﻿@import url("../fonts/255131_4_0/stylesheet.css");

/* MOBILE SCREENS */
@media (min-width: 768px) {
}

/* DESKTOP NORMAL SCREENS */
@media (min-width: 992px) {

}

/* DESKTOP LARGE SCREENS */
@media (min-width: 1200px) {
}




/* RESET */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, h7, h10, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

/* -------------------------------------------- */
/* GLOBAL DEFINITION */
/* -------------------------------------------- */

html { font-size: 100%; line-height: 1; }

* html { font-size: 100%; }

html { font-size: 16px; line-height: 1.625em; }

html * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

body {
	background: #E4E4E4;
	font-family: "Avant";
	font-weight: 400;
	color: #444444;
	position: relative;
	/* background-image: url(../img/tex2res5.png); */
	-webkit-font-smoothing: antialiased;
}

.ie9 { font-family: "Avant"; }
.ie9 * { font-family: "Avant"; }

p {
    font-family: "Avant";
    font-weight: 400;
    font-size: 16px;
    font-size: 1rem;
    margin-bottom: 13px;
    line-height: 1.625em;
}

a:hover {
    color: #71a7de;
    text-decoration: none;
}

ul li {
    list-style-position: initial;
}


/* -------------------------------------------- */
/* FONTS */
/* -------------------------------------------- */

@font-face { font-family: "entypo"; font-style: normal; font-weight: 400; src: url(../fonts/icons/entypo.eot); src: url("../fonts/icons/entypo.eot?#iefix") format("ie9-skip-eot"), url("../fonts/icons/entypo.woff") format("woff"), url("../fonts/icons/entypo.ttf") format("truetype"); }

