@font-face {
    font-family: 'HarmoniaSansW1G-Regular';
    src: url('Fonts/HarmoniaSansW1G-Regular.otf') format('opentype');
}
@font-face {
    font-family: 'HarmoniaSansW1G-Light';
    src: url('Fonts/HarmoniaSansW1G-Light.otf') format('opentype');
}
@font-face{
     font-family: 'HarmoniaSansW1G-SemiBd';
    src: url('Fonts/HarmoniaSansW1G-SemiBd.otf') format('opentype');
}


/*fonts*/
body {
    font-family: 'HarmoniaSansW1G-Regular',Helvetica,Arial,sans-serif;
}
.AboutUs2 .container-fluid {
    padding: 0;
}
.AboutUs:after,
.AboutUs2:after,
.Booking:after,
.Contact:after,
.carousel-park:after {
    content: " ";
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAQAAADYv8WvAAAAEUlEQVQI12NgePyfgeE/EAIAFBUD4aE/TggAAAAASUVORK5CYII=);
    background-position: 0 0;
    background-repeat: repeat;
    background-size: 1px 1px;
    z-index: 1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    position: absolute;
}
.huge-font {
    font-size: 4vw;
}

#wrap {
    position: relative;
}

/*pages sidebar background color and style*/
.maroon-text {
    color: #9b1e30;
}
.red-text {
    color: #eeac95;
}
.blue-text {
    color: #8cc6df;
}
.Contact, .Booking, .Hotel, .Ohrid, .AboutUs {
    background-image: url('Images/contact.jpg');
    background-position: center center;
    /*height: 100vh;
    width: 100vw;*/
    background-repeat: no-repeat;
    overflow-x: hidden;
}
.Home2 {
    height: 100vh;
    overflow: hidden;
}
.Hotel {
    background-image: url('Images/about_us_hotel.jpg');
}
.AboutUs {
    background-image: url('Images/about_us_hotel.jpg');
}
.Ohrid {
    background-image: url('Images/about_us_ohrid.jpg');
}
/*.Accomodation {
    background-image: url('Images/accommodation_1.jpg');
}
.Restaurant {
    background-image: url('Images/restaurant_1.jpg');
}*/
.Booking {
    background-image: url('Images/booking.jpg');
	background-attachment: fixed;
}
.Contact .col-md-5,
.Accomodation .col-md-5,
.Restaurant .col-md-5,
.Booking .col-md-5,
.AboutUs .col-md-5,
.AboutUs2 .col-md-5,
.Hotel .col-md-5,
.Ohrid .col-md-5 {
    padding: 0;
}
.Contact .contact-sidebar,
.Hotel .hotel-sidebar {
    background-color: #0d0e13;
    color: #fff;
    text-align: right;
    padding: 30px;
    min-height: 100vh;
    height: 100%;
    z-index: 2;
    position: relative;
}
.Hotel .hotel-sidebar {
    text-align: left;
}

.AboutUs .hotel-sidebar,
.AboutUs2 .hotel-sidebar {
    background-color: #0d0e13;
    color: #fff;
    text-align: right;
    padding: 30px;
    min-height: 100vh;
    height: 100%;
    z-index: 2;
    position: relative;
    text-align: left;
}
.AboutUs .col-right .position-center,
.AboutUs2 .col-right .position-center {
    z-index: 2;
}
@media (min-width: 8px) {
    .container-fluid > .row > .col-md-5,
    .container-fluid > .vport-container .vport-wrap #left .col-md-5,
    .container-fluid > .vport-container .vport-wrap #right .col-md-5 {
        width: calc((100% - 20vw)/2);
    }
    .container-fluid > .row .col-mid,
    .container-fluid > .vport-container .vport-wrap #left .col-mid,
    .container-fluid > .vport-container .vport-wrap #right .col-mid {
        width: calc(100% - 80vw);
        width: 20vw;
    }
}
.Ohrid .col-left,
.AboutUs .col-right,
.AboutUs2 .col-right {
    min-height: 100vh;
}
.Ohrid .col-left .position-center {
    z-index: 2;
}


