@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;700&display=swap');
:root {
    --blue: #006eb9;
    --background:#F3FCFF;
    --black:#171717;
    --darkBlack:#000000;
    --cardGrey:#9E9E9E;
}

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;;
}
html, body {
    height:100%;
}

.window-wrap{
	background-color:transparent !important;
}

body {
    margin:0;
    font-family: 'Roboto', sans-serif;
    background-color: #fff;
}
.white-bg{
    background-color: #ffffff !important;
}
.blue-bg{
    /* background-color: #BCEDFE;
    background-image: linear-gradient(281deg, #EEF9FE 0%, #BCEDFE 100%); */
    background-color: #fff;
   /* border: 2px solid #006eb9;*/
    border: 2px solid #000;
}
.blue-bg-light{
    background-color:#F3FCFF
}
.border-rad-8{
    border-radius: 8px !important;
}
.border-rad-4{
    border-radius: 4px !important;
}
.border-rad-0-8{
    border-radius:0px 0px 8px 8px !important;
}
.border-rad-12{
    border-radius: 12px !important;
}

h1, h2, .home>header .title>.heading-group p, section.outside-app h1, h3, h4, h5, h6 {
    font-weight: 300;
    margin: 0;
}

li{
    list-style: none;
    margin: 0;
    padding: 0;
    text-indent: 0;
}

img{
    width: 100%;
}

.category_img_container{
    /* width: 150px;
    height: 150px; */
}

.content-wrapper {
    margin: 0 auto;
}

.content-wrapper {
    margin: 20px auto 0 auto;
    max-width: 1920px;
    /* padding: 0 0 10px; */
    margin-top: 110px;
    background: #f1fbff00 !important;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #5f5f5f33;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #5f5f5f33;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: #5f5f5f33;
}

/* Class room */

.student_name_container{
    margin-top: 150px;
}
.header_student_name{
    font-size: 32px;
    color: var(--blue);
}
.dashboard_content_header{
    color: #030000;
    font-size: 28px;
    font-weight: 500;
}
span.filter{
    margin-left: 5%;
    color: #23A6DA;
}
.filter{
    margin-left: 5%;
    color: #23A6DA;
    display: none
}
.filter>i{
    font-size: 21px;
    cursor: pointer;
}
.dashboard_card_list_container{
    height: 100%;
    /* bottom: 0;
    left: 0;
    right: 0;
    position: fixed; */
}

.card_container_box{
    /* height: 108vh; */
}

.course_card_container{
    width: 100%;
}

.course_card{
    box-shadow: 0px 3px 12px #00000040;
    border-radius: 0px 0px 5px 5px;
    margin-bottom: 30px;
    transition:.5s ease-in-out;
    position: relative;
}

.course_card:hover,.course_container:hover{
    box-shadow: 0px 3px 12px #00000080;
    transform:translateY(-5px) translateX(-5px);
}

.transform0{
    transform: none !important;
}
.card_body{
    background: #fff;
    padding: 40px 40px 10px 40px;  
    display: flex;
    justify-content: space-between;
    border-radius: 5px 5px 0px 0px;
    border: 2px solid #006eb9;
}
.body_timer{
    display: flex;
}
.inline{
    display: inline;
    margin-right: 50px;
}
.inline0{
    display: inline;
}
.ib{
    display: inline-block;
}
.card_body_title{
    text-transform: capitalize;
}
.card_body_desc{
    color: var(--blue);
    text-transform: capitalize;
}
.card_text_grey{
    color: #707070;
}
.card_text_grey_dark{
    color: #918F8F;
}
.card_text_grey_light{
    color: #BDBDBD;
}
.response_counter{
    color:#939398;
}
.grey_2{
    color: #8A8989;
}
.card_black_header{
    color: #3F3F3F;
}
.font_12{
    font-size: 12px;
}
.second_grey_text{
    /* margin-left: 50px; */
}

.card_body_right{
    display: flex;
}