h1, h2, h3, h4, h5, h6, h7 { font-family: "Museo"; font-weight: 300; color: #71a7de; text-rendering: optimizelegibility; padding-top: 0.273em; line-height: 1.15538em; padding-bottom: 0.273em; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, h7 a { color: #71a7de; }

h9, h10 { font-family: "Museo"; font-weight: 300; color: white; text-rendering: optimizelegibility; padding-top: 0.273em; line-height: 1.15538em; padding-bottom: 0.273em; }


@media only screen and (max-width: 767px) { h1, h2, h3, h4, h5, h6, h7, { word-wrap: break-word; } }
h1 { font-size: 68px; font-size: 4.25rem; }
h1.xlarge { font-size: 110px; font-size: 6.875rem; }
h1.xxlarge { font-size: 126px; font-size: 7.875rem; }
h1.absurd { font-size: 177px; font-size: 11.0625rem; }

h2 { font-size: 42px; font-size: 2.625rem; }

h3 { font-size: 30px; font-size: 1.875rem; }

h4 { font-size: 26px; font-size: 1.625rem; }

h5 { font-size: 18px; font-size: 1.125rem; }

h6 { font-size: 16px; font-size: 1rem; }

h7 { font-size: 10px; font-size: 1rem; }

h8 { font-size: 10px; }

h9 { font-size: 32px; }

h10 { font-size: 26px; }

h11 { font-size: 21px; font-size: 1.875rem; font-family: "Museo200"; line-height: 1.2em;}


@media only screen and (max-width: 767px) { h1 { font-size: 42px; font-size: 2.625rem; }
  h2 { font-size: 36px; font-size: 2.25rem; } }
.subhead { color: #777; font-weight: normal; margin-bottom: 20px; }

/*=====================================================  	Links & Paragraph styles 	 	======================================================*/
p { font-family: "Avant"; font-weight: 400; font-size: 16px; font-size: 1rem; margin-bottom: 13px; line-height: 1.625em; }
p.Customlead { font-size: 20px; font-size: 1.25rem; margin-bottom: 18px; }
@media only screen and (max-width: 768px) { p { font-size: 17.6px; font-size: 0.9rem; line-height: 1.4em; } }

a { color: white; text-decoration: none; outline: 0; line-height: inherit; }
a:hover { color: #71a7de; }





/* -------------------------------------------- */
/* LAYOUT PAGE */
/* -------------------------------------------- */

.container {
    width: 100%;
    max-width: 970px;
    overflow: hidden;
}

/* Push Up Classes */
.push_up_one { margin-top: 10px }
.push_up_two { margin-top: 20px }
.push_up_three { margin-top: 30px }
.push_up_four { margin-top: 40px }
.push_up_five { margin-top: 50px }
.push_up_six { margin-top: 65px }
.push_up_seven { margin-top: 75px }
.push_up_ten { margin-top: 100px }

/* Push Down Classes */
.push_down_one { margin-bottom: 10px }
.push_down_two { margin-bottom: 20px }
.push_down_three { margin-bottom: 30px }
.push_down_four { margin-bottom: 40px }
.push_down_five { margin-bottom: 50px }
.push_down_six { margin-bottom: 60px }
.push_down_ten { margin-bottom: 100px }

/* Push Aux Classes */
.push10px{
	margin-right:10px;
	vertical-align: middle;
	margin-top: -6px;
}

.push20px{
	margin-right:20px;
}

/* Line */
.line1 { background-image: url(../img/ui_line.png); background-repeat: no-repeat; margin-top: 40px; height: 20px; float: left; width: 100%; }
.line2 { background-image: url(../img/ui_line.png); background-repeat: no-repeat; height: 20px; float: left; width: 100%; background-size:contain }
.line3 { background-image: url(../img/ui_line_phone.png); background-repeat: no-repeat; height: 20px; float: left; width: 100%; background-size:contain }

.line1.space1 {
        padding-top: 0.273em;
        line-height: 1.15538em;
        padding-bottom: 0.273em;
    }

/* Facebook icon */
.btnFb a:hover{ background-position:0px 0px; }
.btnFb { border: 0 0 0 0; padding: 0; }
.btnFb a{ background-image: url(../img/ui_social_btn30.png); background-position: 0px -30px; width: 30px; height: 30px; display: block; background-repeat: no-repeat; color:#ffffff; text-indent: -3000px; }


/* Twitter icon */
.btnLk a:hover{ background-position:-30px 0px; }
.btnLk { border: 0 0 0 0; padding: 0; margin-left: 10px; }
.btnLk a{ background-image: url(../img/ui_social_btn30.png); background-position:-30px -30px; width: 30px; height: 30px; display: block; background-repeat: no-repeat; color:#ffffff; text-indent: -3000px; }


/* Picnic icon */
.btnPk { border: 0 0 0 0; padding: 0; margin-left: 0px; }
.btnPk a{ background-image: url(../img/ui_picnic_btn30.png); background-position:0px -30px; width: 130px; height: 30px; display: block; background-repeat: no-repeat; color:#C2C2C2; text-indent: 38px;font-size: 1em;line-height: 31px;font-family:Museo }
.btnPk a:hover{ background-position:0px 0px !important;color:#4a4d50 }



/* Twitter */
.twitterBarRight { float: left; width: 100%; margin-right: -120px; }
.twitter { margin-right: 120px; /* The size of the fixed block. */ background-color:#c2c2c2; color:#FFF; padding: 20px 20px 20px 26px; }
.twitterBarLeft { float: left; width: 120px; }
.twitterTriangle{ background-image:url(../img/ui_twitter_tri.png); float:right; width:26px; height:60px; }
.twitterUser{ color:#71a7de; }


/* Twitter test responsive */
.twitterBoxtest { width: 100%; height: 70px; background-color: #c2c2c2 }


    /* drawer */
.drawer { background-position:center;background-size:cover; position: relative; width: 100%; max-height: 0; -webkit-box-shadow: inset 0 0px 0px black, inset 0 0px 0px black; box-shadow: inset 0 0px 0px black, inset 0 0px 0px black; overflow: hidden; -webkit-transition-duration: .3s; /* Saf3.2+, Chrome */ -moz-transition-duration: .3s; /* FF4+ */ -ms-transition-duration: .3s; /* IE10 */ -o-transition-duration: .3s; /* Opera 10.5+ */ transition-duration: .3s; color:#FFF}
.drawer.active { height: auto; max-height: 2400px; -webkit-transition-duration: .5s; /* Saf3.2+, Chrome */ -moz-transition-duration: .5s; /* FF4+ */ -ms-transition-duration: .5s; /* IE10 */ -o-transition-duration: .5s; /* Opera 10.5+ */ transition-duration: .5s; }


/* method */
.drawerMethod { position: relative; width: 100%; max-height: 0; -webkit-box-shadow: inset 0 0px 0px black, inset 0 0px 0px black; box-shadow: inset 0 0px 0px black, inset 0 0px 0px black; overflow: hidden; -webkit-transition-duration: .3s; /* Saf3.2+, Chrome */ -moz-transition-duration: .3s; /* FF4+ */ -ms-transition-duration: .3s; /* IE10 */ -o-transition-duration: .3s; /* Opera 10.5+ */ transition-duration: .3s; }
.drawerMethod.active { height: auto; max-height: 800px; -webkit-transition-duration: .5s; /* Saf3.2+, Chrome */ -moz-transition-duration: .5s; /* FF4+ */ -ms-transition-duration: .5s; /* IE10 */ -o-transition-duration: .5s; /* Opera 10.5+ */ transition-duration: .5s; }


/* LOADER */

#progress{position:fixed;width:100%;height:100%;background-color:#E4E4E4;z-index:5000}
#loader{
	position:fixed;
	top:50%;
	left:50%;
	width:80px;
	height:80px;
	margin-left:-38px;
	margin-top:-38px;
	background-image:url(../img/loader.gif);
}

/* ESCONDER / MOSTRAR */

.hiddenOnLoad{
	opacity: 0;
}

.visibleOnLoad{
	opacity: 1;
}





/* -------------------------------------------- */
/* NAVBAR */
/* -------------------------------------------- */

.navbar {
    margin-bottom: 0px;
    border: 0;
}

@media (max-width: 768px){
    .navbar > .container {
        padding-left: 0;
        padding-right: 0;
    }
}

.navbar-massive {
    background: #71a7de;
    color: #fff;
    font-family: "Museo200";
    font-size: 1rem;
    font-weight: 300;
    text-rendering: optimizelegibility;
    border: none;
}

.navbar-brand {
    height: 60px;
    padding: 0;
    line-height: 58px;
    margin: 0 2.12766% 0 0;
}

.navbar .logo {
    padding: 0;
    height: 60px;
}

@media (max-width: 768px){
    .navbar .logo {
        margin-left: 15px;
    }
}

.navbar .navbar-header {
    height: 60px;
}

.navbar-nav>li>a {
    display: block;
    padding: 0 27px;
    white-space: nowrap;
    color: white;
    height: 60px;
    line-height: 63px;
    font-size: 16px;
    font-size: 1rem;
}
    .navbar-nav > li > a:hover {
        background: #fff;
        color: #666;
    }

@media only screen and (max-width: 767px) {
    .navbar-toggle {
        width: 60px;
        text-align: center;
        display: inline-block;
        color: white;
        height: 60px;
        line-height: 60px;
        font-size: 30px;
        font-size: 1.875rem;
        margin: 0;
        padding: 0;
        border: none;
        border-radius: 0;
    }

    .navbar-toggle {
            background-color: #3e4043;
            color: white;
        }

        .navbar-toggle:hover {
            background-color: #3e4043;
            color: white;
        }

    .navbar-toggle.collapsed {
        color: white;
        background-color: #71a7de;
    }

    .navbar-toggle.collapsed:hover {
        background-color: white;
        color: #71a7de;
    }

    .navbar-collapse {
        color: white;
        background-color: #3e4043;
        border-top: 0;
        -webkit-box-shadow: none;
        box-shadow:none;
    }

    .navbar-nav {
        margin-top: 0;
        margin-bottom: 0;
    }

    .navbar ul li {
        position: relative;
        min-height: 60px;
        max-height: 320px;
        height: auto;
        width: 100%;
        border-right: 0 !important;
        -webkit-box-shadow: none;
        box-shadow: none;
        -webkit-transition-duration: 0.5s;
        -moz-transition-duration: 0.5s;
        -o-transition-duration: 0.5s;
        transition-duration: 0.5s;
        text-align: center;
    }

    .navbar-nav>li>a {
        padding: 0px;
        white-space: nowrap;
        color: white;
        height: 60px;
        line-height: 63px;
        font-size: 16px;
        font-size: 1rem;
        }

    .navbar-nav > li > a:hover {
        background: #fff;
        color: #666;
    }
}


/* -------------------------------------------- */
/* FOOTER */
/* -------------------------------------------- */

footer {
    width: 100%;
    max-width: 100%;
    min-width: 320px;
    min-height: 120px;
    background-color: #71a7de;
    margin: 0 auto;
}




/* -------------------------------------------- */
/* CONTACT FORM */
/* -------------------------------------------- */

    /* Map */
.mapBox { width: 100%; height: 340px; background-color: white; margin-top: 20px; float: left; }
.mapContainer {
    width: 100%;
    padding: 1%;
    height: 100%;
    background-color: #FFF;
    margin: 0;
}

.btnClose {
    background-image: url(../img/ui_close_1.png);
    top: 14px;
    right: 14px;
    position: absolute;
    width: 24px;
    height: 24px;
}
.btnClose:hover { background-position:0px -24px; }

/* drawerContact */
.drawerContact { position: relative; width: 100%; max-height: 0; background: #71a7de; color: white; -webkit-box-shadow: inset 0 0px 0px black, inset 0 0px 0px black; box-shadow: inset 0 0px 0px black, inset 0 0px 0px black; overflow: hidden; -webkit-transition-duration: .3s; /* Saf3.2+, Chrome */ -moz-transition-duration: .3s; /* FF4+ */ -ms-transition-duration: .3s; /* IE10 */ -o-transition-duration: .3s; /* Opera 10.5+ */ transition-duration: .3s; }
.drawerContact.active { height: auto; max-height: 800px; -webkit-transition-duration: .5s; /* Saf3.2+, Chrome */ -moz-transition-duration: .5s; /* FF4+ */ -ms-transition-duration: .5s; /* IE10 */ -o-transition-duration: .5s; /* Opera 10.5+ */ transition-duration: .5s; }

.drawerContact a{
	color:#FFF;
}
.drawerContact a:hover{
	text-decoration:underline !important;
}

.drawerContact.active {
    height: auto;
    max-height: 1100px;
}



/* -------------------------------------------- */
/* HOME PAGE */
/* -------------------------------------------- */


/* Slider */
.slideshow { width: 100%; max-width: 100%; min-width: 320px; min-height: 500px; background-color:#000000;  background-size: cover; background-repeat: no-repeat; background-position: center; margin: 0 auto; }

.slideshow div{
	position:absolute;
	width:100%;
	height:500px;
	background-size:cover;
	background-position: center;
	overflow:hidden;
}


#image0{
	background-image:url(../img/gallery_43B.jpg);
}

#image1{
	background-image:url(../img/gallery_28B.jpg);
}

#image2{
	background-image:url(../img/gallery_31.jpg);
}
#image3{
	background-image:url(../img/gallery_44.jpg);
}
#image4{
	background-image:url(../img/gallery_23.jpg);
}
#image5{
	background-image:url(../img/gallery_21.jpg);
}
#image6{
	background-image:url(../img/gallery_24.jpg);
}
#image7{
	background-image:url(../img/gallery_40.jpg);
}


#buttons{
	top:-60px;
	width:180px;
	height:30px;
	left:-75px;
	margin-left:50%;
	margin-top:10px;
	position:relative;
}
#buttons div{
	position:relative;
	float:left;
	width:10px;
	height:10px;
	background-color:#FFF;
	margin:5px;
	border-radius:8px;
	cursor:pointer;
}
#buttons div:hover{
	background-color:#71a7de;
}

.btnActive{
	background-color:#71a7de !important;
}

.containerText{
	width:940px;
	left:50%;
	margin-left:-470px;
	position:absolute;
	padding-top:100px;
}
.containerText span{
	position:relative;
	display:table;
	padding:5px 15px;
	/*background-color:#71A7DE;*/
	margin-top:5px;
	color:white;
	height: 32px;
	line-height: 32px;
}

@media only screen and (max-width: 780px) {
    .containerText {
        width: 80%;
        left: 15px;
        margin-left: 0;
    }
}

.imageTitle{font-size:45px !important;font-family:Museo;}
.imageText{font-size:22px !important;font-weight: 500;}
.imageLink{font-size: 12px !important;
cursor: pointer;
width: 110px;
background-image:url(../img/ui_arrow_white.gif);
background-repeat:no-repeat;
background-position:80px 18px;
}
.imageLink:hover{background-color:white;color:#71A7DE;background-image:url(../img/ui_arrow_blue.gif);}



@media only screen and (max-width:768px) {
    .threeComponents {
        margin-bottom: 60px;
    }

    .threeComponents.last {
        margin-bottom: 40px;
    }
}


.lineArduino {
        position: relative;
        z-index: 1;
         margin-top: -419px;
    }

/* styles for browsers larger than 960px; */
@media (min-width: 992px) {
    .lineArduino {
        margin-top: -131px;
    }
}

/* default iPad screens */
@media only screen and (max-width:768px) {
    .lineArduino {
        margin-top: 20px;
        position: static;
    }
}


.lineArduinoImmersiveEntertainment {
    margin-top: 0px;
}

@media only screen and (max-width:768px) {
    .lineArduinoImmersiveEntertainment {
        margin-top: 25px;
    }
}


.ImmersiveEntertainment {
    margin-top: 0px;
}

@media only screen and (max-width:768px) {
    .ImmersiveEntertainment {
        margin-top: 20px;
    }
}

.ProductDevelopment {
    margin-top: 90px;
}

@media only screen and (max-width:768px) {
    .ProductDevelopment {
        margin-top: 20px;
    }
}


/* -------------------------------------------- */
/* TWITTER */
/* -------------------------------------------- */

#ContainerTwitter ul {
    list-style: none;
}

p.timePosted, .interact, .user
{
	display:none;
}

.tweet
{
	font-size:0.8em !important;
	font-family: "Museo";
	margin-bottom:0 !important;
}

@media only screen and (max-width: 780px) {
	.twitter{font-size:1em}
	.sliderContainer, .sliderContainer div{
		height:220px;
	}
	.containerText{
		width:80%;
		left: 15px;
		margin-left:0;
	}
}


/* -------------------------------------------- */
/* SERVICES PAGE */
/* -------------------------------------------- */
ul.square {
    margin-left: 20px;
}



/* -------------------------------------------- */
/* WORK PAGE */
/* -------------------------------------------- */

.row .work {
    height: 360px;
    margin-bottom: 20px;
}
.work{cursor:pointer}
.work img:hover{ opacity:0.8; background-color:#71a7de;}
/*.work{cursor:pointer;background-color:#71a7de;height:159px}
.work img:hover{opacity:0.3}*/
.lupa{opacity:0; background-color:#71a7de;width:100%;height:220px;position:absolute;z-index:100; background-image:url(../img/magni.png); background-position:center; background-repeat:no-repeat;}
.myImage{position:relative;width:100%;height:220px;background-size:cover;background-position:center;}

.workInfo { background-color:#FFF; height: 400px;}
.workTitle { margin-top:15px;}
.subtitle{
	background-color:#FFF;
	padding: 10px 25px;
	height:140px;
}
#hand{
	position:absolute;
	top:300px;
	left:50%;
	margin-left:-30px;
	width:60px;
	height:92px;
	background-image:url(../img/hand.png);
	z-index:3000;
	display:none;
}

.drawerbg{background-color:#494c4f}
.drawerbblack{background-color:#000000}
.drawerbg.LaunchTrack{background: url(../img/back_lt.jpg)}
.drawerbg.NatureValley{background: url(../img/back_nv.jpg)}
.drawerbg.Oasis{background: url(../img/back_oasis.jpg)}
.drawerbg.Oasis2{background: url(../img/back_oasis_2.jpg)}
.drawerbg.Borealis{background: url(../img/back_borealis.jpg)}

.sliderContainer{
	position:relative;
	float:left;
	width:100%;
	height:460px;
	cursor: hand;
	cursor:-webkit-grab;
}
.sliderContainer div{
	position: absolute;
	width: 100%;
	height: 460px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	top: 1px;
}

.buttons{
	width: 100px;
	height: 30px;
	left: -37px;
	margin-left: 50%;
	margin-top: 10px;
	position: relative;
}
.buttons div{
	position:relative;
	float:left;
	width:10px;
	height:10px;
	background-color:#FFF;
	margin:5px;
	border-radius:8px;
	cursor:pointer;
}
.buttons div:hover{
	background-color:#71a7de;
}




/* MOBILE SCREENS */
@media (min-width: 768px) {
}

/* DESKTOP NORMAL SCREENS */
@media (min-width: 992px) {

}

/* DESKTOP LARGE SCREENS */
@media (min-width: 1200px) {
}

.video-center{
    text-align: center !important;
}