.Accomodation .accomodation-sidebar,
.Restaurant .restaurant-sidebar {
    z-index: 2;
    position: relative;
    text-align: left;
    color: #fff;
    padding: 30px;
    min-height: 100vh;
    height: 100%;
}
@media (min-width: 768px) {
    .Accomodation .container-fluid::after,
    .Restaurant .container-fluid::after {
        content: "";
        position: absolute;
        z-index: 3;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        display: block;

        background: rgba(0,0,0,0.8);
        background: -moz-linear-gradient(left, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.7) 40%, rgba(0,0,0,0.5) 60%, rgba(0,0,0,0) 100%);
        background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,0,0,0.8)), color-stop(40%, rgba(0,0,0,0.7)), color-stop(60%, rgba(0,0,0,0.5)), color-stop(100%, rgba(0,0,0,0)));
        background: -webkit-linear-gradient(left, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.7) 40%, rgba(0,0,0,0.5) 60%, rgba(0,0,0,0) 100%);
        background: -o-linear-gradient(left, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.7) 40%, rgba(0,0,0,0.5) 60%, rgba(0,0,0,0) 100%);
        background: -ms-linear-gradient(left, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.7) 40%, rgba(0,0,0,0.5) 60%, rgba(0,0,0,0) 100%);
        background: linear-gradient(to right, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.7) 40%, rgba(0,0,0,0.5) 60%, rgba(0,0,0,0) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=1 );
    }

    .ohrid-mobile-wrap {
        display: none;
    }
}
@media (max-width: 767px) {
    .Accomodation .accomodation-sidebar,
    .Restaurant .restaurant-sidebar {
        background: rgba(0,0,0,0.7);
        background: -moz-linear-gradient(left, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 100%);
        background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,0,0,0.7)), color-stop(100%, rgba(0,0,0,0.7)));
        background: -webkit-linear-gradient(left, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 100%);
        background: -o-linear-gradient(left, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 100%);
        background: -ms-linear-gradient(left, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 100%);
        background: linear-gradient(to right, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=1 );
    }
}
.Booking .booking-sidebar,
.Ohrid .ohrid-sidebar {
    text-align: left;
    color: #0d0e13;
    padding: 30px;
    min-height: 100vh;
    height: 100%;
    background: #fff;
    z-index: 2;
    position: relative;
}
.Ohrid .ohrid-sidebar {
    text-align: right;
}
.position-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    padding: 30px;
}
.h1 {
    margin-top: 0;
}
/*menu*/
.navbar-default .navbar-nav > li > a {
    color: #fff;
}

    .dropdown .dropdown-toggle,
    .navbar-default .navbar-nav > li > a:focus,
    .navbar-default .navbar-nav > li > a:hover,
    .navbar-default .navbar-nav > .open > a,
    .navbar-default .navbar-nav > .open > a:focus,
    .navbar-default .navbar-nav > .open > a:hover {
        background-color: #0d0e13;
        color: #fff;
    }

.dropdown-menu .menu-links li a.active {
    color: #8cc6df;
}

.dropdown-menu .menu-links li a:hover,
.dropdown-menu .menu-links li a:focus {
    color: #eeac95;
    text-decoration: none;
}
.menu-col {
    min-height: 0px;
}

