/*========== min ==========*/
@media (min-width:768px) {
    
    .visible-mobile { display: none !important;}
    
    .a-sm-left { text-align: left !important;}
    .a-sm-center { text-align: center !important;}
    .a-sm-right { text-align: right !important;}
    
    .container {
        width: 768px;
    }
    
    /*========== Form ==========*/
    .fields .field.half,
    .fields .field.half3 { 
        width: 50%;
    }
    
    /*========== Panel ==========*/
    #lounge-login fieldset {
        width: 30.158729%;
        margin-left: auto;
        margin-right: auto;
    }
    
    /*========== Main ==========*/
    /* Slider */
    .auto-slideshow .swiper-wrapper {
        -webkit-transition-timing-function: linear;
        -o-transition-timing-function: linear;
        transition-timing-function: linear;
    }
    
    .no-touchevents .slideshow .gallery .image:not(:hover),
    .no-touchevents .slideshow .gallery .image:not(:hover) img,
    .no-touchevents .slideshow .gallery .image:not(:hover):after {
        -webkit-transition-delay: .1s;
        -o-transition-delay: .1s;
        transition-delay: .1s;
    }

    .no-touchevents .slideshow .swiper-wrapper {
        -webkit-animation: slideshow 25s linear infinite;
        animation: slideshow 25s linear infinite;
    }
    .no-touchevents .slideshow .swiper-wrapper:hover {
        -webkit-animation-play-state: paused;
        animation-play-state: paused;
    }
    @-webkit-keyframes slideshow {
        0% { 
            left: 0;
        }
        100% { 
            left: -100%;
        }
    }
    @keyframes slideshow {
        0% { 
            left: 0;
        }
        100% { 
            left: -100%;
        }
    }
    
    /* Journal */
    .journal-group .item {
        -ms-flex-preferred-size: 33.3333333%;
        flex-basis: 33.3333333%;
    }
    .journal-group.related .item {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
    }
    
}


