/* global */
body { -webkit-font-smoothing: antialiased; background-color: transparent; color: #24282A; font-family: 'lato', ; }
body, html {
    height: 100%;
}
a { -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; text-decoration: none !important; transition: 0.3s }

.space30 { margin-top: 30px }
.space60 { margin-top: 60px }

header { z-index: 5; position: absolute; left:0; right:0; margin-left:auto; margin-right:auto }
    header .navbar { background-color: #fff; padding: 0!important; }
        header .navbar li { font-size: 16px; text-transform: uppercase; }
        header .navbar .navbar-brand img { width: 413px; }
            header .navbar .navbar-nav li a { -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; color: #000; text-align: center; transition: 0.3s; }
            header .navbar .navbar-nav li a:hover, header .navbar .navbar-nav li.active a, header .navbar .navbar-nav li.open a { color: #000;  border-radius: 5px }
        header .header-strap img.head-logo { position: absolute; top: 0; left: 0; z-index: 10!important }
        header .header-strap { background-color: #000; color: #ffffff!important; padding: 10px 30px; font-family: 'Kanit', sans-serif; }
            header .header-strap a { color: #ffffff!important; font-weight: 800 }
                header .header-strap a:hover { color: #4180a9!important; font-weight: 800 }
            header .header-strap ul { margin-right: 20px }
                header .header-strap li { display: inline; font-size: 21px!important; padding-left: 5px; font-weight: 700 }
            header .header-strap i { color: #4180a9; padding-right: 10px; font-size: 17px; }
        header .header-strap .telephone { margin-left: 0px!important; font-size: 21px; border-left: 2px solid #424242; padding: 10px 20px; justify-content: center; }
            header .header-strap .telephone p { margin: 0; }
            header .header-strap .telephone span { font-size: 13px }
        header .header-strap .btn-book-now { background-color: #4180a9; text-align: center; padding: 5px 18px 3px 18px; margin-left: 0!important;  font-family: 'Kanit', sans-serif; font-weight: 800; text-transform: uppercase; }
            header .header-strap .btn-book-now a { color: #fff; font-size: 30px!important; line-height: 30px!important; }
                header .header-strap .btn-book-now a:hover { color: #000!important }
        
        header .main-menu img.head-logo { display: none; }
        header .main-menu li { font-size: 18px; padding: 0 10px }
            header .navbar .navbar-nav li a { -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; color: #000; text-align: center; transition: 0.3s; }
                header .navbar .navbar-nav li a:hover, header .navbar .navbar-nav li.active a, header .navbar .navbar-nav li.open a { color: #f26437!important;  border-radius: 5px }
            header .main-menu .btn-social { margin-left: 0!important; }
                header .main-menu .btn-social a { font-size: 27px; padding: 7px 15px }
                    header .main-menu .btn-social a:hover { color: #f26437!important }
            header .main-menu .btn-social .btn { border-radius: 0; color: #fff }
                header .main-menu .btn-facebook { background-color: #3b5998 }
                header .main-menu .btn-twitter { background-color: #1da1f2 }
                header .main-menu .btn-instagram { background-color: #c13584 }
                header .main-menu .btn-email { background-color: #484748 }

#carousel-home { background-color: #000; z-index: 1; }
    #carousel-home, #carousel-home .carousel-inner, #carousel-home .carousel-item, #carousel-home .carousel-item.active { height: 100%; }

        #carousel-home .carousel-item .item-quote { bottom: 400px; color: #FFF; font-size: 109px; text-transform: uppercase; font-family: 'Kanit', sans-serif; line-height: 90px; font-weight: 800; right: 9%; position: absolute; max-width: 500px; }
        #carousel-home .carousel-item .item-quote-seals { bottom: 400px; color: #FFF; font-size: 109px; text-transform: uppercase; font-family: 'Kanit', sans-serif; line-height: 100px; font-weight: 800; right: 9%; position: absolute; max-width: 500px; }
        #carousel-home .carousel-item .item-author { bottom: 325px; color: #FFF; font-size: 17px; right: 9%; position: absolute; max-width: 500px }
        #carousel-home .carousel-item .item-btn { bottom: 250px; color: #FFF; font-size: 19px; right: 27%; position: absolute; text-transform: uppercase; }
        #carousel-home #item-1 { background-image: url(/img/layout/wildlife-cruise-landscape.jpg) }
        #carousel-home #item-2 { background-image: url(/img/layout/seaswift-bg.jpg) }
        #carousel-home #item-3 { background-image: url(/img/layout/seal-bg.jpg) }

#home-content { padding: 60px 0 30px 0 }
    #home-content .home-info { padding: 40px 0 10px 0; }
        #home-content .home-info p { padding: 10px 50px 10px 0px; font-size: 18px;}

.upcoming-trips { position: relative; z-index: 3; background-color: #000; color: #fff; border: 3px solid #f26437; border-top-left-radius: 20px; border-bottom-right-radius: 20px; padding: 20px 25px; margin-top: -220px }
    .upcoming-trips h2 { font-family: 'Kanit', sans-serif; font-size: 52px; line-height: 47px; font-weight: 800; margin-bottom: 15px; text-transform: uppercase; text-align: center; }
    .upcoming-trips p { color: #afdbf5; font-size: 17px; font-weight: 700; margin-bottom: 10px; margin-left: 10px; }
        .upcoming-trips p span { color: #f26437; font-size: 17px; font-weight: 800 }
    .upcoming-trips table { background-color: #fff; color: #000; font-weight: 700; }
        .upcoming-trips .table td { border: 0; padding: 5px 10px }
        .upcoming-trips table a { color: #f26437; font-family: 'Kanit', sans-serif; font-weight: 800; }
            .upcoming-trips table a:hover { color: #4180a9; font-family: 'Kanit', sans-serif; font-weight: 800; }
    .upcoming-trips a { color: #fff; font-weight: 700; text-transform: uppercase; font-size: 17px;  }
        .upcoming-trips a:hover { color: #f26437; }
    .upcoming-trips .upcoming-time { width: 65px }
    .upcoming-trips .upcoming-link { width: 70px }

/*#home-trips { margin-bottom: 50px }
    #home-trips h3 { text-align: center; font-size: 44px; line-height: 40px; font-family: 'Kanit', sans-serif; font-weight: 800; text-transform: uppercase; padding-bottom: 20px }
    #home-trips .trips { background-color: transparent; position: relative; max-width: 100%; height: auto; }
        #home-trips .trips img { max-width: 100%; }
        #home-trips .owl-prev, #home-trips .owl-next { color: #f26437!important }
        #home-trips .trips .trip-img { display: block; }*/

        /*#home-trips .trips .trip-info { position: relative; left: 121px; width: 75%; margin-top: -120px; z-index: 3; background-color: #000; color: #fff; border: 3px solid #f26437; border-top-left-radius: 20px; border-bottom-right-radius: 20px; padding: 20px 20px; font-size: 32px; font-family: 'Montserrat', sans-serif; font-weight: 900; line-height: 32px; height: 175px }
        #home-trips .trips .trip-info .btn-project { font-size: 24px; background-color: #fff; padding: 5px 20px; border: 1px #585757 solid; border-radius: 0; text-transform: uppercase; font-weight: 300; width: 100%; color: #f26437 }
            #home-trips .trip-info .btn-project:hover { color: #fff; background-color: #585757; border: 1px #585757 solid; }*/

#home-trips { margin-bottom: 50px }
    #home-trips h3 { font-size: 44px; font-family: 'Kanit', sans-serif; font-weight: 800; line-height: 40px; padding-bottom: 20px; text-align: center; text-transform: uppercase }
    #home-trips .trips { position: relative }
    #home-trips .trips img { margin-bottom: 50px }
    #home-trips .trips .trip-info { -moz-border-bottom-right-radius: 20px; -moz-border-top-left-radius: 20px; -webkit-border-bottom-right-radius: 20px; -webkit-border-top-left-radius: 20px; background-color: #000; border: 3px solid #F26437; border-bottom-right-radius: 20px; border-top-left-radius: 20px; bottom: -50px; color: #FFF; font-family: 'Montserrat', sans-serif; font-size: 32px; font-weight: 900; line-height: 32px; padding: 20px; position: absolute; right: 0; width: 75% }
        #home-trips .trips .trip-info .btn { -moz-border-radius: 0; -webkit-border-radius: 0; background-color: #FFF; border: 1px #585757 solid; border-radius: 0; color: #F26437; font-size: 24px; font-weight: 300; padding: 5px 20px; text-transform: uppercase }
        #home-trips .trips .trip-info .btn:hover { background-color: #585757; border: 1px #585757 solid; color: #FFF }


    .owl-carousel { padding: 0px; position: relative }
    .owl-next, .owl-prev { bottom: 0; color: #D1D0D0 !important; display: block !important; font-size: 45px !important; height: 70px; margin: auto; position: absolute; top: 0; width: 40px }
    .owl-prev { left: -60px }
    .owl-next { right: -60px }
    .owl-dots { text-align: center; -webkit-tap-highlight-color: transparent; }
        .owl-dots .owl-dot { display: inline-block; zoom: 1; *display: inline; }
           .owl-dots .owl-dot span { width: 30px; height: 7px; margin: 50px 7px 20px 7px; background: #000; display: block; -webkit-backface-visibility: visible; transition: opacity 200ms ease; border-radius: 0px; }
            .owl-dots .owl-dot.active span, .owl-dots .owl-dot:hover span { background: #f26437; }

.seal-bg { background-image: url(/img/layout/seal-bw-bg.jpg); -moz-background-size: cover; -o-background-size: cover; -webkit-background-size: cover; background-position: center; background-repeat: no-repeat; background-size: cover; padding: 80px 0 100px 0; text-align: center; color: #fff; }
    .seal-bg h3 { font-size: 44px; line-height: 40px; font-family: 'Montserrat', sans-serif; font-weight: 900; padding-bottom: 10px; }
    .seal-bg p { font-size: 18px;  }

.experiences { position: relative; z-index: 3; margin-top: -70px }
    .experiences .swoosh { position: relative; z-index: 3; margin-top: -67px }
    .experiences h4 { padding: 25px 30px; position: relative; z-index: 4; margin-top: -50px; font-size: 51px; font-family: 'Kanit', sans-serif; font-weight: 800; color: #4180a9; line-height: 40px; }
    .experiences .info-btn { background-color: #000; padding: 15px 25px; width: 100%  }
        .experiences a { font-size: 26px; color: #fff  }

.sea-safari { background-image: url(/img/layout/sea-safari.jpg); -moz-background-size: cover; -o-background-size: cover; -webkit-background-size: cover; background-position: center; background-repeat: no-repeat; background-size: cover; padding: 20px 0; text-align: center; color: #fff; margin-top: 100px; border-top: 14px solid #4180a9; border-bottom: 14px solid #4180a9 }
    .sea-safari p { font-size: 28px; line-height: 32px; margin: 20px 0; }
    .sea-safari a { font-size: 22px; background-color: #000; padding: 15px 25px; color: #fff; border-radius: 0; }
        .sea-safari a:hover { background-color: #f36f21; color: #000; }

.copyright-strap { background-color: #24282b; font-size: 12px; color: #fff; padding-top: 10px; }
    .copyright-strap .right { text-align: right }

footer { padding: 45px 0 }
    footer address { padding: 40px 50px 0 50px; font-size: 18px; text-transform: uppercase; weight: 700 }
    footer .footer-phone { padding-top: 60px; font-size: 32px; font-family: 'Montserrat', sans-serif; font-weight: 900; }
        footer .footer-phone p { margin-bottom: 0; }
        footer .footer-phone i { color: #4180a9 }
        footer .footer-phone a { color: #000 }
            footer .footer-phone a:hover { color: #4180a9 }
        footer .cards { font-size: 18px; padding-top: 40px; text-align: center; }


/* sidebar */
#sidebar { background-color: #fff; box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2); color: #000; height: 100vh; left: -275px; overflow-y: scroll; position: fixed; top: 0; transition: all 0.3s; width: 275px; z-index: 999 }
	#sidebar.active { left: 0 }
	#sidebar .sidebar-header { padding: 20px 10px 17px 10px }
	#sidebar #dismiss { -o-transition: all 0.3s; -webkit-transition: all 0.3s; background-color: #f36f21; color: #FFF; cursor: pointer; height: 35px; line-height: 35px; position: absolute; right: 10px; text-align: center; top: 20px; transition: all 0.3s; width: 35px }
	#sidebar #dismiss:hover { background: #FFF; color: #f36f21 }
	#sidebar ul { margin: 0 }
		#sidebar ul p { color: #000; padding: 10px }
		#sidebar ul li a { color: rgba(0,0,0, 0.5); display: block; font-size: 1.1em; padding: 10px; text-decoration: none !important }
		#sidebar ul li a:hover { color: #f26437!important }
		#sidebar ul li.active>a, a[aria-expanded="true"] { background-color: #f36f21; color: #000 !important }
	#sidebar ul ul a { background-color: #f36f21; color: #FFF; font-size: 0.9em !important; padding-left: 30px !important }
	#sidebar ul ul a:hover { background-color: rgba(255,255,255, 0.5) }
	#sidebar a[data-toggle="collapse"] { position: relative }
    #sidebar .dropdown-toggle::after { display: block; position: absolute; right: 20px; top: 50%; transform: translateY(-50%) }
    #sidebar .btn-book-now { background-color: #f36f21; text-align: center; padding: 5px 10px 3px 10px; margin-left: 0!important;  font-family: 'Kanit', sans-serif; font-weight: 800; text-transform: uppercase; }
        #sidebar .btn-book-now a { color: #fff; font-size: 30px!important; line-height: 30px!important; }
            #sidebar .btn-book-now a:hover { color: #000!important }
    #sidebar .btn-social { margin-left: 0!important; }
        #sidebar .btn-social a { font-size: 27px; padding: 10px 21px }
            #sidebar .btn-social a:hover { color: #000!important }
        #sidebar .btn-social .btn { border-radius: 0; color: #fff }
            #sidebar .btn-facebook { background-color: #3b5998 }
            #sidebar .btn-twitter { background-color: #1da1f2 }
            #sidebar .btn-instagram { background-color: #c13584 }
            #sidebar .btn-email { background-color: #484748 }
.overlay { background-color: rgba(0, 0, 0, 0.7); display: none; height: 100vh; opacity: 0; position: fixed; transition: all 0.5s ease-in-out; width: 100vw; z-index: 998 }
    .overlay.active { display: block; opacity: 1 }

#carousel-home .carousel-inner .video-background { background-color: #000 }
	#carousel-home .carousel-inner .video-background video { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); min-width: 100%; min-height: 100%; width: auto; height: auto }

.inner-head-banner { background-size: cover; background-position: center; background-repeat: no-repeat; height: 500px; position: relative; width: 100%; overflow: hidden; }
    #contact { background-image: url('/img/layout/contact-banner.jpg'); }
    #private { background-image: url('/img/layout/private-excursion-banner.jpg'); }

#inner-content { padding: 30px 0 60px 0 }
    #inner-content { padding: 40px 0 }
        #inner-content  h1 { font-size: 51px; line-height: 45px; font-family: 'Kanit', sans-serif; font-weight: 800; text-transform: uppercase; margin-bottom: 20px; }
        #inner-content .contact-info img { width: 65%; padding-bottom: 20px }
        #inner-content .contact-info .contact-address { text-align: center; padding-top: 30px }
            #inner-content .contact-info .contact-address p { margin-bottom: 5px }
            #inner-content .contact-info .contact-address a { color: #000 }
                #inner-content .contact-info .contact-address a:hover { color: #f36f21 }
        
        #inner-content .contact-info form { margin-right: 40px }

.g-recaptcha { margin-bottom: 10px }

.trip-box { border-top: 10px solid #4180A9; border-bottom: 10px solid #4180A9; background-color: #000; margin-bottom: 30px; color: #fff }
    .trip-box img { display: block; width: 100%; height: 100%; object-fit: cover; }
    .trip-box h2 { font-size: 46px; color: #56A3D5; padding: 20px 15px 10px 0 }
        .trip-box h2 span { font-size: 0.7em; color: #f36f21; padding: 20px 0 10px 0; text-transform: uppercase }
    .trip-box .trip-info { font-size: 17px; /*height: 145px;*/ padding-right: 15px }
    .trip-box .prices { font-size: 24px; }
    .trip-box .price-book { text-align: center; overflow: hidden; }
        .trip-box .btn { font-size: 24px; text-transform: uppercase; margin-top: 20px }
    .trip-box .small { font-size: 14px; text-transform: uppercase; margin: 0; }
        .trip-box .small.left { position: relative; left: -70px }
        .trip-box .small.right { position: relative; right: -50px }
    .trip-box .price { font-size: 65px; color: #f36f21; font-family: 'lato', sans-serif; font-weight: 800; line-height: 65px; margin: 0 }

.trip-box-book { border-top: 10px solid #4180A9; border-bottom: 10px solid #4180A9; background-color: #000; margin-bottom: 30px; color: #fff }
    .trip-box-book h2 { font-size: 46px; color: #56A3D5; padding: 20px 0 10px 0 }
        .trip-box-book h2 span { font-size: 34px; color: #f36f21; padding: 20px 0 10px 0; text-transform: uppercase; }
    .trip-box-book .trip-info { font-size: 18px; padding-right: 20px }
    
.how-to-book { background-color: #4180A9; color: #FFF; margin-top: 40px; padding: 20px 30px }
    .how-to-book h3 { font-size: 48px }
    .how-to-book ol { margin: 0; padding: 0 0 0 20px }
    /*.how-to-book ol { list-style: none; counter-reset: item; }
        .how-to-book li { counter-increment: item; margin-bottom: 5px; justify-content: start; }
            .how-to-book li:before { margin-right: 10px; content: counter(item); background: #fff; border-radius: 50%; color: #4180A9; width: 20px; height: 20px; text-align: center; display: inline-block; padding-left: 0 }*/

.inner-head-banner .video-background video { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); min-width: 100%; min-height: 100%; width: auto; height: auto }
.btn-charter { font-size: 16px!important; }

.faqs { background-color: #F5F5F5; border-radius: 5px; padding: 20px 40px; margin-top: 20px }
    .faqs h3 { color: #4180A9; font-size: 24px;  }
    .faqs p { font-size: 18px; padding-bottom: 0; margin-bottom: 0 }

/* calendar */
#calendar-loading { display: none; font-size: 1.2em; left: 145px; padding-top: 2px; position: absolute; width: 200px }
.fc .fc-button-primary { background-color: #4180A9; border-color: #4180A9 }
.fc .fc-button-primary:hover { background-color: #366A8C; border-color: #366A8C }
.fc .fc-button-primary:disabled { background-color: #BDBBBB; border-color: #BDBBBB }
.fc-theme-standard th { background-color: #BDBBBB !important; color: #FFF !important; text-transform: uppercase !important }
.fc-theme-standard td, .fc-theme-standard th { border-color: #C2C2C2 !important }
.fc .fc-cell-shaded, .fc .fc-day-disabled { background-color: #DEE1E3 !important }
.fc .fc-daygrid-day-bg .fc-bg-event, .fc .fc-timegrid .fc-daygrid-body { cursor: pointer !important }
.fc .fc-daygrid-day-number { color: #FFF !important; font-weight: 600 !important }
.fc .fc-day-other .fc-daygrid-day-top { opacity: 1 !important }
.fc .fc-bg-event { opacity: 1 !important }
.fc .fc-daygrid-event-harness { font-size: 32px !important; font-style: italic !important; font-weight: 300 !important; line-height: 32px !important; text-align: center !important }
.fc .click-to-book { font-style: normal !important; font-weight: 700 !important }
.fc-h-event .fc-event-title { white-space: normal !important }

#booking-times { -moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.2); margin-bottom: 30px }
    #booking-times thead { background-color: #f36f21; color: #FFF }
    #booking-times .booking-price { width: 150px }
.booking-confirm { -moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.2); margin-bottom: 30px }
    .booking-confirm thead { background-color: #f36f21; color: #FFF }
    .booking-confirm tbody td.left { width: 40% }
    .booking-confirm tbody td.right { width: 60% }

.btn-back { background-color: #CCC !important; color: #000 !important }
.btn-next { background-color: #4180A9 !important; color: #FFF !important }

#dd_canvas { border: 1px solid #000 }
#dd_saveButton { background-color: #4180A9 !important; color: #FFF !important; margin-left: 3px }
#ts-and-cs { -moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #DDD; border-radius: 10px; height: 400px; margin-bottom: 15px; overflow: scroll; padding: 20px }
#booking-submit { display: none }


@media (max-width: 4200px) {
    .container { max-width: 1560px; }
   
}

@media (max-width: 1589px) {
    /* global */
    .container { max-width: 1140px; }
    header .header-strap img.head-logo { width: 20% }
    header .header-strap li { font-size: 15px!important; padding-left: 3px }
    header .header-strap i { padding-right: 0px; padding-left: 5px; }
    header .header-strap .telephone { font-size: 15px!important; padding: 10px; }
    header .header-strap .btn-book-now { padding: 8px 12px; }
        header .header-strap .btn-book-now a { font-size: 20px!important; line-height: 20px!important; }
    header .main-menu li { font-size: 14px; padding: 0 3px }
    header .main-menu .btn-social a { font-size: 22px; padding: 5px 10px }

    #home-trips .trips .trip-info { font-size: 22px; line-height: 32px; padding: 15px }
    #home-content .upcoming-trips p { font-size: 22px; }
        #home-content .upcoming-trips p span { font-size: 20px; font-weight: 800 }

    .experiences h4 { padding: 20px 20px; margin-top: -50px; font-size: 40px; line-height: 35px; }
    .experiences a { font-size: 22px; }

    .trip-box h2 { font-size: 38px; padding: 10px 0 5px 0 }
    .trip-box .trip-info { font-size: 15px; /*height: 145px;*/ line-height: 20px }
    .trip-box .prices { font-size: 20px; }
        .trip-box .small.left { position: relative; left: -50px }
        .trip-box .small.right { position: relative; right: -30px }
    .trip-box .price { font-size: 45px; line-height: 45px; }
    .trip-box .btn { font-size: 18px; margin-top: 20px }

    .trip-box-book h2 { font-size: 38px; padding: 15px 0 10px 0 }
        .trip-box-book h2 span { font-size: 26px; padding: 20px 0 10px 0 }
    .trip-box-book .trip-info { font-size: 16px; padding-right: 20px }

    .how-to-book { padding: 15px 20px }
        .how-to-book h3 { font-size: 34px }

    /* calendar */
    .fc .fc-daygrid-event-harness { font-size: 22px !important; line-height: 22px !important }
}

@media (max-width: 1199px) {
    /* global */
    .container { max-width: 960px; }
    header .header-strap { display: none;}
    header .main-menu img.head-logo { display: inline; position: absolute; top: 0; left: 0; z-index: 10!important; width: 40% }
    footer .footer-phone { font-size: 24px; }
    .navbar-light .navbar-toggler { margin: 10px; }
    #home-content .home-info { text-align: center; }
    #home-trips .trips .trip-info { font-size: 26px }
    .owl-prev { left: -40px }
    .owl-next { right: -40px }
    .experiences h4 { padding: 15px 15px; margin-top: -50px; font-size: 33px; line-height: 30px; }
    .experiences a { font-size: 18px; }
    #home-content .home-info p { padding: 20px 0px 0px 0px; font-size: 18px;}
    
    .trip-box h2 { font-size: 32px; padding: 10px 0 5px 0 }
    .trip-box .prices { font-size: 18px; }
    .trip-box .trip-info { height: auto; padding-right: 20px }

    /* calendar */
    .fc .fc-daygrid-event-harness { font-size: 26px !important; line-height: 26px !important }
}

@media (max-width: 991px) {
    /* global */
    .container { max-width: 720px; }
    .copyright-strap { text-align: center }
    .copyright-strap .right { text-align: center }
    footer { text-align: center; }
    footer .footer-phone { padding-top: 20px; font-size: 32px; }
    .experiences h4 { font-size: 50px; line-height: 40px; }
    #home-content img { margin-top: 50px }
    #home-content .home-info img { margin-top: 0px }
    #home-trips .trips .trip-info { font-size: 40px; line-height: 42px }
    #inner-content .contact-info form { margin-right: 0px }
    #inner-content .contact-info { margin-bottom: 275px }

    .trip-box { border-top: 7px solid #4180A9; border-bottom: 7px solid #4180A9; }
    .trip-box h2 { font-size: 28px; padding: 10px 0 5px 0 }
    .trip-box .prices { font-size: 18px; }
    
    .trip-box .btn-book { display: none; }
    .trip-box .small.right { padding-bottom: 20px }

    /* calendar */
    #calendar { min-height: 700px }
    .fc .fc-daygrid-event-harness { font-size: 18px !important; line-height: 18px !important }
}

@media (max-width: 767px) {
    /* global */
    .container { max-width: 540px; }
    #home-content .upcoming-trips {  margin-top: -120px }
    #carousel-home .carousel-item .item-quote { bottom: 140px; font-size: 70px; line-height: 65px; right: 2%; max-width: 400px; }
        #carousel-home .carousel-item .item-quote-seals { bottom: 140px; font-size: 70px; line-height: 65px; right: 2%; max-width: 400px; }
        #carousel-home .carousel-item .item-btn { bottom: 90px; font-size: 30px; right: 35%; }
        #carousel-home .carousel-item .item-author { display: none; }
    #home-trips .trips .trip-info { font-size: 32px }

    /*.trip-box .btn { font-size: 16px; padding: 5px }*/

    .trip-box { border-top: 5px solid #4180A9; border-bottom: 5px solid #4180A9; text-align: center; padding-bottom: 30px; }
    .trip-box .btn { font-size: 18px; margin-top: 5px }
    .trip-box h2 { font-size: 32px; line-height: 34px; padding: 30px 20px 5px 20px }

    .trip-box .prices { font-size: 18px; padding: 0 20px }
    .trip-box .trip-info { height: auto; padding: 0 20px }
    .trip-box .btn-book { display: none; }
    .trip-box .small.right { padding-bottom: 20px }
    
    .sea-swift-info-logo { display: none; }
    .inner-blurb { text-align: center; }

    .faqs { padding: 15px 30px; margin-top: 20px }
        .faqs h3 { color: #4180A9; font-size: 20px;  }
        .faqs p { font-size: 16px; padding-bottom: 0; margin-bottom: 0 }

    /* calendar */
    #calendar { min-height: 600px }
    .fc .fc-daygrid-event-harness { font-size: 14px !important; line-height: 14px !important }

    #booking-times .booking-price { width: auto }
}

@media (max-width: 575px) {
    /* global */
    .container { max-width: 100%; }
    header .main-menu img.head-logo { width: 60% }
    .seal-bg h3 { font-size: 35px; }
    #home-content .upcoming-trips {  margin-top: -200px }
        #home-content .upcoming-trips h2 { font-size: 52px; margin-bottom: 15px; line-height: 45px; }
    #carousel-home .carousel-item .item-quote { bottom: 250px; font-size: 80px; line-height: 70px; max-width: 374px; text-shadow: 2px 2px 2px #000000; }
        #carousel-home .carousel-item .item-quote-seals { bottom: 250px; font-size: 80px; line-height: 70px; max-width: 374px; text-shadow: 2px 2px 2px #000000; }
        #carousel-home .carousel-item .item-btn { bottom: 200px; font-size: 30px; right: 55%; text-shadow: 2px 2px 2px #000000; }
    .experiences h4 { font-size: 60px; line-height: 50px; }
    .experiences .swoosh { margin-top: -90px }
    .experiences a { font-size: 22px; }
    .experiences .info-btn { margin-bottom: 30px }
    #home-trips .trips .trip-info { font-size: 28px; line-height: 32px }

    .trip-box { border-top: 5px solid #4180A9; border-bottom: 5px solid #4180A9; text-align: center; padding-bottom: 30px; }
    .trip-box .btn { font-size: 18px; margin-top: 5px }
    .trip-box h2 { font-size: 32px; line-height: 34px; padding: 30px 20px 5px 20px }

    .trip-box .prices { font-size: 18px; padding: 0 20px }
    .trip-box .trip-info { height: auto; padding: 0 20px }
    .trip-box .btn-book { display: none; }
    .trip-box .small.right { padding-bottom: 20px }

    #inner-content  h1 { font-size: 46px; line-height: 38px; }

    /* calendar */
    #calendar-loading { display: none !important }
    .fc .fc-daygrid-event-harness { font-size: 13px !important; line-height: 13px !important }
}

@media (max-width: 374px) {
	/* global */
    .navbar-brand { padding-top: 33px; }
    #carousel-home .carousel-item .item-quote { bottom: 250px; font-size: 60px; line-height: 50px; max-width: 290px; text-shadow: 2px 2px 2px #000000; }
        #carousel-home .carousel-item .item-quote-seals { bottom: 250px; font-size: 60px; line-height: 50px; max-width: 290px; text-shadow: 2px 2px 2px #000000; }
        #carousel-home .carousel-item .item-btn { bottom: 200px; font-size: 30px; right: 45%; text-shadow: 2px 2px 2px #000000; }
    #home-content .upcoming-trips h2 { font-size: 45px; line-height: 40px; }
    .seal-bg h3 { font-size: 28px; }
    .experiences h4 { font-size: 45px; line-height: 50px; }
    .experiences .swoosh { margin-top: -70px }
    .sea-safari p { font-size: 24px; line-height: 28px; margin: 20px 0; }
    .sea-safari a { font-size: 18px; padding: 10px 15px; }
    #home-trips .trips .trip-info { font-size: 24px; line-height: 32px }
    #home-trips .trips .trip-info .btn { font-size: 20px; padding: 5px 20px }
    #home-content .upcoming-trips .table td { padding: 5px }

    /* calendar */
    .fc .fc-daygrid-event-harness { font-size: 12px !important; line-height: 12px !important }
}