/*
Theme Name: DCMultipage
Author: David Chan
Author URI: http://kldchan.com
Description: DC\'s take on a multipage template
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dcmultipage
Tags:

This theme, like WordPress, is licensed under the GPL.

DCMultipage is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/
@import url('https://fonts.googleapis.com/css?family=Merriweather');
@import url('https://fonts.googleapis.com/css?family=Oswald');


@font-face {
  font-family: 'Century Gothic';
  src: url('fonts/century-gothic.ttf');
}

@font-face {
  font-family: 'Helvetica';
  src: url('fonts/Helvetica.ttf');
}

/*--------------------------------------------------------------
# BACKGROUND COLORS
--------------------------------------------------------------*/
.navbar-default{
  background-color: rgba(255, 255, 255, 0.71);
      box-shadow: 0px 0px 3px rgba(0,0,0,0.2);
      border: 0;
}

#about{
  background-color: #f7f7f7;

}

#contact{
   background-color: #0a0400;
   background-image: url("https://www.transparenttextures.com/patterns/stardust.png");
   box-shadow: 0px 0px 8px rgba(0,0,0,0.2);
}

/* footer background*/
#colophon {
  background:#111;
}

/*--------------------------------------------------------------
# BUTTON COLORS
--------------------------------------------------------------*/
.btn-fancy{
  background-color: #3a1e1a;
  box-shadow: 0px 0px 3px rgba(0,0,0,0.4);
  color: #f7f7f7;
  border: none;
  text-transform: uppercase;
}

.btn-fancy:hover{
  background-color:#0e0e0e !important;
  color:#fff !important; /*button font color*/
}
/*--------------------------------------------------------------
# Header Fonts
--------------------------------------------------------------*/
.navbar-default .navbar-nav>li>a {
  color: #1f1f1f;
      text-transform: none;
      letter-spacing: 1px;
}

h2{
  font-family: 'Century Gothic';
  font-size: 30px;
  letter-spacing: 3px;
  margin-bottom: 20px;
  text-transform: uppercase;
  color: #b8b894;
  text-shadow: 0px 2px 2px rgba(128, 128, 128, 0.5);
}

#about h2{

}

#contact h2{

}

h3{
  font-size: 17px;
color: #ccccb3;
letter-spacing: 3px;
text-transform: uppercase;
}

/*horizontal line after header*/
h2:after{
  position: absolute;
    margin-top: 18px;
    left: 47%;
    width: 6%;
    height: 2px;
    background: #9c7069 none repeat scroll 0% 0%;
    content: "";
    display: block;
}

/*--------------------------------------------------------------
# Body Fonts
--------------------------------------------------------------*/

body{
  font-family: 'Century Gothic', serif;
  font-size:14px;
  line-height:25px;
  letter-spacing:0.5px;
  color:#0e0e0e;
  background-color: #f7f7f7;
}

/* about font*/
#about p{

}

/* contact font */
#contact p{
color:#ccccb3;
}

/* contact links */
#contact a{
  color:#ccccb3;
  font-size:13px;
}

/* footer font */
#colophon p{
  color:#fff;
  margin:0 !important;
}

/*button font*/
.btn{
  border-radius: 0 !important;
  letter-spacing: 1px;
  padding: 19px 36px;
  margin-top: 20px;
  font-size: 18px;
}

/*small screen sizes*/
@media(max-width:767px){
  body{
    font-size:14px;
  }
}

/*--------------------------------------------------------------
# Overlay for background image
--------------------------------------------------------------*/

.overlay{
  position:absolute;
  top:0;
  left:0;
  height:100%;
  width:100%;
  background:rgba(0, 0, 0, 0.4);
}

/*--------------------------------------------------------------
# Logo
--------------------------------------------------------------*/

.logo{
  max-width:500px;
}

/*--------------------------------------------------------------
# Default
--------------------------------------------------------------*/

header{
  margin-top:0;
}

.container{
  position:relative;
}

.section-spacing {
  padding: 30px 0;
}

.text{
  padding:30px;
}

blockquote{
  padding: 10px 20px;
  margin: 0 0 20px;
  font-size: 15.5px;
  border-left: 3px solid #e2d3ab;
}

*:focus {
  outline: none;
  border: none;
}

a:hover{
  text-decoration-line:none !important;
}

/*--------------------------------------------------------------
# Word Break
--------------------------------------------------------------*/

#primary, #secondary{

  -ms-word-break: break-all;
  word-break: break-all;
  word-break: break-word;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;

}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
  display: inline;
  float: left;
  margin-right: 1.5em;
}