.card_footer{
    background: #006eb9;
    padding: 20px 40px 10px 40px;  
    border-radius: 0px 0px 5px 5px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.card_footer_left{
    flex: 25%;
}
.card_footer_center{
    flex: 25%;
    display: flex;
    justify-content: center;
    color:#fff;
}
.card_footer_right{
    flex: 33%;
    display: flex;
    justify-content: flex-end;
}

.sequence-navigation{
    display: flex;
    width: 100%;
    background-color: #F7FDFF;
    color: #23A6DA;
    box-shadow: 0px 4px 16px #02394E3D;
}
.sequence-navigation .next-btn, .sequence-navigation .previous-btn {
    color: #454545;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.sequence-navigation .btn {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    position: relative;
    font-weight: 400;
    padding: 25px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    white-space: nowrap;
    background-color: transparent;
    border:none;
    outline: none;
    cursor: pointer;
}

.btn>span, .colorBlue{
   /* color: #23A6DA; */
	color: #fff;
}
.sequence-navigation .sequence-navigation-tabs .btn {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
}
.flex-grow-1 {
    -webkit-box-flex: 1!important;
    -ms-flex-positive: 1!important;
    flex-grow: 1!important;
}

.d-flex {
    display: -webkit-box!important;
    display: -ms-flexbox!important;
    display: flex!important;
}
.btn-active{
    background:  linear-gradient(115deg, #DCF2F9 0%, #EFFBFF 100%) 0% 0% no-repeat padding-box;;
    border-bottom: 2px solid #23a6da !important;
}

/* Class room */


/* Search bar */
.search_bar_icon{
    width: 60%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
}

form.search_bar_icon input[type=text] {
    padding: 20px;
    font-size: 17px;
    border: none;
    float: left;
    width: 80%;
    background: #ffffff;
    border-radius:5px 0px 0px 5px;
    box-shadow: 0px 3px 12px #00000040;
    height: 50px;
    outline: none;
    transition: 0.5s ease-in-out;
}

form.search_bar_icon input[type=text]:hover{
    box-shadow: 0px 3px 12px #00000080;
}

form.search_bar_icon input[type=text]:hover > button{
    box-shadow: 0px 3px 12px #00000080;
}
  
form.search_bar_icon button {
    float: left;
    width: 7%;
    padding: 10px;
    background-color:#006eb9;
    /* background-image: linear-gradient(130deg, #00B6FE 10%, #00B6FE 14%, #77DAFD 95%) !important; */
    color: white;
    font-size: 17px;
    border: none;
    cursor: pointer;
    height: 50px;
    border-radius: 0px 5px 5px 0px;
    box-shadow: 0px 3px 12px #00000040;
    max-width: 60px;
}
  
form.search_bar_icon button:hover {
    background: #0b7dda;
}
  
form.search_bar_icon::after {
    content: "";
    clear: both;
    display: table;
}

/* Search bar */


.grey_text{
    color: #B4B1B1;
    font-weight: 300;
}
.underline{
    text-decoration: underline;
}
.curPoint{
    cursor: pointer;
}
/* Header all skills */

.header_back_image{
    background-image: url("/static/indigo/images/header_banner_1.e7afe8aae911.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 350px;
    width: 100%;
    
}

@media (min-width: 750px) {
    .header_back_image { height: 200px; }
}
@media (min-width: 768px) {
    .header_back_image { height: 250px; }
}
@media (min-width: 1024px) {
    .header_back_image { height: 390px; }
}
.header_all_skills{
    /* background-size: 100% 100%;
    background-repeat: no-repeat; */
    /* max-height: 304px; */
    /* height: 385px; */
}
.banner_text{
    font-size: 24px;
    width: 35%;
    text-align: right;
    float: right;
    margin-right: 15%;
}

.learn_type_buttons{
    display: flex;
    justify-content: space-around;
}

.button_below_text{
    font-size: 15px;
    color: #171717;
}
/* Header all skills */


.content_header{
    text-transform: capitalize;
}
.text-left{
    text-align: left;
}
.text-center{
    text-align: center;
}
.text-right{
    text-align: right;
}
.floatRight{
    float: right;
}
.cap{
    text-transform: capitalize;
}

/* Top category */
.category_container{
    display: flex;
    flex: 1 0 calc(25% - 10px);
    flex-wrap: wrap;
}

.category_content{
    min-width: 200px;
    max-width: 260px;
    width: 200px;
    height: 270px;
    position: relative;
    box-shadow: none;
    padding: 0;
    border-width: 1px;
    border-radius: 6px;
    margin-right: 30px;
}

.category_content img{
    transition: 0.5s ease-in-out;
}

.category_content img:hover{
    box-shadow: 0px 3px 12px #00000080;
}
/* Top category */

/* User review */

.banner_front_image{
    background-image: url("/static/indigo/images/footer_banner.31d6645c75ac.png");
}
.banner_stick_bottom{
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 36vh;
    z-index: -1;
    background-repeat: no-repeat;
    background-size: cover;
}

.banner_back_image{
    background-image: url("/static/indigo/images/banner_backgound_flipped.a27d2d143e2b.png");
}
.user_review_content{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-direction: row;
    margin-top: 90px;
    flex: 1 0 calc(25% - 10px);
    background-position: bottom;
    background-size: cover;
    background-repeat: no-repeat;
}
.user_review_card {
    box-shadow: 0px 3px 12px #00000040;
    max-width: 330px;
    text-align: center;
    font-family: arial;
    margin-right: 20px;
    border-radius: 10px;
    transition: 0.5s ease-in-out;
    background-color: #fff;
    min-width: 245px;
}

.user_review_card:hover{
    box-shadow: 0px 3px 12px #00000080;
}
  
.user_reivew_title {
    color: grey;
    font-size: 18px;
}


.quotes{
    color: #c8d13e;
    font-size: 2.5rem;
    text-align: center;
}
.user_review_info{
    background-color: #E3F3F9;
    border-radius: 0px 0px 10px 10px;
    min-height: 302px;
    max-height: 302px;
}

.user_review_info .user_review_content_det{
    /* padding: 0 50px 50px 50px; */
    text-align: justify;
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;  
    overflow: hidden;
}

.user_review_end{
    transform: matrix(-1, 0, 0, -1, 0, 0);
background: transparent linear-gradient(92deg, #FE9EF6 0%, #9FDFF6 100%) 0% 0% no-repeat padding-box;
opacity: 0.65;
}

.img-circle{
    border-radius: 50%;
}
.img-square{
    border-radius: 2px;
    box-shadow: 1px 1px #c7c7c7;
    width: 200px;
    height: 200px;
}

.img_profile{
    width: 130px;
    margin-top: -65px;
}

/* User review */

.notify_header{
    margin: 30px 75px;
    background-color: #00E79B;
    padding: 15px;
    border-radius: 8px;
    color: #3F3F3F;
}

.enroll_container_header{
    /* background: #D3EFF9; */
    padding: 40px 40px 20px 40px;  
    display: flex;
    /* flex-wrap:wrap; */
    flex-direction:row;
    justify-content:flex-start;
    align-items:center;
    border-radius: 5px 5px 0px 0px;
}

.enroll_container_main{
    padding: 10px 40px 10px 40px;  
    display: flex;
    /* flex-wrap:wrap; */
    flex-direction:row;
    justify-content:flex-start;
    align-items:center;
}
.enroll_container_left {order:1;  }

.enroll_container_right {
    display: inline-block;    
    width: 92%; 
    margin-bottom: 20px;
}
.enroll_container_right1{
    min-width: 160px;
    text-align:right;
}
.enroll_container_right_content{
    display: flex;
    /* flex-wrap:wrap; */
    flex-direction:row;
    justify-content:space-between;
    align-items:center;
    gap:10px;
}
.enroll_container_right1>.gf_btn2{
	min-width:125px !important;
}
.expander>i{
    cursor: pointer;
}
.enroll_title{
    display: flex;
    flex-wrap:wrap;
}
.enroll_title>a>h3,.enroll_title>a>span{
	display:inline-block;
}
.studNameContainer_inner{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.gf.gf_expand{
	margin-right:5px !important;
}
.enroll_title>h3{
    font-size: 26px;
    font-weight: 400;
    color: var(--black);
    width: auto;
    /* text-decoration: underline  #D3EFF9; */
    /* --webkit-text-decoration: underline  #D3EFF9; */
}
.progress_text{
    font-size: 12px;
}
.progressbar{
    background-color: #E7E7E7;
    width: 100px;
    border-radius: 15px;
    height: 7px;
    display: inline-block;
    vertical-align: middle;
}
.nested li div h3,.nested li div h4{
   /* color: #00AEEF;*/
	color: #000;
}
.completed_status{
    color: #0DC342;
    font-size: 14px;
}
.skill {
    background-color: #1DBD4C;
    color: white;
    padding: 1%;
    border-radius: 15px;
    height: 100%;
}

.bannerContainer{
    /* max-height: 550px; */
    min-height: 500px;
    padding: 100px;
}
.columns_2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 50px;
    grid-gap: 40px;
}
.column_2{
    display: grid;
    grid-template-columns: 0.3fr 1fr;
    width: 100%;
    grid-gap:20px;
}
.course_left{
    max-width: 310px;
}
.course_image{
    height: 200px;
    width: 300px;
    max-width: 300px;
}
.course_image>img{
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
}

.grid_1_2{
    display: grid;
    grid-template-columns: 0.3fr 1.7fr;
    grid-gap: 30px;
    padding: 0px 40px;
}
.filterHeader{
    padding: 10px 40px;
}
.filterHeaderInner{
    display: none;
}
.optionChk_header>h3{
    text-transform: uppercase;
    color: #7B7B7B;
    font-size: 15px;
}
.sortedCourseList{
    color: #04BBFF;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 16px;
}
.sortedCourseName{
    text-transform: capitalize;
    color: #7B7B7B;
    font-size: 15px;
    margin-top: 5px;
    font-weight: 300;
}
.rightCourseContainer{
    width: 100%;
}
.filterContainer{
    display: block;
} 
.filterContainer.active{
    position: absolute;
    display: block;
    z-index: 10000;
    width: 40%;
    min-width: 250px;
    left: 0;
    top: 75px;
    visibility: visible;
    transition: all 0.5s ease 0s;
    -webkit-transition: all 0.5s ease 0s;
    opacity: 1;
}
.filterContainer.active>div{
    border-radius: 0px !important;
}
.filterContainer.active .filterHeaderInner{
    display: block;
    padding: 10px 20px;
}
.course_desc{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
}
.course_desc>p , .font14{
    font-size: 14px;
}
.font12{
    font-size: 12px;
}
.notStarted{
    color: #00AEEF;
}

.course_rating_container{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
    font-size: 12px;
}
.course_duration,.course_provider{
    font-size: 12px;
}

.star{
    background-image: url("/static/indigo/images/icons/Icon_material-star.02265003c03e.png");
    width: 16px;
    height: 13px;
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
}

.un_star{
    background-image: url("/static/indigo/images/icons/Icon_material-star-border.961d6d817580.png");
    width: 16px;
    height: 13px;
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
}
.level{
    background-image: url("/static/indigo/images/icons/level.5590af66c43f.png");
    width: 10px;
    height: 13px;
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 5px;
}

.course_buttons{
    display: flex;
    justify-content: space-between;
    margin-top: 8vh;
}

.col1 {
    height: 300px;
}
.col2 {
  
}

.col1>img{
    max-width: 400px;
    max-height: 400px;
}

.bg_img{
    height: 100%;
    width: 100%;
}
.bg_upskill{
    background-image: url("/static/indigo/images/upskkill.979dff430de6.png");
    background-repeat: no-repeat;
    background-size: contain;
}
.bg_language{
    background-image: url("/static/indigo/images/languages.ce04ccfee2b0.png");
    background-repeat: no-repeat;
    background-size: contain;
}
.bg_lifefstyle{
    background-image: url("/static/indigo/images/lifestyle.f0602ede3031.png");
    background-repeat: no-repeat;
    background-size: contain;
}


.column_3{
    display: flex;
    justify-content: space-between;
    padding: 10px 60px;
}
.col_3_1{
    display: grid;
    grid-template-columns: 0fr 1fr;
    grid-gap: 15px;
    
}

.icon_holder,.text_holder{
    display: inline-block;
    width: 97%;
}
.icon_holder>i{
    width: 50px;
    height: 50px;
    display: inline-block;
    margin-top: 20%;
}
.icon_space{
    background-image: url("/static/indigo/images/icons/icon_space.ea818c7d240d.png");
    background-repeat: no-repeat;
    background-size: contain;
}
.icon_expert{
    background-image: url("/static/indigo/images/icons/icon_experts.f682e7aed159.png");
    background-repeat: no-repeat;
    background-size: contain;
}
.icon_video{
    background-image: url("/static/indigo/images/icons/icon_video.9137066b4b95.png");
    background-repeat: no-repeat;
    background-size: contain;
}
/*footer{
    background-color: #001118;
    position: static;
    bottom: 0;
    width: 100%;
    height:150px;
}*/

.sub-footer-container .sub-footer ul{
    padding: 0;
}
.noShadow{
    box-shadow: none !important;
}

.banner_ratings{
    display: inline-block;
    margin: 20px;
}
.banner_ratings>i{
    height: 16px;
}

.hero-image {
    background-image: linear-gradient(#043F55A6, #043F55A6), url("/static/indigo/images/programme_mngmt.f9f549b110e2.jpg");
    height: 40%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    margin-top: 74px;
}
  
.hero-text {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
}
  
.banner_btn{
    display: grid;
    grid-template-columns: 1fr 1fr;
    /* align-items: center; */
    grid-gap: 30px;
}
.banner_btn>button{
    width: 100%;
}
.banner_btn>.gf_tertiary1 {
    color: #fff !important;
}
.banner_btn>.gf_btn2  {
    font-size: 14px !important;
}
.course_info_container{
    background-color:#043F55A6;
    max-height: 280px;
    min-height: 75px;
    padding: 10px 100px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    color:white;
    font-weight: 300;
    font-size: 13px;
}
.course_info_container>div{
    /* margin-left: 10%; */
}
.course_container {
    margin: 10px 50px;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 0px 0px 5px 5px;
    margin-bottom: 30px;
    transition: 0.2s ease;
    padding: 50px 80px;
   /* border: 2px solid #006eb9;*/
    border: none;
}

.course_container_right>img{
    height: 100%;
}
.course_container_left>p>span{
    cursor: pointer;
}
.course_container_left>p>span:hover{
    text-decoration: underline;
}

.course_container_grid{
    display: grid;
    grid-template-columns: 1fr 0.3fr;
    grid-gap: 20px;
}
.course_info_container_grid{
    display: grid;
    grid-template-columns: 0.3fr 0.7fr;
    grid-gap: 50px;
}

.course_info_container_grid>div>img{
    height: 100%;
    max-height: 300px;
}

.flexCenter{
    display: flex;
    justify-content: center;
}

.ratings > .star {
    background-image: url("/static/indigo/images/icons/Icon_material-star2.6d1dc9af096d.png") !important;
    width: 30px !important;
    height: 30px !important;
}
.ratings > .un_star{
    background-image: url("/static/indigo/images/icons/Icon_material-star-border2.5f0c16823591.png") !important;
    width: 30px !important;
    height: 30px !important;
}

.user_ratings_reviews_container{
    margin: 30px 100px;
}

.ratings_star{
    display: grid;
    grid-template-columns: 0.9fr 0.8fr 0.3fr;
}
.user_ratings_reviews{
    display: grid;
    grid-template-columns: 0.1fr 1fr;
    grid-gap: 10px;
    margin-top: 40px;
}
.profile_pic{
    width: 80px;
    height: 80px;
    border-radius: 50px;
}
.review_rating{
    margin-top: 5px;
}
.loadMore {
    cursor: pointer;
}

.likeDislike{
    display: flex;
    justify-content: flex-start;
}
.likeDislike>div{
    margin-right: 10px;
}
.loadMore {
    display: flex;
    justify-content: center;
}
.likeCounter{
    font-size: 12px;
    display: block;
    color: #B4B1B1;
    font-weight: 300;
}
.grid_2{
    display: grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr) );
    align-items: start;
}
.sidebyside{
    margin:10px !important;
    padding: 20px 40px !important;
    color:var(--cardGrey);
    display: grid;
    grid-gap: 20px;
}
.enroll_body_data{
    display: grid;
    grid-template-columns: 0.1fr 1.9fr;
    grid-gap: 10px;
    margin-bottom: 30px;
}
.middle_container{
    width: 70%;
    margin: 0 auto;
    letter-spacing: 0.26px;
}
.middle_container>h3{
    margin-left: 10%;
}
.subject_image_container{
    max-width: 400px;
    max-height: 400px;
    margin: 0 auto;
}


#overlay {
    position: fixed; /* Sit on top of the page content */
    display: none; /* Hidden by default */
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5); /* Black background with opacity */
    z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
    cursor: pointer; /* Add a pointer on hover */
}
.filterClose{
    position: absolute;
    right: 0;
    top: 0;
    padding: 10px;
}

.course_card_body {
    background: #D3EFF9;
    padding: 40px 40px 10px 40px;
    
    border-radius: 5px 5px 0px 0px;
}
.header_nav{
    width: 100%;
    margin-bottom: 20px;
}
.chapter_disc{
    flex-basis: 100%;
    display: flex;
    justify-content: space-between;
}
.chapter_disc>h4{
    display: flex;
    gap: 10px;
    cursor: pointer;
}
.course-nav-btns{
    margin:0 auto;
    text-align: center;
    margin-bottom: 30px;
}

.p-mb-gap>p{
    margin-bottom: 20px;
}
.notes-bg{
    background-color: #FFF !important;
}
.tabcontent {
    display: none;
}
.tabcontent {
    animation: fadeEffect 1s; /* Fading effect takes 1 second */
}
@keyframes fadeEffect {
    from {opacity: 0.5; margin-top:-20px}
    to {opacity: 1; }
}

.video_container{
    background-color: #F5F5F5;
    width: 90%;
    margin: 0 auto;
    box-shadow: 0px 3px 6px #00000029;
}
.wrapper-downloads a{
    color: #23A6DA;
}
.wrapper-downloads a:hover{
    text-decoration: underline;
}
.wrapper-download-handouts{
    width: 24%;
}
.rights{
    display: block;
    color: #BDBDBD;
    font-size: 12px;
    text-align: right;
    margin-top: 15px;
    padding:15px;
}
.tc_video{
    display: grid;
    grid-template-columns: 1.5fr 0.5fr;
    gap: 10px;
    max-height: 400px;
}
video{
    width: 100%;
    height: 100%;
    max-height: 400px;
}
.subtitle{
    max-height: 380px;
    overflow-x: auto;
    padding: 5px;
}
.subtitle>p{
    line-height: 25px;
    letter-spacing: 0.26px;
}
.subtitle::-webkit-scrollbar-track
{
	-webkit-box-shadow: none;
	border-radius: 10px;
	background-color: none;
}

.subtitle::-webkit-scrollbar
{
	width: 8px;
	background-color: #F5F5F5;
}

.subtitle::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: none;
	background-color: #04BBFF;
}

