:root{
	--grayColor: #1d2631;
}

h1,h2,h3,h4,h5,h6,p{
	padding: 0;
	margin: 0;
	font-family: 'Rubik', sans-serif;
}
body{
	background-color: #fff;
}
a:hover{
	text-decoration: none;
}
.language_main {
    /*min-height: 96vh;
    overflow-y: scroll;
    */
}

i.fa.fa-bars.openDrop {     
font-size: 27px; 
}


button.btn.closeicon {
    background: transparent;
    width: unset;
    padding: 0;
    position: absolute;
    margin-top: 60px;
    right: 38px;
}
.new_resource_title{
    height: 70vh !important;
}
.form_data_table{
        height: 63vh !important;
}
.height_set_p_1 {
    height: 54vh !important;
}
nav{
       overflow: hidden;
}
.new_div_bar {
    padding: 17px;
}
/*=========================>> LANDING PAGE START <<=====================*/
.landing_page_body{
	/*background-image: url(../images/landing_page_bg.png);*/
	height: 100%;
	width: 100%;
	overflow: hidden !important;
	border-radius: 100px;
	background-color: #fff;
}
.landing_content{
	width:100%; 
   	height:100vh;
   	border-radius: 50px;
   	position: relative;
}
.landing_content img{
	position: absolute;
   	top: 50%;
   	left: 50%;
   	transform: translate(-50%, -50%);
}
.select-menu1 .options1 .option1 label{
     margin-bottom: 0rem;
}
/*.landing_content::before{
	content: "";
	position: absolute;
	background-image: url(../images/hello_img_2.png);
	background-repeat: no-repeat;
	width: 733px;
	height: 100%;
	right: 0;
}
.landing_content::after{
	content: "";
	position: absolute;
	background-image: url(../images/hello_img_1.png);
	background-repeat: no-repeat;
	width: 650px;
	height: 450px;
	left: 0;
	bottom: 0
} */
.input_lable_submit.orange_input_bbbb input{
	width: 500px;
}
.scroll_lang_output{
	overflow: scroll;
}
.sign_card{
	width: 500px;
	margin: 0 auto;
}
/*========================>>  LANDING PAGE END  <<=====================*/

