/* Responsive styling */
/* Mobile */
@media screen and (max-width: 767px) {
    /* Sticky Footer */
    #wrapper {
        margin-bottom: -270px;
    }

    #footer, #wrapper:after {
        height: 300px;
    }

    /* Show */
    .mobile {
        display: block;
    }

    /* Hide */
    .no-mobile,
    #navigation,
    .page-triangle,
    #header .tablet .mobile-nav-bar {
        display: none;
    }

    /* Global Styles */
    /* Header tags */
    #home-content h1,
    h1 {
        font-size: 1.6rem;
        line-height: 2.4rem;
    }

    .the-post h1 br {
        display: none;
    }

    /* Main Styles */
    body {
        /* font-size: 12px; */
    }

    .container,
    .container-small {
        width: 100%;
    }

    #scroll-top {
        width: 46px;
        height: 46px;
    }

    /* Header */
    #header {
        padding: 0.8rem 1.667rem 0.8rem 1.667rem;

    }

    /* Navigation */
    .mobile-nav-bar {
        display: block;
        float: right;
        position: relative;
        z-index: 1001;
    }

    .mobile-nav-bar a {
        font-size: 2rem;
    }

    #mobile-navigation {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1000;
        padding: 3.8rem 0 0 0;
        overflow-y: scroll;
        overflow-x: hidden;
    }

    #mobile-navigation ul li a {
        position: relative;
        font-size: 1.2rem;
        display: block;
        padding: 0.5rem 1.667rem;
    }


    /* Sub Navigation */
    #mobile-navigation .menu-item-has-children a:after {
        font-family: "FontAwesome";
        content: "\f067";
        display: inline-block;
        position: absolute;
        right: 2.2rem;
    }

    #mobile-navigation .menu-item-has-children a.sub-nav-open:after {
        content: "\f068";
    }

    #mobile-navigation .menu-item-has-children a.sub-nav-open .sub-menu-wrap a:after,
    #mobile-navigation .menu-item-has-children .sub-menu-wrap a:after {
        content: "";
    }


    #mobile-navigation .sub-menu-wrap {
        display: none;
    }

    #mobile-navigation .sub-menu-wrap ul li:last-child {
        margin-bottom: 0.4rem;
    }

    /* Banner */
    .banner-wrapper,
    .banner-wrapper .banner,
    .banner-wrapper .slide,
    .banner-wrapper .slide .image,
    .banner-wrapper.home,
    .banner-wrapper.home .banner,
    .banner-wrapper.home .slide,
    .banner-wrapper.home .slide .image {
        height: 220px;
    }

    .banner-wrapper .slide .image,
    .banner-wrapper.home .slide .image {
        background-position: center center;
        background-size: cover;
    }

    .banner-wrapper .slide .banner-caption {
        top: 0.8rem;
        left: 0;
    }

    .banner-wrapper .slide .banner-caption h2 {
        font-size: 1.6rem;
        line-height: 2rem;
    }

    .banner-wrapper.home .slide .banner-button {
        display: none;
    }

    .banner-wrapper .slide .banner-caption h2,
    .banner-wrapper .slide .banner-caption .banner-body {
        width: 100%;
        padding: 0 1.667rem;

    }

    .banner-wrapper .slide .banner-caption .banner-body {
        font-size: 0.8rem;
    }

    .banner-wrapper .pager {
        bottom: 0.8rem;
    }

    /* Footer */
    #footer {
        padding-left: 1.667rem;
        padding-right: 1.667rem;
    }

    #footer .social-icon {
        float: left;
        margin: 1.2rem 0;
    }

    #footer .social-icon ul li {
        margin: 0 0.6rem 0 0;
    }

    #footer .social-icon a {
        font-size: 2.6rem;
    }

    #footer .fixed-credit {
        display: block;
    }

    .footer-logos {
        margin-top: 1rem;
    }

    .footer-logos .top-logo img {
        width: 80%;
        margin: 0 auto;
    }

    /* Slider */
    .slider .slide-item {
        width: 30%;
    }

    .slider .slider-container {
        margin: 0 1.4rem;
    }

    /* Sidebar */
    #sidebar {
        margin-left: 0;
        width: 100%;
    }

    #sidebar.horizontal {
        padding: 0 1.667rem;
    }

    #sidebar.horizontal.feat-2,
    #sidebar.horizontal.feat-4 {
        padding: 0 1.667rem;
    }

    #sidebar.horizontal.feat-1 .col-4, #sidebar.horizontal.feat-2 .col-4 {
        width: 100%;
        margin-left: 0;
    }

    #sidebar .panel-image .widget-title, #sidebar.horizontal.feat-1 .panel-image .widget-title {
        font-size: 1.1rem;
        margin: 0.5em 0 0.5rem;
    }

    #sidebar .panel-image, #sidebar.horizontal.feat-1 .panel-image {
        height: auto;
        margin-bottom: 2rem;
    }

    #sidebar .panel-image .image, #sidebar.horizontal.feat-1 .panel-image .image {
        background-position: center center !important;
    }

    #sidebar.horizontal.feat-1 .panel-image .title,
    #sidebar.horizontal.feat-1 .panel-image .title,
    #sidebar.horizontal.feat-1 .panel-image .item-caption,
    #sidebar.horizontal.feat-1 .panel-image .link {
        padding: 0 1.667rem;
    }

    #sidebar.horizontal .panel-icon {
        margin-bottom: 1.8rem;
    }

    #sidebar.horizontal.feat-2 {
        margin: 1.8rem 0 0.4rem 0;
    }

    #features-4 {
        padding: 0.8rem 0;
    }

    #sidebar.horizontal.feat-4 .panel-text {
        margin: 0.4rem 0;
    }

    #sidebar.horizontal .panel-icon .title {
        font-size: 1rem;
    }


    /* Home Specific */
    #home-content {
        padding: 0 1.667rem;
    }

    /* Gallery Styles */
    .gallery-list .gallery-item {
        width: 46.4%;
        height: 125px;
    }

    .gallery-list .gallery-item:nth-child(3n) {
        margin-right: 1.2rem;
    }

    .gallery-list .gallery-item:nth-child(2n) {
        margin-right: 0;
    }

    .gallery-list .gallery-item .title {
        font-size: 0.9rem;
    }


    /* Main Content */
    .page {
        padding: 0 1.667rem;
    }

    .the-post blockquote {
        padding-left: 0;
        padding-right: 0;
    }

    .the-post blockquote p {
        font-size: 1.1rem;
    }

    .page-strap h1 {
        font-size: 2.2rem;
    }

    .page-strap .link a {
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        float: none;
        width: 100%;
    }

    .the-post p.intro-text {
        font-size: 1rem;
        line-height: 1.6rem;
    }

    .page .the-post img {
        display: block;
        width: 100% \9;
        max-width: 100%;
        height: auto;
    }

    .the-post .btn {
        width: 100%;
    }

    .the-post h1
    .the-post h2,
    .the-post h3,
    .the-post h4,
    .the-post h5,
    .the-post h6 {
        margin: 1rem 0 1rem 0;
    }

    .the-post img.alignright,
    .the-post img.alignleft,
    .the-post img.aligncenter,
    .the-post img.alignnone {
        display: block;
        width: 100%;
        max-width: 100%;
        height: auto;
        margin: 3rem 0;
    }


    .g-recaptcha {
        transform: scale(0.8);
        -webkit-transform: scale(0.8);
        transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
    }

}