.center_container{
    width: 80%;
    margin: 0 auto;
}

.bookmart_card{
    width: 25px;
    height: 25px;
    background-image: url("/static/indigo/images/icons/Icon_bookmark_card.aa180157eafd.svg");
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
    margin-left: 25px;
}
.bookmark_card_container{
    padding: 0px 60px 40px 60px;
    display: grid;
    grid-template-columns: 1.5fr 0.5fr;
    grid-gap: 10px;
    align-items: center;
    justify-content:space-between;
}
.bookmark_card_list>li{
    display: inline-block;
    padding: 5px 0px;
    font-weight: 400;
    font-size: 1.3rem;
}
.bm_seperator{
    width: 15px;
    height: 15px;
    display: inline-block;
    color: #23A6DA;
    margin: 0px 4px;
}
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    padding: 0 1em 0 0;
    margin: 0;
    width: 100px;
    font-family: inherit;
    font-size: inherit;
    cursor: inherit;
    line-height: inherit;
    z-index: 1;
    outline: none;
    color: var(--blue);
}
select::-ms-expand {
    display: none;
}

.select {
    display: grid;
    grid-template-areas: "select";
    align-items: center;
    position: relative;
    min-width: 100px;
    max-width: 100px;
    /* border: 1px solid var(--select-border); */
    border-radius: 0.25em;
    padding: 0.25em 0.5em;
    font-size: 1.25rem;
    cursor: pointer;
    line-height: 1.1;
    color: var(--blue);
    /* background-color: #fff; */
    /* background-image: linear-gradient(to top, #f9f9f9, #fff 33%); */
}

.select.choose-filter{
    font-size:14px !important;
}
.select select, .select::after {
    grid-area: select;
}
.select:not(.select--multiple)::after {
    content: "";
    justify-self: end;
    width: 0.8em;
    height: 0.5em;
    background-color: var(--blue);
    -webkit-clip-path: polygon(100% 0%, 0 0%, 50% 100%);
    clip-path: polygon(100% 0%, 0 0%, 50% 100%);
}

select:focus + .focus {
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    border: 2px solid var(--select-focus);
    border-radius: inherit;
}

select[multiple] {
    padding-right: 0;
  /*
   * Safari will not reveal an option
   * unless the select height has room to 
   * show all of it
   * Firefox and Chrome allow showing 
   * a partial option
   */
    height: 6rem;
  /* 
   * Experimental - styling of selected options
   * in the multiselect
   * Not supported crossbrowser
   */
}
select[multiple] option {
    white-space: normal;
    outline-color: var(--select-focus);
}