/*========================>> SIGN UP PAGE START <<=====================*/
.sign_up_page img{
	height: 100vh;
}
.sign1_img img{
    float: right;
    /*height: auto;*/
    width: 82%;
}
.sign_up_form_info h5{
	font-family: 'Rubik', sans-serif;
	color: #515151;
	font-style: normal;
	font-weight: 500;
	font-size: 23px;
	line-height: 35px;
	padding: 20px 0 15px 0;
}
.sign_up_form_info input {
	background: #FFFFFF !important;
	/* box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); */
	border-radius: 5px !important;
	padding: 10px !important;
	border: 1px solid #cfcfcf !important;
}
.sign_up_form_info button{
	font-family: 'Rubik', sans-serif;
	/*background: linear-gradient(90deg, #0E924E 0%, #8FB550 100%);*/
	background: #1d2631;
	border-radius: 5px;
	padding: 13px;
	color: #fff;
	font-weight: 500;
	font-size: 16px;
}
.sign_up_form_info p{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: -0.015em;
	color: #555555;
}
.sign_up_form_info a.already_login{
	background: linear-gradient(90deg, #15335D 61.67%, #187996 91.33%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	text-fill-color: transparent;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
}
.google_icon_text{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400 !important;
	font-size: 14px;
	line-height: 14px;
	text-align: center;
	letter-spacing: -0.02em;
	color: #2D2D2D;
	padding: 10px 0 0 0;
}
.sign_para_last{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 15px;
	line-height: 18px;
	text-align: center;
	color: #555555;
}
.sign_card .card{
	border: 0;
	background-color: #fff;
	box-shadow: none;
}
/*========================>> SIGN UP PAGE END <<=======================*/

/*=======================>> LOGIN PAGE START <<========================*/
.background_element_login{
	background-image: url('../images/Background Elements 1.png');
	background-repeat: no-repeat;
	background-size: cover;
	height: 0600px;
	position: relative;
	z-index: 99;
}
.profile_top h3{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 600;
	font-size: 24px;
	letter-spacing: -0.015em;
	color: #232323;
}
.forgot_password_link a{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 16px;
	background: linear-gradient(90deg, #15315B 0%, #187794 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	text-fill-color: transparent;
}
.checkbox_border input{
	border: 1px solid #8F8F8F;
	position: relative;
	top: -3px;
    left: -4px;
}
.form-check-input:checked[type=checkbox]{
	background-image: url(../images/right_check.png);
	background-repeat: no-repeat;
	background-position: center;
	background-color: #fff;
}
/*=======================>> LOGIN PAGE END <<=========================*/
nav {
	position: fixed;
	width: 100%;
	max-width: 300px;
	bottom: 0;
	top: 0;
	display: block;
	min-height: 300px;
	/*height: 95vh;*/
	color: #fff;
	transition: all 300ms;
	-moz-transition: all 300ms;
	-webkit-transition: all 300ms;
	background: var(--grayColor);
	/*background: linear-gradient(180deg, #0A914E 0%, #94B650 100%);*/
	box-shadow: 0px 0px 10px 5px rgb(0 0 0 / 10%);
	border-radius: 10px;
	margin: 20px 30px;
	border-radius: 10px;
	}
nav .vertical-menu hr{opacity: 0.1; border-width: 0.5px;}
nav ul{width: 90%; padding-inline-start: 0; margin:0px 10px; height: calc(100% - 20px); }
nav .vertical-menu-logo{padding: 20px; font-size: 1.3em; position: relative}
nav .vertical-menu-logo .open-menu-btn{width: 30px; height: max-content; position: absolute; display: none; right: 10px; top: 2px; bottom: 6px; margin: auto; cursor: pointer;}
nav li{list-style: none; padding: 10px 10px; cursor: pointer;}
nav li:hover{ color: rgba(75, 105, 176,1); }
nav li#user-info{position: absolute; bottom: 0; width: 80%;}
nav li#user-info > span{display: block; float: right; font-size: 0.9em; position: relative; opacity: 0.6;}
nav li#user-info > span:after{
    content: '';
    width: 12px;
    height: 12px;
    display: block;
    position: absolute;
    background: green;
    left: -20px; top: 0; bottom: 0;
    margin: auto;
    border-radius: 50%;
}
.content-wrapper{
   /* width: calc(97% - 300px);*/
   width: calc(98% - 300px);
    height: 100%;
    position: fixed;
    background: #fff;
    left: 340px;
    padding: 20px;
}
.closed-menu .content-wrapper{
    width: 100%;
    left: 72px;
}
body {margin: 0; background: #fff; font-family: Arial; }
.content-wrapper{
    transition: all 300ms;
}
.vertical-menu-wrapper .vertical-menu-logo div{transition: all 100ms;}
.closed-menu .vertical-menu-wrapper .vertical-menu-logo div{
    margin-left: -100px;
}
.vertical-menu-wrapper .vertical-menu-logo .open-menu-btn{transition: all 300ms;}
.closed-menu .vertical-menu-wrapper .vertical-menu-logo .open-menu-btn{
    left: 13px;
    right: 100%;
}
.closed-menu .vertical-menu-wrapper ul,.closed-menu .vertical-menu-wrapper hr{ /*margin-left: -300px; */ }
.vertical-menu-wrapper ul, .vertical-menu-wrapper hr{transition: all 100ms;}
.content{
    /* width: 100%; */
    /*min-height: 99%;*/
    background: #fff;
    border-radius: 10px;
}
.profile_top{
	box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.05);
	padding: 20px  24px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-radius: 10px;
}
img.media_icons_message{
	width: 26px;
    margin-right: 20px;
}
/*============>> HEADER DROPDOWN TOGGLE <<===============*/
.sidebar_logo_white{
	width: 166px;
	text-align: center;
}
.table_center{
  	display:table-cell;
  	vertical-align: middle;
}
.drop-down{
    display: table-caption;
    position: relative;
    padding: 4px 8px;
    border-radius: 10px;
    transition: .3s ease all;
}
.drop-down__button{
	width: 22px;
	height: 2px;
  	background: white;
  	padding: 0 1px;
  	text-align: left;
  	border-radius: 4px;
  	cursor: pointer;
  	margin: 6px;
}

.drop-down__name {
    font-size: 9px;
    text-transform: uppercase;
    color: #fff;
    font-weight: 800;
    letter-spacing: 2px;
}

.drop-down__icon {
    width: 18px;
    vertical-align: middle;
    margin-left: 14px;
    height: 18px;
   	border-radius: 50%;
   	transition: all 0.4s;
  	-webkit-transition: all 0.4s;
  	-moz-transition: all 0.4s;
 	-ms-transition: all 0.4s;
  	-o-transition: all 0.4s; 
}
.drop-down__menu-box {
    position: absolute;
    width: 255px;
    left: 0;
    background-color: #fff;
    border-radius: 4px;
  	box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.2);
    transition: all 0.3s;
  	-webkit-transition: all 0.3s;
  	-moz-transition: all 0.3s;
  	-ms-transition: all 0.3s;
  	-o-transition: all 0.3s;
 	visibility: hidden;
	opacity: 0;
  	margin-top: 5px;
	z-index: 1;
}

.drop-down__menu {
    /*margin: 0;*/
    padding: 0 13px;
    list-style: none;
    float: left;
}
.btn.focus, .btn:focus {
    outline: 0;
    box-shadow:none;
}
.drop-down__menu-box:before{
  	content:'';
  	background-color: transparent;
  	border-right: 8px solid transparent;
  	position: absolute;
  	border-left: 8px solid transparent;
  	border-bottom: 8px solid #fff;
  	border-top: 8px solid transparent;
  	top: -15px;
  	left: 13px;
}

.drop-down__menu-box:after{
  	content:'';
  	background-color: transparent;
}

