/*html {*/
    /*-webkit-filter: grayscale(100%);*/
    /*-moz-filter: grayscale(100%);*/
    /*filter: gray; !* IE6-9 *!*/
    /*filter: grayscale(100%);*/
/*} */

/* System UI font stack https://medium.design/system-shock-6b1dc6d6596f */
body {
    font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    color: #54568F;
}
img {
    max-width: 100%;
}
.logo {
    max-width: 167px;
}
h1, h2, h3 {
    font-weight: bold;
}
p {
    font-size: 18px;
}
a, a:visited {
    text-decoration: underline;
    color: #54568F;
}
a:hover, a:active {
    color: #0F1375;
}
span.hover-finger {
    cursor: pointer;
}
.popover .popover-content img {
    max-width: 100%;
}
dd {
    margin-bottom: 4px;
}
.urlfield {
    display: none;
}
/* Navbar -------------------------------------------------------------------*/
header {
    background: #FCFCFC;
    min-height: 122px;
}
.navbar {
    margin-bottom: 0;
}
.navbar-default {
    background-color: transparent;
    border-color: transparent;
    padding-bottom: 30px;
}
ul.navbar-nav {
    margin-top: 40px;
}
/* Link text styles */
.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-nav > li > a:visited,
.dropdown-menu > li > a {
    color: #7274b5;
    text-transform: uppercase;
    text-decoration: none;
}
@media (min-width: 768px) and (max-width: 991px) {
    .navbar-nav > li > a {
        font-size: 12px;
        padding-left: 10px;
        padding-right: 10px;
    }
}
/* Do not transform uppercase links */
.dropdown-menu > li > a {
    text-transform: none;
}
/* Link hover/active/focus styles */
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:active,
.navbar-default .navbar-nav > li > a:focus,
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:active,
.dropdown-menu > li > a:focus {
    background-color: #e5e6f7;
    color: #212190;
}
@media (max-width: 767px) {
    .navbar-default .navbar-nav .open .dropdown-menu>li>a:focus, .navbar-default .navbar-nav .open .dropdown-menu>li>a:hover {
        background-color: #e5e6f7;
        color: #212190;
    }
}
/* Active styles */
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-menu > li > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu>.active>a,
.navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus,
.navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover {
    background-color: #e5e6f7;
    color: #212190;
}
/* Rounded corners on desktop */
@media (min-width: 768px) {
    .navbar-nav > li > a {
        border-radius: 5px;
    }
}
/* Toggle button margin */
@media (max-width: 767px) {
    .navbar-toggle {
        margin-top: 45px;
    }
}
/* Toggle button colours */
.navbar-default .navbar-toggle {
    border-color: #c3c5f1;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #7274b5;
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    background-color: #e5e6f7;
}
/* Remove weird border on mobile*/
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    border-color: transparent;
}

/* Hero ---------------------------------------------------------------------*/
.hero {
    height: 400px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 60%;
    background-image: url('../images/pages/titus.jpg');
}
.destinations .hero {
    background-image: url('../images/pages/raft-houses.jpg');
}
.tour-packages .hero {
    background-image: url('../images/pages/middle-of-the-lake.jpg');
    background-position: 50% 65%;
}
.contact .hero {
    background-image: url('../images/pages/river-boats.jpg');
    background-position: 0 55%;
}
.home2 {
    background-image: url('../images/pages/saiyok.jpg');
    background-position: 75% 50%;
}
.home3 {
    background-image: url('../images/pages/jumping.jpg');
    background-position: 80% 45%;
}

/* Home ---------------------------------------------------------------------*/
div.block {
    padding-top: 100px;
    padding-bottom: 100px;
    max-width: 850px;
}
div.block2 {
    padding-bottom: 100px;
    max-width: 850px;
}
div.block h1, div.block h2, div.block h3 {
    margin-top: 0;
}
.testimonials {
    background-color: #f5f5dc;
}
.testimonial {
    margin: 50px 0;
}
.testimonial p {
    font-style: italic;
}
.testimonial .caption {
    font-weight: bold;
}
.youtube {
    background: #333;
}
.youtube .container {
    max-width: 850px;

    padding: 0;
    margin: 0 auto;
}
/* Footer ------------------------------------------------------------------*/
footer {
    background-color: #ffe4c4;
}
footer p {
    font-size: 14px;
    margin: 0;
    text-align: center;
}
.tatlogo img {
    max-width: 100px;
    max-height: 100px;
    margin-top: 20px;
    margin-left: 20px;
}
.social ul {
    list-style: none;
    padding: 0;
}
.social li {
    float: left;
    margin-right: 15px;
    margin-bottom: 15px;
}
.social li img {
    border-radius: 10px;
    max-width: 50px;
}
.social {
    margin-top: 46px;
}
.colophon {
    padding: 20px 0;
}
@media (max-width: 991px) {
    .social {
        margin-top: 34px;
    }
    .tatlogo img {
        max-width: 60px;
        max-height: 60px;
        margin-left: 0;
    }
    .social li img {
        max-width: 35px;
    }
    .social li {
        margin-right: 10px;
        margin-bottom: 10px;
    }
}
@media (max-width: 399px) {
    .tatlogo img {
        max-width: 50px;
        margin-top: 25px;
    }
}
/* Admin --------------------------------------------------------------------*/
.admin .hero {
    display: none;
}
.admin .main {
    min-height: 621px;
    padding-top: 15px;
}
@media (max-width: 991px) {
    .admin .main {
        min-height: 661px;
    }
}
/* Destinations -------------------------------------------------------------*/
.thumbnail {
    max-width: 120px;
    max-height: 120px;
}

/* Lightbox overrides -------------------------------------------------------*/
/* Remove white flash when changing pictures */
#lightbox .lb-outerContainer, #lightbox .lb-container  {
    background-color: #000000;
}

/* Bootstrap overrides ------------------------------------------------------*/
.container {
    max-width: 1000px;
}
.btn-primary {
    background-color: #54568F;
    border-color: #54568F;
}
.btn-primary:hover, .btn-primary:active, .btn-primary:active:hover, .btn-primary:focus, .btn-primary:active:focus {
    background-color: #0F1375;
}
a.btn, a.btn-visited {
    text-decoration: none;
    color: #FFFFFF;
}