/*Design System Start*/
.ar{ font-family: Tajawal, serif  !important;}
a{color:var(--colorTurquoise); transition: all 0.3s; cursor: pointer}
a:hover{color:var(--colorDarkGreen); transition: all 0.3s; text-decoration: underline}
h1,h2,h3{
    font-family:var(--mainFont);
    font-style: normal;
    font-weight: 500;
    color:var(--colorDarkGreen);
}
h1{font-size: 64px; line-height: 71px; }
h2{font-size: 44px; line-height: 55px; }
h3{font-size: 28px; line-height: 34px; }
.h-element-1-gray{ position: relative}
.h-element-1-gray:before{ content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); height: 40px; width: 300px; background: var(--heading-elements-7-lightGray); background-size: auto 100%; background-repeat:no-repeat; background-position: right; }
.h-element-1-gray div{ position: relative; z-index: 1}
*[dir="rtl"] .h-element-1-gray:before{right: auto; left: 0; transform: rotate(180deg)}
dl, ol, ul{margin: 0 0 0 0; padding: 0;}

.sub-h1, .sub-h2, .sub-h3{font-family:var(--mainFontN); font-style: normal; font-weight: 400;}
.sub-h1{font-size: 35px; line-height: 52px; }
.sub-h2{font-size: 28px; line-height: 34px; }
.sub-h3{font-size: 22px; line-height: 27px; }

.body-text-1, .body-text-1a, .body-text-2, .body-text-3{ font-family:var(--mainFontN); font-weight: 400;  }
.body-text-1{font-size: 18px; line-height: 27px; }
.content-detail .body-text-1 p{font-size: 18px; line-height: 27px; }
.body-text-1a{font-size: 16px; line-height: 24px; }
.body-text-1a p{font-size: 16px; line-height: 24px; }
.content-detail .body-text-1a p{font-size: 16px; line-height: 24px; }
.body-text-2{font-size: 14px; line-height: 21px; }
.body-text-2 p{font-size: 14px; line-height: 21px; }
.content-detail .body-text-2 p{font-size: 14px; line-height: 21px; }
*[dir="rtl"] .body-text-2{font-size: 13px; line-height: 23px;}
.body-text-3{font-size: 12px; line-height: 18px; }

.sub-h1.mfont, .sub-h2.mfont, .sub-h3.mfont,.body-text-1.mfont, .body-text-1a.mfont, .body-text-2.mfont, .body-text-3.mfont{ font-family:var(--mainFont);}
.sub-h1.light, .sub-h2.light, .sub-h3.light,.body-text-1.light, .body-text-1a.light, .body-text-2.light, .body-text-3.light{ font-weight: 300;}

.italic{font-style: italic;}

p{ font-family:var(--mainFontN);}

.text-col-2{ column-count: 2; column-gap: 40px;}
.text-col-3{ column-count: 3; column-gap: 40px;}
.text-col-4{ column-count: 4; column-gap: 40px;}
.text-col-2 p, .text-col-3 p{ margin-bottom: calc(var(--space) * 3); padding-bottom: 0 !important; }



.error {border: 1px solid var(--colorPeach) !important;}
.hide{display:none !important;}
label.error {
    border: none !important;
    color: var(--colorPeach) !important;
    padding: 0 !important;
    font-size: 14px !important;
}
label.success {
    border: none !important;
    color: var(--colorTurquoise) !important;
    padding: 0 !important;
    font-size: 14px !important;
}


.no-desktop{ display: none !important;}
.no-mobile{ display: block !important;}

.btn{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    background:  var(--colorTurquoise);
    border: 1px solid var(--colorTurquoise);
    font-family:var(--mainFontN);
    font-size: 16px;
    line-height: 18px;
    color: white;
    height: 48px;
    width: 220px;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
}
.btnLightBlue{background:  var(--colorLightBlue); border: 1px solid var(--colorLightBlue);}
.btnPeach{background:  var(--colorPeach); border: 1px solid var(--colorPeach);}
.btnYellow{background:  var(--colorYellow); border: 1px solid var(--colorYellow);}
.btn.bg-limeGreen {background:  var(--colorLimeGreen); border: 1px solid var(--colorLimeGreen);}
.btn.small{height: 40px;}
.btn.round{ width: calc(var(--space ) * 10); height: calc(var(--space ) * 10); border-radius: 50%; background: white; border: 1px solid white; color: var(--colorTurquoise);}
.btn.disabled{
    background: rgba(var(--rgbColorGrey) / 0.25);
    border: 1px solid rgba(var(--rgbColorGrey) / 0.25);
}
.btn i + span{ padding: 0 8px}
.btn:hover,
.btnLightBlue:hover,
.btnPeach:hover,
.btnYellow:hover {
    color: white;
   /* background: var(--colorDarkGreen) !important;*/
    border: 1px solid var(--colorDarkGreen) !important;
    text-decoration: none;
    box-shadow: 0 0 16px rgba(33, 181, 146, 0.75) !important;
}
.btnYellow:hover {    
    background: var(--colorDarkGreen) !important;   
}
.btn.hover-lime-green:hover,
.btnLightBlue.hover-lime-green:hover,
.btnPeach.hover-lime-green:hover,
.btnYellow.hover-lime-green:hover {
    color: white;
    background:  var(--colorLimeGreen);
    border: 1px solid var(--colorLimeGreen);
    text-decoration: none;
}
.btn:focus{
    background:  var(--colorTurquoise);
    border: 1px solid var(--colorTurquoise);
    outline: none;
    outline-offset: 0;
    }
.btn-check:focus+.btn, .btn:focus{box-shadow:none}
.btn.line{
    background: none;
    border: 1px solid var(--colorTurquoise);
    color: var(--colorTurquoise);
}
.btn.line:hover{
    border: 1px solid var(--colorDarkGreen);
    color: var(--colorDarkGreen);
}
.btn.line.gray{
    background: none;
    border: 1px solid var(--colorGrey);
    color: var(--colorGrey);
}
.btn.line:hover.gray{
    border: 1px solid var(--colorDarkGreen);
    color: var(--colorDarkGreen);
}
.btn.line.hover-lime-green:hover{
    border: 1px solid var(--colorLimeGreen) !important;
    color: var(--colorLimeGreen);
}
.btn.line.white{
    background: none;
    border: 1px solid white;
    color: white;
}
.btn.line.white:hover{
    border: 1px solid var(--colorDarkGreen);
    color: var(--colorDarkGreen);
    background: none !important;
}
.btn.line.white.hover-lime-green:hover{
    background: none !important;
    border: 1px solid var(--colorLimeGreen);
    color: var(--colorLimeGreen);
}

.btn.btn-apple-podcast{
    background: #6720D2;
    border: 1px solid #6720D2;
    color: white;
}
.btn.btn-apple-podcast:hover{
    background: #EEEAF6;
    border: 1px solid #EEEAF6;
    color: #6720D2;
}
.btn.btn-apple-podcast.gray{
    background: #EEEAF6;
    border: 1px solid #EEEAF6;
    color: #6720D2;
}
.btn.btn-apple-podcast.gray:hover{
    background: #6720D2;
    border: 1px solid #6720D2;
    color: white;

}


.icon{display: inline-block; background-size: contain;}
.ico-search{ background: url("../images/svg/icons-search.svg") no-repeat center; }
.ico-search.white{ background: url("../images/svg/icons-search-white.svg") no-repeat center; }

.btn-close{

}

.separator{ background: white; width: 2px; height: content-box;}

.image-box-wrapper{
    width: 100%;
    height: 330px;
    border-radius: 5px;
    position: relative;
}
.error-img-wrapper{ display: flex; width: 100%; height: 100%; align-items: center; justify-content: center}
.error-img-wrapper img{width: 100%; max-width: 240px; object-fit: contain; }
.error-content{ position: relative;}
.error-content:before {
    content: "";
    width: 210px;
    height: 60px;
    position: absolute;
    background: var(--elements-7-LimeGreen);
    left: 0;
    top: 0;
}
.error-content:after {
    content: "";
    width: 40px;
    height: 90px;
    position: absolute;
    background: var(--elements-4-Turquoise);
    right: 0;
    bottom: 0;
}

.image-box-wrapper:before{ content: "";  width: 100%; height: 100%; position: absolute; top: 0; left: 0;  }
.image-box-wrapper img{ width: 100%; height: 100%; border-radius: 5px; object-fit: cover}
.image-box-wrapper .image-box-content{ position: absolute; width: 100%; height: 100%; z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    flex-flow:  column ;
    padding: 24px;
    color: white;
    background: rgba(var(--rgbColorBlack) / 0.2);
}

.image-box-wrapper .image-box-content .time-label{position: absolute;
    left: 24px;
    top: 24px;
    width: fit-content;
    height: 24px;
    padding: 0 8px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F4F4F4;
    color: var(--colorDarkGreen);

}
*[dir="rtl"] .image-box-wrapper .image-box-content .time-label{left: auto; right: 24px;}
.image-box-wrapper .image-box-content .time-label span{
    padding: 2px 8px 0 8px;
    font-size: 12px;
    display: inline-flex;
    font-family: var(--mainFont);
    font-weight: 500;
}

.image-box-wrapper.elements-1:before{background-position: right; border-radius: 5px; background-repeat:repeat-y; background-size:210px auto }
*[dir="rtl"] .image-box-wrapper.elements-1:before{ transform: rotate(180deg)}
.image-box-wrapper.elements-1.art-color-dark-green:before{background-image: url("../images/svg/image-art-1-dark-green.svg");}
.image-box-wrapper.elements-1.art-color-light-blue:before{background-image: var(--elements-1-LightBlue);}
/*.image-box-wrapper.elements-1.art-color-light-blue:before{background-image: var(--elements-4);}*/
.image-box-wrapper.elements-1.art-color-lime-green:before{background-image: url("../images/svg/image-art-1-lime-green.svg");}
.image-box-wrapper.elements-1.art-color-peach:before{background-image: url("../images/svg/image-art-1-peach.svg");}
.image-box-wrapper.elements-1.art-color-turquoise:before{background-image: url("../images/svg/image-art-1-turquoise.svg");}
.image-box-wrapper.elements-1.art-color-white:before{background-image: url("../images/svg/image-art-1-white.svg");}
.image-box-wrapper.elements-1.art-color-yellow:before{background-image: url("../images/svg/image-art-1-yellow.svg");}
.image-box-wrapper.elements-2{ padding: 24px 0 0 24px}
*[dir="rtl"] .image-box-wrapper.elements-2{ padding: 24px 24px 0 0 }
.elements-2:before{background-position: left top; top: 0; left: 0; background-repeat:no-repeat; background-size:260px 126px }
*[dir="rtl"] .elements-2:before{background-position: right top; top: 0; right: 0; }
.elements-2.art-color-dark-green:before{background-image: url("../images/svg/image-art-2-dark-green.svg");}
.elements-2.art-color-light-blue:before{background-image: url("../images/svg/image-art-2-light-blue.svg");}
.elements-2.art-color-lime-green:before{background-image: url("../images/svg/image-art-2-lime-green.svg");}
.elements-2.art-color-peach:before{background-image: var(--elements-2-Peach)}
.elements-2.art-color-turquoise:before{background-image: url("../images/svg/image-art-2-turquoise.svg");}
.elements-2.art-color-white:before{background-image: url("../images/svg/image-art-2-white.svg");}
.elements-2.art-color-yellow:before{background-image: url("../images/svg/image-art-2-yellow.svg");}
.image-box-wrapper.elements-3{ padding: 0 0 24px 24px}
*[dir="rtl"] .image-box-wrapper.elements-3{ padding: 0 24px 24px 0}
.image-box-wrapper.elements-3:before{background-position: left bottom; bottom: 0; left:0; background-repeat:no-repeat; background-size:140px 220px;  }
*[dir="rtl"] .image-box-wrapper.elements-3:before{background-position: right bottom; bottom: 0; left:0;}
.image-box-wrapper.elements-3.art-color-dark-green:before{background-image: url("../images/svg/image-art-3-dark-green.svg");}
.image-box-wrapper.elements-3.art-color-light-blue:before{background-image: url("../images/svg/image-art-3-light-blue.svg");}
.image-box-wrapper.elements-3.art-color-lime-green:before{background-image: url("../images/svg/image-art-3-lime-green.svg");}
.image-box-wrapper.elements-3.art-color-peach:before{background-image: url("../images/svg/image-art-3-peach.svg");}
.image-box-wrapper.elements-3.art-color-turquoise:before{background-image: url("../images/svg/image-art-3-turquoise.svg");}
.image-box-wrapper.elements-3.art-color-white:before{background-image: url("../images/svg/image-art-3-white.svg");}
.image-box-wrapper.elements-3.art-color-yellow:before{background-image: var(--elements-3-Yellow);}
.image-box-wrapper.elements-4{ padding: 0 24px 0 0}
*[dir="rtl"] .image-box-wrapper.elements-4{ padding: 0 0 0 24px }
.image-box-wrapper.elements-4:before{background-position: right center; bottom: 0; left:0; background-repeat:no-repeat; background-size:100px 200px;  }
*[dir="rtl"] .image-box-wrapper.elements-4:before{background-position: left center; }
 .elements-4.art-color-turquoise:before{background-image: var(--elements-4-Turquoise);}
 .elements-4.art-color-light-blue:before{background-image: var(--elements-4-LightBlue);}
