/*
Theme Name: Quandoo Starter Theme 01
Author: Adam Hazon
*/

@import url(https://fonts.googleapis.com/css?family=Playball);
@import url(https://fonts.googleapis.com/css?family=BenchNine);
@import url(https://fonts.googleapis.com/css?family=Oswald);
@import 'https://fonts.googleapis.com/css?family=Taviraj';


* { margin: 0; padding: 0; }

.about-bg { background-color: #650000;
background-image: url("https://www.transparenttextures.com/patterns/diagonal-noise.png");
/* This is mostly intended for prototyping; please download the pattern and re-host for production environments. Thank you! */ color: #fff; }

.contact-bg { background-color: #f7f7f7; box-shadow:0px 0px 8px rgba(0,0,0,0.5);}
.footer-bg { background-color: #333; color: #fff; }

body { position: relative; font-family: century gothic; font-size: 16px; color: #333; background-color: #eee; }

h4 { font-size: 22px; }
a, a:focus { text-decoration: none; color: #333; }

.anchor { position: relative; top:-70px; visibility: hidden; }
.move_up { position: fixed; top: auto; bottom: 20px; right: 20px; width: 50px; height: 50px; display: none; }

header { position: relative; background-position: center, center; background-repeat: no-repeat; background-size: cover; 
    height: 0; padding-bottom: 50%;}

.logo_holder { position: absolute; top: 35%; left: 0; width: 100%; text-align: center; }
.logo {     display: inline-block;
    width: 45vw;
    min-width: 250px;
 }
.logo_mobile { display: none; position: absolute; top: 5px; left: 10px; max-height: 40px; }

.logo_holder h1 { color: #fff; text-shadow: 0 0 15px rgba(0,0,0,0.7); font-size: 5em; }
nav h1 { display: none; margin: 0; padding: 4px 15px; font-size: 2em; color: #fff; }
nav.float h1 { color: #333; }

.btn-header { display: inline-block; color: #fff; text-transform: uppercase; background-color: rgba(51,51,51,0.8); border: none; border-radius:0px; box-shadow:0px 0px 8px rgba(0,0,0,0.4);}

.btn-header:hover { background-color: #fff; }
.btn-header:focus { background-color: rgba(0,0,0,0.7);; color: #fff; }

nav { position: fixed; top: 0; left: 0; width: 100%; z-index: 100; }
.burger { display: none; cursor: pointer; }
.burger span { color: #fff; display: table-cell; vertical-align: middle; font-size: 30px;}
.top_menu { text-align: center; background-color: rgba(0,0,0,0.8); }
.topScr .top_menu { animation: navColorToBlack 1s forwards; }
.float .top_menu { animation: navColorToWhite 1s forwards; }
.top_menu li { display: inline-block; *display: inline; *zoom: 1; }
.top_menu li a { text-transform: uppercase; letter-spacing: 4px; color: #fff; font-size: 13px; padding: 10px 30px; display: block; }
.float .top_menu li a { color: #333; }

@keyframes navColorToWhite {
    from {background-color: rgba(0,0,0,0.8);}
    to {background-color: rgba(255,255,255,0.8);}
}

@keyframes navColorToBlack {
    from {background-color: rgba(255,255,255,0.8);}
    to {background-color: rgba(0,0,0,0.8);}
}

section { padding: 25px 0; }

h2 { font-family:playball; text-transform: none; padding-bottom: 20px; margin-bottom: 30px; letter-spacing: 1px; font-size:40px;}
h2::after{
    position: absolute;
    margin-top: 18px;
    left: 45%;
    width: 10%;
    height: 2px;
    background: rgb(163, 137, 122) none repeat scroll 0% 0%;
    content: "";
    display: block;
}
.about-bg h2::after{
    background:rgb(255,255,255) none repeat scroll 0% 0%;
}

.content { line-height: 1.6em; }
.content p { margin-bottom: 1.5em; }

.contact_info { margin-bottom: 40px; }
.contact_info > div { height: 110px; border-right: 1px solid #bbb; }
.contact_info > div:last-child { border: none; }

.main_photo { 
    width: 100%; 
    height: 0; 
    padding-bottom: 60%; 
    background-size: cover;
    box-shadow: 0px 0px 8px rgba(0,0,0,0.5);
}

footer .q_signature { height: 16px; }

/*Gallery*/

.gallery { list-style: none; }
.gallery .gallery-item { float: left; position: relative; padding: 5px; }
.gallery .gallery-item a { display: block; width: 100%; height: 0; padding-bottom: 100%; background-size: cover; background-repeat: no-repeat; background-position: center center; box-shadow:0px 0px 8px rgba(0,0,0,0.4);}

/*Gallery*/

@media (max-width: 950px) {
    body { padding-top: 50px; }
    #topNav { height: 50px; background-color: rgba(0,0,0,0.8); }
    #topNav.float { animation: navColorToWhite 1s forwards; }
    #topNav.topScr { animation: navColorToBlack 1s forwards; }
    .burger { display: table; position: absolute; right: 0; top: 0; width: 50px; height: 50px; }
    .float .burger span { color: #333; }
    .top_menu { display: none; }
    .open .top_menu { display: block; top: 50px; padding: 50px 0; position: absolute; width: 100%; }
    .top_menu li { display: block; box-shadow:0px 0px 8px rgba(0,0,0,0.4);}
    .logo, .logo_holder h1 { display: none; }
    .logo_mobile, #topNav h1 { display: block; }
    footer { font-size: 11px; text-align: center; }
    footer .q_signature { height: 11px; }
}

@media (max-width: 767px) {
    .contact_info > div { height: 130px; border-right: none; }
    .contact_info > div > div { width: 200px; height: 85px; margin: 0 auto; border-bottom: 1px solid #bbb; border-right: none; }
    .contact_info > div:last-child > div { border: none; }
}

/* custom DC */

.modal-header, .modal-body, .modal-footer{
    
    border:0 !important;
    text-align:center;
    
}

.open-reservation-modal{
    cursor:pointer;
}