@import "slider.css";
@import "menu_.css";
body { font-family: 'museo_sans_300regular'; color: #fff;  background-image: none; }
/* + loader */
.loader { min-width: 100%; min-height: 100%; width: auto; height: auto; background: #fff; position: fixed; z-index: 999; background-image: url(../img/masterPage/loader.gif); background-repeat: no-repeat; background-position: center; }
/* - loader */
/* + header */
.header { width: 100%; height: 50px; background-image: url(../img/background/generalBg.png); position: relative; z-index: 20; }
.headerContant { width: 960px; margin: 0px auto; }
.logo { float: left; }
.nav { float: right; }

.menuActive { border-bottom: 2px solid #fff; padding: 15px 10px 10px 10px !important; }
.tMenu {display: none;}
.tMenuBtn {display: none;}
.tMenuDetail {display: none;}
.t9 {left: -9999px !important;}
/* - header */
/* + body */
.content { display: none ;width: 910px; min-height: auto;  position: relative; z-index: 3; margin: 35px auto 0px auto; padding: 10px 25px; margin-bottom:50px; }

.contentPlus{background-image: url(../img/background/generalBg.png);display: block !important}
.BigBanner {position: fixed; width: 100%; height: 100%; z-index: 2; background-color: #000;}
.BigBanner  div { width: 100%; height: 100%; }
.BigBanner  div img { width: 100%; height: auto; }
/* - body */

/* + footer */
.footer { width: 100%; height: auto; background-image: url(../img/background/generalBg.png); bottom: 0px; position: fixed; z-index: 4; }
.footerBottom {position: relative; margin-top: 20px;}
.sodium_cc { float: left; }
.social { width: auto; float: right; margin-right: 30px; }
.social a { float: left; opacity: 0.7; margin: 0px 3px; }
.social a:hover { opacity: 1; }
.social span { color: #fff;  padding: 10px;display: block; }
/* - footer*/

/* + about */
.aboutContent h1 { font-size: 20px !important; display: block !important; font-family: 'museo_sans_700regular'; margin: 10px 0px 10px 0px; line-height: 32px; }
.aboutContent h1:first-letter { font-size: 24px !important; line-height: 24px; }
.aboutContent h3 { font-size: 14px !important; display: block !important; text-align: justify; padding: 0px 10px; font-family: 'museo_sans_300regular'; }
/* - about */

/* + menu */
.menuBtn {width:47%; height:auto; padding:5px 0px; color:#FFF; border: 2px solid #FFF; font-family: 'museo_sans_300regular'; margin:1% 1%; float:left; display:block; text-align:center; cursor:pointer; }
.menuBtn:hover {background-color:#FFF; color:#333;  }
.menuBtnActive {background-color:#FFF; color:#333;  }
.menuTitleBox {width:auto; height:auto; border-bottom:1px solid #FFF; padding-bottom:10px; margin-top:55px;}

.menuTitleImg {width:200px; height:200px;  float:right; }
.menuTitleImgThumb img{border-radius: 100px; }
.menuTitleImg  img {width:200px; height:200px; }
.menuContent h2  { font-size: 24px !important; display:block !important; float:left; padding-top:170px; padding-left:10px; }
.menuContent h3  { font-size:18px !important; display:block !important; padding-top:10px; padding-left:5%;   }
.menuContent h4  { font-size:14px !important; display:block !important; padding-top:5px; padding-left:7%; color:#E9E9E9;   }

/* - menu */
.btnTop {
	width: 65px;
    height: 40px;
    display: block;
    z-index: 99;
    position: fixed;
    right: 0px;
    bottom: 75px;
	background-image: url(../img/background/top.png) ;
	background-repeat:none;
	cursor:pointer;
}

/* + reservation + contact */
.reservationContent input { background: none; border: 1px solid #B1B1B1; font-size: 18px; color: #fff; text-align: center; font-family: 'museo_sans_100regular'; height: 36px; width: 96%; padding: 0px 2%; }
.reservationContent h1 { font-size: 20px !important; display: block !important; font-family: 'museo_sans_700regular'; margin: 10px 0px 10px 0px; line-height: 32px; }
.reservationContent h1:first-letter { font-size: 24px !important; line-height: 24px; }
.reservationContent select { text-align: center; }
.DateBox { width: 98%; float: left; margin: 1%; }
.input01 { width: 48%; float: left; margin: 1%; } /* + name */
.input02 { width: 48%; float: left; margin: 1%; } /* + Lastname */
.input03 { width: 48%; float: left; margin: 1%; } /* + tel */
.input04 { width: 48%; float: left; margin: 1%; } /* + mail */
.input05{ width: 48%; float: left; margin: 1%; } /* + mail */
.select01 { width: 18%; height: 40px; float: left; margin: 1%; } /* + gender */
.select02 { width: 48%; height: 40px; float: left; margin: 1%; } /* + gender */
.select03 { width: 14%; height: 40px; float: left; margin: 0.9%; } /* + gender */
.select04 { width: 15%; height: 40px; float: left; margin: 1%; } /* + gender */
.mapdiv a img {width: 100%;}
.mapdiv {width: 98%; margin:0px auto;}
.selectMargin {margin-left:3.5%}

.NoteArea { width: 96%; height: 200px; resize: none; margin: 1%; border: 1px solid #B1B1B1; font-size: 20px; color: #fff; background: none; font-family: 'museo_sans_100regular'; padding: 1% }
input:focus, textarea:focus { border: 1px solid #fff; }
.btnSend { display: block; border: 1px solid #FFFFFF; padding: 2%; text-align: center; color: #fff; cursor: pointer; background-color: transparent; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; transition-property: all; transition-duration: .2s; -webkit-transition-property: all; -webkit-transition-duration: .2s; margin: 1%; font-family: 'museo_sans_500regular'; }
.btnSend:hover { background-color: #fff; color: #000 }
.validateBox { width: 96%; margin: 1%; color: #fff; font-size: 14px; background-color: #B30002; font-family: 'museo_sans_100regular'; padding: 1%; }
.btnRez {width:31.1%; height:auto; padding:5px 0px; color:#FFF; border: 1px solid #FFF; font-family: 'museo_sans_300regular'; margin:1% 1%; float:left; display:block; text-align:center; cursor:pointer; }
.btnRez:hover {background-color:#FFF; color:#333;  }
.btnRezActive {background-color:#FFF; color:#333;  }
/* - reservation + contact */
/* + gallery effect*/
.galleryContent h1 { font-size: 20px !important; display: block !important; font-family: 'museo_sans_700regular'; margin: 10px 0px 10px 0px; line-height: 32px; }
.portfolio-grid { list-style: none; padding: 0; margin: 0 auto; width: 100%; }
.portfolio-grid li {  width: 23%; float:left; margin:1%; }
.portfolio-grid li h3 { font-size:14px; padding-top:5px; text-align:center;  }
.portfolio-grid li > a, .portfolio-grid li > a img { width: 100%; border: none; outline: none; display: block; position: relative; transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; }
.portfolio-grid li > a img:hover { border-radius: 50%; z-index: 9999; }
.animated { -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; }
@-webkit-keyframes flipInX {
 0% {-webkit-transform: perspective(400px) rotateX(90deg); opacity: 0; }
 40% { -webkit-transform: perspective(400px) rotateX(-10deg);}
 70% { -webkit-transform: perspective(400px) rotateX(10deg);}
 100% { -webkit-transform: perspective(400px) rotateX(0deg);opacity: 1; }
}
@-moz-keyframes flipInX {
 0% { -moz-transform: perspective(400px) rotateX(90deg); opacity: 0; }
 40% { -moz-transform: perspective(400px) rotateX(-10deg); }
 70% { -moz-transform: perspective(400px) rotateX(10deg);}
 100% { -moz-transform: perspective(400px) rotateX(0deg); opacity: 1;}
}
@-o-keyframes flipInX {
 0% { -o-transform: perspective(400px) rotateX(90deg); opacity: 0;}
 40% { -o-transform: perspective(400px) rotateX(-10deg);}
 70% { -o-transform: perspective(400px) rotateX(10deg);}
 100% { -o-transform: perspective(400px) rotateX(0deg);opacity: 1;}
}
@keyframes flipInX {
 0% { transform: perspective(400px) rotateX(90deg); opacity: 0;}
 40% { transform: perspective(400px) rotateX(-10deg);}
 70% { transform: perspective(400px) rotateX(10deg);}
 100% { transform: perspective(400px) rotateX(0deg);opacity: 1;}
}
.flipInX { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInX; -moz-backface-visibility: visible !important; -moz-animation-name: flipInX; -o-backface-visibility: visible !important; -o-animation-name: flipInX; backface-visibility: visible !important; animation-name: flipInX; }
/* - gallery effect*/
@media screen and (min-width: 0px) and (max-width: 960px) {
.logo { margin: 0 auto 0 10px; }
.headerContant { width: 100%; margin: 0px auto; }
.content { width: 96%; padding: 2%; }
}

@media screen and (min-width: 0px) and (max-width: 768px) {
.header { height: auto; }
.menu { display: none; }
.logo { width: 160px; margin: 0 auto 0 10px; }
.contentMenu { display: none; }
.mobilMenu { display: inline; }

/* + gallery */
.portfolio-grid li {  width: 31%; float:left; margin:1.1%; }
/* + gallery */
}
@media screen and (min-width: 0px) and (max-width: 700px) {
.menuTitleImg {display:none;}
.menuContent h2 {padding-top:75px !important;}

}

@media screen and (min-width: 0px) and (max-width: 480px) {
.sodium_cc { display: none; }
.social { width: 185px; float: none; margin: 0px auto; }
.social a { opacity: 1; }
/* + gallery */
.portfolio-grid li {  width: 48%; float:left; margin:1%; }
/* + gallery */
.select01 { width: 98%; height: 40px; float: left; margin: 1%; } /* + gender */
.select02 { width: 98%; height: 40px;  } /* + gender */
.selectMargin {margin-left:0%}
.DateBox { width: 98%; float: left; margin: 1%; }
.select03 { width: 100%; height: 40px;  } /* + gender */
.select04 { width: 100%; height: 40px;  } /* + gender */
.input05{ width: 98%; float: left; margin: 1%; } /* + mail */
/* + menu */
.menuBtn {width:98%; height:auto; padding:5px 0px; color:#FFF; border: 2px solid #FFF; font-family: 'museo_sans_300regular'; margin:2% 1%; float:left; display:block; text-align:center; }
/* - menu */
}
@media screen and (min-width: 0px) and (max-width: 320px) {
/* + reservation + contact */
.DateBox, .input01,.input02, .input03, .input04, .select01     { width: 96%; float: left; margin: 2%; }
/* - reservation + contact */
/* + gallery */
.portfolio-grid li {  width: 98%; float:left; margin:1%; }
/* + gallery */
}

@media screen and (min-width: 0px) and (max-width: 800px) {
.BigBanner { display: none;}
.nav {display: none;}
.mobilMenu {display: none;}
body {  background: url(../img/sliderBackground/mobilBg.jpg) no-repeat top center; background-size: 100%; }
.tMenuBtn {display: block; border: 1px solid #fff; margin: 5px; padding: 10px 15px; color: #fff;  position:absolute; right:0px; z-index:100; cursor:pointer;}
.tMenu a {
text-align: center;
color: #999;
padding: 7px 10px 12px 10px;
color: #FFF;
display: block;
cursor: pointer;
font-family: 'museo_sans_700regular';
font-size: 17px;
line-height: 21px;
background-image: url(../img/background/generalBg.png);
}
.tMenuDetail {border-top: 1px solid #fff; border-bottom: 1px solid #fff;  }
.hide{display: none}
.divmap {width: 100%; height: 300px}