.elements-5{ padding: 16px 16px 0 0; position: relative; }
*[dir="rtl"] .elements-5{ padding: 16px 0 0 16px ;}
.elements-5:before{ position: absolute; content: ""; background-position: right top; bottom: 0; left:0; background-repeat:no-repeat; background-size:70px 180px;  }
*[dir="rtl"] .elements-5:before{background-position: left top; bottom: 0; left:0; }
.elements-5.art-color-turquoise:before{background-image: var(--elements-5-Turquoise);}

.image-box-wrapper.elements-9{ padding: 40px 40px 0 0}
*[dir="rtl"] .image-box-wrapper.elements-9{ padding: 40px 0 0 40px }
.elements-9:before{background-position: right top; top: 0; right: 0; background-repeat:no-repeat; background-size:140px 90px }
*[dir="rtl"] .elements-9:before{background-position: left top; }
.image-box-wrapper.elements-9.art-color-turquoise:before{background-image: var(--elements-9-Turquoise);}
.image-box-wrapper.elements-9.art-color-light-blue:before{background-image: var(--elements-9-LightBlue);}
.image-box-wrapper.elements-9.art-color-lime-green:before{background-image: var(--elements-9-LimeGreen);}

.image-box-wrapper.elements-10{ padding: 40px 0 0 40px}
*[dir="rtl"] .image-box-wrapper.elements-10{ padding: 40px 40px 0 0 }
.elements-10:before{background-position: left top; top: 0; left: 0; background-repeat:no-repeat; background-size:130px 130px }
*[dir="rtl"] .elements-10:before{background-position: right top;}
.image-box-wrapper.elements-10.art-color-turquoise:before{background-image: var(--elements-10-Turquoise);}
.image-box-wrapper.elements-10.art-color-light-blue:before{background-image: var(--elements-10-LightBlue);}
.image-box-wrapper.elements-10.art-color-lime-green:before{background-image: var(--elements-10-LimeGreen);}

.elements-8{ position: relative}
.elements-8:before{position: absolute; content: ""; transform: rotate(180deg); background-position: right bottom; top: 0; left:0; background-image: var(--elements-8-Turquoise); background-repeat:no-repeat; width: 20%; height: 20%; }

.partners-logo-list{ display: flex; gap: 32px; flex-wrap: wrap}
.partner-logo-wrapper{ width: 120px; height: 72px; display: flex; align-items: center; justify-content: center;}
.partner-logo-wrapper img{ width: 100%; height: 100%; object-fit: contain}

.wSet{ width: 100%; max-width: 1220px; margin: auto }

.top-nav-bar-wrapper{ width: 100%; height: 80px; position: absolute; z-index: 4; top:0; left: 0; background: rgba(0, 55, 42, 0.3);}
.top-nav-bar-wrapper.inner-pages{ position: relative; background:var(--colorDarkGreen) }



.top-nav-bar-wrapper .inner-wrapper{  height: 80px; display: flex; flex-flow: row; justify-content: space-between;  align-items: center;}
.sticky-nav-bar {
    position: fixed !important;
    top: 0;
    width: 100%;
    transition: all 0.3s ease;
    z-index: 99;
}
.sticky-nav-bar.bg-dark-green{ background: var(--colorDarkGreen);}
.sticky-nav-bar + * {
    transition: all 0.3s ease;
}
.sticky-nav-bar.inner-pages + section { margin-top: 80px;  }
.sticky-nav-bar.inner-pages + * {
    padding-top: 80px;
}

.top-nav-bar-wrapper .nav-wrapper {}
.top-nav-bar-wrapper .nav-wrapper nav{ font-family: var(--mainFont)}
.top-nav-bar-wrapper .nav-wrapper nav ul{display: flex; flex-flow: row;}
.top-nav-bar-wrapper .nav-wrapper nav ul li{ padding: 0 32px}
.top-nav-bar-wrapper .nav-wrapper nav ul li a{ color:white; text-decoration: none}
.top-nav-bar-wrapper .nav-wrapper nav ul li a.active,
.top-nav-bar-wrapper .nav-wrapper nav ul li a:hover{ color:var(--colorLimeGreen)}

.top-nav-bar-wrapper .right-link-wrapper{ display: flex; justify-content: center; align-items: center}
.top-nav-bar-wrapper .right-link-wrapper .btn{  width: 110px; margin: 0 0 0 16px;}
.top-nav-bar-wrapper .right-link-wrapper .lang{ font-family: var(--mainFont)}
*[dir="rtl"] .top-nav-bar-wrapper .right-link-wrapper .btn{  width: 110px; margin: 0 16px 0 0; font-size: 14px;}

.top-nav-bar-wrapper .right-link-wrapper .user-img{ width: 40px; height: 40px; border-radius: 5px; margin: 0 0 0 16px;}
*[dir="rtl"] .top-nav-bar-wrapper .right-link-wrapper .user-img{ width: 40px; height: 40px; border-radius: 5px; margin: 0 16px 0 0 ;}
.top-nav-bar-wrapper .right-link-wrapper .user-img a{ margin: 0; display: block; height: 100%; padding: 0}
.top-nav-bar-wrapper .right-link-wrapper .user-img img{ width: 100%; height: 100%; object-fit: cover; border-radius: 5px;}

.top-nav-bar-wrapper.inner-pages .right-link-wrapper .btn:hover{background: var(--colorLimeGreen); border-color: var(--colorLimeGreen);}
.top-nav-bar-wrapper .right-link-wrapper a{ margin: 0 16px; color: white; text-decoration: none}
.top-nav-bar-wrapper .right-link-wrapper .icon{ width: 32px; height: 32px; }
.top-nav-bar-wrapper .right-link-wrapper .separator{ height: 44px; margin: 0 16px;}


.top-nav-bar-wrapper .inner-wrapper{ position: relative}
.top-nav-bar-wrapper .user-info{
    border-bottom: 1px solid rgba(var(--rgbColorGrey) / 0.25);
    margin: 8px 0;
    color: var(--colorTurquoise);
    display: flex;
    align-items: center;
    padding: 0 0 16px 0;
}

.top-nav-bar-wrapper .user-info .user-img{ margin: 0 0; }
.top-nav-bar-wrapper .user-info .user-name{}
.top-nav-bar-wrapper .user-info .user-name a{ font-family: var(--mainFont); font-size: 16px; line-height: 24px; color: var(--colorTurquoise);}
.top-nav-bar-wrapper .user-info .user-name:hover a{  color: var(--colorDarkGreen);}
.top-nav-bar-wrapper .user-menu-wrapper{ display: none;
    position: absolute;
    right: 0;
    top: 100px;
    min-width: 280px;
    padding: 24px;
    color: var(--colorDarkGreen);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
    border: none;
}
*[dir="rtl"] .top-nav-bar-wrapper .user-menu-wrapper{ left: 0; right: inherit;}
.top-nav-bar-wrapper .user-menu-wrapper li{margin: 4px 0; }

.top-nav-bar-wrapper .user-menu-wrapper li a{color: var(--colorDarkGreen);
    font-family: var(--mainFont); font-size: 16px; line-height: 24px; margin: 0 0; display: block; padding: 4px 0;
}
.top-nav-bar-wrapper .user-menu-wrapper li a:hover{color: var(--colorTurquoise);}
.top-nav-bar-wrapper .user-menu-wrapper li a i{ width: 24px; text-align: center; font-size: 15px}
.top-nav-bar-wrapper .user-menu-wrapper li a span{ padding: 0 8px}

.top-nav-bar-wrapper .user-menu-wrapper .btn-bar-wrapper{}
.top-nav-bar-wrapper .user-menu-wrapper .btn-bar-wrapper .btn{ width: 100%; margin: 0 0}
.top-nav-bar-wrapper .user-menu-wrapper .btn-bar-wrapper .btn:hover{ background: var(--colorDarkGreen)}
.top-nav-bar-wrapper .user-menu-wrapper .btn-bar-wrapper .btn span{ padding: 0 8px}
.user-menu-wrapper.show{ display: block}


.popup-search-wrapper{
    padding:0 0 0 0  !important;

}
.popup-search-wrapper .modal-dialog{ max-width: 100%; margin: 0 0 0 0; border-radius: 0}
.popup-search-wrapper .modal-dialog .modal-content{ border-radius: 0; border: none}
.popup-search-wrapper .modal-dialog .modal-content .modal-header{ border-radius: 0; border: none; align-items: center;}
.popup-search-wrapper .modal-dialog .modal-content .modal-body{ min-height: 120px;}
*[dir="rtl"] .popup-search-wrapper .modal-dialog .modal-content .modal-header .btn-close{margin: -0.5rem auto -0.5rem -0.5rem ; }
.popup-search-wrapper .search-form-wrapper{ width: fit-content; margin: auto }
.popup-search-wrapper .search-form-wrapper .search{ display: flex; align-items: center}
.popup-search-wrapper .search-form-wrapper .search-input{
    height: 48px;
    border: none;
    border-bottom:1px solid var(--colorGrey);
    font-style: normal;
    font-weight: normal;
    font-size: 22px;
    line-height: 125%;
    color: var(--colorGrey);
    width: 424px;

}
.popup-search-wrapper .search-form-wrapper .search-btn{ background: none; border: none}
.popup-search-wrapper .search-form-wrapper .icon{
    width: 32px;
    height: 32px;
}
.popup-search-wrapper .search-result{
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 27px;
}
.popup-search-wrapper .search-result li{ display: flex; justify-content: flex-start; align-items: center}
.popup-search-wrapper .search-result li .icon{ width: 16px; height: 16px;}

