@import url("https://fonts.googleapis.com/css?family=Abhaya+Libre:400,700|Vidaloka");
/* MAIN COLOR */
/* SECONDARY COLOR */
body { font-family: 'Abhaya Libre', serif; color: #222; font-size: 1.5em; }

hr.style11 { height: 6px; background: url("../img/hr.png") repeat-x 0 0; border: 0; }

h1, h2, h3, h4, h5, h6 { font-family: 'Vidaloka', serif; }

.navbar { margin-bottom: 0; }

.navbar-nav { margin: 0 -15px; }

.navbar, .navbar-header { height: 100px; }
.navbar .navbar-nav > li > a, .navbar-header .navbar-nav > li > a { margin-top: 25px; text-transform: uppercase; font-size: 1.2em; background: #f8f8f8; }
.navbar .navbar-nav > li > a:hover, .navbar-header .navbar-nav > li > a:hover { border-top: 2px solid #2184a3; border-bottom: 2px solid #2184a3; color: #2184a3; border-radius: 0; transition: all 0.7s ease 0s; }
@media (max-width: 767px) { .navbar .navbar-nav > li > a:hover, .navbar-header .navbar-nav > li > a:hover { background-color: #f8f8f8; color: #222; border-radius: 0; border: 0px solid #f8f8f8; } }
@media (max-width: 767px) { .navbar .navbar-nav > li > a, .navbar-header .navbar-nav > li > a { line-height: 20px; margin-top: 0; } }
@media (max-width: 767px) { .navbar, .navbar-header { height: 70px; }
  .navbar .logo, .navbar-header .logo { max-height: 70px; } }

.navbar-brand { padding: 0px 15px; }

.cta-box { padding: 20px 0px; }

.cta { padding: 20px 30px; background: #2184a3; font-size: 1.2em; color: #f8f8f8; transition: all 0.7s ease 0s; text-decoration: none; }
.cta:hover { background: #f8f8f8; color: #2184a3; text-decoration: none; box-shadow: 0px 0px 4px #b8b8b8; }

.hero-slider { padding: 80px 0; margin-top: 100px; background: #ebebeb; }
@media (max-width: 767px) { .hero-slider { margin-top: 70px; padding: 20px 0; } }
.hero-slider .pull-left { margin-bottom: 25px; }
.hero-slider .img-right img { box-shadow: 0px 0px 25px #b8b8b8; }
.hero-slider h2 { font-size: 2em; }
.hero-slider p { font-size: 1.3em; }

.hero-services { background-color: #ebebeb; color: #222; padding: 50px 0; }
.hero-services h1 { padding: 0 0 25px 0; color: #2184a3; font-weight: bold; font-size: 3em; }
.hero-services .col-1, .hero-services .col-2 { padding: 25px 0; }
.hero-services p { font-size: 1.3em; padding: 0 20px; }

.hero-about { padding: 60px 0; background-color: #fdfdfd; color: #222; }
@media (max-width: 767px) { .hero-about { padding: 20px 0; } }
.hero-about h2 { color: #2184a3; font-weight: bold; font-size: 3em; }
.hero-about p { font-size: 1.4em; font-weight: 500; color: #222; }
@media (max-width: 767px) { .hero-about p { margin: 20px 0; font-size: 1.2em; } }

.hero-img { background-image: url("../img/hero-img.jpg"); background-repeat: no-repeat; background-attachment: fixed; background-size: cover; background-position: center; padding: 250px 0; }
.hero-img h1 { color: #222; font-weight: bold; font-size: 2.5em; line-height: 1.5em; }
@media (max-width: 767px) { .hero-img h1 { font-size: 1.5em; } }
.hero-img p { font-size: 2em; }
@media (max-width: 767px) { .hero-img p { font-size: 1.3em; } }
@media (max-width: 1024px) { .hero-img { background-attachment: scroll; padding: 150px 0; } }
@media (max-width: 767px) { .hero-img { padding: 100px 0; } }

.hero-contact { background-color: #ebebeb; padding: 0; color: #222; }
.hero-contact .col-md-12 { padding: 20px 50px; }
@media (max-width: 767px) { .hero-contact .col-md-12 { padding: 40px 20px; color: #555555; } }
.hero-contact .col-md-12 img { margin-top: 5%; }
@media (max-width: 480px) { .hero-contact .col-md-12 ul { padding-left: 10px; } }
.hero-contact .col-md-12 li { list-style: none; line-height: 26px; }
.hero-contact .col-md-12 a { text-decoration: none; color: #2f2f2f; font-weight: 100; }
.hero-contact .col-md-12 p { font-size: 1.2em; line-height: 1.5em; color: #2f2f2f; }
.hero-contact .col-md-12 .footer-banner ul { padding-left: 0; }

footer { text-align: center; padding-top: 25px; background: #666; color: white; }

.hero-services { background-color: #fdfdfd; }

.hero-guide { padding: 80px 0; margin-top: 100px; background: #ebebeb; font-size: 1.3em; }
@media (max-width: 767px) { .hero-guide { margin-top: 70px; padding: 20px 0; } }
.hero-guide h2 { font-size: 2em; }
.hero-guide img { width: 100%; height: auto !important; margin-bottom: 1rem; }

.nav > li > a { padding: 10px 12px; }
