@import url(http://fonts.googleapis.com/css?family=Josefin+Sans);
/* 
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 24/02/2015, 19:28:11
    Author     : MC001
*/
html{
    height:100%;
}
body {
    background: white;
    width:100%;
    height:100%;
    margin:0;
    padding:0;
    font-family: 'Josefin Sans', sans-serif;
    min-height:100%;
    overflow:hidden;	
    width:100%;
    color:white;
}
* {
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
    box-sizing: border-box;
}

.ani,.ani *,.ania,.ania *,.ania *:before,.ania *:after,.ania:before,.ania:after,
.image .message,.wrapper img,.gallery .loading,.formSend,.formSend *,.sendForm,.message{
	transition: all .3s ease-out;
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
}
.gallery,.gallery .wrapper{
	transition: all .4s ease-out;
	-webkit-transition: all .4s ease-out;
	-moz-transition: all .4s ease-out;
	-o-transition: all .4s ease-out;
}

/*			LOADING		*/

.loadingInit{
	position:fixed;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background:white;
	z-index:200;
	background-image:url('../images/brandIcon.png');
	background-repeat:no-repeat;
	background-position:center center;
}
.loadingInit .spin {
  position:absolute;
  left:50%;
  top:50%;
  margin:-5em;
  font-size: 10px;
  z-index:200;
  text-indent: -9999em;
  border-top: 0.5em solid rgba(138,96,99, 0.2);
  border-right: 0.5em solid rgba(138,96,99, 0.2);
  border-bottom: 0.5em solid rgba(138,96,99, 0.2);
  border-left: 0.5em solid rgb(138,96,99);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}
.loadingInit .spin,
.loadingInit .spin:after {
  border-radius: 50%;
  width: 10em;
  height: 10em;
}
@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}



/*			COMMON		*/


ul{ 
    list-style:none;
    margin:0;
    padding:0;
}
ul li{
	cursor:pointer;
}

/*			NAV			*/

nav{
    position:fixed;
    left:-220px;
    top:0;
    bottom:0;
    width:220px;
    background:rgba(138,96,99,0.8);
    color:white;
    z-index:110;
}

nav > ul{
	border-top:1px solid rgba(255,255,255,0.3);
	position:absolute;
	left:0;
	right:0;
	bottom:70px;
	margin:0;
	top:160px;
	overflow:auto;
}
nav > ul > li {
	line-height:40px;
	font-size:20px;
	padding:0 18px;
}
nav > ul > li:hover {
	background:rgba(0,0,0,0.2);
	padding-left:30px;
}
nav > ul > li > a{
	width:100%;
	display:block;
	color:white;
	text-decoration:none;
}
nav > ul > ul.collapse{
	height:0px;
	overflow:hidden;
}
nav > ul > ul > li{
	padding:0 34px;
	line-height:30px;
	font-size:15px;
}
nav > ul > ul > li:hover,nav > ul > ul > li.active {
	background:rgba(0,0,0,0.2);
	padding-left:40px;
}

nav > .copy,nav > .facebook{
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	font-size:11px;
	bottom:15px;
	text-align:center;
}
nav > .facebook{
	bottom:40px !important;
        height:20px !important;
        width: 100% !important;
}

.menuToggleWhats{
	position:fixed;
    left:20px;
    top:80px;
    bottom:0;
    width:44px;
    height:44px;
    z-index:110;
    text-align:center;
    cursor:pointer;
    background-image:url('../images/whatsapp.png');
    background-size:contain;
}
.menuToggleWhats a{
	display:block;
	width:100%;
	height:100%;
}

.menuToggle{
    position:fixed;
    left:20px;
    top:20px;
    bottom:0;
    width:44px;
    height:44px;
    border:2px solid white;
    z-index:110;
    text-align:center;
    padding-top:5px;
    cursor:pointer;
}
.menuToggle div{
	left:5px;
	width:30px;
	height:2px;
	position:absolute;
	top:10px;
}
.menuToggle div:after,
.menuToggle div:before{
    content:'';
    width:15px;
    height:2px;
    background:white;
    position:absolute;
    left:0px;
}
.menuToggle div:after{
	left:15px;
}
.menuToggle div:nth-child(1){
	top:18px;
}
.menuToggle div:nth-child(2){
	top:27px;
}