.modal-open{ padding: 0 !important; overflow: hidden; height: 100vh;}
.modal{backdrop-filter: blur(16px);}
.popup-share-wrapper{ background: rgba(250, 250, 250, 0.1); }
.popup-share-wrapper .modal-content { border-radius: 5px}
.popup-share-wrapper .modal-header{ border: none;position: absolute; right: 0; z-index: 1; }
.popup-share-wrapper .modal-header .btn-close{ border: none}
.popup-share-wrapper .social{ display: flex; justify-content: space-evenly; margin: auto; width: fit-content; min-width: 50%; font-size: 24px;}
.popup-share-wrapper .social a:hover i{
    font-family: 'Font Awesome 5 Free', serif;
    font-weight: 400;
}

.share-form-wrapper{}
.share-form-wrapper .share-form{ display: flex; justify-content: center; }
.share-form-wrapper .share-form .share-input{ min-width: 294px; font-size: 12px; background: #fafafa; height: 32px; border-radius: 5px; padding: 8px; border:none;}
.share-form-wrapper .share-form .share-input::placeholder{ color: #898A8D;}
.share-form-wrapper .share-form .share-btn{ width: 37px; height: 32px; border-radius: 0 5px 5px 0}

/*HEADER STYLE Start*/

header{
    width: 100%;
    height: 100vh;
    position: relative;
}
header h1,header h2{ color: white; }
header p{ color: white; font-size: 18px; line-height: 27px;}
header .btn { width: fit-content; }
header .slider{width: 100%; height: 100%;}
header .slide{ width: 100%; height: 100%; position: relative; display: flex; justify-content: center;}
header .slide .slide-element{  width: 100%; height: 100%; position: absolute; z-index: 1; pointer-events: none }
header .slide .slide-element .left{position: absolute; left: 0; top: 80px}
*[dir="rtl"] header .slide .slide-element .left{ right: 0; left: auto;}
header .slide .slide-element .left.two{ top: 25%;}
header .slide .slide-element .left.cityhub{
    transform: rotate(180deg); height: 40px; top: 120px;
}
*[dir="rtl"] header .slide .slide-element .left.cityhub{transform: rotate(0);}
header .slide .slide-element .right{position: absolute; right:0; bottom: 20px}
*[dir="rtl"] header .slide .slide-element .right{ right:auto; left: 0; transform: rotate(180deg);}
header .slide .slide-element .rightCenter{position: absolute; right:0; top: 50%; transform: translateY(-50%);}
*[dir="rtl"] header .slide .slide-element .rightCenter{ right:auto; left: 0; }
header .slide .slide-element .leftCenter{position: absolute; left:0; top: 50%; transform: translateY(-50%);}
*[dir="rtl"] header .slide .slide-element .leftCenter{ right: 0; left: auto; }
header .slide .slide-element .rotate90a{position: absolute; left:0; top: 50%; transform: translateY(-50%);}
header .slide .slide-element .rotate-faq{     left: 50px;transform: translateY(-50%) rotate(90deg);}
header .slide .slide-image{  width: 100%; height: 100%; position: absolute; z-index: 0; }
header .slide .slide-image.halfRight{ width: 30%; right: 0; top: 80px }
header .slide .slide-image img{
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
header .slide .slide-contact{ position: relative; z-index: 2; width: 700px; display: flex; justify-content: center; align-items: flex-start; flex-flow:column; }

header .slider-dots-wrapper{
    position: absolute;
    width: 100%;
    height: 4px;
    bottom: 32px;
    left: 0;
    display: flex;
    z-index: 3;
}
header .slider-dots-wrapper .wSet{
    display: flex;
    justify-content: flex-start;
    align-items: center;

}
header .slider-dots-wrapper .dot{
    width: 46px;
    height: 4px;
    background: rgba(248, 248, 248, 0.33);
    margin: 0 8px;
    cursor: pointer;
}
header .slider-dots-wrapper .dot.active{background: var(--colorLimeGreen);}


header.podcastheader{ height: fit-content;}
header .podcast{ width: 100%; height: 100%; background: white }

header .podcast .podcast-image{ width: 100%; height: calc(100% - 200px); position: absolute; z-index: 0;}
header .podcast .podcast-image:before{ content:""; position: absolute; top: 0; right: 0; background: rgba(var(--rgbColorBlack) / 0.5); width: 100%; height: 100%;}
header .podcast .podcast-image img{ width: 100%; height: 100%; object-fit: cover; display: block;}

header .podcast .slide-contact{ position: relative; display: flex; padding-top: 64px; padding-bottom:24px; align-items: center; justify-content: center; height: 100%; flex-flow: column;}
header .podcast .slide-contact .buttons-wrapper{ display: flex}
header .podcast .slide-contact .social{ font-size: 24px;}
header .podcast .slide-contact .social a{ color: white; margin: 0 8px;}
header .podcast .slide-contact .social a:hover{ }
header .podcast .slide-contact .social a:hover .fab { color: var(--colorDarkGreen);
    font-family: "Font Awesome 5 Free", serif; font-weight: normal;}
header .slide-contact .links-bar-wrapper{
    font-family: var(--mainFontN);
    font-weight: 600;
    font-size: 18px;
    line-height: 27px
}
header .slide-contact .links-bar-wrapper a{
    text-decoration: none;
    color: white;
    margin-right: 8px;
    font-weight: 600;
    margin-left: -4px
}
*[dir="rtl"] header .slide-contact .links-bar-wrapper a{ margin-left: 8px; margin-right: -4px;}
header .slide-contact .links-bar-wrapper a i{ margin: 0 8px;}
header .podcast .podcast-player{
    position: relative;
    bottom: 0;
    left: 0;
    width: 100%;
}
header .podcast .podcast-player iframe{ margin: auto;}
header .podcast .apple-podcast{

    background: #F7F7F9;
    margin: 0 auto;
    padding: 24px;
    border-radius: 5px;
    width: fit-content;
}
header .podcast .podcast-player .podcast-player-wrapper,
header .podcast .apple-podcast .apple-podcast-wrapper{ max-width: 800px;  width: 800px;}

header .carousel-indicators{}
header .carousel-inner{background: var(--colorDarkGreen);}

header .carousel-item {
    height: 100%;
    /*min-height: 350px;*/
    background: no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
header .carousel-item .carousel-item-img-wrapper{
    height: 100%;
    width: 100%;
    max-width: 530px;
    position: absolute;
    right: 0;
    padding-top: 80px;
}
header .carousel-item .carousel-item-img-wrapper:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    background: rgba(var(--rgbColorBlack) / 0.4);
    width: 100%;
    height: 100%;
    z-index: 0;
}
*[dir="rtl"] header .carousel-item .carousel-item-img-wrapper{ right: auto; left: 0;}

header .carousel-item .carousel-item-img-wrapper .img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
header .carousel-item .carousel-item-img-wrapper .art-work-1 {
    height: 100%;
    width: 70px;
    position: absolute;
    left: 0;
    top: 0;
}
*[dir="rtl"] header .carousel-item .carousel-item-img-wrapper .art-work-1 { right: 0; left: auto;}
header .carousel-item .carousel-item-img-wrapper .art-work-1 img{ width: 100%; height: 100%}
header .carousel-item .carousel-item-img-wrapper .art-work-2 {
    height: 177px;
    width: 75%;
    position: absolute;
    left: -50%;
    top: 80px;
/*    background: url("../images/");*/
}
header .carousel-item .carousel-item-img-wrapper .art-work-3 {
    height: 177px;
    width: 67px;
    position: absolute;
    left: -33px;
    top: 80px;
}
*[dir="rtl"] header .carousel-item .carousel-item-img-wrapper .art-work-2 {right: -50%; left:auto;}
header .carousel-item .carousel-item-img-wrapper .art-work-2 img{ width: 100%; height: 100%}

header .carousel-caption{
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    left: 0;
    top: 0;
    padding: 0 0 0 0;
    text-align: inherit;
    z-index: 3;
}
*[dir="rtl"] header .carousel-caption {left: auto;right: 0;}

header .carousel-indicators{  align-items: center; justify-content: flex-start; bottom: calc( var(--space ) * 4); z-index: 4}
header .carousel-indicators [data-bs-target]{ width: 48px;  height: 4px; margin: 0 8px  }
header .carousel-indicators [data-bs-target].active{ width: 48px;  height: 4px; background-color:var(--colorLimeGreen) }

header .carousel-control-next, header .carousel-control-prev{ z-index: 4; width: 5%;}

header .carousel-inner .partners-logo-list{ align-items: center; gap: 8px; justify-content: flex-start;}
header .carousel-inner .partners-logo-list .partner-logo-wrapper{    height: 40px; width: 72px;}
header .carousel-inner .partners-logo-list .partner-logo-wrapper a{ height: 100%; display: block;}


/*HEADER STYLE END*/

.articles-listing{  }
.articles-listing h2{ }

.articles-listing .articles-nav-wrapper{
   /* padding: 0 0  48px 0;*/
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.articles-listing .category-nav {}
.articles-listing .category-nav ul{
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: center;
}
.articles-listing .category-nav ul li{
    padding: 0 18px;
    display: flex;
    align-items: center;
}
.articles-listing .category-nav ul li:first-child{ padding:0 18px 0 0;}
*[dir="rtl"] .articles-listing .category-nav ul li:first-child{ padding:0 0 0 18px;}
.articles-listing .category-nav ul li a{
    color: var(--colorGrey);
    font-family: var(--mainFontN);
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 22px;
    text-decoration: none;
}
.articles-listing .category-nav ul li a.active,
.articles-listing .category-nav ul li a:hover{

    color: var(--colorTurquoise);
    font-weight: 400;
}
.articles-listing .category-nav ul li a.active{font-family: var(--mainFont);}
.articles-listing .category-nav ul li a:hover{}
.articles-listing .filter-nav{
    display: flex;
    align-items: center;
    justify-content: flex-end;
}




.filter-nav ul{}
.filter-nav ul li{
    display: inline-flex;
    position: relative;
    height: 48px;
    padding: 0 0 0 16px;
    box-sizing: border-box;
    border: 1px solid var(--colorGrey);
    border-radius: 5px;
    margin:0 0 0 24px;
}
*[dir=rtl] .filter-nav ul li{padding: 0 16px 0 0; margin:0 24px 0 0;}
.filter-nav ul li.has-child > a:after{
    content: url("../images/svg/icon-arrow-down.svg");
    width: 20px;
    height: 20px;
    margin: 0 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.filter-nav ul li.has-child:hover > a:after{content: url("../images/svg/icon-arrow-up.svg");}
.filter-nav ul li.has-child.filter > a:after{content: url("../images/svg/icon-filter.svg");}
.filter-nav ul li a{
    color: var(--colorGrey);
    font-family: var(--mainFont);
    font-style: normal;
    font-size: 16px;
    font-weight: 300;
    text-decoration: none;
    display: flex;
    align-items: center;
}
.filter-nav ul li a.active{color: var(--colorTurquoise);}
.filter-nav ul li:hover{ }
.filter-nav ul li ul {
    display: none;
    position: absolute;
    top: 46px;
    right: 0;
    z-index: 3;
    padding: 16px 24px;
    background: white;
    border: 1px solid rgba(var(--rgbColorGrey) / 0.25);
    border-radius: 5px;
    box-sizing: border-box;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
}
*[dir=rtl] .filter-nav ul li ul{ left: 0; right: unset}
.filter-nav ul li ul li{ display: block; padding: 8px 0; margin: 0 0 0 0}
*[dir=rtl] .filter-nav ul li ul li{ display: block; padding: 8px 0; margin: 0 0 0 0}
.filter-nav ul li ul li { height: auto; border: none}
.filter-nav ul li ul li a{
    color: var(--colorTurquoise);
    font-family: var(--mainFont);
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    text-decoration: none;
    min-width: 125px;

}

.filter-nav ul li ul li a:hover,
.filter-nav ul li ul li a.active{color: var(--colorDarkGreen);}
.filter-nav ul li:hover a + ul{ display: block;}

.filter-nav ul li ul li .form-outline{ padding: 0}
.filter-nav ul li ul li .form-check .form-check-label{ color: var(--colorTurquoise); white-space: nowrap;  font-family: var(--mainFont); font-weight: 400;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    padding: 2px 8px 0 8px;
}


.articles-listing-wrapper{
    display: grid;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
     grid-template-columns: repeat(4, 1fr);
    /* grid-template-columns: repeat(auto-fill, 280px); */
    /* grid-template-columns: minmax(280px, 4fr); */
    /* grid-template-columns: repeat( auto-fit, minmax(280px, 1fr)); */
    gap: 32px;
}
.profile-wrapper .articles-listing-wrapper{ display: flex; }

.articles-carousel-listing-wrapper{ /*direction: ltr*/}
.articles-carousel-listing-wrapper .carousel-inner{ gap: 32px;
    padding: 16px;
    margin: -16px;
    width: calc(100% + 32px);
}
*[dir="rtl"] .articles-carousel-listing-wrapper .carousel-inner .carousel-item{ direction: rtl}
.articles-carousel-listing-wrapper .carousel-inner .carousel-item {  }
.articles-carousel-listing-wrapper .carousel-control-prev,
.articles-carousel-listing-wrapper .carousel-control-next {
    background-color: #FFFFFF;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.05);
    top: 50%;
    transform: translateY(-25%);
    color: red;
    opacity: 1;
    border: 1px solid rgba(var(--rgbColorGrey) / 0.25);
}
.articles-carousel-listing-wrapper .carousel-control-prev{ left: -29px;}
.articles-carousel-listing-wrapper .carousel-control-next{ right: -29px;}
.articles-carousel-listing-wrapper .carousel-control-prev-icon {  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");}
.articles-carousel-listing-wrapper .carousel-control-next-icon {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");}
@media (min-width: 768px) {
    .articles-carousel-listing-wrapper .carousel-item {
        margin-right: 0;
        flex: 0 0 calc(25% - 24px);
        display: block;
    }
    .articles-carousel-listing-wrapper .carousel-inner {
        display: flex;
        flex-wrap: nowrap;
    }
}



.articles-listing-wrapper .article-outer,
.articles-carousel-listing-wrapper .article-outer{
    background: white;
    border: 1px solid rgba(var(--rgbColorGrey) / 0.25);
    box-sizing: border-box;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
    border-radius: 5px;
    position: relative;
   /* max-width: 330px;*/
}
.profile-wrapper .articles-listing-wrapper .article-outer{ box-shadow: 0 0 0 rgba(0, 0, 0, 0.05);}
.articles-listing-wrapper .article-outer .time-label,
.articles-carousel-listing-wrapper .article-outer .time-label{
    position: absolute;
    left: 8px;
    top: 8px;
    width: fit-content;
    height: 24px;
    padding: 0 8px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    color: var(--colorDarkGreen);

}
*[dir="rtl"] .articles-listing-wrapper .article-outer .time-label,
*[dir="rtl"] .articles-carousel-listing-wrapper .article-outer .time-label{ left: auto; right: 8px;}

.articles-listing-wrapper.events-listing{ grid-template-columns: repeat(2, 1fr);}
.articles-listing-wrapper.events-listing .article-outer,
.articles-listing-wrapper .article-outer.event{ display: flex}
.articles-listing-wrapper.events-listing .article-outer .article-img,
.articles-listing-wrapper .article-outer.event .article-img{ height: 100%; max-width: 250px}
.articles-listing-wrapper.events-listing .article-outer .article-img img,
.articles-listing-wrapper .article-outer.event .article-img img{ border-radius: 5px 0 0 5px;}
.articles-listing-wrapper.events-listing .article-outer .article-content,
.articles-listing-wrapper .article-outer.event .article-content { }
.articles-listing-wrapper.events-listing .article-outer .article-content .article-text-wrapper,
.articles-listing-wrapper .article-outer.event .article-content .article-text-wrapper { height: auto;}
.articles-listing-wrapper.events-listing .article-outer .time-label.relative,
.articles-listing-wrapper .article-outer.event .time-label.relative{ position: relative; top: 0; left: 0;}

.search-listing-wrapper .article-outer{ width: calc(25% - 24px)}
.search-listing-wrapper .article-outer.event{ width: calc(50% - 16px); height: 230px}

.article-outer .time-label.bg-dark-green{background: var(--colorDarkGreen); color: white;}
.article-outer .time-label.bg-turquoise{background: var(--colorTurquoise); color: white}
.article-outer .time-label.bg-limeGreen{background: var(--colorLimeGreen); }
.article-outer .time-label.bg-petroleum{background: var(--colorPetroleum); color: white}
.article-outer .time-label.bg-red{background: var(--colorRed);  color: white}
.article-outer .time-label.bg-orange{background: var(--colorOrange);  color: white}
.article-outer .time-label.bg-lightBlue{background: var(--colorLightBlue); color: white}
.article-outer .time-label.bg-peach{background: var(--colorPeach); color: white}
.article-outer .time-label.bg-yellow{background: var(--colorYellow);}
.article-outer .time-label.bg-blue{background: var(--colorBlue);}
.article-outer .time-label.bg-grey{background: var(--colorGrey); color: white}
.article-outer .time-label.bg-lightGrey{background: #F4F4F4;}

.articles-listing-wrapper .article-outer .time-label i,
.articles-carousel-listing-wrapper .article-outer .time-label i{font-size: 14px;}
.articles-listing-wrapper .article-outer .time-label span,
.articles-carousel-listing-wrapper .article-outer .time-label span{padding: 2px 8px 0 8px; font-size: 12px; display: inline-flex;
    font-family: var(--mainFont);
    font-weight: 500;
}
.articles-listing-wrapper .article-outer .badges-icon,
.articles-carousel-listing-wrapper .article-outer .badges-icon{
    width: 24px;
    height: 24px;
    position: absolute;
    right: 8px;
    top: 8px;
    background: var(--colorTurquoise);
    border-radius: 50%;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}
*[dir="rtl"] .articles-listing-wrapper .article-outer .badges-icon,
*[dir="rtl"] .articles-carousel-listing-wrapper .article-outer .badges-icon{left: 8px; right: auto;}
.articles-listing-wrapper .article-outer .badges-icon i,
.articles-carousel-listing-wrapper .article-outer .badges-icon i{ font-size: 14px;}
.articles-listing-wrapper .article-outer .article-img,
.articles-carousel-listing-wrapper .article-outer .article-img{ width: 100%; height: 175px;}
.articles-listing-wrapper .article-outer .article-img img,
.articles-carousel-listing-wrapper .article-outer .article-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 5px 5px 0 0;
}
.articles-listing-wrapper .article-outer .article-content,
.articles-carousel-listing-wrapper .article-outer .article-content{ padding: 24px; width: 100%}
.articles-listing-wrapper .article-outer .article-content .article-text-wrapper,
.articles-carousel-listing-wrapper .article-outer .article-content .article-text-wrapper{ height: 192px;}
.articles-listing-wrapper .article-outer .article-text-wrapper a,
.articles-carousel-listing-wrapper .article-outer .article-text-wrapper a{ text-decoration: none; color: var(--colorDarkGreen);}
.articles-listing-wrapper .article-outer .article-text-wrapper a:hover,
.articles-carousel-listing-wrapper .article-outer .article-text-wrapper a:hover{  color: var(--colorTurquoise);}
.articles-listing-wrapper .article-outer .article-title,
.articles-carousel-listing-wrapper .article-outer .article-title{
    font-family: var(--mainFont);
    font-size: 18px;
    line-height: 27px;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;

}
.articles-listing-wrapper .article-outer .article-title:hover,
.articles-carousel-listing-wrapper .article-outer .article-title:hover{}
.articles-listing-wrapper .article-outer .article-text,
.articles-carousel-listing-wrapper .article-outer .article-text{
    font-family: var(--mainFontN);
    font-size: 14px;
    font-weight: 400;
    color: var(--colorGrey);
    line-height: 21px;
}
.articles-listing-wrapper .article-outer .bottom-links-wrapper,
.articles-carousel-listing-wrapper .article-outer .bottom-links-wrapper{
    display: flex;
    justify-content: space-between;
    line-height: 24px;
}
.articles-listing-wrapper .article-tags{}
.articles-carousel-listing-wrapper .article-tags,
.articles-listing-wrapper .article-tags a,
.articles-carousel-listing-wrapper .article-tags a{
    font-family: var(--mainFont);
    font-style: italic;
    font-weight: 400;
    font-size: 12px;
    line-height: 125%;
    color: var(--colorDarkGreen);
    text-decoration: none;
}
.articles-listing-wrapper .icon-link a:hover i,
.articles-carousel-listing-wrapper .icon-link a:hover i,
.articles-listing-wrapper .icon-link a.active i,
.articles-carousel-listing-wrapper .icon-link a.active i{ font-weight: normal}
.btn-bar-wrapper{
    display: flex;
    align-items: center;
    justify-content: center;
    /*gap: 16px;*/
}

.btn-bar-wrapper.start{ justify-content: flex-start; }
.btn-bar-wrapper.end{ justify-content: flex-end; }
.btn-bar-wrapper a:last-child { margin: 0 0 0 0;}
.btn-bar-wrapper.alone a {margin: 0 0 0 0;}

.tabs-content-wrapper{}
.tabs-content-wrapper .nav-tabs{ border-bottom: 1px solid #F4F4F4;}
.tabs-content-wrapper .nav-tabs .nav-link{   background: none; border: none; letter-spacing: 1px;  border-radius: 0; font-family:var(--mainFontN); color: var(--colorGrey); font-weight: 400; font-size: 14px;}
.tabs-content-wrapper .nav-tabs .nav-item.show .nav-link,
.tabs-content-wrapper .nav-tabs .nav-link.active{ color: var(--colorTurquoise); border-bottom: 2px solid var(--colorTurquoise); font-weight: 600;}
.tabs-content-wrapper .nav-tabs .nav-item.colorTurquoise.show .nav-link,
.tabs-content-wrapper .nav-tabs .nav-link.colorTurquoise.active{ color: var(--colorTurquoise); border-bottom: 2px solid var(--colorTurquoise);}
.tabs-content-wrapper .nav-tabs .nav-item.colorPeach.show .nav-link,
.tabs-content-wrapper .nav-tabs .nav-link.colorPeach.active{ color: var(--colorPeach); border-bottom: 2px solid var(--colorPeach);}
.tabs-content-wrapper .nav-tabs .nav-item.colorLightBlue.show .nav-link,
.tabs-content-wrapper .nav-tabs .nav-link.colorLightBlue.active{ color: var(--colorLightBlue); border-bottom: 2px solid var(--colorLightBlue);}
.tabs-content-wrapper .nav-tabs .nav-item.colorYellow.show .nav-link,
.tabs-content-wrapper .nav-tabs .nav-link.colorYellow.active{ color: var(--colorYellow); border-bottom: 2px solid var(--colorYellow);}

.content-detail .tabs-content-wrapper .nav-tabs{padding-bottom: 0;}
.content-detail .tabs-content-wrapper .nav-tabs li{ padding-left: 0; padding-bottom: 0; line-height: inherit; position: inherit;}
.content-detail .tabs-content-wrapper .nav-tabs li .nav-link{  font-size: 17px;     white-space: nowrap;}

.content-detail{}
.content-detail .content-detail-inner-wrapper{ width: 100%; max-width: 1000px; margin: 0 auto; }
.content-detail h1, .content-detail h2, .content-detail h3,
.content-detail p, .content-detail ol, .content-detail ul{ padding-bottom: calc(var(--space) * 3);}
.content-detail p{ font-size: 18px; line-height: 27px;}
.content-detail .wrapper-border-box{ border: 1px solid rgba(var(--rgbColorGrey) / 0.25 ); padding:24px; border-radius:5px; color: black; }
.content-detail .wrapper-border-box .icon-box-wrapper { height:40px;  }
.content-detail .wrapper-border-box .icon-box-wrapper img{ height: 100%;  }
.content-detail .wrapper-border-box .box-top-img{ margin: -24px -24px 16px -24px; }
.content-detail .wrapper-border-box .box-top-img img{ object-fit: cover;  width: 100%}

.content-detail .wrapper-border-box.table{ padding:0; vertical-align: middle }
.content-detail .wrapper-border-box.table { padding:0; }

.content-detail .wrapper-border-box .table>:not(:first-child ){ border: none }
.content-detail .wrapper-border-box .table tr {     border: none !important; border-bottom-width: 0 !important; }
.content-detail .wrapper-border-box .table tr th, .content-detail .wrapper-border-box .table tr td { height:56px; vertical-align:middle; border: none !important; padding: 0 24px; border-bottom-width: 0 !important; }
.content-detail .wrapper-border-box .table .color-grey{ color: var(--colorGrey) !important;}

.content-detail .wrapper-border-box .program-highlights-icon img{ height: 48px; width: auto; }




.content-gallery{ position: relative; padding-bottom: 110px;}
.content-gallery .carousel-inner { border-radius: 5px;}
.content-gallery .carousel-inner img {width: 100%; height: 100%;}
.content-gallery .carousel-item { max-height: 400px; }
.content-gallery .carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
}

.content-gallery .carousel-indicators {
    margin: 0 0 0 0;
    justify-content: start;
    width: 100%;
    height: 100px;
    overflow: hidden;
    position: absolute;
    bottom: 0;
}
.content-gallery div.carousel-indicators{width: 72%; left: 14%; right: 14%}
.content-gallery .carousel-indicators ol{ width: 100%; overflow-x:hidden }
.content-gallery .carousel-indicators>li { width: 80px; margin: 0 8px; padding: 0; }
.content-gallery .carousel-indicators>li:before { display: none}
.content-gallery .carousel-indicators li a { display: block; width: 100%; height: 100%; margin: 0 0 0 0;}
.content-gallery .carousel-indicators li img {
    display: block;
    opacity: 0.5;
    width: 80px;
    height: 64px;
    object-fit: cover;
    border-radius: 5px;
}
.content-gallery .carousel-indicators .active img { opacity: 1}
.content-gallery .carousel-indicators li:hover img { opacity: 0.75 }

.content-gallery .carousel-indicators .thumb{ display: inline-block}
.content-gallery .carousel-indicators .thumb button{ width: 80px; height: 64px;}
.content-gallery .carousel-indicators .thumb img{
    display: block;
    opacity: 0.5;
    width: 80px;
    height: 64px;
    object-fit: cover;
    border-radius: 5px;
}


.content-gallery .carousel-control-prev, .content-gallery .carousel-control-next{
    width: 56px;
    height: 56px;
    background: white;
    border: 1px solid #E5E5E5;
    box-sizing: border-box;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.05);
    opacity: 1;
    bottom: 28px;
    top: unset;

}
.content-gallery .carousel-control-prev .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}

.content-gallery .carousel-control-next .carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.content-gallery .carousel-control-prev:hover, .content-gallery .carousel-control-next:hover{ background: var(--colorTurquoise);}
.content-gallery .carousel-control-prev:hover .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}

.content-gallery .carousel-control-next:hover .carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}


.content-banner{ }
.content-banner .content-banner-img-wrapper{ position: relative; width: 100%; height: 100%;}
.content-banner .content-banner-img-wrapper .main-img{ position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);  }

.content-banner-img-wrapper .elements{
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: visible;
}
.content-banner-img-wrapper .elements:before {
    content: "";
    width: 100%; height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.content-banner-img-wrapper .elements.e10  { right: 12%; bottom: -24px;}
.content-banner-img-wrapper .elements.e10:before {
    background-position: right bottom ;
    background-repeat: no-repeat;
    background-size: 80px 80px;
}
.content-banner-img-wrapper .elements.e10.art-color-lime-green:before { background-image: var(--elements-10-LimeGreen); }

.content-banner-img-wrapper .elements.e4  { z-index: 0; left: 12%; bottom: 0;}
.content-banner-img-wrapper .elements.e4:before {
    background-position: left bottom ;
    background-repeat: no-repeat;
    background-size: auto 100%;
}
.content-banner-img-wrapper .elements.e4.art-color-turquoise:before { background-image: var(--elements-4-Turquoise);}

.course-widgets{}
.course-widgets .course-widgets-table-wrapper{  }
.course-widgets .course-widgets-table-wrapper .row{ }
.course-widgets .course-widgets-table-wrapper .body-text-2{line-height: 16px;/* white-space: nowrap*/}
.course-widgets .course-widgets-table-wrapper i{ font-size: 16px; line-height: 16px }
.course-widgets.on-header{
    position: absolute;
    top: 0;
    right: 0;
    background: white;
    width: 100%;
    max-width: 380px;
}
*[dir="rtl"] .course-widgets.on-header{left: 0; right: auto;}

header .content-detail{ position: relative}

.content-detail ul ,
.content-detail ol {}
.content-detail ul li,
.content-detail ol li{
    font-family: var(--mainFontN);
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 27px;
    padding-bottom: 16px;
    position: relative;
    padding-left: 24px;

}
*[dir="rtl"] .content-detail ul li,
*[dir="rtl"] .content-detail ol li{ padding-left: inherit; padding-right: 24px;}
.content-detail ul li:last-child,
.content-detail ol li:last-child{padding-bottom: 0;}
.content-detail ol { counter-reset: li;}
.content-detail ol li{ counter-increment: li;}
.content-detail ol li::before {
    font-family: var(--mainFont);
    content: counter(li)".";
    color: var(--colorTurquoise);
    position: absolute;
    display: inline-block; width: 1em; margin-left: -24px
}
*[dir="rtl"] .content-detail ol li::before { margin-right: -24px; margin-left: inherit }
.content-detail ul li::before {
    content: " "; border-radius:50%; color: var(--colorTurquoise); background: var(--colorTurquoise);
    display: inline-block; width: 8px; height: 8px;
    position: absolute; top: 8px;
    margin-left: -24px;
}
.content-detail ul li::before{}
*[dir="rtl"] .content-detail ul li::before { margin-right: -24px; margin-left: inherit; }
.content-detail ul.small li::before {width: 5px; top: 10px; height: 5px;  margin-left: -24px; }
*[dir="rtl"] .content-detail ul.small li::before { margin-right: -24px; margin-left: inherit; }
.content-detail ul.check li::before ,
.content-detail .check li::before {
    content:"\f00c";
    background: none !important;
    font-size: 12px;
    line-height: 8px;
    font-family: 'Font Awesome 5 Free';}
.content-detail ol.round li{padding-left: 64px; min-height: 48px; }
*[dir="rtl"] .content-detail ol.round li{padding-right: 64px; padding-left:inherit; }
.content-detail ol.round li::before { content: counter(li) ; width: 44px; height: 44px;  margin-left: -64px; background: var(--colorDarkGreen); border-radius: 50%; color: white; display: flex; justify-content: center; align-items: center}
*[dir="rtl"] .content-detail ol.round li::before { margin-right: -64px; margin-left: inherit;}
.content-detail ul.black li::before {background: var(--colorBlack); color: var(--colorBlack);}
.content-detail ol.black li::before { color: var(--colorBlack);}
.content-detail ul.lime-green li::before ,
.content-detail .lime-green li::before {background: var(--colorLimeGreen); color: var(--colorLimeGreen);}
.content-detail .lime-green li::before ,
.content-detail ol.lime-green li::before { color: var(--colorLimeGreen);}
.content-detail .body-text-img{ width: 375px; height: 245px; object-fit: cover; border-radius: 5px; float: left; }
*[dir="rtl"] .content-detail .body-text-img{ float: right;}

.content-detail .links-bar-wrapper{color: var(--colorDarkGreen); font-family: var(--mainFontN); font-weight: 600; font-size: 18px; line-height: 27px;}
.content-detail .links-bar-wrapper a{ text-decoration: none; color: var(--colorDarkGreen); margin-right: 8px; font-weight: 600;}
.content-detail .links-bar-wrapper a .fa,
.content-detail .links-bar-wrapper a .far,
.content-detail .links-bar-wrapper a .fas{ text-decoration: none; color: var(--colorLimeGreen); margin: 0 8px}
.content-detail .links-bar-wrapper a .fa.fa-grip-lines-vertical{ margin: 0 8px 0 0;}
*[dir="rtl"] .content-detail .links-bar-wrapper a .fa.fa-grip-lines-vertical{ margin: 0 0 0 8px;}

.content-detail .nav-links-bar-wrapper{ display: flex; justify-content: space-between; align-items: center}
.content-detail .nav-links-bar-wrapper .tags-wrapper .label{ font-family: var(--mainFontN); font-weight: bold; font-size: 14px; color: var(--colorDarkGreen); font-style: italic}
.content-detail .nav-links-bar-wrapper .tags-wrapper a{
    font-family: var(--mainFontN);
    font-style: italic;
    font-weight: normal;
    font-size: 12px;
    text-decoration: none;
    padding: 0 4px;
}
.content-detail .nav-links-bar-wrapper .btns-wrapper{
    display: flex;
    justify-content: space-between;
    align-items: center
}
.content-detail .nav-links-bar-wrapper .btns-wrapper .btn { width: fit-content; padding: 0 16px;}
.content-detail .nav-links-bar-wrapper .btns-wrapper .btn i{ margin: 0 8px;}
.content-detail .nav-links-bar-wrapper .btns-wrapper .label{ /*padding:0 16px 0 0;*/}
*[dir="rtl"] .content-detail .nav-links-bar-wrapper .btns-wrapper .label{  /*padding: 0 0 0 16px;*/}

.content-detail .nav-links-bar-wrapper .tags-wrapper.partners-logo{display: flex; flex-flow: wrap;}
.content-detail .nav-links-bar-wrapper .tags-wrapper.partners-logo .body-text-2 { width: 100%;}
.content-detail .nav-links-bar-wrapper .tags-wrapper.partners-logo img{ height: 32px;  margin-bottom: 12px; }

.content-detail .img-container{ display: flex; grid-gap: 60px; justify-content: center; align-items: center}
.content-detail .img-container img{ border-radius: 5px; width: 550px; height: 380px; object-fit: cover;}
.content-detail .img-container.full-wd img{ border-radius: 5px; width: 100%; height: 380px; object-fit: cover;}
/*.img-container-contain{ display: flex; grid-gap: 0; justify-content: center; align-items: center}*/
.img-container-contain img{ border-radius: 5px; width: 100%; height: 380px; object-fit: contain;}

.video-container-wrapper{
    position: relative;
    height: 470px;
}
.video-container-wrapper .img-container {    grid-gap: 0;  width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1;}
.video-container-wrapper .img-container ,
.content-detail .video-container-wrapper .img-container img{ height: 100%;}
.video-container-wrapper .play{ position: absolute; top:calc(50% - 40px); left: calc(50% - 40px); z-index: 2;}

.video-container-wrapper iframe{ width: 100%; height: 100%; border-radius: 5px}

.content-detail .inner-banner{
    height: 500px;
    background: no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    border-radius: 5px;
    color: white;
    display: flex;
    flex-flow: row wrap;
    align-items: flex-end;
    position: relative;
}
.content-detail .inner-banner:before{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    background: rgba(var(--rgbColorBlack) / 0.5);
    width: 100%;
    height: 100%;
    z-index: 0;
}
.content-detail .inner-banner .inner-banner-content{ max-width: 650px; position: relative}
.content-detail .inner-banner .inner-banner-content h2{ color: white; padding-bottom: var( --space); text-decoration: none}
.content-detail .inner-banner .inner-banner-content a { text-decoration: none}
.content-detail .inner-banner .inner-banner-content a:hover { text-decoration: none}
.content-detail .inner-banner .inner-banner-content a:hover h2{ color: var(--colorTurquoise);}
.content-detail .inner-banner .inner-banner-content p{ color: white; padding-bottom: var( --space)}
.content-detail .inner-banner .inner-banner-content .bottom-links-wrapper{ display: flex; justify-content: flex-start; line-height: 24px;}
.content-detail .inner-banner .inner-banner-content .bottom-links-wrapper a{ color: white; text-decoration: none}
.content-detail .inner-banner .inner-banner-content .bottom-links-wrapper a:hover{color: var(--colorTurquoise); text-decoration: none}
.content-detail .inner-banner .inner-banner-content .bottom-links-wrapper .icon-link a:hover i{
    font-family: 'Font Awesome 5 Free', serif; font-weight: 400;}
.content-detail .inner-banner .inner-banner-content .time-label{
    width: fit-content;
    height: 24px;
    padding: 0 8px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    color: var(--colorDarkGreen);
}
.content-detail .inner-banner .inner-banner-content .time-label i{ font-size: 14px;}
.content-detail .inner-banner .inner-banner-content .time-label span{  padding: 0 8px;
    font-size: 12px;
    display: inline-flex;
}
.content-detail .inner-banner .inner-banner-content .badges-icon{
    width: 24px;
    height: 24px;
    background: var(--colorTurquoise);
    border-radius: 50%;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}
.content-detail .sign-up-alert-box-wrapper{
    margin-top: -24px;
    border: 1px solid #000000;
    padding: 24px;
    /*box-shadow: 0 -5px 12px -5px #333;*/
    position: relative;
    text-align: center;
}
.content-detail .sign-up-alert-box-wrapper:before{ content: "" ; height: 53px; width: 100%;
    background: url("../images/trasparent-line.png");
    position: absolute;
    top: -55px;
    left: 0;
}
.content-detail .sign-up-alert-box-wrapper a{text-decoration: none}

.content-detail .podcast-about-wrapper{
    display: flex;
    max-width: 1010px;
    margin: auto;
}
.content-detail .podcast-about-wrapper .podcast-about-image{ width: 400px; height: 400px}
.content-detail .podcast-about-wrapper .podcast-about-image img{ width: 400px; border-radius: 5px;
    height: 100%; object-fit: cover}
.accordion{margin: auto}
.accordion .accordion-button{ line-height: 27px;  color: black}
*[dir="rtl"] .accordion .accordion-button{ text-align: right;}
.accordion .accordion-button a{ text-decoration: none; color: black}

.podcast-element{position: relative; overflow: hidden;}
.podcast-element:before,
.podcast-element:after{
    content: "";
    position: absolute;
    top: 100px;
    height: 40px;
    width: 300px;
    background: var(--heading-elements-7-lightGray);
    background-size: auto 100%;
    background-repeat: no-repeat;
}
.podcast-element:before{ left: -115px; transform: translateY(-50%) rotate(180deg); background-position: left; }
.podcast-element:after{ right: -115px; transform: translateY(-50%); background-position: right;}

.podcast-content-wrapper { background: white;}
.podcast-content-wrapper .accordion{max-width: 800px; }

.apple-podcast{}
.apple-podcast .apple-podcast-wrapper{ display: flex; height: 180px; margin: 0 auto; box-sizing: border-box;}
.apple-podcast .apple-podcast-wrapper .apple-podcast-img{
    width: 180px;
    height: 180px;
}
.apple-podcast .apple-podcast-wrapper .apple-podcast-img img{
    height: 100%;
    width: 100%;
    object-fit: cover;
    display: block;
    border-radius: 5px;
}
.apple-podcast .apple-podcast-wrapper .apple-podcast-content{
    font-family: var(--mainFontN);
    max-width: 76%;
}
.apple-podcast .apple-podcast-wrapper .apple-podcast-content .apple-podcast-date{
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 15px;
    text-transform: uppercase;
    color: #898A8D;
}
.apple-podcast .apple-podcast-wrapper .apple-podcast-content .apple-podcast-heading{
    font-weight: 600;
    font-size: 18px;
    line-height: 20px;
    color: var(--colorDarkGreen);
}
.apple-podcast .apple-podcast-wrapper .apple-podcast-content .apple-podcast-info{
    font-size: 16px;
    line-height: 20px;
    color: #898A8D;
}


.apple-podcast .apple-podcast-wrapper .apple-podcast-content .nav-links-bar-wrapper{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.apple-podcast .apple-podcast-wrapper .apple-podcast-content .nav-links-bar-wrapper .btns-wrapper{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.apple-podcast .apple-podcast-wrapper .apple-podcast-content .nav-links-bar-wrapper .btns-wrapper .btn{
    width: fit-content;
    padding: 0 16px;
}
.apple-podcast .apple-podcast-wrapper .apple-podcast-content .nav-links-bar-wrapper .btns-wrapper .btn i{margin: 0 8px;}
.apple-podcast .apple-podcast-wrapper .apple-podcast-content .nav-links-bar-wrapper .btns-wrapper .btn{ font-weight: 500; font-family: var(--mainFontN)}

.accordion{

}
.accordion .accordion-item{
    background: white;
    border: 0 solid rgba(var(--rgbColorGrey) / 0.25);
    box-sizing: border-box;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
    border-radius: 5px;
    margin: 16px 0;
}
.accordion .accordion-item:first-of-type{}

.accordion .podcast-player-wrapper{ max-width: 100%; background: none; border:none; box-shadow:none;}

.accordion .accordion-button{border-radius: 5px; padding: 24px; font-size: 18px; font-weight: 600; border: 0 solid rgba(var(--rgbColorGrey) / 0.25); font-family: var(--mainFontN); background-color:white;}
.accordion .accordion-button:not(.collapsed){ font-size: 18px; border: 0 solid rgba(var(--rgbColorGrey) / 0.25); font-weight: 600; box-shadow : none; color: var(--colorDarkGreen); font-family: var(--mainFontN)}

.accordion .accordion-body{ background: #F7F7F9}

.accordion-button::after{ background-color: var(--colorTurquoise); border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-position: center center;
    background-size: 14px auto ;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
*[dir="rtl"] .accordion-button::after{ margin-left: unset; margin-right: auto;}
.accordion-button:not(.collapsed)::after{ background-color: var(--colorDarkGreen); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")}
.faq .accordion-button:not(.collapsed)::after{ background-color: var(--colorLimeGreen); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")}

.accordion-course-outline{}
.accordion-course-outline .accordion-header{ cursor: pointer}
.accordion-course-outline .accordion-header [aria-expanded="true"] .wrapper-border-box { border-radius: 5px 5px 0 0 ; }
.accordion-course-outline .accordion-header .wrapper-border-box { position: relative; }
.accordion-course-outline .accordion-header .wrapper-border-box::after{ content: ""; background-color: var(--colorDarkGreen);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); background-repeat: no-repeat;
    background-size: 14px auto; background-position: center center;
    width: 24px;
    height: 24px; position: absolute; right:16px; top: 50%; transform: translateY(-50%); border-radius: 50%; display: flex; justify-content: center; align-items: center; }
.accordion-course-outline .accordion-header [aria-expanded="true"] .wrapper-border-box::after{
    background-color: var(--colorTurquoise);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); top: 50%; transform: rotate(-180deg) translateY(50%);  }
*[dir="rtl"] .accordion-course-outline .accordion-header .wrapper-border-box::after{ left: 16px; right: auto}
    /*.accordion-course-outline .accordion-header .collapsed .wrapper-border-box { border-radius: 5px 5px 5px 5px ;}*/
.accordion-course-outline .accordion-header .col-1{ padding: 0 0}
.accordion-course-outline .accordion-header .img-container{ width: 72px}
.accordion-course-outline .accordion-collapse .wrapper-border-box{
    border-top: 0;
    border-radius: 0 0 5px 5px;
}
.accordion-course-outline .accordion-item{
    background: none;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0.05);
    border-radius: 0;
}

.podcast-player-wrapper{
    max-width: 800px;
    height: 180px;
    margin: 0 auto;
    background: white;
    border: 1px solid rgba(var(--rgbColorGrey) / 0.25);
    box-sizing: border-box;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
    border-radius: 5px;
    position: relative;
    display: flex;
}
.podcast-img{
    width: 180px;
    height: 100%;
}
.podcast-img img{
    height: 100%;
    width: 100%;
    object-fit: cover;
    display: block;
    border-radius: 0 0 0 0;
}
.podcast-player-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.podcast-player-controls .btn{ width: calc(var(--space ) * 6); height: calc(var(--space ) * 6); box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);}
.podcast-player-controls .progress-bar{
    background: rgba(137, 138, 141, 0.15);
    height: 4px;
    width: 380px;
}

.podcast-player-controls .progress-bar .progress-buffer{ height: 4px; background: var(--colorTurquoise);}
.podcast-player-controls .volume{ width: 140px; display: flex; align-items: center; justify-content: flex-start;}
.podcast-player-controls .volume .progress-bar{width: 110px;}

.podcast-player-controls .progress-bar .progress-buffer{     color: rgba(193,200,209,.6);}

.podcast-player-video{}

.podcast-player-video .podcast-player-wrapper{
    max-width: 680px;
    height: 460px;
    margin: 0 auto;
    background: white;
    border: 1px solid rgba(var(--rgbColorGrey) / 0.25);
    box-sizing: border-box;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
    border-radius: 5px;
    position: relative;
}
.podcast-player-video .podcast-img{ width: 100%; height: 100%; border-radius: 5px;}
.podcast-player-video .podcast-img img{ border-radius: 5px;}
.podcast-player-video .podcast-player-controls{ position: absolute; bottom: 32px; left: calc(50% - 274px); color: white }
.podcast-player-video .podcast-player-controls .progress-bar{ background: rgba(137, 138, 141, 0.55); }

.author-info-block-wrapper{
    border-top: 1px solid var(--colorGrey);
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
}
.author-info-block-wrapper.large{border-top: 0;}
.author-info-block-wrapper .author-img{ background: var(--colorDarkGreen); width: 70px; height: 70px; border-radius: 50%;}
.author-info-block-wrapper.large .author-img{ width: 124px; height: 124px;}
.author-info-block-wrapper .author-img img{ border-radius: 50%; width: 100%; height: 100%; object-fit: cover}
.author-info-block-wrapper .social { font-size: 22px; display: flex }
.author-info-block-wrapper .social a{ margin-right: 8px; margin-top: -12px;}
.author-info-block-wrapper .social a:hover i,
.author-info-block-wrapper .social a.active i{ font-family: "Font Awesome 5 Free", serif; font-weight: normal}

.label-tags-wrapper{ display: flex; flex-flow: wrap}
.label-tags-wrapper .label-tag{
    width: fit-content;
    padding: 8px 16px 7px 16px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--colorTurquoise);
    color: white;
    margin-right: 8px;
    margin-bottom: 8px;
    text-decoration: none;
}
.label-tags-wrapper .label-tag.gray{background: #F4F4F4; color: var(--colorDarkGreen);}
.label-tags-wrapper a:hover.label-tag{ background: var(--colorDarkGreen); color: white;}
.label-tags-wrapper .label-tag span{
    font-size: 16px;
    display: inline-flex;
    font-family: var(--mainFont);
    font-weight: 500;
}
.label-tags-wrapper .label-tag .close{
    background: white;
    display: flex;
    width: 16px;
    height: 16px;
    color: var(--colorTurquoise);;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin: 0 0 0 8px;
    cursor: pointer;
}
*[dir="rtl"] .label-tags-wrapper .label-tag .close{ margin: 0 8px 0 0;}
.label-tags-wrapper .label-tag .close:hover{background: var(--colorDarkGreen); color: white;}

.label-tags-wrapper .label-tag i + span{padding: 2px 8px 0 8px;}
.icontest{ font-size: 44px; line-height: normal; border: 1px solid var(--colorBlue); /*height: 54px;*/    }

.icontest .far:hover{ font-weight: normal}
.icontest .fab:hover{ font-family: "Font Awesome 5 Free", serif; font-weight: normal}

.user2-info-wrapper{ }
.user2-info-wrapper .user2-info-img-wrapper {background: var(--elements-4-Turquoise);}
.user2-info-wrapper .user2-info-img-wrapper img{
    border-radius: 0;
    width: 100%;
}

.two-col-content{
    display: grid;
    justify-content: start;
    align-items: stretch;
    /* grid-template-columns: repeat(3, 1fr); */
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    grid-gap: 32px;
}
.two-col-content.col-auto{ grid-template-columns: auto auto auto auto;}
.two-col-content .col-left{ grid-column-start: span 1; width: 380px; position: relative}
.two-col-content .col-center{ grid-column-start: span 3;}
.two-col-content .span2{ grid-column-start: span 2;}
.two-col-content .col-center .articles-listing-wrapper{ grid-template-columns: repeat(auto-fill, 280px);}
.two-col-content .span-2{ grid-column-start: span 2;}
   /* grid-template-columns: repeat( auto-fit, minmax(280px, 1fr) );
}*/

.fc-theme-standard{
    background: white;
    border: 1px solid rgba(var(--rgbColorGrey) / 0.25);
    box-sizing: border-box;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
    border-radius: 5px;
    gap:0;
}
.fc .fc-toolbar{justify-content: flex-start !important;}
.fc .fc-toolbar.fc-header-toolbar{ margin-bottom: 0 !important; padding: 24px 32px;}
.fc .fc-toolbar-title{padding: 4px 16px 0 16px; font-size: 28px; font-family: var(--mainFont);}
.fc .fc-button-group > .fc-button{
    width: 56px;
    height: 56px;
    background: white;
    border: 1px solid #E5E5E5;
    box-sizing: border-box;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.05);
    border-radius: 50% !important;
    margin: 0 8px;
    cursor: pointer;
}
.fc-popover-body .fc-daygrid-event-harness .fc-daygrid-event{ border-radius: 0; margin-right: 0 !important; margin-left: 0 !important;}
.insight-nologin{ height: 100vh; overflow: hidden}
.insight-nologin .sign-up-alert-box-wrapper{
    position: sticky;
    text-align: center;
    bottom: 0;
    /*transform: translatey(-50%);*/
    background: #fafafa;
}
.insight-nologin .top-nav-bar-wrapper,
.insight-nologin .links-bar-wrapper,
.insight-nologin .nav-links-bar-wrapper,
.insight-nologin .subscribe ,
.insight-nologin footer { pointer-events: none}

.fc .fc-h-event, .fc .fc-event{background: var(--colorTurquoise); border: 1px solid var(--colorTurquoise); height: 44px; border-radius: 5px; padding: 4px 8px;
    font-family: var(--mainFontN);
    font-size: 12px;
    line-height: 150%;
    font-style: normal;
    font-weight: 400;
}
.fc .fc-h-event:hover, .fc .fc-event:hover{background: var(--colorTurquoise); border: 1px solid var(--colorTurquoise); height: 44px; border-radius: 5px; padding: 4px 8px;}
.fc .fc-button .fc-icon{color: var(--colorDarkGreen);cursor: pointer;}
.fc .fc-button-group > .fc-button:hover{background: var(--colorTurquoise);border: 1px solid var(--colorTurquoise); box-shadow: 0 0 8px rgba(0, 0, 0, 0.05);}
.fc .fc-button-group > .fc-button:hover .fc-icon,.fc .fc-button .fc-icon:hover{ color: white}
.fc .fc-col-header-cell{padding: 4px;}
.fc .fc-col-header-cell-cushion{ color: var(--colorDarkGreen); text-decoration: none; cursor: pointer; font-family: var(--mainFontN); font-size: 14px}
.fc .fc-col-header-cell-cushion:hover{ color: var(--colorLimeGreen);}
.fc .fc-daygrid-day.fc-day-today{background-color: rgba(var(--rgbColorTurquoise) / 0.15) !important; }
.fc .fc-daygrid-day-top{flex-direction: row; padding: 8px 8px 0 8px;}
.fc .fc-daygrid-day-frame{background: rgba(var(--rgbColorGrey) / 0.05);}
.fc-daygrid-day-number{ text-decoration: none; color: var(--colorGrey); cursor: pointer; font-family: var(--mainFontN); font-size: 14px}
.fc-daygrid-day-number:hover{ color: var(--colorLimeGreen);}
.fc-theme-standard td {height: 120px;}
.fc-event .fc-event-main{ height: 100%; display: flex; align-items: center}
.fc-daygrid-day-bottom{ }

.fc .fc-daygrid-more-link{
    color: #121212; font-family: var(--mainFontN);
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 150%;
    background: #E5E5E5; border-radius: 5px;
    padding: 4px 8px;
    width: 100%;
    display: block;
    text-decoration: none;
}
.fc .fc-list-event-dot{ border-color: var(--colorTurquoise) !important;}

.fc-h-event .fc-event-main{ font-family: var(--mainFontN); font-size: 12px; line-height: 150%; font-style: normal; font-weight: 400; }
*[dir="rtl"] .fc-event .fc-event-main{justify-content: end; text-align: right}
*[dir="rtl"] .fc .fc-h-event, *[dir="rtl"] .fc .fc-event{justify-content: end; text-align: right}
*[dir="rtl"] a.fc-daygrid-more-link.fc-more-link{    text-align: right; padding: 13px 8px 0 0 ;}
.fc .fc-header-toolbar .fc-toolbar-chunk:last-child { margin-left: auto; }
.fc .fc-header-toolbar .fc-toolbar-chunk:last-child .fc-button-group{  }
.fc .fc-header-toolbar .fc-toolbar-chunk:last-child .fc-button-group > .fc-button{ color: var(--colorDarkGreen); border-radius: 0 !important; width: fit-content; margin: 0 0;}
.fc .fc-header-toolbar .fc-toolbar-chunk:last-child .fc-button-group > .fc-button.fc-button-active{ color: white; border-color:var(--colorTurquoise) ; background: var(--colorTurquoise);}
.fc .fc-header-toolbar .fc-toolbar-chunk:last-child .fc-button-group > .fc-button:hover{ color: white; background: var(--colorTurquoise);}
.fc .fc-header-toolbar .fc-toolbar-chunk:last-child .fc-button-group > .fc-button:first-child{border-radius: 5px 0 0 5px !important}
.fc .fc-header-toolbar .fc-toolbar-chunk:last-child .fc-button-group > .fc-button:last-child { border-radius: 0 5px 5px 0 !important}

.two-col-content .col-center .articles-listing-wrapper{}
.white-content-box{
    max-width: 100%;
    min-height: 120px;
    margin: 0 auto;
    background: white;
    border: 1px solid rgba(var(--rgbColorGrey) / 0.25);
    box-sizing: border-box;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
    border-radius: 5px;
    position: relative;
}
.two-col-content .col-left .author-box .social{ font-size: 24px}
.two-col-content .col-left .author-box .social a{ margin-right: 8px;}
*[dir="rtl"] .two-col-content .col-left .author-box .social a{ margin-left: 8px; margin-right: inherit;}
.two-col-content .col-left .author-box .social a:hover i, .autor-box .social a.active i{    font-family: "Font Awesome 5 Free", serif; font-weight: normal;}

.contact-us{ font-size: 24px}
.contact-us .social a{ margin-right: 8px;}
*[dir="rtl"] .contact-us .social a{ margin-left: 8px; margin-right: inherit;}
.contact-us .social a:hover i, .autor-box .social a.active i{    font-family: "Font Awesome 5 Free", serif; font-weight: normal;}


.application-form-box-wrapper{
    margin-top: -64px !important;
    position: relative;
    max-width: 1000px;
    box-shadow: 0 0 12px rgb(var(--rgbColorBlack) / 5%);
    background: white;
}

.application-form-box-wrapper.gray-box h3, .application-form-box-wrapper.gray-box p{ padding: 0 0 0 0;}

.application-form-box-wrapper.gray-box h3, .application-form-box-wrapper.gray-box p{ padding: 0 0 0 0;}
.application-form-box-wrapper .umbraco-forms-field{ padding: 8px 0;}
.application-form-box-wrapper .radiobuttonlist{ display: flex; padding-top: 8px; flex-flow: row wrap;}
.application-form-box-wrapper .radiobuttonlist .form-check{ padding-left: inherit; padding-right: 1.5em;}
*[dir="rtl"] .application-form-box-wrapper .radiobuttonlist .form-check{ padding-left: 1.5em; padding-right: inherit;}

.application-form-box-wrapper .checkboxlist{
    display: grid;
    grid-template-columns: repeat( auto-fit, minmax(160px, 1fr));}

.umbraco-forms-caption{ font-size: 18px; font-weight: 400; font-family:var(--mainFont);color: var(--colorDarkGreen);}
.umbraco-forms-container label {
    font-size: 14px;
    line-height: 16px;
    color: var(--colorDarkGreen);
    padding-bottom: 8px;
    width: 100%;
}
.umbraco-forms-container label .umbracoForms-Indicator { color: var(--colorPeach)}

.umbraco-forms-field-wrapper .datepickerfieldshadow,
.umbraco-forms-field-wrapper .form-control {
    height: 48px;
    color: var(--colorDarkGreen);
    border-radius: 5px;
    font-size: 16px;
    font-family: var(--mainFontN);
    font-weight: normal;
}
.umbraco-forms-field-wrapper textarea.form-control{ min-height: 120px;}
.umbraco-forms-field-wrapper .field-validation-valid{ font-size: 16px; color: var(--colorTurquoise); font-family: var(--mainFontN)}
.umbraco-forms-field-wrapper .field-validation-error{ font-size: 16px; color: var(--colorPeach); font-family: var(--mainFontN)}
.contact-us .btn-wrapper{ padding-top: 16px}

.umbraco-forms-field-wrapper select.form-control{    height: 48px;
    color: var(--colorDarkGreen);
    border-radius: 5px;
    font-size: 16px;
    font-family: var(--mainFontN);
    font-weight: normal;
    background: url(../images/svg/icon-arrow-down-turquoise.svg) no-repeat center right 16px;
    background-size: auto 6px;}
.umbraco-forms-field-wrapper input[type="file"] {
    border-radius: 5px;
    font-size: 16px;
    font-family: var(--mainFontN);
    height: auto;
    border: 0px solid #ced4da;
    background-clip: padding-box;
    display: block;
    overflow: hidden;
    line-height: 32px;
    cursor: pointer;

}
*[dir="rtl"] .umbraco-forms-field-wrapper select.form-control{background: url(../images/svg/icon-arrow-down-turquoise.svg) no-repeat center left 16px;}

.two-col-content .col-left .author-box .author-img {
    background: var(--colorDarkGreen);
    width: 120px;
    height: 120px;
    border-radius: 50%;
    margin-bottom: 24px;
}
.two-col-content .col-left .author-box .author-img img {
    border-radius: 50%;
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.testimonials-slider-wrapper{ height: 510px; width: 100%; position: relative; overflow: hidden; cursor: pointer }
.testimonials-slider-wrapper ul{ /*position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: -17px;
    overflow-y: scroll;*/ }
*[dir="rtl"] .testimonials-slider-wrapper ul{ left: -17px;}
.testimonials-slider-wrapper ul li:first-child{margin-top: 32px;}
.testimonials-slider-wrapper ul li{  background: rgba(var(--rgbColorGrey) / 0.05); min-height: 60px; border-radius:5px; margin-bottom: 24px; padding: 16px 24px   }
.testimonials-slider-wrapper ul li:nth-child(even){ margin-left:33%;  }
.testimonials-slider-wrapper ul li:nth-child(odd){ margin-right:33%;}
.testimonials-slider-wrapper .bottom-links-wrapper{
    display: flex;
    justify-content: space-between;
    padding-top: 16px;
}
.testimonials-slider-wrapper .testimonials-star-wrapper{ font-size: 12px; color: var(--colorGrey)}
.testimonials-slider-wrapper .testimonials-star-wrapper .checked{ color: var(--colorYellow)}
.testimonials-slider-wrapper .author-name{
    font-family: var(--mainFont);
    font-weight: 400;
    font-size: 12px;
}

.subscribe{
    height: 220px;
    width: 100%;
    background: url("../images/1.png");
    color: white;
    border-radius:5px;
    padding: 32px 56px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-flow: column;
    background-size: cover;
}

.subscribe h2{ color: white}
.subscribe p{
    font-family: var(--mainFontN);
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
}
.subscribe .subscribe-form {
    padding-top: 24px;
}
.subscribe .subscribe-form form {
    display: flex;
    flex-flow: row wrap;
    position: relative;
}
.subscribe .subscribe-form .subscribe-input {
    background: none;
    border-radius: 5px;
    border: 1px solid white;
    height: 48px;
    padding: 0 15px;
    font-family: var(--main-font);
    font-size: 14px;
    color: white;
    width: 380px;
}

.subscribe .subscribe-form .btn {
    height: 48px;
    width: fit-content;
    padding: 0 48px;
    outline: none;
    margin: 0 16px;
}

.subscribe.newsletter{  background: white; height: auto; padding: 60px 0; position: relative;}
.subscribe.newsletter .subscribe-content{ position: relative; z-index: 1;}
.subscribe.newsletter .newsletter-img{ height: 100%; margin-right: -16px}
*[dir="rtl"] .subscribe.newsletter .newsletter-img{ height: 100%; margin-left: -16px; margin-right: auto; transform: rotatey(180deg);}
.subscribe.newsletter .newsletter-element{
    position: absolute;
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    height: 100%;
    z-index: 0;
    background: white;
}
.subscribe.newsletter .newsletter-element .right{ height: 50%}

.subscribe.newsletter h2,
.subscribe.newsletter h3,
.subscribe.newsletter p{ color: var(--colorDarkGreen); }

.subscribe .subscribe-form .subscribe-input{border: 1px solid var(--colorDarkGreen); color: var(--colorDarkGreen); font-size: 11px; border-radius: 5px 0 0 5px; border-right: none;}
*[dir="rtl"] .subscribe .subscribe-form .subscribe-input{border-radius: 0 5px 5px 0 ; border-left: none; border-right: 1px solid var(--colorDarkGreen);}

.subscribe .subscribe-form .subscribe-input:invalid {}
.form-control.is-invalid, .was-validated .form-control:invalid{border: 1px solid var(--colorRed); border-right: none ;}
.subscribe .subscribe-form  .invalid-feedback{ position: absolute; bottom: -20px; }
.subscribe .subscribe-form  .success-feedback{ position: absolute; bottom: -20px; color: var(--colorTurquoise); }
.subscribe .subscribe-form .btn{ margin: 0 0; border-radius: 0 5px 5px 0}
*[dir="rtl"] .subscribe .subscribe-form .btn{border-radius: 5px 0 0 5px; }

.from-box-wrapper{
    min-height: 84vh;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    margin: auto;

}

.from-box-wrapper .box-container{
    background: #ffffff;
    box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.05);
    border-radius: 5px;
    width: 100%; max-width: 600px;
}

.from-box-wrapper .heading-wrapper{ display: flex; justify-content: space-between; align-items: flex-start; font-size: 16px; font-family: var(--mainFontN); line-height: 55px;}
.from-box-wrapper form .row{ padding: 0; margin: 0;}
.from-box-wrapper form .row>*{ padding: 0; margin: 0;}

.from-box-wrapper .separator{ width: 100%; background: #ced4da; height: 1px;}
.from-box-wrapper .separator.or{ position: relative}
.from-box-wrapper .separator.or:before{ content: "OR"; position: absolute; left:calc(50% - 16px ); top: calc(50% - 10px ) ; font-size: 16px; color: #ced4da; background: white;
    height: 20px;
    width: 32px;
    display: flex;
    /*align-items: center;*/
    justify-content: center;
}
.form-outline{ font-size: 16px; font-family: var(--mainFontN);
    padding: 8px 0; margin: 0 0 0 0}
.form-outline label{ font-size: 12px; line-height: 10px; color: var(--colorGrey)}
.form-outline .inner-addon{ position: relative;}
.form-outline .inner-addon .form-control{ height: 48px; color: var(--colorDarkGreen);  padding: 0 40px; border-radius: 5px; font-size: 16px; font-family: var(--mainFontN); font-weight: normal;}
.form-outline .inner-addon .form-control::placeholder{ color: var(--colorGrey)}
.form-outline .inner-addon i{ position: absolute;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 16px;
    top: 0;
    font-size: 12px;
    color: var(--colorGrey);
}
.form-outline .inner-addon .opt-input .form-control{ background: rgba(var(--rgbColorGrey ) / 0.15) ; border: none !important;
    height: 82px;
    width: 66px;
    margin: 0 8px;
    font-size: 56px;
    line-height: 82px;
    text-align: center;
    padding: 8px 0 0 0;
    font-family: var(--mainFontN);
    color: var(--colorGrey);
}

.form-control.is-invalid, .was-validated .form-control:invalid{border-color: var(--colorPeach);}
.form-control.is-invalid:focus, .was-validated .form-control:invalid:focus{    border-color: var(--colorPeach);}
.valid-feedback, .invalid-feedback{ font-size: 16px; margin-top: 8px;}
.valid-feedback, .form-outline .inner-addon .valid-feedback i{ color: var(--colorTurquoise)}
.invalid-feedback, .form-outline .inner-addon .invalid-feedback i{ color: var(--colorPeach)}

.was-validated .form-control:invalid, .form-control.is-invalid {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23FF6B63'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23FF6B63' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center right 8px;
}
*[dir="rtl"] .was-validated .form-control:invalid, .form-control.is-invalid {

    background-position: center left 8px;
}

.form-check-input{ width: 16px; height: 16px; border-radius: 2.5px; margin: 0 0 ;  border: 1px solid #ced4da;}
.form-check-input[type=checkbox]{border-radius: 2.5px;}
.form-check-input:checked{
    background-color: var(--colorTurquoise);
    border-color: var(--colorTurquoise);
}
.form-check {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.form-check .form-check-label{ font-size: 16px; color: black; padding: 0 16px; line-height: 18px}
.form-outline .btn{ width: 100%}


*[dir="rtl"] .pre-login-wrapper .separator.or:before{ content: "أو";}
.is-valid ~ .valid-feedback,
.is-valid ~ .valid-tooltip,
.was-validated :valid ~ .row  * .valid-feedback,
.was-validated :valid ~ .valid-tooltip{ display: block}

.is-invalid ~ .invalid-feedback,
.is-invalid ~ .invalid-tooltip,
.was-validated :invalid ~ .row  * .invalid-feedback,
.was-validated :invalid ~ .invalid-tooltip {
    display: block;
}
.form-outline .inner-addon .valid-feedback i,
.form-outline .inner-addon .invalid-feedback i{
    position: relative;
    width: fit-content;
    display: inline;
    margin: 0 0;
}
.form-outline .inner-addon .valid-feedback span,
.form-outline .inner-addon .invalid-feedback span{ padding: 0 8px}
.row.validation { display: none}
.is-valid ~ .row.validation,
.is-invalid ~ .row.validation,
.was-validated :valid ~ .row.validation,
.was-validated :invalid ~ .row.validation{ display: flex}