.main-menu .menu-info .btn-default {
    background: none;
    border-radius: 0;
    color: #fff;
    border: 1px solid #fff;
}
.navbar-nav > li > .dropdown-menu {
    border-radius: 0;
}

    .main-menu {
        z-index: 11;
        max-width: calc(100% - 80vw);
        max-width: 20vw;
        width: 100%;
        margin: 0 auto;
        padding: 0;
        position: fixed;
        top: -60px;
        left: 50%;
        -moz-transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
        -o-transform: translate(-50%, 0);
        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0);
        /*Transition*/
        -webkit-transition: All 0.5s ease;
        -moz-transition: All 0.5s ease;
        -o-transition: All 0.5s ease;
        transition: All 0.5s ease;
        max-height: calc(100vh + 10px);
        overflow: hidden;
    }

        .main-menu:hover {
            top: 0px;
            max-height: 100vh;
        }
    .navbar-collapse.collapse {
        max-height: calc(100vh + 10px) !important;
    }
    .navbar-nav,
    .navbar-nav > .dropdown {
        text-align: center;
        float: none;
        margin: 0 auto;
    }

        .navbar-nav > .dropdown {
        }

    .navbar-collapse {
        padding: 0;
    }

    .dropdown-menu {
        position: static;
        bottom: 0;
        height: calc(100vh - 66px);
        float: none;
        background: #0d0e13;
        color: #fff;
    }

        .dropdown-menu > li > a,
        .dropdown-menu .menu-links a {
            color: #fff;
        }

    
    .main-menu .navbar-nav .dropdown {
        -moz-transition:    all 1000ms ease;
        -ms-transition:     all 1000ms ease;
        -webkit-transition: all 1000ms ease;
        transition:         all 1000ms ease;

        height: 110px;
    }
    .main-menu .navbar-nav .dropdown.open {


        height: 100%;
        top: -4vh;
    }
    .main-menu .navbar-nav .dropdown-menu {
        -moz-transition:    all 1000ms ease;
        -ms-transition:     all 1000ms ease;
        -webkit-transition: all 1000ms ease;
        transition:         all 1000ms ease;
        display: block;
        top: -110vh;
        border: none;
        position: relative;
    }
    .main-menu .navbar-nav .dropdown.open .dropdown-menu {
        top: 0;
    }
    @media (max-width: 480px) {
        .main-menu .navbar-nav .dropdown.open .dropdown-menu {
            top: -3vh;
        }
    }

    .menu-logo {
        position: absolute;
        text-align: center;
        top: -77px;
        left: 50%;
        -moz-transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
        -o-transform: translate(-50%, 0);
        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0);
        width: 100%;
        background: #0d0e13;
        padding: 10px;
    }

    .menu-info {
        position: absolute;
        text-align: center;
        bottom: 3%;
        left: 50%;
        -moz-transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
        -o-transform: translate(-50%, 0);
        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0);
        width: 100%;
    }

    .menu-links {
        position: absolute;
        top: 34%;
        left: 50%;
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 100%;
        text-align: center;
    }


/* chat box */
#chat-box-header {
        z-index: 10;
        max-width: 20vw;
        width: 100%  !important;
        margin: 0 auto;
        top: auto;
        left: 50%;
        right: 50% !important;
        -moz-transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
        -o-transform: translate(-50%, 0);
        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0);

        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        background: #ffffff !important;
        color: #0d0e13 !important;
        text-align: center;
        padding: 10px 10px !important;
        box-sizing: border-box !important;
        font-size: 16pt !important;
        text-transform: uppercase;


    }
    #chat-box {
        z-index: 10;
        max-width: 20vw;
        height: 332px !important;
        width: 100%  !important;
        margin: 0 auto;
        padding: 0  !important;
        left: 50%;
        right: 50% !important;
        -moz-transform: translate(-50%, 0);
        -ms-transform: translate(-50%, 0);
        -o-transform: translate(-50%, 0);
        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0);

        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        background: #ffffff !important;
        color: #0d0e13 !important;
        text-align: center;
        padding: 10px 10px !important;
        box-sizing: border-box !important;
        font-size: 16pt !important;
        text-transform: uppercase;
        opacity: 1 !important;
    }
    #chat-box-email {
    border-radius: 0 !important;
    border: 1px solid #0d0e13 !important;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
}
#chat-box-cmt {
    border-radius: 0 !important;
    border: 1px solid #0d0e13 !important;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    width: 100%;
}