/* Tablet */
@media screen and (min-width: 768px) and (max-width: 894px) {
    /* Sticky Footer */
    #wrapper {
        margin-bottom: -165px;
    }

    #footer, #wrapper:after {
        height: 165px;
    }

    /* Show/Hide */
    .tablet {
        display: block;
    }

    /* Hide */
    .no-mobile,
    #navigation,
    .page-triangle,
    #header .tablet .mobile-nav-bar {
        display: none;
    }

    /* Layout */
    .container {
        width: 100%;
    }

    .container-small {
        width: 60%;
    }

    /* Header */
    #header {
        padding: 0.8rem 1.667rem 0 1.667rem;
    }

    #header .col-3 {
        width: 100%;
    }

    /* Navigation */
    .mobile-nav-bar {
        display: block;
        float: right;
        position: relative;
        z-index: 1001;
    }

    .mobile-nav-bar a {
        font-size: 2rem;
    }

    #mobile-navigation {
        position: fixed;
        top: 0;
        left: 0;
        width: 50%;
        height: 100%;
        z-index: 1000;
        padding: 3.8rem 0 0 0;
        overflow-y: scroll;
        overflow-x: hidden;
    }

    #mobile-navigation ul li a {
        position: relative;
        font-size: 1.2rem;
        display: block;
        padding: 0.5rem 1.667rem;
    }


    /* Sub Navigation */
    #mobile-navigation .menu-item-has-children a:after {
        font-family: "FontAwesome";
        content: "\f067";
        display: inline-block;
        position: absolute;
        right: 2.2rem;
    }

    #mobile-navigation .menu-item-has-children a.sub-nav-open:after {
        content: "\f068";
    }

    #mobile-navigation .menu-item-has-children a.sub-nav-open .sub-menu-wrap a:after,
    #mobile-navigation .menu-item-has-children .sub-menu-wrap a:after {
        content: "";
    }


    #mobile-navigation .sub-menu-wrap {
        display: none;
    }

    #mobile-navigation .sub-menu-wrap ul li:last-child {
        margin-bottom: 0.4rem;
    }

    /* Banner */
    .banner-wrapper,
    .banner-wrapper .banner,
    .banner-wrapper .slide,
    .banner-wrapper .slide .image,
    .banner-wrapper.home,
    .banner-wrapper.home .banner,
    .banner-wrapper.home .slide,
    .banner-wrapper.home .slide .image {
        height: 400px;
    }

    .banner-wrapper .slide .image,
    .banner-wrapper.home .slide .image {
        background-position: center center;
        background-size: cover;
    }

    /* Sidebar */
    #sidebar {
        width: 35.524%;
        margin-left: 2rem;
    }

    #sidebar.horizontal {
        padding-left: 1.667rem;
        padding-right: 1.667rem;
    }

    #sidebar.horizontal.feat-3 {
        padding-left: 0;
        padding-right: 0;
    }

    /* Footer */
    #footer {
        padding-left: 1.667rem;
        padding-right: 1.667rem;
    }

    /* Home specific */
    .page,
    #home-content {
        padding-left: 1.667rem;
        padding-right: 1.667rem;
    }

    #home-content h1 {
        font-size: 2rem;
    }

    #features-4 {
        padding: 2.429rem 0;
    }

    /* Gallery */
    .gallery-list .gallery-item {
        width: 31.5%;
    }
}