.select--disabled {
    cursor: not-allowed;
    background-color: #eee;
    background-image: linear-gradient(to top, #ddd, #eee 33%);
}

label {
    /* font-size: 1.125rem; */
    font-weight: 500;
}

.select + label {
    margin-top: 2rem;
}


/* Footer */
.sub-footer>ul:last-child{
	justify-self: auto;
}
.footer_container{
    /*padding: 30px 50px;*/
    padding: 10px 6% !important;
}
.footer-logo{
    width: 150px;
    height: 40px;
}
.footer-logo>img{
    height: 100%;
    width: 100%;
}
.footer_links{
    padding-left: 12px;
    font-size: 12px;
    margin-top:10px
}
.footer_links>a{
    color: #FDFDFD;
    display: block;
    text-decoration: none;
}
.footer_links>a:nth-child(2){
    margin-top:5px
}

/* Footer */


.blue-hr{
    border-bottom: 1px solid #BCEDFE;
    width: 90%;
    margin: 0 auto;
    margin-bottom: 30px;
}

.profile-visibility-container{
    background-color: #F7FBFC;
    padding: 25px 0px 10px 25px;
    box-shadow: 0px 4px 16px #02394e3d;
}
.profile-visibility-container>div{
    display: flex;
    grid-gap: 20px;
    align-items: center;
}
.profile-visibility-container>div>i{
    max-width: 22px;
}
.thinBorder{
    border:1px solid #B4B1B1;
    padding: 5px;
}
.w150{
    width: 150px !important;
}
.downCap{
    content: "";
    background: url("/static/indigo/images/icons/ionic-md-arrow-dropdown.4ab154e09246.png") no-repeat;
    background-size: contain;
    display: inline-block;
    width: 10px;
    height: 10px;
    position: relative;
    margin-left: -40px;
    width: 15px;
    height: 15px;
    margin-top: 5px;
}
.profile_card_container{
    display: grid;
    grid-template-columns: 0.5fr 1.5fr;
    grid-gap: 40px;
}
.about_me_header{
    display: flex;
    justify-content: space-between;
}

.user_setting_info{
    margin-top:10px;
}
.user_setting_info:not(:last-child){
    border-bottom: 1px solid #e8e7e7;
}
.user_setting_info:last-child{
    
    margin-bottom: 20px;
}
.settings_header{
    text-align: left;
    padding: 10px 30px;
}
.settings_info{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.cert_header {
    padding: 20px;
}
.cert_footer{
    padding: 5px;
}
.cert_1{
    background-image: linear-gradient(112deg,#BCEDFE 0%, #E6F8FF 100%);
}
.cert_2{
    background-image: linear-gradient(112deg,#DFFFEC 0%, #EBFFF3 100%);
}
.cert_3{
    background-image: linear-gradient(112deg,#D8D2F9 0%, #EBE8FC 100%);
}
.cert_4{
    background-image: linear-gradient(112deg,#F9E5D2 0%, #FFF7EF 100%);
}

.pgn-transition-replace-group {
    -webkit-transition: height .3s ease;
    transition: height .3s ease;
    display: none;
}
.position-relative {
    position: relative!important;
}
.w100{
    width: 100% !important;
}
.m400{
    max-width: 400px;
}
.profile_btns{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(50px,100px));
    grid-gap: 10px;
}
.profile_btns>button{
    max-width: 150px;
    min-width: 100px !important;
}
.sideBySide {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(50px,220px));
    grid-gap: 30px;
}
.sideBySide.lg {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(50px,320px));
    grid-gap: 30px;
}
.pgn-transition-replace-group>textarea{
    width: 100%;
    padding: 20px;
    border-radius: 8px;
    transition: 0.5s;
    min-height: 150px;
    font-size: 16px;
    font-family: 'Roboto';
    outline: none;
}
.pgn-transition-replace-group>textarea:hover{
    box-shadow: 0px 4px 16px #00000029;
    border: 1px solid #04BBFF;
    border-radius: 8px;
    outline: none !important;
}

.helpgrid-row .row-item-full .icon,  .helpgrid-row .row-item .icon {
    padding: 0 10px;
    font-size: 24px;
    vertical-align: middle;
    display: table-cell;
}
.helpgrid-row .row-item-full .row-description, .helpgrid-row .row-item .row-description {
    vertical-align: middle;
    display: table-cell;
}
.helpgrid-row-navigation .fa-search ,.fa-envelope{
    color: #dee2e6;
}
.helpgrid-row-navigation .fa-sort {
    color: #dee2e6;
}
.helpgrid-row-participation .fa-plus {
    color: #0D7D4D;
}
.helpgrid-row-participation .fa-flag {
    color: #e83e8c;
}
.helpgrid-row-participation .fa-star {
    color: #00688D;
}
.mail_box{
    display: flex;
    align-items: center;
    gap: 10px;
}
.mail_box>div{
    display: flex;
    align-items: center;
    border: 1px solid #d6d4d4;
    padding: 5px;
}

.side_searchBar>.search_bar_icon {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
}
.side_searchBar>.search_bar_icon>input {
    height: 30px !important;
    max-width: 300px;
}
.side_searchBar>form.search_bar_icon button {
    float: left;
    width: 18%;
    height: 40px;
    max-width: 40px;
}
/* Discussions */

.discussion-body, .discussion-module {
    width: 100%;
    border: none;
    background: transparent;
    box-shadow: none;
}
.discussion-column {
    flex-grow: 1;
    margin-bottom: 20px;
}
aside,main {
    display: block;
}
.flexRight{
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.flexRight>button{
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.add_post{
    border:none;
    outline: none;
    background: none;
    cursor: pointer;
}
.add_post:hover{
    /* box-shadow: 0px 3px 12px #00000080;
    background: transparent; */
}
.add_post>span{
    color: #171717;
    font-size: 16px;
}
.disc_searchBar>.search_bar_icon>input{
    height: 25px !important;
    max-width: 300px;
}
.disc_searchBar>.search_bar_icon>button{
    height: 40px !important;
    max-width: 40px;
}
.whiteFont{
    color:#D3ECEB;
}
.sort_filter_container{
    display: flex;
    justify-content: space-around;
    padding-bottom: 10px;
    border-bottom: 1px solid #2eb4e9;
}
.whiteDrop:not(.select--multiple)::after {
    content: "";
    justify-self: end;
    width: 14px;
    height: 8px;
    background-color: #ffffff !important;
}
.whiteDrop option {
    color:#000000;
}
.side_menu{
    display: flex;
    justify-content: flex-start;
    gap: 10px;
    align-items: center;
}
.side_menu>i{
    color: #F0F0F0;
    cursor: pointer;
}
.side_menu>span{
    color:#FDFDFD;
}

.home-helpgrid {
    border-bottom: none;
    border-radius: 3px;
    border: 1px solid #dee2e6;
    box-shadow: 0 1px 3px rgb(0 0 0 / 15%);
    margin-left: -50px;
}
table {
    border-collapse: collapse;
}
.helpgrid-row {
    border-bottom: 1px solid #dee2e6;
}
.helpgrid-row .row-title {
    background: #F2F0EF;
}
.helpgrid-row .row-title {
    padding: 30px 20px;
    background-color: #dedede;
    font-size: 12px;
}
.helpgrid-row .row-title {
    background: #F2F0EF;
}
th {
    text-align: inherit;
}
.helpgrid-row .row-item {
    font-size: 12px;
    padding: 0 10px;
    width: 26%;
    vertical-align: middle;
}

.forum-nav {
    background-color: #23A6DA;
    z-index: 1;
    position: relative;
}
.forum-nav.opened{
    background-color: #E9F9FF;
    box-shadow: -3px 0px 16px #02394E3D;
}
.shadow{
    box-shadow:2px 4px 4px 0px #02394e3d;
}
.discussion-thread-list-container{
    display: none;
}
.discussion-thread-list-container  .side_menu{
    padding: 20px;
}
.discussion-thread-list-container  .side_menu>i{
    color: #BDBDBD;
}
.discussion-thread-list-container  .side_menu>span{
    color: #BDBDBD;
}
.discussion-thread-list-container .sort_filter_container{
    border:none;
}
.discussion-thread-list-container .whiteDrop:not(.select--multiple)::after{
    background-color: #23A6DA !important;
}
.forum-nav-thread-list {
    padding-left: 0 !important;
    min-height: 60px;
    max-height: 800px;
    border-bottom: 1px solid #E1DDDB;
    margin: 0;
    overflow-y: auto;
    list-style: none;
    border-radius: 0 0 3px 3px;
}
.forum-nav-thread {
    border-bottom: 1px solid #dee2e6;
    /* background-color: #fff; */
    margin-bottom: 0;
}
.forum-nav-thread:hover{
    background-color:#e0f3ff;
}
.forum-nav-thread.never-read{
    border-left: 2px solid #00AEEF;
}
.forum-nav-thread .forum-nav-thread-link.is-active {
    /* background-color: #f5f5f5; */
}
.forum-nav-thread .forum-nav-thread-link {
    border-left: 3px solid transparent;
    display: flex;
    padding: 10px;
    transition: none;
    align-items: center;
    justify-content: space-between;
    color: #414141;
}
.forum-nav-thread-wrapper-0 {
    margin-right: 4px;
    align-self: flex-start;
}
.forum-nav-thread-wrapper-0, .forum-nav-thread-wrapper-1, .forum-nav-thread-wrapper-2 {
    display: inline-block;
    vertical-align: middle;
}
.forum-nav-thread-wrapper-0 .icon {
    font-size: 14px;
    width: 18px;
    text-align: center;
}
.forum-nav-thread-wrapper-1 {
    margin: 0 5px;
    max-width: calc(100% - 75px);
    flex-grow: 1;
}
.forum-nav-thread-title {
    margin-left: 0;
    font-size: 16px;
    display: block;
    color: #0E0E44;
}
.forum-nav-thread-list .thread-preview-body {
    margin-top: 5px;
    color: #A6A6A6;
    font-size: 12px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.forum-nav-thread-wrapper-2 {
    text-align: right;
    min-width: 40px;
    white-space: nowrap;
}
.forum-nav-thread-votes-count, .forum-nav-thread-comments-count {
    margin-right: 5px;
    font-size: 12px;
    display: inline-block;
    text-align: center;
    color: #000;
}
.forum-nav-thread-comments-count {
    position: relative;
    margin-left: 5px;
    margin-bottom: 5px;
    border-radius: 3px;
    padding: 2px 4px;
    min-width: 2em;
    background-color: #E1DDDB;
}
.forum-nav-thread-votes-count, .forum-nav-thread-comments-count {
    margin-right: 5px;
    font-size: 12px;
    display: inline-block;
    text-align: center;
    color: #000;
}
.li_footer_disc{
    display: flex;
    justify-content: space-around;
    gap: 5px;
    color: #BDBDBD;
    margin-top: 10px;
    margin-bottom: 10px;
    /* display: grid;
    grid-template-columns: repeat(auto-fit,minmax(50px,110px) );
    align-items: center;
    color: #BDBDBD;
    margin-bottom: 10px;
    font-size: 10px; */
}
.li_footer_disc>div{
    display: flex;
    align-items: center;
    gap:5px;
    cursor: pointer;
}

.gf_pin ~span{
    color:#BDBDBD;
}
.gf_pin.active ~span{
    color:#FA0000;
}

.gf_follow ~span{
    color:#BDBDBD;
}
.gf_follow.active ~span{
    color:#FCB316;
}


.gf_user ~span{
    color:#00AEEF;
}
.gf_user_ta ~span{
    color:#0DE14B;
}

.forum-content{
    display: none;
}
.usernameSpan{
    color: #0095CC;
    cursor: pointer;
}
.content_grid{
    display: grid;
    grid-template-columns: 1.7fr 0.3fr;
    grid-gap: 15px;
    align-items: center;
}

.post_icons>div{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 5px;
}
.post_icons>div>div>i{
    cursor: pointer;
}
.dropdown {
    float: left;
    overflow: hidden;
}
.dropdown .dropbtn {
    font-size: 16px;  
    border: none;
    outline: none;
    color: white;
    padding: 14px 16px;
    background-color: inherit;
    font-family: inherit;
    margin: 0;
}
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    right: 20px;
}
.dropdown-content a {
    float: none;
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}
.dropdown-content a:hover {
    background-color: #ddd;
}
.dropdown:hover .dropdown-content {
    display: block;
}
.comments_container{
    border: 1px solid #F0F0F0;
}
.comments_container>div{
    
    padding: 30px;
}
.side_bar_nav{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}
.side_bar_nav>.seperator{
    background: url("/static/indigo/images/icons/Icon_ionic-ios-arrow-down.77c4941d232f.svg") no-repeat;
    width: 10px;
    height: 15px;
    margin: 3px 5px;
    background-size: contain;
}
.side_bar_nav>li:first-child>a{
    color: #BDBDBD;
}
.side_bar_nav>li>a{
    color: #23A6DA;
    cursor: pointer;
}
.side_bar_nav>li:not(:first-child)>a:hover{
    text-decoration: underline;
}
.discussion-thread-list-container .side_searchBar{
    padding: 0px 20px;
}
.add_post_btn{
    display: flex;
    justify-content: start;
    grid-gap: 10px;
}
.border-rad-2{
    border-radius: 2px !important;
    max-width: 100px !important;
    min-width: 160px !important;
}


.forum-nav-browse-menu {
    padding-left: 0;
    margin: 0;
    font-size: 14px;
    overflow-y: scroll;
    list-style: none;
    max-height: 60vh;
    color: #FDFDFD;
    font-weight: 400;
}
.forum-nav-browse-menu-item {
    margin-bottom: 0;
    display: list-item;
}
.forum-nav-browse-menu-following .forum-nav-browse-title {
    padding-left: 30px;
}
.forum-nav-browse-title {
    text-align: left;
    display: block;
    width: 100%;
    border: 0;
    border-radius: 0;
    padding: 10px;
    background: transparent;
    box-shadow: none;
    background-image: none;
    cursor: pointer;
}
.forum-nav-browse-title:hover, .forum-nav-browse-title:focus, .forum-nav-browse-title.is-focused {
    background-image: none !important;
    box-shadow: none !important;
    background: #ffffff29 !important;
}
.forum-nav-browse-menu-following .icon {
    float: left;
    left: 10px;
    position: relative;
    top: 11px;
}
.forum-nav-browse-submenu {
    list-style: none;
    margin: 0;
    padding: 0;
}
.forum-nav-browse-submenu li .forum-nav-browse-title {
    padding-left: 20px;
}
.sr-only, .sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    clip-path: inset(50%);
    border: 0;
}
.fa-yellow-star{
    color:#FCE516;
}

.forum-nav-browse-menu::-webkit-scrollbar-track, .forum-nav-thread-list::-webkit-scrollbar-track
{
	-webkit-box-shadow: none;
	border-radius: 10px;
	background-color: none;
}

.forum-nav-browse-menu::-webkit-scrollbar, .forum-nav-thread-list::-webkit-scrollbar
{
	width: 4px;
	background-color: none;
}

.forum-nav-browse-menu::-webkit-scrollbar-thumb, .forum-nav-thread-list::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: none;
	background-color: #04BBFF;
}
/* Discussions */


/* font designs */
.f15{
    font-size: 15px;
}
.padding{
    padding: 30px;
}
.mt0{
    margin-top: 0;;
}
.mcon{
    margin:0px 90px
}
.mtn10{
    margin-top: -10%;
}
.ml10{
    margin-left: 10px;
}
.ml15P{
    margin-left: 15%;
}
.ml40{
    margin-left: 40px;
}
.mt5{
    margin-top:5px ;
}
.mb10{
    margin-bottom: 10px;
}
.mt10{
    margin-top: 10px;
}
.mb20{
    margin-bottom: 20px;
}
.mt20{
    margin-top: 20px;
}
.mt75{
    margin-top: 75px;
}
.mb30{
    margin-bottom: 30px;
}
.mt30{
    margin-top: 30px !important;
}

.mb40{
    margin-bottom: 40px;
}
.mt40{
    margin-top: 40px !important;
}
.mb50{
    margin-bottom: 50px;
}
.mt50{
    margin-top: 50px;
}

.mt100{
    margin-top: 100px;
}
.mb100{
    margin-bottom: 100px;
}
.font200{
    font-weight: 200 !important;
}
.font300{
    font-weight: 300 !important;
}
.font400{
    font-weight: 400 !important;
}
.font500{
    font-weight: 500 !important;
}
.font700{
    font-weight: 700 !important;
}
.fontBold{
    font-weight: bold !important;
}

.p20{
    padding: 20px !important;
}
.p30{
    padding: 30px;
}
.p40{
    padding: 40px;
}
.p50{
    padding: 50px;
}
.p100{
    padding: 100px;
}
.p0{
    padding: 0px !important;
}
.p120{
    padding: 20px 40px;
}
.p020{
    padding: 0px 20px;
}
.p040{
    padding: 0px 40px;
}
.db{
    display: block !important;
}
.w52{
    width: 52%;
    margin: 0 auto;
}
.blue{
    color:var(--blue);
}
.o8{
    opacity: 0.8;
}

hr{
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #E9E6E6;
    margin: 1em 0;
    padding: 0;
}
/* font designs */


/* Remove default bullets */
ul, #myUL {
list-style-type: none;
}
  
/* Remove margins and padding from the parent ul */
#myUL {
    margin: 0;
    padding: 0;
    width: 100%;
}

/* Style the caret/arrow */
.caret {
    cursor: pointer;
    user-select: none; /* Prevent text selection */
}

/* Create the caret/arrow with a unicode, and style it */
.caret::before {

    display: inline-block;
    margin-right: 6px;
}

/* Rotate the caret/arrow icon when clicked on (using JavaScript) */
.caret-down {
    transform: rotate(180deg);
}

/* Hide the nested list */
.nested {
    display: none;
    padding-left: 30px;
}

/* Show the nested list when the user clicks on the caret/arrow (with JavaScript) */
.nested.active {
display: block;
}

.container {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

.learner_grid{
    display: flex;
    flex-wrap: wrap;
    margin-left: -12px;
    margin-right: -12px;
}

._cs3pjta {
    position: relative;
    min-height: 1px;
    width: 100%;
    padding-left: 12px;
    padding-right: 12px;
}
._1pfe6xlx {
    margin-top: 24px;
}
.p-l-2, .p-x-2 {
    padding-left: 1.5rem!important;
}
.p-r-0 {
    padding-right: 0!important;
}
.m-b-2 {
    margin-bottom: 1.5rem!important;
}
.m-r-1 {
    margin-right: 1rem!important;
}
._y1d9czk {
    display: flex;
}
._1dfpihp {
    -webkit-box-align: center;
    -webkit-box-pack: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    /* border: 2px solid rgb(35 166 218); */
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    box-shadow: 0px 3px 12px #ccc;
}
._1tu07i3a {
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    display: flex;
    flex-direction: column;
    justify-content:center;
}

.headline-4-text {
    font-size: 24px;
    line-height: 30px;
}
._1l2q8kho {
    font-size: 2.125rem;
    line-height: 2.625rem;
    font-weight: normal;
    font-family: OpenSans-Light, OpenSans, Arial, sans-serif;
}
.p-b-1s {
    padding-bottom: .5rem!important;
}
.font-sm {
    font-size: .9rem;
}
.p-y-1s {
    padding-top: .5rem!important;
    padding-bottom: .5rem!important;
}
._1qfi0x77 {
    -webkit-box-align: center;
    align-items: center;
    display: flex;
}
.m-x-1 {
    margin-right: 1rem!important;
}
.m-l-1, .m-x-1 {
    margin-left: 1rem!important;
}
.font-md {
    font-size: 1rem;
}
.text-primary {
    color: #363b42;
}
.rc-FinaidLink.reset .finaid-link {
    color: inherit;
}
button.button-link:hover, div.button-link:hover {
    text-decoration: underline;
    color: #004eb6;
}
button.button-link:hover, div.button-link:hover {
    text-decoration: underline;
    color: #004eb6;
}
button.button-link, div.button-link {
    color: #0062e4;
    text-decoration: none;
    cursor: pointer;
}
button.button-link, button.nostyle, div.button-link {
    background: transparent none repeat 0 0 scroll;
    color: rgba(0,0,0,.87);
    border: 0;
    font-size: 1em;
    margin: 0;
    padding: 0;
    text-align: left;
    text-decoration: none;
    text-indent: 0;
    min-width: 0;
}
[type=reset], [type=submit], button, html [type=button] {
    -webkit-appearance: button;
}
.course_info_container span{
    font-size: 16px;
}

.img_fac>img{
    width:90px;
    height:100px;
    border-radius: 8px;
}
.img_container{
    display: flex;
    align-items:center;
    gap: 20px;
    padding: 10px;
    border-bottom: 1px solid #e0e5f0;
}
.director_container{
    word-break: break-word !important;
   /* border-style: solid;
    border-width: 1px;
    border-color: #e0e5f0;*/
    border-radius: 6px;
    background-color: rgb(255, 255, 255);
    box-shadow: 2px 2px 5px 1px #00000040;
    /* padding-top: 10px; */
}
.img_container:first-child{
    /* border-top: 3px solid #ccc6; */
}
.desc_fac {
    
}
.desc_fac>h6{
    font-size: 16px;;
}
.desc_fac>p{
    margin-top:5px;
    font-style: italic;
}
.noTransform{
    transform:none !important;
}
.events li { 
    display: flex; 
    color: #999;
}
  
.events time { 
    position: relative;
    /* padding: 0 1.5em;   */
}
.course_header_text{
    word-break: break-word !important;
    color:var(--darkBlack)
}
.icon_with_text>p{
    color:var(--blue)
}
.icon_with_text{
    margin-bottom: 20px;
    cursor: pointer;
    display:flex;
    align-items:flex-start;
    gap:5px;
}
.icon_with_text>i{
    flex-basis:100%;
    max-width:15px;
}
.icon_with_text>p{
   text-align:left;
}
.events time::after { 
    content: "";
    position: absolute;
    z-index: 2;
    right: 0;
    top: 25px;
    transform: translateX(50%);
    border-radius: 50%;
    background: #ffffff;
    border: 7px #23A6DA solid;
    width: 20px;
    height: 20px;
}
  
  
.events span {
    padding: 0 0 1.5em 1.5em;
    position: relative;
    width: 100%;
}
  
.events span::before {
    content: "";
    position: absolute;
    z-index: 1;
    left: 0;
    top:35px;
    height: 100%;
    border-left: 1px #ccc solid;
}

.events>li:last-child>span::before{
    height:2%;
}
  
.events strong {
    display: block;
    font-weight: bolder;
}
  
/* .events { margin: 1em; width: 50%; } */
.events, 
.events *::before, 
.events *::after { box-sizing: border-box;  }


/* CheckBox */

.styled-checkbox {
    position: absolute;
    opacity: 0;
}
.styled-checkbox + label {
    position: relative;
    cursor: pointer;
    padding: 0;
    color: #7B7B7B;
    font-size: 14px;
    font-weight: 300;
}
.styled-checkbox + label:before {
    content: "";
    margin-right: 10px;
    display: inline-block;
    vertical-align: text-top;
    width: 15px;
    height: 15px;
    background: white;
    border:1px solid #84DEFD;
    border-radius: 3px;
}
.styled-checkbox:hover + label:before {
    background: #84DEFD;
}
.styled-checkbox:focus + label:before {
    /* box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12); */
}
.styled-checkbox:checked + label:before {
    background: #84DEFD;
}
.styled-checkbox:disabled + label {
    color: #b8b8b8;
    cursor: auto;
}
.styled-checkbox:disabled + label:before {
    box-shadow: none;
    background: #ddd;
}
.discussion_check input:checked:disabled ~ span {
    /* color:#A8A8A8; */
    opacity: 0.5;
}
.styled-checkbox:checked + label:after {
    content: "";
    position: absolute;
    left: 4px;
    top: 8px;
    background: white;
    width: 2px;
    height: 2px;
    box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
    transform: rotate(45deg);
}
  
.unstyled {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
  
.unstyled>li {
    margin: 5px 0;
}
  
.centered {
    width: 200px;
}
  
.title {
    text-align: center;
    color: #4571ec;
}


/* Course checkbox */


.course_qst_option_container>form {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}
  
.qst_radio {
    display: flex;
    cursor: pointer;
    font-weight: 500;
    color: #707070;
    position: relative;
    overflow: hidden;
    margin-bottom: 0.375em;
    background-color: #FFFFFF;   
    box-shadow: 0px 4px 8px #00000029;
    border-radius: 8px;
    padding: 15px;
    transition: 0.5s ease-in-out;
}
.qst_radio  input {
    position: absolute;
    left: -9999px;
}
.qst_radio  input:checked + span {
    background-color: none;
    font-weight: 600;
}
.qst_radio  input:checked + span:before {
    box-shadow: inset 0 0 0 0.4375em #23A6DA;
}
.qst_radio  span {
    display: flex;
    align-items: center;
    padding: 0.375em 0.75em 0.375em 0.375em;
    border-radius: 99em;
    transition: 0.25s ease;
}
.qst_radio:hover {
    box-shadow: -1px -5px 16px #00000029;
    transform: translateY(-0.25rem);;
}
.qst_radio  span:before {
    display: flex;
    flex-shrink: 0;
    content: "";
    background-color: #fff;
    width: 1.5em;
    height: 1.5em;
    border-radius: 50%;
    margin-right: 0.375em;
    transition: 0.25s ease;
    box-shadow: inset 0 0 0 0.025em #707070;
}
  
.course_qst_option_container,.explain-selection {
    width: 100%;
    padding: 20px;
}

.explain-selection>form>textarea{
    width: 100%;
    padding: 20px;
    border-radius: 8px;
    transition: 0.5s;
    min-height: 150px;
    font-size: 16px;
    font-family: 'Roboto';
}

.explain-selection>form>textarea:focus,.explain-selection>form>textarea:hover{
    box-shadow: 0px 4px 16px #00000029;
    border: 1px solid #04BBFF;
    border-radius: 8px;
    outline: none !important;
}
.preview{
    background-color: #D3EFF9;
    padding: 20px 10px;
    border-radius: 0px 0px 8px 8px;
    margin-top: -55px;
}
.add_post_block:not(.disc_searchBar){
    /* opacity: 0 ; */
    display: none;
}
.add_post_block.disc_searchBar{
    opacity: 0;
}
.add_post_block>section{
    margin-bottom: 40px;
}
.add_post_title{
    color: #171717;
    margin-bottom: 10px;
}
.post_input_container{
    margin-top: 10px;
}
.post_select{
    background-color: white;
    border: none;
    height: 40px;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 4px;
    padding-left: 15px;
    outline: none;
}
.post_select[type="text"]{
    max-width: 400px;
}

.user_prof_small{
    border-radius: 50%;
    width: 50px;
    height: 50px;
    top: -110px;
    background-size: contain;
    display: inline-block;
    position: relative;
    margin-left: 12px;
}
/* Discussion radio button */
.radio-item {
    display: inline-block;
    position: relative;
    margin: 10px 20px 0 0;
}
  
.radio-item>input[type='radio'] {
    display: none;
}
  
.radio-item>label {
    color: #666;
    font-weight: normal;
    cursor: pointer;
}
  
.radio-item>label:before {
    content: " ";
    display: inline-block;
    position: relative;
    top: 5px;
    margin: 0 5px 0 0;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1px solid #000000;
    background-color: transparent;
}
.radio-item>input[type=radio]:checked + label:after {
    border-radius: 50%;
    width: 18px;
    height: 18px;
    position: absolute;
    top: 7px;
    left: 2px;
    content: " ";
    background: #23A6DA;
}
.radio-item.center_small>input[type=radio]:checked + label:after {
    border-radius: 50%;
    width: 14px;
    height: 14px;
    position: absolute;
    top: 9px;
    left: 4px;
    content: " ";
    background: #23A6DA;
}
.center_small>label{
    color:#A8A8A8;
}
.radio-item>input[type=radio]:checked + label:before{
    border: 1px solid #23A6DA;
}
.radio-item>input[type=radio]:checked + label{
    color:#23A6DA;
}
.radio-item>label>i{
    margin-right: 5px;
}
/*  */

/*  */
.discussion_check{
    display: inline-block;
    position: relative;
    padding-left: 25px;
    margin-right: 15px;
    cursor: pointer;
    font-size: 16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-bottom: 10px;
  }

/* Hide the browser's default checkbox */
.discussion_check>input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
  
/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: transparent;
    border:2px solid #8A8A8A;
    border-radius: 4px;
}
  
/* On mouse-over, add a grey background color */
.discussion_check:hover input ~ .checkmark {
    background-color: #ccc;
}
  
/* When the checkbox is checked, add a blue background */
.discussion_check input:checked ~ .checkmark {
    background-color: #23A6DA;
    border:none;
}

.discussion_check>input:checked ~ svg>path.a{
    fill: #23A6DA !important;
    stroke: #23A6DA !important;
}
.discussion_check input:checked ~ span {
    color: #23A6DA;
}
  
/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}
  
  /* Show the checkmark when checked */
.discussion_check input:checked ~ .checkmark:after {
    display: block;
}

  
/* Style the checkmark/indicator */
.discussion_check .checkmark:after {
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
/*  */


/* rows and columns */
.s-row{
    display: grid;
    gap: 30px;
    grid-template-columns: repeat(auto-fit,minmax(200px,320px));
}

[class^="s-col-"]{
    box-shadow: 4px 4px 16px #02394E3D;
    border-radius: 8px;
    /* background-image: linear-gradient(290deg,#EEF9FE 0%,#BCEDFE 100% ); */
    background-color: #fff;
    border: 2px solid #006eb9;
    padding: 30px;
    max-width: 300px;
    transition: 0.5s ease-in-out;
}

.s-row-cert{
    display: grid;
    gap: 30px;
    grid-template-columns: repeat(auto-fit,minmax(200px,230px));
}
.s-col-md-cert{
    box-shadow: 4px 4px 16px #02394E3D;
    border-radius: 8px;
    background-image: linear-gradient(290deg,#EEF9FE 0%,#BCEDFE 100% );
    padding: 0px;
    max-width: 300px;
    transition: 0.5s ease-in-out;
}

[class*="s-col-"]:hover{
    box-shadow: 0px 3px 12px #00000080;
    transform: translateY(-0.25rem);
}


/*  */

.page-top-content{
    display: flex;
    gap: 10px;
    justify-content: space-between;
    padding: 10px;
    margin: 20px;
    align-items: center;
}
.page-top-content>div{
    display: flex;
    gap: 20px;
    padding-bottom: 15px;
}

.mainMenu_second{
    background-color: transparent;
    padding: 20px 20px 0px 10px;
    text-align: center;
    z-index: 1;
    position: relative;
}
.studio_top_menu{
    background-color: #FAFAFA;
    padding-top: 20px !important;
    text-align: center;
    box-shadow: -5px -3px 8px 0px #02394e3d;
}
.studio_top_menu>ul{
    margin-left: 0px !important;
}
.studio_top_menu>ul>li{
    width: 260px;
}
.main-nav_second {
    display: inline-flex;
    padding: 0;
    list-style: none;
    margin-left: 0%;
}
.main-nav_second>li {
    margin-right: 10px;
}
.main-nav_second li a {
    padding: 10px;
    text-transform: capitalize;
    white-space: nowrap;
    font-size: 17px;
    text-decoration: none;
    color: #BDBDBD;
    font-weight: 300;
    opacity: 1;
}
.main-nav_second li a:hover {
    color: #DD74EB;
    font-weight: 400;
}
.main-nav_second li.active >a {
    color: #DD74EB;
    opacity: 1;
    font-weight: 400;
}
.main-nav_second li.active:after {
    content:"";
    background: -webkit-linear-gradient(left,#DD74EB 0%, #DD74EB 12%, #DD74EB 47%, #DD74EB 100%);
    display: block;
    height:3px;
    bottom: 0;
    border-radius: 10px;
    margin-top: 10px;
}


.page-content{
    background-color: #FFFFFF;
    padding:20px;
    box-shadow: -5px -3px 8px 0px #02394e3d;
    margin-top: -2px;
}

.page-container{
    padding: 20px 3vw;
}
.extra_padding{
    padding: 0 12vw;
}
.course_ins_container:not(:last-child){
    border-bottom:3px solid #ECF7FA;
}
.course_ins_container>h4>span:nth-child(2){
    margin-left:40px !important;
}
.center_ins_box{
    padding:20px;
    max-width: 600px;
    margin: 0 auto;
    width: 100%;
    margin-bottom:40px;
    transition: all 0.2s;
}
.center_ins_box:hover{
    -ms-transform: translateY(-0.25rem);
    transform: translateY(-0.25rem);
}
.center_ins_box_body{
    background-color: #F3FCFF;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 8px 8px 0px 0px;
}
.no-footer{
    border-radius:8px !important;
}
.center_ins_box_footer{
    background-color: #FFFFFF;
    
    box-shadow: 0px 3px 6px #00000029;
    border-radius:0px 0px 8px 8px;
}

.ins_box_content>ul{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px,480px) );
    grid-gap: 20px;
}
.ins_box_content.half>ul{
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 20px;
}
.ins_box_content.half>ul>li{
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    grid-gap: 20px;
}
.ins_box_content>ul>li{
    display: grid;
    grid-template-columns:1.9fr 0.1fr;
    grid-gap: 10px;
}
.padding_sm{
    padding:10px 50px;
}
.blue-footer{
    color:#04BBFF;
}
.choose-one{
    color:#00B7FF;
    font-weight: bold;
}
.top_padder{
    padding: 0px 7%;
}
.shad{
    box-shadow: 0px 3px 6px #00000029 !important;
}

.gf-form-control{
    background-color: rgb(241, 251, 255);
    padding: 20px;
    border-radius: 8px;
    border: none;
    -webkit-appearance: none;
    -moz-box-shadow:inset  rgb(0 0 0 / 16%) 0px 3px 6px ;
    -webkit-box-shadow: inset rgb(0 0 0 / 16%) 0px 3px 6px ;
    box-shadow: inset rgb(0 0 0 / 16%) 0px 3px 6px ;
    outline: none;
    margin: 0px;
    color:#707070;
    font-family: 'Roboto';
}
.full_input{
    width: 100%;
    height: 175px;
}

.gf-form-control[type="text"], .gf-form-control[type="email"]{
    max-height:50px;
}
.no-border{
    border:none !important;
}
.ins_select{
    background-color:#F1FBFF;
    color:#04BBFF;
    font-weight: 500;
}
.ins_select ~ .dropdown_caret_holder{
    color: #04BBFF !important;
}
.add_staff_container{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.staff_container{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px,230px) );
    align-items: center;
    gap: 20px;
    padding: 20px 0px;
    border-bottom: 3px solid #ECF7FA;
}
.staff_container:last-child{
    border-bottom: none;
}
.input-container-dblock{
    display: grid;
    grid-template-columns: 1fr;
    gap: 5px;
}

.input-container-dblock>input:placeholder{
    color: #A8A8A8;
}

.oneByTwoInput{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

.input-container-dblock>label{
    color:#A8A8A8;
}
.course_ins_container textarea{
    resize: none;
}
.pinkhr{
    border-bottom: 2px solid #FCEFFE;
}
.pink-text{
    color:#DD74EB;
}
.pink-text-dark{
    color:#D900C7;
}
.warning{
    color:#FF5A5A;
}
.exam_container{
    display: none;
}
form.search_input_container{
    max-width: 600px;
}
form.search_input_container input[type='text'] {
    float: left;
    width: 80%;
    background-color: #E2F8FF;
}
  
form.search_input_container button {
    float: left;
    width: 20%;
    padding: 15px;
    margin-left: -15px;
    background: #00B7FF;
    color: white;
    font-size: 17px;
    border-radius  :8px ;
    border: none;
    cursor: pointer;
    max-width: 60px;
}
  
form.search_input_container button:hover {
    /* background: #0b7dda; */
}
  
form.search_input_container::after {
    content: "";
    clear: both;
    display: table;
}

.choose_dropdown_container{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.autoMin{
    min-width: auto !important;
}

.custom-file {
    position: relative;
    display: inline-block;
    width: 100%;
    height: calc(1.5em + .75rem + 2px);
    margin-bottom: 0;
}
.custom-file-input {
    position: relative;
    z-index: 2;
    width: 100%;
    height:45px;
    margin: 0;
    opacity: 0;
}
.custom-control-label::before, .custom-file-label, .custom-select {
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.custom-file-label {
    position: absolute;
    top: -4px;
    right: 0;
    left: 0;
    z-index: 1;
    height: 45px;
    padding: .375rem .75rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    border: 1px solid #ced4da;
    background-color: rgb(241, 251, 255);
    padding: 20px;
    border-radius: 4px;
    border: none;
    -webkit-appearance: none;
    -moz-box-shadow: inset rgb(0 0 0 / 16%) 0px 3px 6px;
    -webkit-box-shadow: inset rgb(0 0 0 / 16%) 0px 3px 6px;
    box-shadow: inset rgb(0 0 0 / 16%) 0px 3px 6px;
    outline: none;
    margin: 0px;
    color: #707070;
    font-family: 'Roboto';
}
.custom-file-input:lang(en)~.custom-file-label::after {
    content: "Browse";
}
.custom-file-label::after {
    position: absolute;
    top: 0px;
    right: -3px;
    bottom: 0;
    z-index: 3;
    display: block;
    height: 33px;
    padding: 6px;
    line-height: 2.2;
    font-size: 14px;
    color: #FFFFFF;
    content: "Browse";
    background-color: #006eb9;
    border-left: inherit;
    border-radius: 4px;
    width: 15%;
    text-align: center;
}
.studio_card_container_header {
    padding: 40px;
    border-radius: 5px 5px 0px 0px;
}
.studio_card_container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
}
.studio_card_container>div:nth-child(2){
    display: flex;
    justify-content: flex-end;
}
.course_desc_list{
    color:var(--blue);
    margin-top:20px;
}
.course_desc_list>li{
    display: inline-block;
    cursor: pointer;
}
.course_desc_list>li:after{
    content:'/';
    padding: 0px 5px;
}
.course_desc_list>li:last-child:after{
    content:'';
}
.gf_anchor {
    color: var(--blue);
    cursor: pointer;
    font-weight: 400;
    /* font-size: 20px; */
}
.card_details_container{
    display: grid;
    grid-template-columns: 1.7fr 0.3fr;
    gap: 30px;
}


.popover__title {
    font-size: 24px;
    line-height: 36px;
    text-decoration: none;
    color: #00AEEF;
    text-align: center;
    /* padding: 15px 0; */
}
  
  .popover__wrapper {
    margin-bottom: 30px;
    margin-right: 4%;
    display:none;
}
  .popover__content {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    transform: translate(0, 10px);
    background-color: #ffffff;
    padding: 1.5rem;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    width: 250px;
    right: 17%;
    /* top: 30%; */
  }
  .popover__content:before {
    /* position: absolute;
    z-index: -1;
    content: "";
    right: calc(0% - 7px);
    top: 110px;
    border-style: solid;
    border-width: 10px 20px 19px 0px;
    border-color: transparent transparent #c5c5c5 transparent;
    transition-duration: 0.3s;
    transition-property: transform;
    transform: rotate(224deg); */
  }
  .popover__wrapper:hover .popover__content {
    z-index: 10;
    opacity: 1;
    visibility: visible;
    /* transform: translate(0, -20px); */
    transition: all 0.5s cubic-bezier(0.75, -0.02, 0.2, 0.97);
  }
  .popover__message {
    text-align: center;
  }



.input_field[type="text"], [type="email"], [type="password"], select {
    font-size: 16px !important;
}
.input_field {
    color: #5d5d5d;
    width: 100%;
    border: none;
    outline: none;
    font-size: 1.3rem;
    font-weight: 400;
    padding: 15px;
    background-color: #FFFFFF;
    box-shadow: inset 0px 2px 6px #0000000f;
    padding-left: 20px;
    transition: 0.5s ease-in-out;
    font-size: 16px;
    margin:10px 0px;
    border: 1px solid #EBEBEB;
    border-radius: 4px; 
}
select.input_field{
    box-shadow: 0px 3px 6px #0000001A !important;
    color:#707070 !important;
}
.info{
    color:#DD74EB;
}
.studio_create{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 200px) );
    justify-content: center;
    gap: 30px;
}

.input_container>.dropdown_caret_holder {
    display: inline-block;
    position: absolute;
    margin-left: -30px;
    width: 10px;
    height: 10px;
    margin-top: 28px;
    z-index: 1;
    color: #00AEEF;
}
/*  */

/* pagination */
.search-page{
    display: grid;
    grid-template-columns: 1.6fr 0.4fr;
    align-items: center;
    gap: 10px;
}
.hide {
    display: none !important;
}
.center, .center-align {
    text-align: center;
}
.pagination li {
    display: inline-block;
    font-size: 0.8rem;
    padding: 0 10px;
    line-height: 30px;
    border-radius: 2px;
    text-align: center;
    color:#BDBDBD;
}
.waves-effect {
    position: relative;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    vertical-align: middle;
    z-index: 1;
    will-change: opacity, transform;
    transition: all .3s ease-out;
}
.pagination li i {
    font-size: 1.2rem;
    vertical-align: middle;
}
.pagination li.active {
    color: #00B7FF;
    font-size: 1rem;
}
.blue_text{
    color:#00B7FF;
}
.red_text{
    color:#DC0000;
}
/* pagination */



.banners{
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.studio_index .single{
	position: absolute;
	top: 0;
	left: 0; 
	width: 100%;
	height: 100%;
    min-height: 200px;	
	-webkit-background-size: cover;
	background-size: cover;

}

.studio_index .banner-text{
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-top: 9%;
    font-weight: bold;
    display: grid;
    justify-content: flex-end;
    margin-bottom: 15%;
    margin-right: 10%;
}

.studio_index .banner-text h1{
	display: inline-block;
	padding: 0.5em;
	font-size:2rem;
}

.studio_index .banner-text span{
    width:80%;
    padding: 0.5em;
    font-weight: 500;
}
.grid_2_img_text{
    display: grid;
    gap:20px;
    padding:5% 0%;
}
.grid_2_img_text.left{
    grid-template-columns: 0.8fr 1.2fr;
    justify-content: center;
    align-items: center;
}
.grid_2_img_text.right{
    grid-template-columns: 1.2fr 0.8fr;
    justify-content: center;
    align-items: center;
}
.grid_2_banner_text{
    max-width: 60%;
    display: grid;
    gap: 30px;
}
.right>.grid_2_text>.grid_2_banner_text{
    margin-left: 10%;;
}
.studio_index1{
    background: url("/static/indigo/images/studioIndex2.eaf3c53faa3e.png") no-repeat;
    height: 210px;
    background-size: contain;    
    margin-left: -7%;
    padding: 30%;
}
.studio_index2{
    background: url("/static/indigo/images/studioIndex3.f8610346ea42.png") no-repeat;
    height: 210px;
    background-size: contain;    
    margin-left: -7%;
    padding: 30%;
}
.studio_index3{
    background: url("/static/indigo/images/studioIndex4.8211049e91ca.png") no-repeat;
    height: 210px;
    background-size: contain;    
    margin-left: -7%;
    padding: 30%;
}

.grid_3_text{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px,300px) );
    justify-content:center;
    gap:30px;
    padding:5%;
}
.inner_shadow{
    box-shadow: inset 0px 3px 6px #00000029;
}
.grid_text_container{
    display:grid;
    grid-template-columns: 1fr;
    gap:20px;
}