.clear{
	clear: both;
}
.drop-down__item {
	font-family: 'Rubik';
    font-size: 16px;
    padding: 0px 0px 20px;
    text-align: left;
    font-weight: 400;
    color: #555555;
    cursor: pointer;
    position: relative;
	letter-spacing: -0.015em;
}
.drop-down__item a{
	color: #555555;
	display: flex;
	    align-items: center;
}
.drop-down__item-icon {
    width: 15px;
    height: 15px;
    position: absolute;
    right: 0px;
    fill: #8995b6;
}
.drop-down__item:hover .drop-down__item-icon{
  	fill: #3d6def;
}
.drop-down__item:hover{
  	color: #3d6def;
}
.drop-down__item:last-of-type{
  	border-bottom: 0;
}

.drop-down--active .drop-down__menu-box{
	visibility: visible;
	opacity: 1;
  	margin-top: 15px;
}
.drop-down__item:hover:before{
  	display:block;
}
.student_profile_sidebar img{
	width: 90px;
}
.student_profile_sidebar{
	padding-top: 10px;
}
.student_profile_sidebar h5{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 28px;
	letter-spacing: -0.015em;
	color: #FFFFFF;
	padding: 10px 0 0 0;
}
.student_profile_sidebar p{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 16px;
	line-height: 23px;
	padding: 5px 0 0 0;
}
.select-menu1.active .mainoption1{
	box-shadow: 0px 0px 15px 1px rgb(0 0 0 / 10%);
    border-radius: 5px;
}
.about_student_info ul li a{
	text-decoration: none;
	color: #fff;
}
.about_student_info{
	padding: 37px 0 0 0;
}
.about_student_info ul {
    width: 92%;
    margin: 0;
}
.drop-down.drop-down--active svg{
	background: white;
	color: #555555;
}
.about_student_info ul li {
    padding: 0 !important;
    margin-bottom: 12px;
}
button,
button::after {
  	-webkit-transition: all 0.3s;
  	-moz-transition: all 0.3s;
  	-o-transition: all 0.3s;
  	transition: all 0.3s;
}
button.btn-2 a{
	-webkit-transition: all 0.3s;
  	-moz-transition: all 0.3s;
  	-o-transition: all 0.3s;
  	transition: all 0.3s;
}

button.btn-2 {
  	background: none;
  	border: none;
  	display: block;
  	position: relative;
  	width: 100%;
  	padding: 15px;
  	/* margin: 30px 10px; */
  	text-align: left;
}
button.btn-2:hover a {
    color: red;
}
button.btn-2:hover img.white_icons{
	display: none;
}
button.btn-2:hover img.hover_green_icon{
	display: inline-block;
}
button.btn-2 img.hover_green_icon{
	display: none;
}
button.btn-2 img{
	/*padding: 0 15px 0 0;*/
	width: 30px;
}
button.btn-2 span{
	margin-left: 5%;
}
button.btn-2::before,
button.btn-2::after {
  	background: #fff;
  	content: "";
  	position: absolute;
  	z-index: -1;
  	border-radius: 0px 10px 10px 0px!important;
}
button.btn-2 a img {
    margin-right: 10px;
}
button:focus{
	outline: none;
}
button.btn-2{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	font-size: 20px;
	line-height: 24px;
	letter-spacing: -0.015em;
	color: #FFFFFF;
}
button.btn-2:hover{
	color: var(--grayColor);
}
.btn-2::after {
  	height: 100%;
  	left: -10px;
  	top: 0;
  	width: 0;
}

.btn-2:hover:after {
  width: 80%;
}
.user_data_table{
	display: flex;
	justify-content: space-between;
	    padding: 15px 0px 0px;
	    align-items: center;
}
.user_data_table h2{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 500;
	font-size: 28px;
	color: var(--grayColor);
}
.user_data_table a button{
	width: 170px;
	height: 40px;
	background: var(--grayColor);
	border-radius: 6px;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	color: #FFFFFF;
}
.user_profile_main{
	box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.05);
	border-radius: 10px;
	margin-top: 30px;
	padding: 30px 38px;
	min-height: 90vh;
}
.user_name p{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	color: #8F8F8F;
}
.user_detailed input{
	background: #FFFFFF;
	box-shadow: 0px 0px 8px 4px rgba(85, 85, 85, 0.05);
	border-radius: 8px;
	border: none;
	padding: 10px;
	width: 350px;
}
.user_detailed select{
	background: #FFFFFF;
	box-shadow: 0px 0px 8px 4px rgba(85, 85, 85, 0.05);
	border-radius: 8px;
	border: none;
	padding: 10px;
	width: 350px;
}
.user_profile_bio{
	align-items: center;
}
.profile_top h3 img{
	margin: 0 10px 0 0;
}
.user_name{
	width: 209px;
}
.user_profile_bio{
	padding-top: 51px;
    padding-left: 25px;
}
.drop-down__item a svg{
	padding: 0 10px 0 0;
}
.user_data_table h2.edit_heading_two{
	color: var(--grayColor);
	padding-left: 22px;
}
.user_detailed a button{
	width: 170px;
	height: 40px;
	background: #1d2631;
	border-radius: 6px;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 500;	
	font-size: 14px;
	color: #fff;
}
:focus-visible {
	outline: none;
}
.user_detailed a button svg{
	font-size: 13px;
	padding: 0 8px 0 0;
}
.user_data_table h2.classes_heading_two
{
	color: var(--grayColor);
	/*padding-top: 30px;
	padding-left: 13px;
	*/
}
.user_prof{
    font-size: 26px !important;
}
.btn-submit {
    background: #4FAA6F;
    color: #fff;
    text-transform: uppercase;
    margin: 0px 11px;
    letter-spacing: 1px;
}