/* Main-menu, chatbox, big-white-logo mobile*/
@media (max-width: 767px) {
    .navbar-header {
        display: none;
    }
    .main-menu, #chat-box, #chat-box-header {
        width: 100%;
        max-width: 100%;
    }
    #chat-box-header {
        border-top: 1px solid #0d0e13 !important;
    }
    .bottom-element {
    }
    .menu-logo svg {
        width: 65px;
    }
    .Accomodation .row > .col-mid,
    .Accomodation .row > .col-right,
    .Restaurant .row > .col-mid,
    .Restaurant .row > .col-right,
    .Booking .row > .col-mid,
    .Booking .row > .col-right,
    .Contact .row > .col-left,
    .Contact .row > .col-mid,
    .AboutUs .row > .col-mid,
    .AboutUs .row > .col-right,
    .AboutUs2 .row > .col-mid,
    .AboutUs2 .row > .col-right,
    .Ohrid .row > .col-left,
    .Ohrid .row > .col-mid {
        display: none;
    }
    .Accomodation .row > .col-left,
    .Restaurant .row > .col-left,
    .Booking .row > .col-left,
    .Contact .row > .col-right,
    .AboutUs .row > .col-left,
    .AboutUs2 .row > .col-left,
    .Ohrid .row > .col-right {
        width: 100%;
    }
    .Accomodation .accomodation-sidebar {
        padding: 50px 40px 60px 20px;
    }
    .Booking .booking-sidebar,
    .AboutUs .hotel-sidebar,
    .AboutUs2 .hotel-sidebar,
    .Ohrid .ohrid-sidebar {
        padding: 50px 20px 70px;
    }
    .Contact .contact-sidebar {
        padding: 60px 20px;
    }
    .Contact .main-menu {
            border-bottom: 1px solid #fff;
    }
    .Restaurant .restaurant-sidebar .position-center {
        position: relative;
        top: auto;
        left: auto;
        transform: none;
        width: 100%;
        padding: 20px 0;
    }
    .main-menu .menu-info-item {
        margin-bottom: 0px;
        padding: 5px;
    }
    .menu-links {
        top: 30%;
    }
}

@media (min-width: 920px) {
        .navbar-nav > li > .dropdown-menu {
            top: -50px;
        }
        .menu-logo {
            top: 15px;
        }
        .menu-links {
            top: 43%;
        }
    }

@media (min-width: 768px) and (max-width: 991px) {
    .menu-logo {
        top: -44px;
    }
    .menu-logo svg {
        width: 80px;
    }
    .menu-links {
        top: 37%;
    }
}

/*carousel style*/
.carousel-control {
    opacity: 1;
    z-index: 2;
}

.glyphicon {
    background: #0D0E13;
}

.carousel-park {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
}
.Restaurant .carousel-park,
.Accomodation .carousel-park {
    z-index: 2;
}
.Restaurant .restaurant-sidebar,
.Accomodation .accomodation-sidebar {
    position: relative;
    z-index: 4;
}

.item {
    background-position: center center;
    height: 100vh;
    width: 100vw;
    background-repeat: no-repeat;
}

.Home2 #item1 {
    background-image: url('Images/slider_01.jpg');
}

.Home2 #item2 {
    background-image: url('Images/slider_02.jpg');
}

.Home #item3 {
    background-image: url('Images/slider_03.jpg');
}

.Home #item4 {
    background-image: url('Images/slider_04.jpg');
}

.Home #item5 {
    background-image: url('Images/slider_05.jpg');
}

.Home #item6 {
    background-image: url('Images/slider_06.jpg');
}

.Home #item7 {
    background-image: url('Images/slider_07.jpg');
}

.Home #item8 {
    background-image: url('Images/slider_08.jpg');
}

.Home #item9 {
    background-image: url('Images/slider_09.jpg');
}