.menuToggle:hover + .menuToggleInfo:not(.clicked){
	opacity:0;
	left:70px;
}


.menuToggleInfo{
	position:absolute;
	z-index:110;
	left:90px;
	top:24px;
	width:180px;
	
}
.menuToggleInfo.clicked{
	opacity:0;
	z-index:-1;
	visibility:hidden;
}
.menuToggleInfo:after,.menuToggleInfo:before{
	position:absolute;
	content:'';
	width:10px;
	height:2px;
	background:white;
	left:-15px;
	top:14px;
}
.menuToggleInfo:after{
	top:20px;
}


body.menuExpand .menuToggle:not(:hover) div:nth-child(1){
	opacity:0;
}
.menuToggleInfo:after,
body.menuExpand .menuToggle:not(:hover) div:nth-child(2):after,
body.menuExpand .menuToggle:not(:hover) div:nth-child(3):before{
	-ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
    transform: rotate(45deg);
}
.menuToggleInfo:before,
body.menuExpand .menuToggle:not(:hover) div:nth-child(2):before,
body.menuExpand .menuToggle:not(:hover) div:nth-child(3):after{
	-ms-transform: rotate(-45deg); /* IE 9 */
    -webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */
    transform: rotate(-45deg);
}
body.menuExpand .menuToggle:not(:hover) div:nth-child(2):before,
body.menuExpand .menuToggle:not(:hover) div:nth-child(3):before{
	left:2px;
}
body.menuExpand .menuToggle:not(:hover) div:nth-child(2):after,
body.menuExpand .menuToggle:not(:hover) div:nth-child(3):after{
	left:13px;
}
body.menuExpand .menuToggle:not(:hover) div:nth-child(3){
	top:13px;
}
body.menuExpand .menuToggle:not(:hover) div:nth-child(2){
	top:24px;
}
body.menuExpand .gallery{
	padding-left:112px;
}

nav .brand{
	margin:5%;
	width:90%;
	height:140px;
	background:url('../images/brand.png') no-repeat center center;
}

/*			CONTENT		*/

content {
    position:fixed;
    left:0;
    top:0;
    bottom:0;
    right:0;
    background:grey;
    z-index:100;
}

/*			GALLERY		*/
.gallery{
	opacity:0; 
}
.gallery.active{
	opacity:1; 
}

.gallery, .gallery .wrapper {
    width:100%;
    height:100%;
    position:relative;
    overflow:hidden;
}
.gallery .wrapper {
	width:999999px;
	background:black;
}
.wrapper img{
    float:left;
    opacity:0;    
	height:100% !important;
	width:auto !important;

}
.wrapper img.loaded{ 
	opacity:0.3; 
}
.wrapper img.active,.gallery .message.active{
	opacity:1;
}
.gallery .message{
    text-align:center;
    font-size:44px;
	position:absolute;
	bottom:100px;
	left:20px;
	right:20px;
	z-index:10;
	opacity:0;
}
.gallery .message:before{
    content:'';
    position:fixed;
    left:0;
    top:0;
    bottom:0;
    right:0;
    background:rgba(0,0,0,0.3);
    z-index:-1;
}


.image.t{
    background-position:top center;
}
.image.b{
    background-position:bottom center;
}


.dots{
    position:absolute;
    right:20px;
    top:20px;
    z-index:110;
}
.dots li {
    width:20px;
    height:20px;
    border:2px solid white;
    float:left;
    margin-left:10px;
    cursor:pointer;
}
.dots li.active:not(.loaded),
.dots li:hover {
    background:white;
}

.dots li.active.loaded{
	border:0px;
	position: relative;
	border-radius: 50%;
}

.galleryPlay.active:not(.loaded) > div{
	width:20px;
	height:20px;
	background:white;
}