@media (min-width:992px) {
    
    .visible-device { display: none !important;}
    
    .container {
        width: 1150px;
    }
    .container.md {
        width: 970px;
    }
    
    /*========== Form ==========*/
    .fields .field.half3 { 
        width: 33.3333333%;
    }
    
    .form-layout {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    .form-col:not(:last-child) {
        margin-bottom: 0;
    }
    .form-sidebar {
        width: 30.158729%;
    }
    .form-main {
        width: calc(100% - 30.158729%);
        padding-left: 100px;
    }
    
    /*========== Header ==========*/
    .header-nav-ctrl {
        display: none !important;
    }
    .header-nav {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    .follow {
        position: absolute;
        left: 0; top: 0;
        z-index: 1;
    }
    .follow li:not(:last-child) {
        margin-right: 8px;
    }
    .follow a,
    .follow .line {
        font-size: 13px;
        color: #d1d1d1;
    }
    
    .header-system {
        position: absolute;
        right: 50px; top: 0;
        z-index: 2;
        height: 100%;
    }
    .system {
        height: 100%;
        padding-top: 12px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .system li {
        text-align: right;
    }
    .system a {
        font-size: 13px;
        
    }
    .system .booking-system {
        color: #d1d1d1;
    }
    
    /*========== Panel ==========*/
    .booking-form .summary {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .booking-form .summary .col:not(:last-child) {
        margin-bottom: 0;
        padding-right: 20px;
    }
    
    /*========== Main ==========*/
    /* Hero */
    .hero-card {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end;
        direction: rtl;
        unicode-bidi: bidi-override;
    }
    .hero-card .image {
        width: 68.8888888%;
    }
    .hero-card .meta {
        max-width: 350px;
        padding: 0 40px 30px;
        text-align: left;
        direction: ltr;
        unicode-bidi: bidi-override;
        text-align: left;
    }
    
    /* Courses */
    .courses {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end;
    }
    .courses .image {
        width: 68.8888888%;
    }
    .courses .meta {
        max-width: 350px;
        padding: 0 40px;
        text-align: left;
    }
    
    .courses-group .item:not(:last-child) {
        margin-bottom: 80px;
    }
    .courses-group .item:nth-child(even) {
        direction: rtl;
        unicode-bidi: bidi-override;
    }
    .courses-group .item .meta {
        direction: ltr;
        unicode-bidi: bidi-override;
        text-align: left;
    }
    
}


@media (min-width:1200px) {
    
    /*========== Main ==========*/
    /* Hero */
    .hero-group.slider .item {
        height: calc(100vh - 121px);
        height: calc((var(--vh, 1vh) * 100) - 121px);
    }
    .hero-group.slider .hero,
    .hero-group.slider .image {
        width: 100%;
        height: 100%;
    }
    .hero-group.slider .image img {
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center;
    }
    
}

/*========== min and max ==========*/
@media (min-width:768px) and (max-width:991px) {
    
    /*========== Form ==========*/
    #lounge-login fieldset {
        min-width: 329px;
    }
    
}


/*========== max ==========*/
@media (max-width:1279px) {
    
    /*========== Form ==========*/
    .clone-fields .ctrls {
        left: auto;
        right: 0;
        bottom: 0;
        padding-left: 0;
        line-height: 0;
        font-size: 0;
    }
    .clone-fields .ctrl {
        display: inline-block;
        vertical-align: top;
    }
    .clone-fields .ctrl:not(:last-child) {
        margin-bottom: 0;
        margin-right: 30px;
    }
    
}


@media (max-width:991px) {
    
    .hidden-device { display: none !important;}
    
    .a-left-device { text-align: left !important;}
    .a-right-device { text-align: right !important;}
    .a-center-device { text-align: center !important;}
    
    .padding-0-device { padding: 0 !important;}
    .padding-top-0-device { padding-top: 0 !important;}
    .padding-bottom-0-device { padding-bottom: 0 !important;}
    
    .margin-0-device { margin: 0 !important;}
    .margin-top-0-device { margin-top: 0 !important;}
    .margin-bottom-0-device { margin-bottom: 0 !important;}
    
    .container, 
    .container-fluid {
        padding-left: 30px;
        padding-right: 30px;
    }
    .container.fullwidth-device {
        padding-left: 0;
        padding-right: 0;
        width: 100%;
    }

    /*========== Form ==========*/
    .clone-fields:not(:first-child) {
        padding-top: 50px;
    }
    .clone-fields:not(:first-child):before, 
    .clone-fields:not(:first-child):after {
        top: 25px;    
    }
    
    .booking-form .summary .col:not(:last-child) {
        margin-bottom: 10px;
    }
    .booking-form .summary:not(:first-child) {
        padding-top: 25px;
    }
    
    /*========== Header ==========*/
    #header {
        border-bottom: 0;
    }
    
    .header-brand {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    
    .header-nav-enabled {
        overflow: hidden !important;
    }
    .header-nav {
        display: none;
        width: 100%;
        height: calc(100vh - 122px);
        height: calc((var(--vh, 1vh) * 100) - 122px);
        position: absolute;
        left: 0; top: 122px;
        z-index: 100;
        background-color: #fff;
        line-height: inherit;
        overflow: hidden;
    }
    .header-nav .wrap {
        height: 100%;
        padding-right: 25px;
        margin-right: -25px;
        overflow: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
    .header-nav .inner {
        position: relative;
        min-height: 100%;
        padding: 50px 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column;
        flex-flow: column;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
    .header-nav .menu:not(:last-child) {
        margin-bottom: 50px;
    }
    .header-nav .menu li {
        display: block;
    }
    .header-nav .menu li:not(:last-child) {
        margin-right: 0;
        margin-bottom: 20px;
    }
    
    .header-system {
        margin-left: -30px;
        margin-right: -30px;
        border-top: 1px solid rgba(89,91,60,0.4);
        border-bottom: 1px solid rgba(89,91,60,0.4);
    }
    .system li {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }
    .system li:not(:last-child) {
        border-right: 1px solid rgba(89,91,60,0.4);
    }
    .system a {
        display: block;
        background-image: none;
    }
    
    /*========== Panel ==========*/
    .panel-close {
        min-width: 0;
        width: calc(50vw + 1px);
        text-align: center;
        font-size: 12px;
    }
    
    .panel-lounge-system .panel-close {
        right: auto;
        left: 0;
    }
    
    .booking-form .member-infos .info {
        width: 50%;
    }
    
    /*========== Popup ==========*/
    button.mfp-close:before, 
    .modal-dismiss:before {
        font-size: 20px;
    }
    button.mfp-close, 
    button.mfp-close:active, 
    .modal-dismiss {
        right: 30px;
        top: 30px;
    }
    .popup-style-gallery .mfp-arrow-left {
        left: 30px;
    }
    .popup-style-gallery .mfp-arrow-right {
        right: 30px;
    }
    
    /*========== Main ==========*/
    #main {
        min-height: calc(100vh - 402px);
        min-height: calc((var(--vh, 1vh) * 100) - 402px);
    }
    
    /*========== Flex ==========*/
    .d-column-device {
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: normal !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
    }
    
}


@media (max-width:767px) {
    
    .hidden-mobile { display: none !important;}
    
    .a-left-mobile { text-align: left !important;}
    .a-right-mobile { text-align: right !important;}
    .a-center-mobile { text-align: center !important;}
    
    .padding-0-mobile { padding: 0 !important;}
    .padding-top-0-mobile { padding-top: 0 !important;}
    .padding-bottom-0-mobile { padding-bottom: 0 !important;}
    
    .margin-0-mobile { margin: 0 !important;}
    .margin-top-0-mobile { margin-top: 0 !important;}
    .margin-bottom-0-mobile { margin-bottom: 0 !important;}
    
    /*========== Form ==========*/
    .fields {
        margin-left: -10px;
        margin-right: -10px;
    } 
    .field { 
        padding-left: 10px;
        padding-right: 10px;
    }
    
    .form legend .fix {
        font-size: 10px;
    }
    
    .ui-datepicker {
        width: calc(100vw - 60px);
    }

    /*========== Header ==========*/
    .logo {
        height: 27px;
    }
    
    #header .container-fluid {
        padding-left: 15px;
        padding-right: 15px;
    }

    /*========== Panel ==========*/
    .panel-inner {
        padding: 50px 0;
    }
    
    .panel .form, .panel 
    .step-form .step {
        min-height: calc(100vh - 292px);
        min-height: calc((var(--vh, 1vh) * 100) - 292px);
    }
    
    /*========== Flex ==========*/
    .d-column-mobile {
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: normal !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
    }
    
    /*========== Main ==========*/
    /* Hero */
    .hero-group.slider .item {
        width: 100%;
    }
    
    .hero .image {
        height: 0;
        padding-top: 107.5555555%;
    }
    .hero .image img {
        display: block;
        margin: 0 auto;
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        position: absolute;
        top: 0;
        left: 0;
    }
    
    /* Tile */
    .tile-group .item {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        height: 0;
        padding-top: 107.5555555%;
    }
    .tile {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0; left: 0;
    }
    
    /* Gallery */
    .gallery-group {
        margin: 0 -10px;
    }
    .gallery-group .item {
        width: 69.3333333%;
        padding: 0 10px;
    }
    
    /* Article */
    .art-media {
        margin-left: -30px;
        margin-right: -30px;
    }
    
}

@media (max-width:640px) {
    
    /*========== Footer ==========*/
    .directory-group {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .directory {
        width: auto;
        max-width: none;
    }
    .directory:nth-child(2n) {
        text-align: right;
    }
    
    /*========== Panel ==========*/
    .message-box .inner {
        padding-left: 20px;
        padding-right: 20px;
    }
    
    /*========== Main ==========*/
    #main {
        min-height: calc(100vh - 488px);
        min-height: calc((var(--vh, 1vh) * 100) - 488px);
    }
    
}