/*：此代码只作为演示用,不是源代码。源码地址唯一出处: http://www.bootstrapmb.com/item/486(这个说明仅在演示里会看到,下载的源码里没有)*//**********************Responsive.css=============Author:  Gino AliajTemplate: Swimmerland - Water Park HTML TemplateVersion: 1.0Author URI: gnodesign.com***************************//*------------------------------------------  Responsive Grid Media Queries--------------------------------------------*//* ---- Start of min-width 1800px CSS ---- */@media (min-width: 1800px) {    section#countup:before {        height: 70px !important;        top: -67px !important;    }    section#countup:after {        height: 70px !important;        bottom: -67px !important;    }    footer#main-footer:before {        height: 70px !important;        top: -67px !important;    }}/* ---- End of min-width 1800px CSS ---- *//* ---- Start of min-width 1450px CSS ---- */@media (min-width: 1450px) {    section#countup:before {        height: 60px;        top: -57px;    }    section#countup:after {        height: 60px;        bottom: -57px;    }    footer#main-footer:before {        height: 60px;        top: -57px;    }}/* ---- End of min-width 1450px CSS ---- *//* ---- Start of max-width 992px CSS ---- */@media (max-width: 992px) {    /**************** 		Training Courses Section	****************/    section#courses {        padding-bottom: 80px;    }    section#courses .training-course {        padding: 25px 0;    }    section#courses .training-course >div {        float: none !important;    }    section#courses .course-image {        display: none;    }    /**************** 		Blog Section	****************/    .blog-post .blog-desc {        overflow: hidden;        padding: 30px;    }    /**************** 		Testimonial Section	****************/    section#testimonials {        background-size: cover;    }    /**************** 		Pricing Tables Section	****************/    section#pricing .pricing-tables .col-md-4 {        margin-top: 80px;    }    section#pricing .pricing-tables .col-md-4:first-child {        margin-top: 0;    }    /**************** 		Signup Section	****************/    section#signup h3 {        text-align: center;    }    section#signup .section-title:after {        margin: 0 auto;    }    /**************** 		Footer	****************/    footer .footer-social {        clear: both;        margin-top: 50px;    }    footer .footer-newsletter {        margin-top: 50px;    }    /**************** 		Contact Pages	****************/    form#contact-form input {        margin: 20px 0;    }    form#contact-form {        margin: 30px 0 60px 0;    }    .gmaps #map {        width: 100%;        margin-bottom: 40px;    }}/* ---- End of max-width 992px CSS ---- *//* ---- Start of min-width 480px and max-width 768px CSS ---- */@media all and (min-width: 480px) and (max-width: 768px) {    /**************** 		TOP HEADER	****************/}/* ---- End of min-width 480px and max-width 768px CSS ---- *//* ---- Start of max-width 769px CSS ---- */@media all and (max-width: 769px) {    /**************** 		Main Menu	****************/    .navbar-nav>li>a {        padding: 15px 0;    }    .dropdown-menu {        background: rgba(15, 83, 108, 0.55) !important;    }    .dropdown-menu li a {        color: #f6f8f8 !important;        padding: 15px 0 15px 30px !important;    }    /**************** 		Training Courses Section	****************/    section#courses .course-main .row:last-child {        padding: 0;    }    /**************** 		Count Up Section	****************/    section#countup .col-xs-12 {        padding: 30px 0;    }    /**************** 		Signup Section	****************/    section#signup {        background: #3cbeee;    }    /**************** 		Latest Events Section	****************/    section#events table {        border: none;    }    /**************** 		About Page	****************/    section#about .about-vid .vid-container {        width: 100%;    }    ul.timeline:before {        left: 40px;    }    ul.timeline >li >.timeline-panel {        width: calc(100% - 90px);        width: -moz-calc(100% - 90px);        width: -webkit-calc(100% - 90px);    }    ul.timeline >li >.timeline-badge {        left: 40px;        margin-left: 0;        top: 15px;    }    ul.timeline >li >.timeline-panel {        float: right;    }    ul.timeline >li >.timeline-panel:before {        border-left-width: 0;        border-right-width: 15px;        left: -15px;        right: auto;    }    ul.timeline >li >.timeline-panel:after {        border-left-width: 0;        border-right-width: 14px;        left: -14px;        right: auto;    }    /**************** 		Blog Detail Page	****************/    section#blog-post ul.social li {        margin-bottom: 20px;    }    section#blog-post .post-quote blockquote {        padding: 90px 0;    }}/* ---- End of max-width 769px CSS ---- *//* ---- Start of max-width 767px CSS ---- */@media all and (max-width: 767px) {    /**************** 		Coming Soon Page	****************/    section#coming-soon .fullscreen {        position: fixed;    }    section#coming-soon .coming-content {        position: absolute;        width: 100%;        top: 30%;        transform: translateY(20%);    }}/* ---- End of max-width 767px CSS ---- *//* ---- Start of max-width 580px CSS ---- */@media all and (max-width: 580px) {    /**************** 		Main Slider Section	****************/    .slider-content {        top: 30%;    }    .slider-content h3 span {        font-size: 52px;    }    .swiper-pagination {        height: 0;    }    /**************** 		Gallery Section	****************/    ul.gallery-sorting li {        margin-bottom: 50px;    }    /**************** 		Testimonial Section	****************/    #sync1 .item .testimonial {        padding-left: 0;        padding-top: 70px;    }    /**************** 		Footer	****************/    footer .col-xs-6 {        width: 100%;        text-align: center;        margin-bottom: 60px;    }    footer .footer-social {        clear: both;        margin-top: 0;    }    footer .footer-newsletter {        margin-top: 0;    }}/* ---- End of max-width 580px CSS ---- *//* ---- Start of max-width 480px CSS ---- */@media all and (max-width: 480px) {    /**************** 		Gallery Section	****************/    .gallery-items li.col-xs-6.shuffle-item {        width: 100%;    }    /**************** 		Blog Section	****************/    article.blog-post {        padding: 25px;    }}/* ---- End of max-width 480px CSS ---- *//* ---- Start of max-width 420px CSS ---- */@media all and (max-width: 420px) {    /**************** 		Main Menu	****************/    nav.navbar {        margin: 40px 0 0 0;    }    .navbar-brand {        width: 100%;    }    .navbar-brand img {        margin: 0 auto;    }    .navbar-header {        clear: both;        width: 100%;        position: relative;    }    .navbar-toggle {        position: absolute;        left: 50%;        transform: translateX(-50%);    }    /**************** 		Main Slider Section	****************/    .slider-content h3 span {        font-size: 42px;    }    .swiper-pagination {        display: none;    }    /**************** 		Blog Section	****************/    .blog-post .blog-desc {        overflow: hidden;        padding: 30px 0;    }    /**************** 		Blog Detail Page	****************/    form#comment-form .comment-require {        text-align: center;    }    form#comment-form .comment-require .btn {        float: none !important;    }    /**************** 		404 Page	****************/    #not-found.main {        height: 100vh;    }}/* ---- End of max-width 420px CSS ---- *//* ---- Start of max-width 380px CSS ---- */@media all and (max-width: 380px) {    /**************** 		Testimonial Section	****************/    #sync2 .item .client-img {        width: 100%;    }    #sync2 .item img {        margin: 0 auto;    }    #sync2 .item .details {        width: 100%;        padding: 0;    }    #sync2 .item .details h4,    #sync2 .item .details h6 {        text-align: center;    }    /**************** 		Latest Events Section	****************/    section#events .col-md-6 {        padding: 40px 0 0 0;    }    section#events table {        margin-left: -15px;    }    .calendar td {        font-size: 16px;    }    /**************** 		About Page	****************/    ul.timeline:before {        display: none;    }    ul.timeline >li >.timeline-badge {        display: none;    }    .timeline >li >.timeline-panel {        width: 100% !important;    }    /**************** 		404 Page	****************/    section#not-found .error-detail h2 {        font-size: 160px;    }    section#not-found img {        width: 250px;    }}/* ---- End of max-width 380px CSS ---- *//* ---- Start of max-width 320px CSS ---- */@media all and (max-width: 320px) {    /**************** 		Main Slider Section	****************/    .slider-content h3 span {        font-size: 36px;    }    /**************** 		404 Page	****************/    section#not-found .error-detail h2 {        font-size: 140px;    }}/* ---- End of max-width 320px CSS ---- *//* ---- Start of max-height 420px CSS ---- */@media screen and (max-height: 420px) {    /**************** 		Main Slider Section	****************/    .fullscreen {        height: 550px;    }    nav.navbar {        margin: 30px 0 0 0;    }    /**************** 		404 Page	****************/    #not-found.main {        height: 700px;    }}/*：此代码只作为演示用,不是源代码。源码地址唯一出处: http://www.bootstrapmb.com/item/486(这个说明仅在演示里会看到,下载的源码里没有)*/