.galleryPlay.active.loaded > div:before,
.galleryPlay.active.loaded > div:after,
.dots li.active.loaded:before,
.dots li.active.loaded:after {
  border-radius: 50%;
  position: absolute;
  content: '';
  background: white;
  top: 0;
  width: 10px;
  height: 20px;
}
.galleryPlay.active.loaded > div:before,
.dots li.active.loaded:before {
   border-radius: 20px 0 0 20px;
  left: 0;
  -webkit-transform-origin: 10px;
  transform-origin: 10px;
  -webkit-animation: load2 4s 1 ease 1s;
  animation: load2 4s 1 ease 1s;
}
.galleryPlay.active.loaded > div:after,
.dots li.active.loaded:after {
  border-radius: 0 20px 20px 0;
  left: 10px;
  -webkit-transform-origin: 0px 10px;
  transform-origin: 0px 10px;
  -webkit-animation: load2 4s 1 ease;
  animation: load2 4s 1 ease;
}
@-webkit-keyframes load2 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load2 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}




.arrowL,.arrowR{
    width:100px;
    height:100%;
    position:absolute;
    background-repeat:no-repeat;
    top:0px;
    opacity:0;
    cursor:pointer;
    z-index:100;
}
.arrowL:not(.active),.arrowR:not(.active){
	opacity:0;
	pointer-events:none;
}
.arrowL{
    background-position:right center;
    background-image:url('../images/arrowLlarge.png');
    left:0px;
}
.arrowR{
    background-position:left center;
    background-image:url('../images/arrowRlarge.png');
    right:0px;
}
.arrowL:hover,.arrowR:hover{
    opacity:1;
    width:150px;
}
.galleryPlay {
    width:44px;
    height:44px;
    position:absolute;
    top:20px;
    right:20px;
    border:2px solid white;
    z-index:101;
    cursor:pointer;
    opacity:0.5;
}
.galleryPlay:not(.active):hover{
	opacity:0.8;
}
.galleryPlay.active {
	border-radius:50%;
	opacity:1;
}
.galleryPlay > div{
	position:absolute;
	margin:10px;
}
.galleryPlay:not(.active):after{
	content:'';
	position:absolute;
	margin:10px 14px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 10px 0 10px 15px;
	border-color: transparent transparent transparent #ffffff;
}

.arrowLGallery,.arrowRGallery{
    width:44px;
    height:44px;
    position:absolute;
    bottom:45px;
    margin-top:-58px;
    border:2px solid white;
    z-index:101;
    cursor:pointer;
    left:20px;
}
.arrowLGallery[gallery=""],.arrowRGallery[gallery=""]{
	opacity:0;
	pointer-events:none;
}
.arrowLGallery:before,.arrowRGallery:before{
    content:attr(gallery);
    position:absolute;
    top:47px;
    white-space:nowrap;
    font-weight:bold;
    text-transform:uppercase;
}
.arrowRGallery{
	left:auto;
    right:20px;
}
.arrowRGallery:before{
    text-align:right;
    right:0px;
}
.arrowLGallery div,
.arrowRGallery div{
	position:absolute;
	left:12px;
	top:14px;
}
.arrowLGallery div:last-child{
	left:25px;
	opacity:0;	
}
.arrowRGallery div:last-child{
	left:0px;
	opacity:0;	
}
.arrowLGallery div:after,
.arrowLGallery div:before,
.arrowRGallery div:after,
.arrowRGallery div:before{
	content:'';
	width:15px;
	height:2px;
	background:white;
	position:absolute;
}
.arrowLGallery div:after,
.arrowRGallery div:before{
	-ms-transform: rotate(-45deg); /* IE 9 */
    -webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */
    transform: rotate(-45deg);
}
.arrowLGallery div:before,
.arrowRGallery div:after{
	-ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
    transform: rotate(45deg);
}

