@import url(https://fonts.googleapis.com/css?family=Arvo);

@font-face {
  font-family: "alluraregular";
  src: url("../fonts/allura/allura-regular-webfont.eot");
  src: url("../fonts/allura/allura-regular-webfont.eot?#iefix")
      format("embedded-opentype"),
    url("../fonts/allura/allura-regular-webfont.woff2") format("woff2"),
    url("../fonts/allura/allura-regular-webfont.woff") format("woff"),
    url("../fonts/allura/allura-regular-webfont.ttf") format("truetype"),
    url("../fonts/allura/allura-regular-webfont.svg#alluraregular")
      format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "blackolives";
  src: url("../fonts/black_olive/black_olives_demo-webfont.eot");
  src: url("../fonts/black_olive/black_olives_demo-webfont.eot?#iefix")
      format("embedded-opentype"),
    url("../fonts/black_olive/black_olives_demo-webfont.woff2") format("woff2"),
    url("../fonts/black_olive/black_olives_demo-webfont.woff") format("woff"),
    url("../fonts/black_olive/black_olives_demo-webfont.ttf") format("truetype"),
    url("../fonts/black_olive/black_olives_demo-webfont.svg#alluraregular")
      format("svg");
  font-weight: normal;
  font-style: normal;
}

/*------------------------------------------------------------------------------------------------*/
body {
  padding-top: ; /* This is required for fixed menu */
  font-size: 1.8em;
  /* background: url(../images/logo/ribbon.png) no-repeat center right; 
  -webkit-background-size: 15%;
  -moz-background-size: 15%;
  -o-background-size: 15%;
  background-size: 15%; */
}

blockquote {
  font-family: "blackolives";
  font-size: 1.4em;
  font-weight: 600;
}

.tina_signature {
  font-family: "blackolives";
  font-size: 1.6em;
  font-weight: 600;
}
/*------------------------------------------------------------------------------------------------*/
/* Header and Menu mods */
.dropdown-menu .divider {
  background-color: #121212;
}
#brand_image {
  display: inline-block;
  height: 74px;
  width: 107px;
  position: relative;
  top: -8px;
  left: -10px;
  float: left;
  z-index: 1100;
}
.navbar-brand h1 {
  display: inline-block;
  position: relative;
  top: -6px;
  top: -10px;
  font-size: 1.4em;
  font-size: 2.2em;
  padding: 0 0 0 0px;
  margin: 0;
  font-family: "Arvo";
  font-family: "alluraregular";
  color: #d5ad6d;
  background: -webkit-linear-gradient(transparent, transparent),
    -webkit-linear-gradient(top, rgba(213, 173, 109, 1) 0%, rgba(
            213,
            173,
            109,
            1
          )
          26%, rgba(226, 186, 120, 1) 35%, rgba(163, 126, 67, 1) 45%, rgba(
            145,
            112,
            59,
            1
          )
          61%, rgba(213, 173, 109, 1) 100%);
  background: -o-linear-gradient(transparent, transparent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.navbar {
  margin-bottom: 0;
}

/* END Header and Menu mods */
/*---------------------------------------------------------------------------------------------------------------------------*/
/* ------------- Slider Styling --------*/
#testimonial {
  margin-top: 2.2%;
}
#holidayCarousel {
}
#dramaCarousel img {
}
#myCarousel {
  margin-top: 4.5%;
}
.carousel.fade {
  opacity: 1;
}
.carousel.fade .item {
  -moz-transition: opacity ease-in-out 0.7s;
  -o-transition: opacity ease-in-out 0.7s;
  -webkit-transition: opacity ease-in-out 0.7s;
  transition: opacity ease-in-out 0.7s;
  left: 0 !important;
  opacity: 0;
  top: 0;
  position: absolute;
  width: 100%;
  display: block !important;
  z-index: 1;
}
.carousel.fade .item:first-child {
  top: auto;
  position: relative;
}
.carousel.fade .item.active {
  opacity: 1;
  -moz-transition: opacity ease-in-out 0.7s;
  -o-transition: opacity ease-in-out 0.7s;
  -webkit-transition: opacity ease-in-out 0.7s;
  transition: opacity ease-in-out 0.7s;
  z-index: 2;
}