.alignright {
  display: inline;
  float: right;
  margin-left: 1.5em;
}

.aligncenter {
  clear: both;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.centerstuff{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  z-index:5;
  width:90%;
}

.nopadding{
  padding:0 !important;
}

.nomargin{
  margin:0 !important;
}

.text-left{
  text-align:left;
}

.text-center{
  text-align:center;
}

.background-image{
  background-position:center !important;
  background-size:cover !important;
}

.background-generic{
  min-height:100vh;
  background-color:#333;
}

.bg-gray{
  background-color:#f5f5f5;
  border-top: 1px solid #e2e2e2;
}




/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {
  margin: 0 0 1.5em;
}

.widget select {
  max-width: 100%;
}

.widget ul{
  list-style:none;
  padding-left:15px;
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/

.navbar-collapse{
  text-align:center;
}

.navbar-collapse ul{
  display:inline-block;
  float:none;
}


/*--------------------------------------------------------------
# Gallery
--------------------------------------------------------------*/

#gallery-content .fa{
  font-size:40px;
}

.gallery {
  margin-bottom: 1.5em;
}

.gallery li{
  list-style: none;
  height: 0;
  padding: 0 0 33%;
  overflow: hidden;
  position:relative;
  box-shadow:0px 0px 3px rgba(0,0,0,0.15);
  transition-duration:0.3s;
  -webkit-transition-duration:0.3s;
}
.gallery li:hover{
  transform:scale(0.9);
}
.gallery li img{
  min-height: 100%;
  min-width: 100%;
  max-height: 150%;
  max-width: 150%;
}
@media(max-width:767px){
  .gallery-tab{
    padding:15vh 0;
  }
  .gallery li{
  }
}

/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/

#contact .text-center{
  padding-bottom:30px;
}



.map, .map p{
  height:600px;
  max-height:80vh;
  padding:0 !important;
}

/*--------------------------------------------------------------
## Modal
--------------------------------------------------------------*/

.modal-content{
  border-radius: 0;
  box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
  color:#333;
}
.modal-header, .modal-content, .modal-footer{
  border:none;
}

.modal-header{
  padding:0 !important;
}
.fa-close{
  position: absolute;
  top: 10px;
  right: 10px;
  color: #adadad;
  font-size: 25px;
  opacity: 1;
}

#reservation-modal .modal-body div{
  display:inline-block !important;
}

.open-reservation-modal{
  cursor:pointer;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {
  word-wrap: break-word;
}

.bypostauthor {
  display: block;
}

.comments-title, .comment-reply-title {
  padding-bottom: 9px;
  margin: 40px 0 20px 0;
  border-bottom: 1px solid #eee;
}

ol.comment-list {
  list-style:none;
  padding-left: 0;
}

.comment-author .avatar {
  margin-right: 25px;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  padding: 4px;
}

.comment-meta {
  margin-top: 20px;
  margin-bottom: 20px;
}

.comment-details {
  overflow: hidden;
  zoom: 1;
  margin-bottom: 25px;
  padding-bottom: 25px;
  border-bottom: 1px solid #ddd;
}

.comment-details .reply {
  margin-top: 10px;
}

.comment-date a {
  font-size: 11px;
  color: #777;
  margin-right: 10px;
}

#commentform #comment {
  width: 100% !important;
}

#commentform #submit {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: center;
  #f7f7f7-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;

  color: #333;
  background-color: #fff;
  border-color: #ccc;
}

#commentform #submit:hover{
  color: #333;
  background-color: #e6e6e6;
  border-color: #adadad;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/

.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
  display: none;
}


.infinity-end.neverending .site-footer {
  display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
  border: none;
  margin-bottom: 0;
  margin-top: 0;
  padding: 0;
}