.arrowLGallery div:after,
.arrowRGallery div:after{
	top:0px;
}
.arrowLGallery div:before,
.arrowRGallery div:before{
	top:10px;
}
.arrowLGallery:hover div:first-child{
	left:0px;
	opacity:0;
}

.arrowLGallery:hover div:last-child{
	left:12px;
	opacity:1;
}
.arrowRGallery:hover div:first-child{
	left:22px;
	opacity:0;
}
.arrowRGallery:hover div:last-child{
	left:12px;
	opacity:1;
}

.arrowAGallery{
	position:absolute;
	left:50%;
	margin-left:-150px;
	width:300px;
	text-align:center;
	z-index:110;
	bottom:20px;
	font-size:35px;
}
.arrowAGallery:before{
	content:attr(gallery);
	text-transform:uppercase;
}

.gallery .loading {
	position:absolute;
	left:0px;
	bottom:-10px;
	right:0px;
	height:10px;
	background:white;
	z-index:100;
	opacity:0;
}
.gallery .loading.active{
	opacity:1;
	bottom:0px;
}

/*			FLOAT			*/
.boxFloat,.boxFloatClose{
	width:1000px;
	height:610px;
	left:50%;
	top:50%;
	margin-left:-500px;
	margin-top:-305px;
	position:fixed;
	z-index:200;
	background:rgba(255,255,255,0.95);
	color:black;
}
.boxFloat{
	overflow:hidden;
}
.boxFloat span{
	position:absolute !important;
	left:0;
	right:0;
	top:0;
	bottom:0;
	padding:20px;
}
.boxFloat span:not(.active){
	opacity:0;
	visibility:hidden;
	pointer-events:none;
	position:fixed;
}
.boxFloatBack{
	position:fixed;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background:rgba(0,0,0,0.5);
	z-index:189;
}
.boxFloatClose{
	background:transparent;
	cursor:pointer;
	z-index:199;
	opacity:0.7;
}
.boxFloatClose:before,
.boxFloatClose:after{
	content:'';
	position:absolute;
	width:44px;
	height:44px;
	right:-54px;
	top:0;
	z-index:200;
}
.boxFloatClose:after{
	border:2px solid white;
}
.boxFloatClose:hover:after{
	border-radius:20%;
}
.boxFloatClose:hover{
	opacity:1;
}
.boxFloatClose:before{
	right:-52px;
	top:2px;
	background:url('../images/close.png') no-repeat center center;
}

.boxFloat img{
	float:left;
	width:270px;
	height:340px;
	margin:0 10px 10px 0;
}
.boxFloat span > .title{
	font-size:40px;
	text-align:center;
	position:relative;
	text-transform:uppercase;
	margin:10px 0 20px 0;
	padding-bottom:10px;
}
.boxFloat span > .title:after{
	content:'';
	width:100%;
	height:2px;
	background:black;
	position:absolute;
	left:0px;
	bottom:-5px;
}
.boxFloat span > .title > i{
	font-size:15px;
	font-style:normal;
}
.boxFloat span > .title > i > a{
	text-decoration:underline;
	font-weight:bold;
	cursor:pointer;
}
.hidden{
	opacity:0;
	visibility:hidden;
	position:fixed;
}
.boxFloat span > .title > i > a:hover{
	color:rgba(138,96,99,0.8);
}
.boxFloat p{
	text-indent:20px;
	line-height:25px;
	font-size:18px;
	text-align:justify;
}

.boxFloat:not(.active),.boxFloatBack:not(.active),.boxFloatClose:not(.active){
	opacity:0;
	visibility:hidden;
	pointer-events:none;
	position:fixed;
}
.box75,.box25{
	width:75%;
	float:left;
	padding:0 20px;
}
.box50{
	width:48%;
	float:left;
	margin:0 1%;
}
.box25{
	width:25%;
	line-height:25px;
}
.line{
	border-left:2px dashed #000;
}