.Home #item10 {
    background-image: url('Images/slider_10.jpg');
}
.Home #item11 {
    background-image: url('Images/slider_11.jpg');
}
.Home #item12 {
    background-image: url('Images/slider_12.jpg');
}
.Home #item13 {
    background-image: url('Images/slider_13.jpg');
}
.Home #item14 {
    background-image: url('Images/slider_14.jpg');
}
/*.Home #item15 {
    background-image: url('Images/slider_15.jpg');
}
.Home #item16 {
    background-image: url('Images/slider_16.jpg');
}
.Home #item17 {
    background-image: url('Images/slider_17.jpg');
}
.Home #item18 {
    background-image: url('Images/slider_18.jpg');
}*/

.Accomodation #item1 {
    background-image: url('Images/Accomodation/accommodation_1.jpg');
}

.Accomodation #item2 {
    background-image: url('Images/Accomodation/accommodation_2.jpg');
}

.Accomodation #item3 {
    background-image: url('Images/Accomodation/accommodation_3.jpg');
}

.Accomodation #item4 {
    background-image: url('Images/Accomodation/accommodation_4.jpg');
}

.Accomodation #item5 {
    background-image: url('Images/Accomodation/accommodation_5.jpg');
}

.Accomodation #item6 {
    background-image: url('Images/Accomodation/accommodation_6.jpg');
}

.Accomodation #item7 {
    background-image: url('Images/Accomodation/accommodation_7.jpg');
}
.Accomodation #item8 {
    background-image: url('Images/Accomodation/accommodation_8.jpg');
}
.Accomodation #item9{
    background-image: url('Images/Accomodation/accommodation_9.jpg');
}
.Accomodation #item10 {
    background-image: url('Images/Accomodation/accommodation_10.jpg');
}
.Accomodation #item11 {
    background-image: url('Images/Accomodation/accommodation_11.jpg');
}
.Accomodation #item12 {
    background-image: url('Images/Accomodation/accommodation_12.jpg');
}
.Accomodation #item13 {
    background-image: url('Images/Accomodation/accommodation_13.jpg');
}
.Accomodation #item14 {
    background-image: url('Images/Accomodation/accommodation_14.jpg');
}
.Accomodation #item15 {
    background-image: url('Images/Accomodation/accommodation_15.jpg');
}

.Restaurant #item1 {
    background-image: url('Images/Restaurant/restaurant_1.jpg');
}
.Restaurant #item2 {
    background-image: url('Images/Restaurant/restaurant_2.jpg');
}
.Restaurant #item3 {
    background-image: url('Images/Restaurant/restaurant_3.jpg');
}
.Restaurant #item4 {
    background-image: url('Images/Restaurant/restaurant_4.jpg');
}
.Restaurant #item5 {
    background-image: url('Images/Restaurant/restaurant_5.jpg');
}
.Restaurant #item6 {
    background-image: url('Images/Restaurant/restaurant_6.jpg');
}
.Restaurant #item7 {
    background-image: url('Images/Restaurant/restaurant_7.jpg');
}
.Restaurant #item8 {
    background-image: url('Images/Restaurant/restaurant_8.jpg');
}
@media screen and (orientation: landscape) {
    .item {
        /*background-size: 100% auto;*/
    }
}

@media screen and (orientation: portrait) {
    .item {
        background-size: auto 100%;
    }
}

.carousel-control.right,
.carousel-control.left {
    background: none;
}

.facebook-icon,
.twitter-icon,
.instagram-icon {
    background-image: url(Images/fb.png);
    background-position: center;
    background-repeat: no-repeat;
    width: 28px;
    height: 28px;
    display: inline-block;
    background-size: 28px;
    margin: auto 6px;
}
.facebook-icon:hover {
    background-image: url(Images/fb2.png);
}
.twitter-icon {
    background-image: url(Images/tw.png);
}
.twitter-icon:hover {
    background-image: url(Images/tw2.png);
}
.instagram-icon {
    background-image: url(Images/insta.png);
}
.instagram-icon:hover {
    background-image: url(Images/insta2.png);
}
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    border: none;
}