img.img-fluid.auth-logo-dark.me-start {
    max-width: 250px;
}
.input_lable_submit {
    margin-left: 10px;
}
.three_lines_table.classes_table_shadow{
    height: 86vh;
}
.classes_table_shadow{
	box-shadow: 0px 0px 10px 5px rgba(35, 35, 35, 0.05);
	border-radius: 10px;
	margin-top: 40px;
	height: 77vh;
}
.classes_table_shadow th{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 500;
	font-size: 18px;
	color: #232323;
}
.classes_table_shadow td{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	color: #8F8F8F;
}
.classes_table_shadow td img.participant_one_img{
	width: 131px;
}
.classes_table_shadow td{
	border-bottom: 1px solid rgba(85, 85, 85, 0.15);
}
.classes_table_shadow th{
	border-top: none;
	border-bottom: none;
}
tr.table_heading_top{
	border-top: 0;
}
.classes_table_shadow td:nth-child(3) {
	position: relative;
    left: 40px;
}
.classes_table_shadow .table td, 
.classes_table_shadow .table th{
	padding:28px 0 28px 50px;
}
.display_buttons button.previous_btn_table{
	margin-left: 44px;
}
.display_buttons button{
	width: 120px;
	height: 40px;
	background: #1d2631;
	border-radius: 3px;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	color: #FFFFFF;
	margin-bottom: 30px;
    margin-top: 20px;
}
.display_buttons button svg{
	padding: 0 5px;
}
.display_buttons button.next_btn_table{
	position: absolute;
	right: 18%;
	top: 0;
}
.display_buttons p{
	width: 457px;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	line-height: 24px;
	color: #555555;
}
nav.blue_gredient_bg{
	background: linear-gradient(180deg, #15345E 0%, #187895 100%);
}
.three_lines_table td:nth-child(2) {
    position: relative;
    /*text-align: center;*/
}
.three_lines_table td:nth-child(3) {
    position: inherit;
    left: 0;
    /*text-align: center;*/
}
.classes_table_shadow td img.groups_one_img{
	width: auto;
}
.user_data_table button.edit_group_btn{
	background:var(--grayColor);
}
.user_data_table button.edit_group_btn img{
	padding-right: 8px;
}
.three_lines_table td{
	border-bottom: 0;
}
td.group_previous_btn button{
	width: 120px;
	height: 40px;
	background: var(--grayColor);
	border-radius: 3px;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 24px;
	color: #FFFFFF;
}
.page_para_group{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 500;
	font-size: 18px;
	line-height: 24px;
	color: #555555;
}
td.group_previous_btn button svg{
	padding: 0 4px;
}
button.blue_btn-2:hover{
	color: #187794;
}
.user_data_table a button.create_group_btn{
	width: 100%;
}
.user_data_table a button.create_group_btn svg{
	padding-right: 8px;
}
.edit_icons_img img{
	padding-right: 5px;
}
.new_grp_plus a{
	color: var(--grayColor);
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	font-size: 20px;
	text-decoration: none;
}
.saved_profile_border td{
	border-bottom: 0;
}
.three_cards_word h3.card_title{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 600;
	font-size: 25px;
	color: #fff;
	padding:26px 0 0 0;
}
.three_cards_word .card img{
	width: 160px;
	margin: 0 auto;
}

@media (min-width: 1024px) and (max-width: 1365px) {
	/* CSS styles for iPad Pro */
	/* Add your styles here */
	.three_cards_word .card{
		padding: 60px 20px;
		background: #4FAA6F;
		border: 2px solid #4FAA6F;
		box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.1);
		border-radius: 10px;
		min-height: 648px !important;
		display: grid !important;
	}
  }
  
.three_cards_word .card{
	padding: 60px 20px;
	background: #4FAA6F;
	border: 2px solid #4FAA6F;
	box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.1);
	border-radius: 10px;
	min-height: 435px;
    display: grid !important;
}
button.btn-2{
    display: flex;
    align-items: center;
    cursor: pointer !important;
}
.three_cards_word .card p{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 16px;
	color: #fff;
	padding: 44px 0 19px 0;
	line-height: 25px;
	WIDTH: 341PX;
    MARGIN: 0 AUTO;
}
.cards{
	padding-top: 40px;
}
.card.img_card{
	border: 2px solid #929292;
	box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.1);
	background-color: #929292;
}
.img_card h3{
	color: #fff;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 600;
	font-size: 25px;
	padding: 17px 0 0 0;
}
.img_card h6{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 20px;
	color: #fff;
	padding: 30px 0 0 0;
}
.card.img_card img{
	width: 141px;
}
.card.sentences_card{
	border: 2px solid #6496D5;
	box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.1);
	background: #6496D5;
}
.second-card {
    margin-top: 25px;
}
.card.fourcard {
    
    border: 2px solid #74bc3f;
    box-shadow: 0px 0px 15px 1px rgb(0 0 0 / 10%);
    background-color: #74bc3f;
}