.box25 > div {
	font-size:17px;
	width:100%;
	max-width:236px;
	margin:0 10px 10px 10px;
}
.formSend{
	opacity:0;
	position:fixed;
	left:0;
	right:0;
	bottom:0;
    z-index:-1;
}
.formSend,.formSend .loadingInit{
	top:80%;
}
.formSend.active,.formSend.active .loadingInit{
	top:0px;
    opacity:1;
    z-index:202;
}
.formSend div.text{
	text-align:center;
	font-size:30px;
	color:black;
    height: auto;
    width: 100%;
    bottom:0;
    position: fixed;
	margin-bottom:-100px;
	opacity:0;
	z-index:-1;
}
.formSend.active div.text{
	bottom:50%;
	opacity:1;
	z-index:inherit;
}
.formSend div.close{
	position: fixed;
	left:50%;
	bottom:0;
	width:200px;
	height:50px;
	margin-bottom:-170px;
	margin-left:-100px;
	background:rgba(138,96,99,0.6);
	z-index:-1;
	text-align:center;
	line-height:50px;
	border-radius:10px;
	opacity:0;
	font-size:22px;	
}
.formSend div.close:hover,.sendForm:hover{
	background:rgba(138,96,99,1);
	cursor:pointer;
}
.formSend.sended div.close{
	opacity:1;
	z-index:inherit;
	bottom:50%;
}
.phone{
	font-size:30px !important;
	line-height:30px;
	text-align:center;
}
.phone i,.time i{
	font-size:15px !important;
}
.time i{
	font-weight:bold;
}
.map {
	width:100%;
	height:120px;
	border-radius:5px;
	background-image:url('../images/map.jpg');
	border:1px solid #D1C8C2;
	position:relative;
	overflow:hidden;
	cursor:pointer;
}
.map:hover:before{
	content:'Ampliar mapa';
	width:inherit;
	text-align:center;
	position:absolute;
	line-height:120px;
	color:white;
	background:RGBA(0,0,0,0.8);
	


}


/*		FORM INPUT		*/


.form-control:focus{
	border:1px solid #999;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(153, 153, 153, 0.5);
	-moz-box-shadow:    0px 0px 10px 0px rgba(153, 153, 153, 0.5);
	box-shadow:         0px 0px 10px 0px rgba(153, 153, 153, 0.5);
}
.form-control.vValid:focus{
	-webkit-box-shadow: 0px 0px 10px 0px rgba(28, 202, 204, 0.5);
	-moz-box-shadow:    0px 0px 10px 0px rgba(28, 202, 204, 0.5);
	box-shadow:         0px 0px 10px 0px rgba(28, 202, 204, 0.5);
}

.form-control.vInvalid{
	border:1px solid rgba(227, 50, 68, 1);
	-webkit-box-shadow: 0px 0px 10px 0px rgba(227, 50, 68, 0.5);
	-moz-box-shadow:    0px 0px 10px 0px rgba(227, 50, 68, 0.5);
	box-shadow:         0px 0px 10px 0px rgba(227, 50, 68, 0.5);
}

.form-control.vValid{
	border:1px solid rgba(28, 202, 204, 1);
}

.vDisabled{
	background-color:#777 !important;
	cursor:default !important;
	color:#CCC;
}
.vRequired:not(.vValid){
	border-right:3px solid rgba(138,96,99, 1) !important;
}

.ballonErro{
	background-color:#222;
	border-radius:5px;
	color:#FFF;
	font-size:11px;
	height:auto;
	position:absolute;
	left:0px;
	top:0px;
	z-index:-100;
	opacity:0;
	visibility:hidden;
	margin-right:5px;
	transition: opacity 0.5s ease;
	padding:8px;
	z-index:203;
}   
.ballonErro:before{
	content: '';
	position: absolute;
	top:-6px;
	left: 13px;
	border-style: solid;
	border-width: 0 6px 6px 6px;
	border-color: #222 transparent;
	visibility:inherit;
	opacity:inherit;
}

.ballonErro.show{
	visibility:visible;
	z-index:99999999999;
	opacity:1;
}

::-webkit-input-placeholder { /* WebKit browsers */
   color:    black;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    black;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    black;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
   color:    black;
}