#image_links ul {
}

#image_links ul li {
  border: solid 1px crimson;
  list-style-type: none;
  float: left;
  padding: 0 3.5%;
}

/* -------------END Slider Styling --------*/

.yt-toggle.collapsed .glyphicon-chevron-up {
  display: none;
}

.yt-toggle.collapsed .glyphicon-chevron-down {
  display: inline-block;
}

.yt-toggle .glyphicon-chevron-down {
  display: none;
}

/*---------------------------------------------------------------------------------------------------------------------------*/

/* ----------------  Flex Box Classes  -------------------*/
.parent {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  /* -webkit-box-orient: horizontal;
-webkit-box-direction: normal; */
  -webkit-flex-direction: row;
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-flow: row;
  -ms-flex-flow: row;
  -moz-flex-flow: row;
  flex-flow: row;
}

/* ---------------- End Flex Box Classes  -------------------*/
/*---------------------------------------------------------------------------------------------------------------------------*/

/* GA Personal Mods */
hr {
  /* https://css-tricks.com/examples/hrs/ */
  border: 0;
  height: 1px;
  background-image: linear-gradient(
    to right,
    rgba(0, 0, 0, 0),
    rgba(51, 51, 51, 1),
    rgba(0, 0, 0, 0)
  );
  /* THIS IS THE GOLD background-image: linear-gradient(to right, rgba(184,134,11,0), rgba(184,134,11,0.75), rgba(184,134,11,0)); */
}
.border {
  border: 1px solid #555;
}
.date_text {
  font-size: 0.65em;
  float: right;
}

.transparency {
  background: #7f7f7f;
  background: rgba(255, 255, 255, 0.8);
}
.half_font {
  font-size: 0.75em;
}
.visitorcounter {
  background: rgba(51, 51, 51, 0.2);
  font-size: 110%;
  padding: 2px;
}

/* $$$$$$$$$$$$$$$$$$$$$$$$$$$*/
/*SSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS  Spinner SSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS*/
.loader:before,
.loader:after,
.loader {
  border-radius: 50%;
  width: 2.5em;
  height: 2.5em;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: load7 1.8s infinite ease-in-out;
  animation: load7 1.8s infinite ease-in-out;
}
.loader {
  font-size: 10px;
  margin: 80px auto;
  position: relative;
  text-indent: -9999em;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
.loader:before {
  left: -3.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.loader:after {
  left: 3.5em;
}
.loader:before,
.loader:after {
  content: "";
  position: absolute;
  top: 0;
}
@-webkit-keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em rgba(150, 185, 181, 1);
  }
  40% {
    box-shadow: 0 2.5em 0 0 rgba(150, 185, 181, 1);
  }
}
@keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em rgba(150, 185, 181, 1);
  }
  40% {
    box-shadow: 0 2.5em 0 0 rgba(150, 185, 181, 1);
  }
}

/* TTTTTTTTTTTT TYPEwriter effect TTTTTTTTTTTTTTTT */
.typewriter h1 {
  overflow: hidden; /* Ensures the content is not revealed until the animation */
  white-space: nowrap; /* Keeps the content on a single line */
  margin: 0 auto; /* Gives that scrolling effect as the typing happens */
  letter-spacing: 0.15em; /* Adjust as needed */
  animation: typing 3.5s steps(40, end);
}

/* The typing effect */
@keyframes typing {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}

/* TTTTTTTTTTTT TYPEwriter effect TTTTTTTTTTTTTTTT */

/*SSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS END Spinner SSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS*/

.border-temp {
  border: solid 2px #000000;
}
.bg-red {
  background: rgba(131, 14, 22, 1); /* Tina hex codes */
}
.bg-grey {
  background: grey;
}

.bg-green {
  background: #34cb48; /* Tina hex codes */
}

