@charset "UTF-8";
/* CSS Document */

body {  background: #000; font-family: 'Lato', sans-serif!important; font-size:14px; text-align:center; width:100%; color:#fff;}
div, ul, li, h1, h2, h3, h4, p, a, span, strong, form, input, label, textarea { position:relative;box-sizing: border-box; }
body, ul, li, h1, h2, h3, h4, p {font-weight:normal; margin: 0;}
h1, h2, h3 {display:block;}
ul{ padding: 0; }
li { list-style:none;}
p{ padding-bottom: 10px; line-height: 24px; }
a { outline:none; text-decoration:none!important; cursor: pointer; color: #fff;}
a, input {-webkit-appearance: none;}
a img { border:none;}
header, nav, section, footer, hgroup, article, content { display:block; position:relative; width:100%;}
h1,h2 { padding-bottom: 15px; }
.headerContact, content { width: 100%; max-width: 1200px; margin: 0 auto; padding: 30px 0; }

header { width: 100%; position: fixed; z-index: 9999; top: 0; background: rgba(0, 0, 0, .7); }
.headerContact {padding: 12px 2% 0; color: #fff; text-align: right;}
.socialMediaTop li { padding: 0 3px; }
.socialMediaTop li a { width: 24px;  display: block; opacity: .7;}
.socialMediaTop li a i { font-size:28px; }
.socialMediaTop li a:hover,
.socialMediaTop li a:active { opacity: 1; }
.socialMediaTop li:last-child { display: none; }

.headerHolder { width: 96%; margin: 0 auto; padding-bottom: 15px; max-width: 1200px;}
.mainLogo { width:26%;}
.mainLogo img { max-width:150px; height:auto; width: 80%;}

.mainNav { width: 69%; text-align: right; }
.mainNav li { margin: 0 5px; }
.mainNav li a { display: block; padding: 5px; }
.mainNav li a:hover,
.mainNav li a:active,
.mainNav li.active a { border-bottom: 3px solid red; }
.mainNav li#closeNavR { display: none; } 

/*Slider*/
.bx-wrapper,
.sliderHolder,
.sliderHolder li,
.sliderHolder li img,
.socialMediaTop li a img { width:100%; padding: 0 !important; margin: 0 !important; height:auto;}
.sliderHolder li img { display:block;}

.menuSlideHolder, .menuSlide { width: 100%; }
.menuSlide { margin-bottom: 50px; }
.menuList { width: 90%; max-width: 900px; margin: 0 auto;top: 30px; }
.menuList li { width: 18%; margin: 0 5px; }
.menuList li a { width: 100%; display: block; }
.menuList li a .imgHolder { overflow: hidden; }
.menuList li a .imgHolder, .menuList li a .imgHolder img {width: 100%; z-index: 1; }
.menuList li a h2 { position: absolute; top: 10px; width: 100%; z-index: 2; font-size: 16px; }
.menuSlideCTA { padding-top: 15px; } 

.imgBG { background:url(../images/monte_fuji.jpg) no-repeat center bottom ;  overflow: hidden; padding: 40px 0 220px; background-size: contain;}

.holderIMG, .mainDesc { width: 40%; float:left }
.holderIMG, .tepanyakiHolder { overflow: hidden; }
.holderIMG img { width: 120%; height: auto; display: block;  left: -20%; position: relative;}
.mainDesc, .tepanyakiDesc { width: 60%; padding:50px }
.mainDesc img { width: 70%; max-width: 200px; margin: 0 auto; position: relative; }
.mainDesc h1 { padding:10px 0; }
.mainDesc p, .tepanyakiDesc p { text-align: center; padding-bottom: 15px; line-height: 24px; font-size: 16px; }

.tepanyakiDesc, .holderIMG {float: left; }
.tepanyakiDesc img { width: 80%; max-width: 200px; padding-bottom: 20px; }
.holderIMG { width: 40%;}
.tepanyakiHolder .holderIMG img { width: 100%; left: 0; }

footer { background: #1c1c1c; padding:30px 10%; box-sizing: border-box; }
footer p, .footeNav { width: 69%;}
.descFooter { width: 69%; text-align: right;}
.descFooter p { width: 100%; color: #666; font-size: 12px; }
.footeNav { padding: 0 0 15px; width: 100%;}
.footeNav li {}
.footeNav li a { padding: 5px; cursor: pointer; }
.footeNav li a:hover,
.footeNav li a:active,
.footeNav li.active a { border-bottom: 3px solid red; }

.socialFooter { width: 30%; }
.socialFooter > a,
.socialFooter > a img,
.socialMedia li a,
.socialMedia li a img { width: 100%; display: block; height: auto; }
.socialFooter > a { max-width: 120px; margin: 0 auto; }
.socialMedia { width: 70%; max-width: 150px; margin: 0 auto; padding-top: 5px;} 
.socialMedia li a { padding: 4px;opacity: .3; }
.socialMedia li a:active,
.socialMedia li a:hover { opacity: .7; }
.socialMedia li a img { max-width:26px; }

/*Páginas internas*/
.innerP > p { max-width: 1000px; margin: 0 auto; }
.thanksP .orderForm p { color: #777; text-align: center; }
.thanksP .orderForm p.orderCode { font-size: 40px; font-weight: bold; padding: 20px 0; }

/* Quienes Somos*/
.quienesDesc, .picGallery,
.locacionesList { width: 100%; overflow: hidden; max-width: 1200px; margin: 0 auto; }
.quienesDesc { padding: 30px 0; }
.quienesDesc li { width: 50%; float: left; }
.quienesDesc li:first-child { padding: 30px; text-align: left; line-height: 24px; }
.quienesDesc li:first-child h1 { font-size: 24px; padding-bottom: 10px; }
.quienesDesc li:first-child p { padding-bottom: 15px;  font-size: 16px;}
.quienesDesc li img { width: 90%; left: 5%; height: auto; display: block; position: relative; }

.picGallery { height: 800px; max-width: 1000px;}
.picGallery li { width: 32%; position: absolute; left: 0; top: 0; height: 32%;}
.picGallery li:nth-child(2) { left: 33%; }
.picGallery li:nth-child(3) { left: 66%; }
.picGallery li:nth-child(4) { width: 65%; top: 33%; height: 65%;}
.picGallery li:nth-child(5) { left: 66%; top: 33%; }
.picGallery li:nth-child(6) { left: 66%; top: 66%; }
.picGallery li a,
.picGallery li a img { width: 100%; display: block; height: 100%; overflow: hidden;}

.redCTAGallery { font-size: 40px; text-align: left; padding: 25px; line-height: 45px;}
.redCTAGallery span { width: 100%; display: block; }
.picGallery li:last-child { float: none; }

/*Locaciones*/
.locacionesList > li { background: #111; padding: 20px; width: 30%; border:1px solid #333; margin:0 1% 20px; }
.locacionesList li .locLogo { background: #fff; border-radius: 100px; -moz-border-radius: 100px; -webkit-border-radius: 100px ; width: 150px; height: 150px; margin: 0 auto 20px; }
.locacionesList li .locLogo img { width: 100%; height: auto; }
.locacionesList li .locDesc { \padding-bottom: 50px;}
.locacionesList li h2 { font-size: 30px; }
.locacionesList li p { padding-bottom: 5px; text-align: left; line-height: inherit;}
.locacionesList li ul { padding-bottom: 10px; }
.locacionesList li ul, .locacionesList li ul li { width: 100%;}
.locacionesList li ul li { text-align: left; padding: 0 0 5px; }

.locacionesList li ul.restPics li { width: 100%; z-index: 1; overflow: hidden; }
.locacionesList li ul.restPics li.Map { width: 100px; position: absolute;z-index: 2; top: -30px; left: 10px; border: 1px solid #fff; padding: 0; }
.locacionesList li ul.restPics li a,
.locacionesList li ul.restPics li a img { width: 100%; height: auto; display: block;}
.locacionesList li div.showMap { display:inherit!important; position:fixed; z-index:9999; width:100%; background:rgba(0, 0, 0, .8);  height:100%;  left: 0; top: 0}
.locacionesList li div.showMap iframe { width: 90%;max-width:600px; max-height:600px; height: 50%; position:relative; margin:0 auto; top:20%; left:0 }
.locacionesList li div.showMap i { position: absolute; font-size:30px; color:#fff; right:30px; top:30px; cursor:pointer; }
/*Tepanyaki*/
.teppanyaki2 .tepanyakiDesc,
.teppanyaki2 .holderIMG { float: right; }

/*Contacto Page*/

/*Formulario*/
.formItems { width: 96%;padding:20px; text-align: left; margin: 0 auto; background: #191919; }
.formItems li { width: 100%;padding-bottom: 15px;}
.formItems li label { width: 100%; display: block;  font-size: 18px;}
.formItems li input,
.formItems li textarea,
.formItems li .inputWrap { width:100%; border:none; padding:10px 4%; color: #777; overflow: hidden; font-size: 16px;}
.formItems li .inputWrap { padding: 0; }
.formItems li .inputWrap .fa-chevron-down { position:absolute; z-index:1; right:10px; top:13px; color: #000 }
.formItems li .inputWrap select { width: 110%; border: none;padding:10px 4%;color: #777; font-size: 16px; z-index:2}
.formItems li textarea { min-height: 150px; }
.formItems li input:focus, .formItems li textarea:focus { border:1px solid #090;}
.formItems li input.redCTA { color: #fff; font-size: 20px; cursor: pointer; border: none; font-weight: bold; }
.formItems li input::placeholder { color: #dedede;}
.formItems li input:-ms-input-placeholder {color: #dedede;}
.formItems li input::-ms-input-placeholder {color: #dedede;}
.formItems li a { font-size: 12px; color: #999; text-decoration: none; width: 100%; display: block; }
.formItems li a:first-child { padding-bottom: 5px;}

.contactInfo { width: 60%; padding: 30px 0;}
.contactInfo2 { width: 39% ; }
.contactInfo > h2,
.contactInfo > p { text-align: left; width: 100%; }
.contactInfo > p a { font-size: 18px; }

.contactList { width: 100%;}
.contactList li { width: 100%; padding: 0 0 15px; text-align: left; color: #fff; font-size: 18px;}
.contactList li .fa-circle { font-size:8px; color:red;  margin-right: 10px;}

/*----- menú animado ------*/
.menuAnimation { width: 100%; display: flex; max-width: 1000px; margin: 50px auto;box-shadow: 0 0 60px #333;}
.book {display: flex;}
.book input { display: none; }
#cover, .flip-book {
  width: 500px;
  height: 590px;
}
.flip-book { perspective: 1500px;}
#cover, .flip {border: 1px solid #333;}
.flip, .front, .back {  width: 100%; height: 100%; position: absolute; top: 0; left: 0;}

.flip { transform-origin: left; transform-style: preserve-3d; transform: rotateY(0deg); transition: .5s; color: #000;}
.front { background-color: #000; box-sizing: border-box;}
.back { z-index: 99; transform: rotateY(180deg); backface-visibility: hidden; background-color: #000;}
.next-btn, .back-btn {position: absolute; bottom: 13px; right: 13px; cursor: pointer; color: #fff; padding: 6px; background: rgba(0, 0, 0, .8); font-size: 10px;}

#p1 { z-index: 15;}
#p2 { z-index: 14;}
#p3 { z-index: 13;}
#p4 { z-index: 12;}
#p5 { z-index: 11;}
#p6 { z-index: 10;}
#p7 { z-index: 9;}
#p8 { z-index: 8;}
#p9 { z-index: 7;}
#p10 { z-index: 6;}
#p11 { z-index: 5;}
#p12 { z-index: 4;}
#p13 { z-index: 3;}
#p14 { z-index: 2;}
#p15 { z-index: 1;}


#c1:checked ~ .flip-book #p1 { transform: rotateY(-180deg); z-index: 1;}
#c2:checked ~ .flip-book #p2 { transform: rotateY(-180deg); z-index: 2;}
#c3:checked ~ .flip-book #p3 { transform: rotateY(-180deg); z-index: 3;}
#c4:checked ~ .flip-book #p4 { transform: rotateY(-180deg); z-index: 4;}
#c5:checked ~ .flip-book #p5 { transform: rotateY(-180deg); z-index: 5;}
#c6:checked ~ .flip-book #p6 { transform: rotateY(-180deg); z-index: 6;}
#c7:checked ~ .flip-book #p7 { transform: rotateY(-180deg); z-index: 7;}
#c8:checked ~ .flip-book #p8 { transform: rotateY(-180deg); z-index: 8;}
#cover img, .flip img { width: 100%; height: auto; display: block;}


/*#p1 { z-index: 3;}
#p2 { z-index: 2;}
#p3 { z-index: 1;}

#c1:checked ~ .flip-book #p1 { transform: rotateY(-180deg); z-index: 1;}
#c2:checked ~ .flip-book #p2 { transform: rotateY(-180deg); z-index: 2;}
#c3:checked ~ .flip-book #p3 { transform: rotateY(-180deg); z-index: 3;}*/

/*-------------------- General ---------------------*/
/*Red CTA*/
.redCTA { width: 80%; color: #fff; display: block;  padding: 10px 5px; max-width: 300px; margin: 0 auto; text-transform: uppercase;}

.redCTA:hover,
.redCTA:active,
.redCTAGallery:active, 
.redCTAGallery:hover { background: #fff;}

/*Red gradient*/
.menuSlide {/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8b0000+1,e10019+50,8b0000+100 */
background: #8b0000; /* Old browsers */
background: -moz-linear-gradient(top,  #8b0000 1%, #e10019 50%, #8b0000 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #8b0000 1%,#e10019 50%,#8b0000 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #8b0000 1%,#e10019 50%,#8b0000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8b0000', endColorstr='#8b0000',GradientType=0 ); /* IE6-9 */
}

/* Gray gradient */
.quienesDesc li:first-child {/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#191919+1,000000+100 */
background: #191919; /* Old browsers */
background: -moz-linear-gradient(left,  #191919 1%, #000000 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #191919 1%,#000000 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #191919 1%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#191919', endColorstr='#000000',GradientType=1 ); /* IE6-9 */
}

/*Red color*/
.redCTAGallery:active, 
.redCTAGallery:hover,
.contactInfo > p a:hover,
.contactInfo > p a:active { color: #cf0014; }

.redCTA,
.redCTAGallery {background:#cf0014;}

/*Display inline block*/
.socialMediaTop li,
.mainLogo,
.mainNav,
.mainNav li,
.menuList li,
.descFooter,
.socialFooter,
.footeNav li,
.socialFooter,
.socialMedia li,
.picGallery li,
.locacionesList > li,
.contactInfo { display:inline-block; vertical-align:top;}

.mainLogo,
.mainNav,
.contactList li .fa-circle,
.locacionesList li ul li img {vertical-align: middle; }

/*Green color*/
{ color:#090; }

.redCTA:hover,
.redCTA:active,
.formItems li input.redCTA:hover,
.formItems li input.redCTA:active { background:#090; }

/*Border Radius*/
.formItems li input,
.formItems li .inputWrap,
.formItems li textarea,
.picGallery li a,
.next-btn, .back-btn { border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;}

.redCTA,
.menuList li a .imgHolder,
.formItems { border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px;}

.locacionesList > li { border-radius:30px; -moz-border-radius:30px; -webkit-border-radius:30px;}

{ border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%;}

.quienesDesc li:first-child {border-radius: 20px 0 0 20px; -moz-border-radius: 20px 0 0 20px; -webkit-border-radius: 20px 0 0 20px;}

/*Transfor & transition*/
.mainNav, .showMenu {transition: .2s all linear;}

{transform: scale(1.1); transition: .2s all linear; }

.showMap {-webkit-transition: .4s; transition: .4s; }

/*Box shadow*/
.locacionesList li ul.restPics li.Map { box-shadow: 0 0 10px rgb(0 0 0 / 0.5);}

/*------------------- Ends General --------------------*/

@media screen and (max-width:1024px) {
    section.innerP, .socialFooter { width: 90%; margin: 0 auto; }
}
@media screen and (max-width:990px) {
    .mainNav li a { font-size: 12px; }
    .picGallery { height: 600px; }
    .redCTAGallery { font-size: 26px; line-height: 30px;}
    .menuList li { width: 20%; }

}
@media screen and (max-width:768px)
{
    .imgBG { padding: 40px 0 100px; }
    .mainDesc, .tepanyakiDesc { padding: 20px 50px; }
    .mainDesc, .holderIMG, .tepanyakiDesc { width: 100%; }
    .tepanyakiDesc { padding: 20px; }
    .holderIMG img,
    .tepanyakiHolder .holderIMG img { width: 60%; margin: 0 auto; left: inherit;}

    .quienesDesc li { width: 90%; margin-bottom: 20px;  left: 5%;}
    .descFooter { display: none; }
    .formItems { width: 100%; }

    .locacionesList > li { width: 100%; overflow: hidden; }
    .locacionesList li .locLogo,
    .locacionesList li .locDesc,
    .locacionesList li ul.restPics {float: left; }

    .locacionesList li .locDesc { width: 68%; padding-left: 10%; }
    #cover, .flip-book { width: 50%; height: auto; }
}

@media screen and (max-width:767px) {
    header { padding-bottom: 20px; }
    .headerHolder { position: absolute; top: 10px; left: 0; width: 200px; padding-bottom: 0; }
    .mainLogo { width: 100%; }
    .mainNav { position: fixed; right: 0; top: 0; height:100%; background: #000; width: 300px; right: -300px; border-left: 1px solid #333;}
    .mainNav li { width: 100%; text-align: left; margin: 0; }
    .mainNav li a { font-size: 18px; border-bottom: 1px solid #333; padding: 10px; box-sizing: border-box;}
    .mainNav li#closeNavR { display: inherit; text-align: right; } 
    .mainNav li#closeNavR p { padding: 10px 10px 0; font-size: 30px; }
    .socialMediaTop li:last-child { display: inline-block; }
    .showMenu { right: 0; }

    .mainLogo img { max-width: 120px; }
    .nav { display: none!important; }
    .contactoP { width: 90%; margin: 0 auto; }
    .contactInfo { width: 100%;  max-width: inherit; padding: 10px 0;}
    .menuList li a h2{ font-size: 10px; width: 80%; left: 10%;}
    .quienesDesc li:first-child h1,
    .quienesDesc li:first-child p { text-align: center; }

}
@media screen and (max-width:650px) {
    .picGallery { height: 440px; }
    .locacionesList li .locLogo,
    .locacionesList li .locDesc,
    .locacionesList li ul.restPics { float: none; }
    .locacionesList li .locDesc { width: 100%; padding-left: 0; }
}
@media screen and (max-width:575px) {
    .picGallery { height: 330px; }
    .redCTAGallery { font-size: 18px; line-height: 20px;}
}
@media screen and (max-width:370px) {


}