.lines_2{
    /* height:60px; */
}
.lines_3{
    height:90px;
}
.lines_2>h3{
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;  
    overflow: hidden;
}
.lines_3>h3{
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;  
    overflow: hidden;
}
.sign_in{
    display: flex;
    justify-content: center;
    align-content: center;
    padding: 3% 20px;
    margin-top: 6%;
}
.sign_in>h3>a{
    color:#00B7FF;
    text-decoration: none;
}
.sign_in>h3>a:hover{
    text-decoration: underline;
}

body.studio #navbar{
    padding: 0px 3vw;
}
body.studio .top_padder{
    padding: 0px 3vw;
}



@media screen and (max-width: 768px) {


	.studio_index{
		padding-top: 60px;
	}
  	
  .studio_index .banner-text h1{
		display: block;
	}

	.studio_index .banner-text h2{
		display: table;
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
}



.program_course_list{
    margin-top:20px;
}
.program_course_list>li {
    list-style-type: circle;
    color:#ccc;
    margin-left: 25px;
    margin-bottom: 10px;
}
.program_course_list>li>a {
    color:#383838;
}

.we_accept{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    /* margin: 0 auto; */
    gap: 10px;
    flex-direction: row-reverse;
}


.we_accept{
    display:grid;
    grid-template-columns: 1fr;
    justify-content:center;
    align-items:center;
    max-width: 300px;
    margin:0 auto;
    gap:10px;
}
.icon_check{
    width:35px;
    height:35px;
}
.icon_with_text li {
    color: var(--blue);
    margin-bottom: 5px;
}
.certificateholder{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}
.courseBrochureBtn{
    width:100%;
    max-width:300px;
    display:block;
    text-decoration:none;
}
.buyNowRight{
    width:100% !important;
    max-width:300px;
    display: flex!important;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.page_under_construction_container{

display: flex;
align-items:center;
justify-content:center;
gap:10px;
flex-direction: column-reverse;
}