.navbar-default {
    border: none;
    border-radius: 0;
    background: none;
}

.menu-logo:after {
    content: "";
    height: 100px;
    position: absolute;
    top: -115px;
    left: 0;
    right: 0;
    background-color: #0d0e13;
}

.menu-info-item {
    display: block;
    padding: 5px;
}

.menu-links a {
    font-size: 1.4vw;
    text-transform: uppercase;
}

a.dropdown-toggle div {
    font-size: 16pt;
    text-transform: uppercase;
}

.bottom-element {
    position: fixed;
    bottom: 60px;
    left: 50%;
    -moz-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    -o-transform: translate(-50%, 0%);
    -webkit-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
    z-index: 2;
    display: none;
}
.Home .bottom-element {
    display: block;
}
.logo-overlay {
    display: none;
}
.Home .logo-overlay {
    display: block;
}
.logo-overlay svg {
    width: 100%;
    height: auto;
    max-width: 18vw;
    max-height: 80vh;
}

/*@media (max-width: 767px) {
    .logo-overlay svg {
        width: auto;
    }
}*/

/*gallery page*/
.Gallery {
    background: #0d0e13;
}
.Gallery .bottom-element .logo-overlay {
    display: none;
}

.gallery-wrap {
    height: 100vh;
    width: 100vw;
    overflow-x: hidden;
    overflow-y: auto;
}

    .gallery-wrap .thumb-item {
        padding: 0;
        margin: 0;
        line-height: 0;
        border: 2px solid #0D0E13;
    }

.thumb-item .btn-thumb {
    background: #0d0e13;
    width: 100%;
    height: 25vh;
    padding: 0;
    margin: auto;
    background-position: center;
    background-repeat: no-repeat;
    border: none;
    display: block;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.btn-thumb img {
    /*display: none;*/
    width: 100%;
    height: auto;

    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    /*Transition*/
        -webkit-transition: All 1s ease;
        -moz-transition: All 1s ease;
        -o-transition: All 1s ease;
        transition: All 1s ease;
}
.btn-thumb:hover img {
    width: 120%;
}
.btn-thumb:after {
    content: " ";
    position: absolute;
    background: #fff;
    width: 100%;
    height: 100%;
    opacity: 0;

    /*Transition*/
        -webkit-transition: All 1s ease;
        -moz-transition: All 1s ease;
        -o-transition: All 1s ease;
        transition: All 1s ease;
}
.btn-thumb:hover:after {
    opacity: 0.3;
}
.thumb-item .btn-thumb:hover {
    background-size: 150% auto;
}

@media screen and (orientation: landscape) {
    .thumb-item .btn-thumb {
        background-size: 100% auto;
    }
}

@media (max-width: 991px) and (orientation: landscape) {
    .thumb-item .btn-thumb {
        height: 50vh;
    }
}

@media screen and (orientation: portrait) {
    .thumb-item .btn-thumb {
        background-size: auto 100%;
    }
}
/*@media (max-width: 767px) {
    .thumb-item .btn-thumb {
        width: 100%vw;
        height: 25vh;
    }
}*/


/* date picker */
#ui-datepicker-div {
    background-color: #fff;
    border: 1px solid #0d0e13;
    box-sizing: border-box;
}



/* forms and inputs */
.form-control {
    border-radius: 0;
    border: 1px solid #0d0e13;
}
.btn {
    border-radius: 0;
}

/* icons */
.icon-item {
    display: block;
    width: 11.11%;
    height: auto;
    float: left;
    padding: 10px;
}
@media (max-width: 767px) {
    .icon-item {
        width: 20%;
    }
}