embed,
iframe,
object,
img {
  max-width: 100%;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
  margin-bottom: 1.5em;
  max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.wp-caption .wp-caption-text {
  margin: 0.8075em 0;
}

.wp-caption-text {
  text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/

.gallery-item {
  display: inline-block;
  text-align: center;
  vertical-align: top;
  width: 100%;
}

.gallery-columns-2 .gallery-item {
  max-width: 50%;
}

.gallery-columns-3 .gallery-item {
  max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
  max-width: 25%;
}

.gallery-columns-5 .gallery-item {
  max-width: 20%;
}

.gallery-columns-6 .gallery-item {
  max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
  max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
  max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
  max-width: 11.11%;
}

.gallery-caption {
  display: block;
}

/*--------------------------------------------------------------
# Post Meta
--------------------------------------------------------------*/

.entry-meta span {
  margin-right: 20px;
  display: inline-block;
}

.entry-meta span:last-child {
  margin-right: 0;
}

.entry-meta span .fa{
  color: #bcbcbc;
}

.entry-meta span a {
  color: #777;
  text-decoration: none;
}

.entry-meta span a:hover {
  text-decoration: underline;
}

.posted-on .fa, .byline .fa{
  color:#bcbcbc;
}

.posted-on a, .byline a{
  color:#777;
  text-decoration:none;
}

.posted-on a:hover, .byline a:hover{
  color:#555;
  font-weight:bold;
}
.comments-link span{
  display:none;
}

/*--------------------------------------------------------------
Search
--------------------------------------------------------------*/
.search-highlight {
  background:#FFFF00
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/

.footer-bg {
  background-color: #171717;
  color: #fff;
  padding: 17px 0;
  z-index: 10;
  font-size: 13px;
}

#colophon .container {
  padding-top: 25px;
  padding-bottom:25px;
}



.footer {
  margin-left:0;
  padding:0 0 30px 0;
}

.footer li {
  display:inline;
  list-style-type:none;
}

.footer li a {
  border-left:1px solid #ddd;
  padding: 0 8px;
}

.footer > li:first-child > a {
  border-left:none;
  padding:0 8px 0 0;
}

.thumbnail{
  margin-bottom: 6px;
  border-radius: 0;
  border-color: #9c7069;
  background: #9c7069;
  box-shadow: 0px 0px 3px #c7c7c7;
  padding: 2px;
}
}


/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/

.spinner{
  width: 80px;
  height: 80px;

  border: 2px solid #f3f3f3;
  border-top:3px solid #06512a;
  border-radius: 100%;

  position: absolute;
  top:0;
  bottom:0;
  left:0;
  right: 0;
  margin: auto;

  animation: spin 1s infinite linear;
}

@keyframes spin {
  from{
    transform: rotate(0deg);
    }to{
      transform: rotate(360deg);
    }
  }

  #overlay{
    height:100%;
    width:100%;
    background:rgba(0, 0, 0, 1);
    position:fixed;
    left:0;
    top:0;
    z-index:9999;
  }

  .maxwidth{
    width:100vw;
    max-width:100vw;
  }

  /*--------------------------------------------------------------
  Media Queries
  --------------------------------------------------------------*/

  /* Custom, iPhone Retina */
  @media only screen and (min-width : 320px) {

  }

  /* Extra Small Devices, Phones */
  @media only screen and (min-width : 480px) {

  }

  /* Small Devices, Tablets */
  @media only screen and (min-width : 768px) {

  }

  /* Medium Devices, Desktops */
  @media only screen and (min-width : 992px) {

    .copyright {
      float: right;
    }
  }

  /* Large Devices, Wide Screens */
  @media only screen and (min-width : 1200px) {

  }

  /*--------------------------------------------------------------
  Media Queries
  --------------------------------------------------------------*/

  /* ipad */
  @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
    #background-slider, .carousel-slider, #home .item, #background-slider .background{
      height: 768px;
    }
    #background-slider .background{
      min-width:1200px;
    }
  }
  @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
    #background-slider, .carousel-slider, #home .item, #background-slider .background {
      height: 1024px;
    }
    #background-slider .background{
      min-width:1000px;
    }
  }
  /* Android */
  @media only screen and (min-device-width: 320px) and (min-device-height: 569px) and (max-device-height: 700px) and (orientation : landscape){
    #background-slider, .carousel-slider, #home .item, #background-slider .background {
      height: 370px;
    }
    #background-slider .background{
      min-width:1000px;
    }
  }
  @media only screen and (min-device-width: 320px) and (min-device-height: 569px) and (max-device-height: 700px) and (orientation : portrait) {
    #background-slider, .carousel-slider, #home .item, #background-slider .background {
      height: 700px;
    }
    #background-slider .background{
      min-width:1000px;
    }
  }
  /* iphone5 */
  @media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2) {
    #background-slider, .carousel-slider, #home .item, #background-slider .background {
      height: 320px;
    }
    #background-slider .background{
      min-width:1000px;
    }
  }
  @media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2) {
    #background-slider, .carousel-slider, #home .item, #background-slider .background {
      height: 600px;
    }
    #background-slider .background{
      min-width:1000px;
    }
  }