.card.fifthcard {
  
    border: 2px solid #e55086;
    box-shadow: 0px 0px 15px 1px rgb(0 0 0 / 10%);
    background-color: #e55086;

}
.fifthcard h3 {
    color: #fff;
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 600;
    font-size: 25px;
    padding: 17px 0 0 0;
}
.fifthcard h6 {
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 300;
    font-size: 25px;
    color: #fff;
    padding: 30px 0 0 0;
}

.card.sixthcard {
   border: 2px solid #fec700;
    box-shadow: 0px 0px 15px 1px rgb(0 0 0 / 10%);
    background-color: #fec700;
}
.sixthcard h3 {
    color: #fff;
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 600;
    font-size: 25px;
    padding: 17px 0 0 0;
}
.sixthcard h6 {
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 300;
    font-size: 25px;
    color: #fff;
    padding: 30px 0 0 0;
}

.card.sentences_card h3{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 600;
	font-size: 25px;
	color: #fff;
	padding: 17px 0 0 0;
}
.card.sentences_card h6{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 20px;
	color: #fff;
	padding: 30px 0 0 0;
}
.input_lang_title{
	display: flex;
	justify-content: space-between;
	padding: 15px 0;
}
.close_btn{
	width: 20px;
}
.input_lang_title h4{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 500;
	font-size: 20px;
	line-height: 16px;
	text-transform: uppercase;
	color: #555555;
}
.language_main{
	background: #FFFFFF;
	box-shadow: 0px 0px 25px 2px rgba(0, 0, 0, 0.1);
	border-radius: 10px;
	padding: 20px 30px;
	/*overflow: scroll;*/
}
.new_resource_title h6{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 20px;
	color: #555555;
}
.new_resource_title p{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	color: #FF9548;
	width: 441px;
	background: #FFFFFF;
	box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.1);
	border-radius: 5px;
	padding: 20px;
	width: 441px;
	margin: 20px 0;
}
.select-menu {
  	max-width: 330px;
}
.select-menu .select-btn {
  	display: flex;
  	background: #fff;
  	padding: 20px;
  	border-radius: 5px;
  	align-items: center;
  	cursor: pointer;
  	justify-content: space-between;
  	box-shadow:0px 0px 15px 1px rgba(0, 0, 0, 0.1);;
  	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 18px;
	color: #FF9548;
	width: 441px;
}
.select-menu .options {
  	overflow-y: auto;
  	max-height: 357px;
  	padding: 10px;
  	margin-top: 10px;
  	border-radius: 8px;
  	background: #fff;
  	animation-name: fadeInDown;
  	-webkit-animation-name: fadeInDown;
  	animation-duration: 0.35s;
  /*	animation-fill-mode: both;
  	-webkit-animation-duration: 0.35s;
  	-webkit-animation-fill-mode: both;*/
}
.select-menu .options .option {
    display: flex;
    height: 42px;
    cursor: pointer;
    padding: 0 11px;
    border-radius: 8px;
  	align-items: center;
  	background: #fff;
}
.select-menu .options .option:hover {
    background: #f2f2f2;
}
.select-menu .options .option i {
  	font-size: 25px;
  	margin-right: 12px;
}
.select-menu .options .option .option-text {
  	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 16px;
	line-height: 19px;
	color: #6D6A5D;
  	margin-left: 19px;
}
.select-btn i {
  	font-size: 25px;
  	transition: 0.3s;
}
.select-menu.active .select-btn i {
  	transform: rotate(-180deg);
}
.select-menu.active .options {
  	display: block;
  	opacity: 0;
  	z-index: 10;
  	animation-name: fadeInUp;
  	-webkit-animation-name: fadeInUp;
  	animation-duration: 0.4s;
  	animation-fill-mode: both;
  	-webkit-animation-duration: 0.4s;
  	-webkit-animation-fill-mode: both;
	border-radius: 5px;
}
input[type='checkbox'] {
    accent-color: #4FAA6F;
}
.mainoption {
    background: #FFFFFF;
    box-shadow: 0px 0px 15px 1px rgb(0 0 0 / 10%);
    width: 441px;
    padding: 0 20px 0px 0px;
}
.select-menu.active .up_arrw_rotate{
	transform: rotate(180deg);
}
::-webkit-scrollbar {
  	width: 5px;
}
::-webkit-scrollbar-track {
  	background: #FFF7F0; 
  	position: relative;
  	left: 20px;
}
::-webkit-scrollbar-thumb {
  	background: #4FAA6F; 
   	border-radius: 100px;
}
.select-menu .mainoption{
	box-shadow: none;
}
.select-menu.active .mainoption{
	box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.1);
	border-radius: 5px;
}
.profile_input_top{
	padding: 20px 30px;
}
.back_next_btn a button{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	color: #FFFFFF;
	background: #4FAA6F;
	border-radius: 5px;
	padding: 17px 56px;
	margin: 30px 1px;
}
.back_close_word{
	display: flex;
	justify-content: space-between;
	padding: 0 0 40px 0;
}
.input_lable_submit label{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	color: #FF9548;
	text-align: center;
}
.input_lable_submit input{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	font-size: 15px;
	color: #555555;
	text-align: center;
	border: 0;
	background: #FFFFFF;
	box-shadow: 0px 0px 25px 2px rgba(0, 0, 0, 0.1);
	border-radius: 5px;
	padding:7px 30px;
	width: 272px;
}
.input_lable_submit a button{
	background: #4FAA6F;
	box-shadow: 0px 0px 25px 2px rgba(0, 0, 0, 0.1);
	border-radius: 5px;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	color: #ffff;
	padding: 7px 20px;
}
.form_data_table table td{
	border-top: none;
	padding-bottom: 45px;
    padding-top: 55px;
    font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 16px;
	color: #555555;
}
.form_data_table table th{
	border-bottom: 1.5px solid #555555;
	border-top: none;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	color: #555555;
}
.form_data_table  .tabletitle th{
	border-bottom: 1.5px solid #555555;
	border-top: none;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	color: #555555;
}
/*.a_single_data_td{
	width: 576px;
    padding: 0 30px;
}*/
/*.a_single_data_td p{
	padding: 0 200px 0 0;
}*/
.form_data_table {
    padding: 61px 0 0 0;
    
}
.form_data_table{
	/*height: 600px;
	overflow-y: scroll;*/
}
.form_data_table .table-responsive{
	height: 600px;
	overflow-y: scroll;
}