/* carousel arrows */
.carousel-control .glyphicon-chevron-right {
    right: 6%;
    height: 10vh;
    width: 6vh;
}
.carousel-control .glyphicon-chevron-left {
    left: 6%;
    height: 10vh;
    width: 6vh;
}
.carousel-control .glyphicon-chevron-right::before,
.carousel-control .glyphicon-chevron-left::before {
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    content: "";
    height: 6vh;
    background-position: center;
    background-size: 3vh 7vh;
    background-repeat: no-repeat;
    background-image: url(Images/Icons/arrow_right.png);
    width: 3vh;
}
.carousel-control .glyphicon-chevron-left::before {
    background-image: url(Images/Icons/arrow_left.png);
}


.font-light {
    font-family: 'HarmoniaSansW1G-Light';
}
.font-semibold {
    font-family: 'HarmoniaSansW1G-SemiBd';
}
.font-tracking {

}




/* SLIDER WITH CSS ANIMATION */
.cb-slideshow,
.cb-slideshow:after {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 0;
}
.cb-slideshow:after {
    content: '';
    background: transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAQAAADYv8WvAAAAEUlEQVQI12NgePyfgeE/EAIAFBUD4aE/TggAAAAASUVORK5CYII=) repeat top left;
    background-size: 1px 1px;
}
.cb-slideshow li span {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    color: transparent;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    opacity: 0;
    z-index: 0;
	-webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 36s linear infinite 0s;
    -moz-animation: imageAnimation 36s linear infinite 0s;
    -o-animation: imageAnimation 36s linear infinite 0s;
    -ms-animation: imageAnimation 36s linear infinite 0s;
    animation: imageAnimation 36s linear infinite 0s;
}
.cb-slideshow li div {
    z-index: 1000;
    position: absolute;
    bottom: 30px;
    left: 0px;
    width: 100%;
    text-align: center;
    opacity: 0;
    -webkit-animation: titleAnimation 36s linear infinite 0s;
    -moz-animation: titleAnimation 36s linear infinite 0s;
    -o-animation: titleAnimation 36s linear infinite 0s;
    -ms-animation: titleAnimation 36s linear infinite 0s;
    animation: titleAnimation 36s linear infinite 0s;
}
.cb-slideshow li div h3 {
    font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
    font-size: 240px;
    padding: 0;
    line-height: 200px;
	color: rgba(169,3,41, 0.8);
}
.cb-slideshow li:nth-child(1) span { background-image: url(Images/slider_01.jpg) }
.cb-slideshow li:nth-child(2) span {
    background-image: url(Images/slider_02.jpg);
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
}
.cb-slideshow li:nth-child(3) span {
    background-image: url(Images/slider_03.jpg);
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}
.cb-slideshow li:nth-child(4) span {
    background-image: url(Images/slider_04.jpg);
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s;
}
.cb-slideshow li:nth-child(5) span {
    background-image: url(Images/slider_05.jpg);
    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    -ms-animation-delay: 24s;
    animation-delay: 24s;
}
.cb-slideshow li:nth-child(6) span {
    background-image: url(Images/slider_06.jpg);
    -webkit-animation-delay: 30s;
    -moz-animation-delay: 30s;
    -o-animation-delay: 30s;
    -ms-animation-delay: 30s;
    animation-delay: 30s;
}
.cb-slideshow li:nth-child(7) span {
    background-image: url(Images/slider_07.jpg);
    -webkit-animation-delay: 36s;
    -moz-animation-delay: 36s;
    -o-animation-delay: 36s;
    -ms-animation-delay: 36s;
    animation-delay: 36s;
}
.cb-slideshow li:nth-child(8) span {
    background-image: url(Images/slider_08.jpg);
    -webkit-animation-delay: 42s;
    -moz-animation-delay: 42s;
    -o-animation-delay: 42s;
    -ms-animation-delay: 42s;
    animation-delay: 42s;
}
.cb-slideshow li:nth-child(9) span {
    background-image: url(Images/slider_09.jpg);
    -webkit-animation-delay: 48s;
    -moz-animation-delay: 48s;
    -o-animation-delay: 48s;
    -ms-animation-delay: 48s;
    animation-delay: 48s;
}
.cb-slideshow li:nth-child(10) span {
    background-image: url(Images/slider_10.jpg);
    -webkit-animation-delay: 54s;
    -moz-animation-delay: 54s;
    -o-animation-delay: 54s;
    -ms-animation-delay: 54s;
    animation-delay: 54s;
}
.cb-slideshow li:nth-child(2) div {
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
}
.cb-slideshow li:nth-child(3) div {
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}
.cb-slideshow li:nth-child(4) div {
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s;
}
.cb-slideshow li:nth-child(5) div {
    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    -ms-animation-delay: 24s;
    animation-delay: 24s;
}
.cb-slideshow li:nth-child(6) div {
    -webkit-animation-delay: 30s;
    -moz-animation-delay: 30s;
    -o-animation-delay: 30s;
    -ms-animation-delay: 30s;
    animation-delay: 30s;
}
.cb-slideshow li:nth-child(7) div {
    -webkit-animation-delay: 36s;
    -moz-animation-delay: 36s;
    -o-animation-delay: 36s;
    -ms-animation-delay: 36s;
    animation-delay: 36s;
}
.cb-slideshow li:nth-child(8) div {
    -webkit-animation-delay: 42s;
    -moz-animation-delay: 42s;
    -o-animation-delay: 42s;
    -ms-animation-delay: 42s;
    animation-delay: 42s;
}
.cb-slideshow li:nth-child(9) div {
    -webkit-animation-delay: 48s;
    -moz-animation-delay: 48s;
    -o-animation-delay: 48s;
    -ms-animation-delay: 48s;
    animation-delay: 48s;
}
.cb-slideshow li:nth-child(10) div {
    -webkit-animation-delay: 54s;
    -moz-animation-delay: 54s;
    -o-animation-delay: 54s;
    -ms-animation-delay: 54s;
    animation-delay: 54s;
}
/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation { 
	0% {
	    opacity: 0;
	    -webkit-animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    -webkit-transform: scale(1.05);
	    -webkit-animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    -webkit-transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    -webkit-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@-moz-keyframes imageAnimation { 
	0% {
	    opacity: 0;
	    -moz-animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    -moz-transform: scale(1.05);
	    -moz-animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    -moz-transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    -moz-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@-o-keyframes imageAnimation { 
	0% {
	    opacity: 0;
	    -o-animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    -o-transform: scale(1.05);
	    -o-animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    -o-transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    -o-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@-ms-keyframes imageAnimation { 
	0% {
	    opacity: 0;
	    -ms-animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    -ms-transform: scale(1.05);
	    -ms-animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    -ms-transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    -ms-transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@keyframes imageAnimation { 
	0% {
	    opacity: 0;
	    animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    transform: scale(1.05);
	    animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    transform: scale(1.1);
	}
	100% { opacity: 0 }
}
/* Show at least something when animations not supported */
.no-cssanimations .cb-slideshow li span{
	opacity: 1;
}
ul.cb-slideshow li {
    list-style-type: none;
}

/* SLIDER CSS END */



/* for about us layout*/
.vport-container {
  height: 100vh;
  width: 100vw;
  overflow: hidden;

}
.vport-wrap {
  height: 100vh;
  width: 200vw;
  position: relative;
  display: block;
}
.vport {
  height: 100vh;
  min-height: 100%;
  width: 100vw;
  display: block;
  float: left;
}
#left {
    padding: 0px 15px;
}


/* FONT SIZE */
h1, .h1 {
    font-size: 2.5vw;
}
p, .btn {
    font-size: 1vw;
}
.btn-lg {
    font-size: 1.3vw;
}

.timeless {
	position:absolute;
	right:20px;
	top:20px;
}

.timeless img {
	height: 70px;
}

#chat-box-header a {
	color:#333;
}