.scrolling::-webkit-scrollbar{
	width:10px;
}
.scrolling::-webkit-scrollbar-thumb{
	background-color:rgba(50,50,50,0.25);
	border:2px solid transparent;
	border-radius:10px;
	background-clip:padding-box;
} 

.scrolling::-webkit-scrollbar-thumb:hover{
	background-color:rgba(138,96,99,0.8);
}
ul.scrolling::-webkit-scrollbar-thumb:hover{
	background-color:rgba(255,255,255,0.8) !important;
}

form input[type="text"],form textarea{
	width:100%;
	margin:5px 0;
	font-size:16px;
	float:left;
	border:0px;
	background:transparent;
	border:1px solid transparent;
	border-bottom:1px solid #999;
	border-radius:5px;
	outline:0px;
	font-family:inherit;
	padding:8px;
	background:rgba(138,96,99,0.05);
}
form input[type="text"]:focus,form textarea:focus,
form input[type="text"].vValid,form textarea.vValid{
	border:1px solid rgba(138,96,99,0.6);
	background:rgba(138,96,99,0.6);
	color:white;
}
form input[name="cidade"]{
	width:74%;
}
form input[name="uf"]{
	width:24%;
	float:right;
}
.sendForm{
	background:rgba(138,96,99,0.6);
	text-align:center;
	line-height:50px;
	border-radius:10px;
	border:0px;
	width:100px;
	height:50px;
	color:white;
	text-transform:uppercase;
	float:right;
}


.opt-group {
	padding:20px;
	width:100%;
	height:400px;
	overflow-y:auto;
}
.box50 .title{
	font-size:20px;
	text-align:center;
}
.opt-group .inputBlock div{
	float:left;

}
.opt-group .inputBlock div:first-child{
	width:180px;
}
.opt-group input[type='text']{
	width:40px !important;
	height:25px;
	margin-right:10px;
}
.opt-group .inputBlock{
	width:50%;
	height:auto;
	line-height:38px;
	float:left;
	padding:0 0 5px 5px;
	border-bottom:1px dashed #ccc;
	border-right:1px dashed #ccc;
	margin:5px 0;
	min-width:200px;
}
.opt-group .inputBlock.full{
	width:100%;
}
.opt-group .inputBlock input[type="checkbox"]{
	width:16px;
	height:16px;
}
@-webkit-keyframes flipInX {
    0% {  -webkit-transform: perspective(400px) rotateX(90deg) translateY(-100px);    opacity: 0;    }
    50% { -webkit-transform: perspective(400px) rotateX(-10deg) translateY(10px);                    }
    75% { -webkit-transform: perspective(400px) rotateX(10deg) translateY(-10px);                    }
    100% {-webkit-transform: perspective(400px) rotateX(0deg) translateY(0px);        opacity: 1;    }
}

@-moz-keyframes flipInX {
    0% {  -moz-transform: perspective(400px) rotateX(90deg) translateY(-100px);    opacity: 0;    }
    50% { -moz-transform: perspective(400px) rotateX(-10deg) translateY(10px);                    }
    75% { -moz-transform: perspective(400px) rotateX(10deg) translateY(-10px);                    }
    100% {-moz-transform: perspective(400px) rotateX(0deg) translateY(0px);        opacity: 1;    }
}
@-ms-keyframes flipInX {
    0% {  -ms-transform: perspective(400px) rotateX(90deg) translateY(-100px);    opacity: 0;    }
    50% { -ms-transform: perspective(400px) rotateX(-10deg) translateY(10px);                    }
    75% { -ms-transform: perspective(400px) rotateX(10deg) translateY(-10px);                    }
    100% {-ms-transform: perspective(400px) rotateX(0deg) translateY(0px);        opacity: 1;    }
}
@-o-keyframes flipInX {
    0% {  -o-transform: perspective(400px) rotateX(90deg) translateY(-100px);    opacity: 0;    }
    50% { -o-transform: perspective(400px) rotateX(-10deg) translateY(10px);                    }
    75% { -o-transform: perspective(400px) rotateX(10deg) translateY(-10px);                    }
    100% {-o-transform: perspective(400px) rotateX(0deg) translateY(0px);        opacity: 1;    }
}
@keyframes flipInX {
    0% {  transform: perspective(400px) rotateX(90deg) translateY(-100px);    opacity: 0;    }
    50% { transform: perspective(400px) rotateX(-10deg) translateY(10px);                    }
    75% { transform: perspective(400px) rotateX(10deg) translateY(-10px);                    }
    100% {transform: perspective(400px) rotateX(0deg) translateY(0px);        opacity: 1;    }
}