.tabletitle{
	width: 100%;
}


.select-menu1 {
  	max-width: 330px;
}
.select-menu1 .select-btn1 {
  	display: flex;
  	background: #fff;
  	padding: 20px;
  	border-radius: 5px;
  	align-items: center;
  	cursor: pointer;
  	justify-content: space-between;
  	box-shadow:0px 0px 15px 1px rgba(0, 0, 0, 0.1);;
  	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 18px;
	color: #FF9548;
	width: 441px;
}
.select-menu1 .options1 {
  	overflow-y: auto;
  	max-height: 295px;
  	padding: 10px;
  	margin-top: 10px;
  	border-radius: 8px;
  	background: #fff;
  	animation-name: fadeInDown;
  	-webkit-animation-name: fadeInDown;
  	animation-duration: 0.35s;
  	animation-fill-mode: both;
  	-webkit-animation-duration: 0.35s;
  	-webkit-animation-fill-mode: both;
}
.select-menu1 .options1 .option1 {
    display: flex;
    height: 36px;
    cursor: pointer;
    padding: 0 11px;
    border-radius: 8px;
  	align-items: center;
  	background: #fff;
}
.select-menu1 .options1 .option1:hover {
    background: #f2f2f2;
}
.select-menu1 .options1 .option1 i {
  	font-size: 25px;
  	margin-right: 12px;
}
.select-menu1 .options1 .option1 .option-text1 {
  	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 16px;
	line-height: 19px;
	color: #6D6A5D;
  	margin-left: 19px;
}
.select-btn1 i {
  	font-size: 25px;
  	transition: 0.3s;
}
.select-menu1.active .select-btn1 i {
  	transform: rotate(-180deg);
}
.select-menu1.active .options1 {
  	display: block;
  	opacity: 0;
  	z-index: 10;
  	animation-name: fadeInUp;
  	-webkit-animation-name: fadeInUp;
  	animation-duration: 0.4s;
  	animation-fill-mode: both;
  	-webkit-animation-duration: 0.4s;
  	-webkit-animation-fill-mode: both;
	border-radius: 5px;
}
.mainoption1 {
    background: #FFFFFF;
    /*box-shadow: 0px 0px 15px 1px rgb(0 0 0 / 10%);*/
    width: 350px;
    padding: 0 20px 0px 0px;
}
.select-menu1.active .up_arrw_rotate{
	transform: rotate(180deg);
}
.new_resource_title p.awesome_title{
	box-shadow: none;
	margin: 5px 0 0 0;
}
.output_back_btns a button{
	margin: 15px 0 15px 0px;
}
.output_step_2_input h4 img{
	margin-right: 30px;
}
.type_word_text .input_lable_submit label{
	text-align: center;
    width: 270px;
}
.form_data_table .table-responsive.table_sub{
	height: auto;
}
/*.form_th{
	width: 9%;
}
.form_th_two{
	width: 576px;
}*/
/*.table{
	table-layout: fixed;
}*/
.type_word_text{
	text-align: center;
}
.media_icons_output {
	/*text-align: right;*/
}
.word_flex_item{
	display: flex;
	justify-content: space-between;
	padding: 15px 10px;
}
.word_flex_item h6{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	color: #676767;
}
.gredient_color_heading{
	/*background: linear-gradient(180deg, #FFA762 0%, #4FAA6F 100%);*/
	background: #4FAA6F;
	border-radius: 0px 0px 5px 5px;
	transform: matrix(1, 0, 0, -1, 0, 0);
}
.dutch_word_card p{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 14px;
	color: #FFFFFF;
	padding: 7px 10px;
	transform: matrix(1, 0, 0, -1, 0, 0);	
}
.dutch_word_card{
	background: #FFFFFF;
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
	border-radius: 5px;
	margin-bottom: 36px;
}
.last_output_three{
	width: calc(100% - 0px);
	left: 0;
	overflow: scroll;
	/*padding: 10px;*/
}
.last_output_three .content{
	width: 100%;
}
.drop-down__item a img{
	/*width: 19px;*/
	margin-right: 5px;
	height: 19px;
}
.drop-down.drop-down--active .drop-down__button{
	background: #555555;
}
.drop-down.drop-down--active{
	background: #fff;
	color: black;
}
button.close_para{
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	font-size: 20px;
	letter-spacing: -0.015em;
	color: #187492;
	background: #fff;
    float: right;
    margin: 5px;
}
.participents_title{
	padding-left: 260px !important;
}
.flex_item_pre_buttons{
	display: flex;
	justify-content: space-between;
}
.table.edit_save_pro_table th,
.table.edit_save_pro_table td{
	padding: 37px 0px 37px 50px;
}
.classes_table_shadow .table th.participants_aaaaa{
	padding: 28px 0 28px 0px;
}