.bg-yellow {
  background: #ffff00; /* Tina hex codes */
}
.bg-black {
  background: black;
}
.bg-blue {
  background: #0000ff; /* Tina hex codes */
}
.bg-pink {
  background: pink;
}
.bg-orange {
  background: orange;
}
.bg-gold {
  background-color: #ffeeb5;
  /* For WebKit (Safari, Chrome, etc) */
  background: #ffeeb5 -webkit-gradient(
      linear,
      left top,
      left bottom,
      from(#ae8913),
      to(#ffeeb5)
    ) no-repeat;
  /* Mozilla,Firefox/Gecko */
  background: #ffeeb5 -moz-linear-gradient(top, #ae8913, #ffeeb5) no-repeat;
  /* IE 5.5 - 7 */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#AE8913, endColorstr=#FFEEB5) no-repeat;
  /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#AE8913, endColorstr=#AE8913)"
    no-repeat;
}

/*################### Tnted Backgrounds #######################*/
.color-a {
  background-color: red;
}

.color-b {
  background-color: green;
}

.color-c {
  background-image: repeating-linear-gradient(
    45deg,
    yellow,
    yellow 10px,
    blue 10px,
    blue 20px
  );
}

.tint1 {
  box-shadow: inset 10000px 0 0 rgba(255, 255, 255, 0.1);
}

.tint2 {
  box-shadow: inset 10000px 0 0 rgba(255, 255, 255, 0.2);
}

.tint3 {
  box-shadow: inset 10000px 0 0 rgba(255, 255, 255, 0.3);
}

.tint4 {
  box-shadow: inset 10000px 0 0 rgba(255, 255, 255, 0.4);
}

/* Gallary styling */

* {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

label[for] {
  cursor: pointer;
}

.grid {
  width: 100%;
  position: relative;
  top: 0;
  left: 0;
  height: 100%;
  background-color: inherit;
  z-index: 0;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-align-content: flex-start;
  -ms-flex-line-pack: start;
  align-content: flex-start;
  /* padding: 16px; */
  overflow: auto;
  text-align: center;
  -webkit-transition: opacity 0.75s;
  transition: opacity 0.75s;
}

.grid .grid-item {
  width: 12%;
  display: inline-block;
  padding: 16px;
  opacity: 0.75;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}

.grid .grid-item:hover {
  opacity: 1;
}

@media screen and (max-width: 1024px) {
  .grid .grid-item {
    width: 50%;
  }
}

@media screen and (max-width: 480px) {
  .grid .grid-item {
    width: 100%;
  }
}

.grid img {
  max-width: 100%;
  max-height: 100%;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

input[type="checkbox"] {
  display: none;
}

.lightbox {
  background: rgba(51, 51, 51, 0.6);
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  min-height: 100%;
  z-index: 1;
  overflow: auto;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
  -webkit-transition: -webkit-transform 0.75s ease-out;
  transition: transform 0.75s ease-out;
}

.lightbox img {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  max-width: 96%;
  max-height: 96%;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

input[type="checkbox"]:checked + .lightbox {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

input[type="checkbox"]:checked ~ .grid {
  opacity: 0.125;
}
/* Gallary styling */
/*########### MEDIA QUERy ###############*/

/* Smartphones (landscape) ----------- */
@media only screen and (min-width: 321px) {
}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width: 320px) {
  .parent {
    display: inline-block;
  }
} /* END 320px */

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  .parent {
    display: inline-block;
  }
} /* END Smartphones (portrait and landscape) ----------- */

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width: 360px) and (max-device-width: 640px) {
  .parent {
    display: inline-block;
  }
} /* END Smartphones (portrait and landscape) ----------- */

/* iPhone 4 ----------- */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
  only screen and (min-device-pixel-ratio: 1.5) {
  .parent {
    display: inline-block;
  }
} /* END   iPhone 4 ----------- */

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .navbar-nav > li > a {
    paddin-left: 0;
    padding-right: 6px;
    max-height: auto;
  }
}
/* Desktops and laptops ----------- */
@media only screen and (min-width: 1224px) {
}

/* Large screens ----------- */
@media only screen and (min-width: 1824px) {
}

/* ###########################End media queries  #################### */