.boxFloat.active,.boxFloatClose.active {
	-webkit-backface-visibility: visible !important;
	-webkit-animation-name: flipInX;
	-moz-backface-visibility: visible !important;
	-moz-animation-name: flipInX;
	-ms-backface-visibility: visible !important;
	-ms-animation-name: flipInX;
	-o-backface-visibility: visible !important;
	-o-animation-name: flipInX;
	backface-visibility: visible !important;
	animation-name: flipInX;
	-webkit-animation-duration: 1.0s;
	-moz-animation-duration: 1.0s;
	-ms-animation-duration: 1.0s;
	-o-animation-duration: 1.0s;
	animation-duration: 1.0s;
}



/*			SETTINGS		*/
body.menuExpand nav{
	left:0;
}
body.menuExpand .menuToggle{
	left:240px;
}
@media only screen and (min-width: 1024px){

	body.menuExpand .arrowL,body.menuExpand .arrowLGallery,body.menuExpand .menuToggleWhats{
		left:240px;
	}
	
	body.menuExpand .arrowAGallery{
		margin-left:-55px;
	}
}

@media only screen and (min-width: 320px) and (max-width: 736px){
	.brand {
		height:80px !important;
		background-size:60% !important;
	}
	nav > ul{
		top:110px;
	}	
	.gallery .message{
		font-size:26px !important;
		bottom:100px;
	}
	.arrowAGallery{
		bottom:45px;
	}

	.arrowL,.arrowR{
    	width:70px !important;  
	}
	.dots{
		width:50px;
	}
	.dots li{
		margin:0 5px 5px 0;
	}
	.arrowAGallery{
		font-size:22px;
	}
	
	.boxFloat > span > .title{
		line-height:20px;
		font-size:30px !important;
	}
	.boxFloat .title i{
		font-size:12px !important;
		margin-top:20px;
		display:block;
	}
	.boxFloat .box50{
		width:100%;
		margin-bottom:30px;
	}
	.boxFloat .opt-group{
		height:auto;
		overflow:hidden;
	}
	.boxFloat span{
		overflow:auto;
	}
	
	.box25,.box75{
		width:100% !important;	
	}
	.line {
		margin-top:20px;
		padding-top:20px;
		border-top:2px dashed #000;
		border-left:0;
	}
}
@media only screen and (max-width: 320px){
	body.menuExpand .dots{
		top:80px;
	}

}

@media only screen and (max-width : 768px) and (orientation : portrait){
	.boxFloat{
		width:720px !important;
		margin-left:-360px;
	}
	.box25{		width:40%;	}
	.box75{		width:60%;	}
	.inputBlock{width:100% !important;	}
}

@media only screen and (max-width : 414px) and (orientation : portrait){
	.boxFloat,.boxFloatClose{
		position:fixed;
		width:auto !important;
		height:auto !important;
		left:10px;
		right:10px;
		bottom:10px;
		top:60px;
		margin:0;

	}	
	.boxFloatClose:before,
	.boxFloatClose:after{
		top:-54px;
		right:0;
		z-index:200;
	}
}
@media only screen and (max-width : 736px) and (orientation : landscape){
	.boxFloat,.boxFloatClose{
		width:auto !important;
		height:auto !important;
		left:10px;
		right:60px;
		bottom:10px;
		top:10px;
		margin:0;
	}	
}