.auth-logo .auth-logo-dark {
    display: block;
    margin: 23px auto 0;
}

.header-fixed {
    width: 100%;
    height: 500px; 
    display: block;
}

.header-fixed th:nth-child(2) {
  	width: 40%;
}
.header-fixed td:nth-child(2) {
  	width: 40%;
}
.table.header-fixed th{
	border-top: none;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	color: #555555;
	border-bottom: 1px solid #555555;
}
.table.header-fixed td {
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 300;
	font-size: 16px;
	line-height: 19px;
	color: #555555;
	border-top: none;
	padding-top: 40px;
	padding-bottom: 40px;
	line-height: 19px;
}
.table.header-fixed td p{
	width: 500px;
	line-height: 22px;
}




@keyframes fadeInUp {
  from {
    transform: translate3d(0, 30px, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes fadeInDown {
  from {
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
  to {
    transform: translate3d(0, 20px, 0);
    opacity: 0;
  }
}

/*---------------------------------------------------*/

.sidebar_logo_white img{
	margin-left: 10px;
	margin-top: 2px;
}
.a_single_data_td {
  width: 688px;
}

.user_title{
	  color: var(--grayColor);
  padding-top: 30px;
  padding-left: 13px;
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 500;
  font-size: 28px;
}
@media(max-width: 414px)
{
    button.btn-2 img{
        width: 20px;
        padding: 0;
    }
}
.button-active {
    color: #1d2631 !important;
}
.button-active .hover_green_icon{
	display: inline-block !important;
}
.button-active .white_icons{
	display: none !important;
}
.button-active::after {
	background: #fff !important;
    z-index: -1 !important;
    border-radius: 0px 50px 50px 0px !important;
	width: 80% !important;
	color: #1d2631 !important;
	cursor: pointer !important;
    content: "";
    position: absolute !important;
}
.button-active::before {
	background: #fff !important;
    content: "";
    position: absolute !important;
    z-index: -1 !important;
    border-radius: 0px 50px 50px 0px !important;
}

.back_next_btn a button:hover, .back_next_btn input:hover, .btn-submit:hover {
	color: #4FAA6F;
    background: #FFFFFF;
	border: 1px solid #4FAA6F;
}

.user_detailed a button:hover, .user_data_table button.edit_group_btn:hover {
	color: #1d2631;
	background: #FFFFFF;
	border: 1px solid #1d2631;
}

.swal2-styled.swal2-default-outline:focus {
	box-shadow: none !important;
}
.swal2-styled.swal2-confirm, .swal2-styled.swal2-cancel {
	border: 1px solid transparent !important;
}
.swal2-styled.swal2-confirm:hover {
	border: 1px solid rgb(254, 125, 34) !important;
	color: rgb(254, 125, 34);
	background-color: #fff !important;
}
.swal2-styled:hover {
	background-image: none !important;
}

.swal2-styled.swal2-cancel:hover {
	border: 1px solid rgb(221, 51, 51) !important;
	color: rgb(221, 51, 51);
	background-color: #fff !important;
}

.body-card {
	box-shadow: 0px 0px 10px 5px rgba(35, 35, 35, 0.05);
    border-radius: 10px;
	height: calc(100vh - 128px);
	border-radius: 10px;
}
.section-header {
    margin-top: 1.2rem;
}
.page-title h2, .swal2-title {
	font-family: 'Rubik' !important;
	font-style: normal !important;
	font-weight: 500 !important;
	font-size: 28px !important;
	color: var(--grayColor) !important;
}

.next-pre-button a button {
	font-family: 'Rubik';
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    color: #4FAA6F;
    background: #FFFFFF;
    border-radius: 5px;
    padding: 10px 30px;
	width: 250px;
	margin: 2px;
	border: 1px solid #4FAA6F;
}

.cross-button a button {
	border-radius: 50%;
    background: #4FAA6F;
    color: #FFFFFF;
    margin-right: 30px !important;
}

.next-pre-button a button:hover, .cross-button a button:hover, .buttons-active {
	background: #4FAA6F !important;
	border: 1px solid transparent !important;
	color: #FFFFFF !important;
}

.back-button a button { 
	font-family: 'Rubik';
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
	background: #4FAA6F !important;
	border: 1px solid transparent !important;
	color: #FFFFFF !important;
	border-radius: 5px;
    padding: 10px 30px;
	width: 200px;
	margin: 2px;
}

.back-button a button:hover { 
	background: #FFFFFF !important;
	border: 1px solid #4FAA6F !important;
	color: #4FAA6F !important;
}

.search-input { 
	line-height: 1.8;
}

.word-result th {
	font-family: 'Rubik';
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    color: #232323;
}

.word-result td {
	font-family: 'Rubik';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    color: #8F8F8F;
}

.table-responsive td {
	font-family: 'Rubik';
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    color: #8F8F8F;
}

.edit_group_btn{
	background:var(--grayColor);
	color: #FFFFFF;
	border: 1px solid #1d2631;
	font-family: 'Rubik';
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	padding: 7px 30px;
}

.edit_group_btn:hover {
	color: #1d2631;
	background: #FFFFFF;
	border: 1px solid #1d2631;
}

.page-link {
	color: #1d2631;
}

.page-item.active .page-link {
    z-index: 1;
    color: #fff;
    background-color: #1d2631;
    border-color: #1d2631;
}

.page-link:hover {
    color: #1d2631;
    text-decoration: none;
    background-color: #e9ecef;
    border-color: #dee2e6;
}

.page-link:focus {
    z-index: 2;
    outline: 0;
    box-shadow: 0 0 0 0.1rem #1d2631;
}

.cursor-pointer {
	cursor: pointer;
}

.new-img {
    border-radius: 50%;
    height: 100px;
    width: 100px !important;
    object-fit: cover;
}

.button-without-color {
	background-color: #FFFFFF !important;
	color: #212529 !important;
	border: 1px solid #CFCFCF !important;
}

.separator{
	position: relative;
	text-align: center;
}

.separator label{
	background-color:#fff;
	padding: 0 0.4em;
	position: relative;
	margin-bottom: 0px;
}

.separator:before{
	content: '';
	border-style: solid;
	border-width: 0 0 1px 0;
	position: absolute;
	left: 0;
	top: 50%;
	width: 100%;
	border-color: #1d2631;
}

.simple-text {
	color: #9a1c0f !important;
	font-weight: normal;
}

.table-responsive {
	overflow: hidden;
}

a.classes_heading_two{
    margin: auto;
}

a.classes_heading_two.unset_margin{
    margin: unset;
}


.col-12.mt-4.d-flex.flex-wrap.align-items-center {
    margin-left: -16px;
}

.content-wrapper{
    overflow-y: unset !important;
}

@media only screen 
and (min-width: 768px) 
and (max-width: 1023px)
{
a.classes_heading_two {
    margin: unset !important;
    margin-top: 10px !important;
}
 .content-wrapper{
    overflow-y: scroll !important;
}
}

@media only screen 
and (min-width: 375px) 
and (max-width: 767px)
{
    .sidebar_logo_white img{
         margin-left: 4px;
    margin-top: 4px;
    height: 33px;
    }
    .closed-menu .vertical-menu-wrapper ul, .closed-menu .vertical-menu-wrapper hr{
        margin-left:-4px;
    }
    button.btn-2 img.hover_green_icon{
        margin-right:10px;
    }
    img.img-fluid.white_icons {
    margin-right: 8px;
    }
    i.fa.fa-bars.openDrop {
    font-size: 23px;
    margin-left: -1px;
    }
    a.classes_heading_two {
    margin: unset;
    margin-top: 10px;
    }
    .content-wrapper{
    overflow-y: scroll !important;
}
}
.swal-button {
    background-color: #212529;
    color: #fff;
    border: none;
    box-shadow: none;
    border-radius: 5px;
    font-weight: 600;
    font-size: 14px;
    padding: 10px 24px;
    margin: 0;
    cursor: pointer;
}

.swal-button:not([disabled]):hover {
    background-color: #ffffff;
	color: #212529;
}

#fullscreen-button {
      position: fixed;
      top: 20px;
      left: 20px;
      cursor: pointer;
    }