@charset "utf-8";
/* CSS Document */

body{
	background-color: #3894c6;
	direction: rtl;
	font-family: 'Rubik', sans-serif;
	margin: 0px;
	font-size: 16px;
	color: #036cb4;
}

h1{
	font-family: 'Rubik', sans-serif;
	font-weight: normal;
	font-size: 45px;
	color: #ffffff;
	text-align: center;
	margin-bottom: 5px;
	margin-top: 20px;
}

h2{
	font-family: 'Rubik', sans-serif;
	font-weight: bold;
	font-size: 18px;
	text-align: right;
	margin-bottom: 10px;
	margin-top: -5px;
	color: #036cb4;
	padding-right: 25px;
}

.normal_font{
	font-weight: normal;
}


h3{
	font-family: 'Rubik', sans-serif;
	font-weight: bold;
	font-size: 16px;
	text-align: right;
	margin-bottom: 0px;
	margin-top: 0px;
	color: #036cb4;
}

h4{
	font-family: 'Rubik', sans-serif;
	font-weight: bold;
	font-size: 18px;
	text-align: right;
	color: #036cb4;
	padding-right: 15px;
	margin: 4px 0px;
}



hr {
    background-image: -webkit-linear-gradient(left, transparent, rgba(56, 148, 198, 0.2), transparent);
    background-image: linear-gradient(to right, transparent, rgba(56, 148, 198, 0.2), transparent);
    border: 0;
    height: 1px;
    margin: 15px 0 25px 0;
}

.tall2{
	margin: 50px 2px 20px 2px
}
/*<------------------------------>*/


.home_edit_row_bg{
	background-color: #bde8f2;
	color: #036cb4;
	padding: 10px;
	border: 1px solid #ffffff !important;
	text-align: right;
 	outline: none;
 	transition: 0.4s;
	font-size: 18px;
	height: 30px;
}


.home_edit_Category_column{
	float: right;
    width: 10%;
    text-align: right;


}


/*<------------------------------>*/



.logos_div{
	background-color: #0773b7;
	height: 120px;
}


.thumbnail {
	width: 20%;
	text-align: center;
	float: right;
	margin-top: 10px;
}

.logos{
	width: 120px;
}

.logo_text{
	color: #ffffff;
	font-size: 14px;
	margin-top: 5px;	
}

.delet_logo_icone{
	background-color: #ff0000;
	color: #ffffff;
	font-size: 20px;
	padding: 4px 8px;
	border-radius: 15px;
}

.delet_logo_icone:hover{
	background-color: #FF0004;
}

.btn_add_logo{
	background-color: #ffffff;
	color: #536920;
	font-family: 'Rubik', sans-serif;
	font-size: 18px;
	font-weight: bold;
	width: 120px;
	margin-right: auto;
	margin-left: auto;
	padding: 10px;
	margin-top: 8px;
	border-radius: 4px;
}

.btn_add_logo:hover{
	background-color: #51ad32;
	color: #ffffff;
}

.btn_green_text{
	margin: 0px;
}

.add_logo_icone{
	font-size: 30px;
}

.add_logo_icone2{
	font-size: 25px;
}


/*<------------------------------>*/


.content_edit_bg{
	background-color: #ffffff;
	width: 90%;
	padding: 20px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 20px;
	border-radius: 4px;
}

.select{
	width: 300px !important;
	height: 30px !important;
}

.search_input {
    height: 35px;
    padding: 3px 8px;
    font-size: 16px;
    line-height: -5px;
    color: #036cb4;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    margin-bottom: 5px;
    margin-left: 0px;
    width: 270px;
    font-family: 'Rubik', sans-serif;
    float: left;
    margin-top: -30px;
}


.form-control {
	height: 25px;
	padding: 3px 8px;
	font-size: 14px;
	line-height: 1.42857143;
	color: #036cb4;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	margin-bottom: 5px;
	margin-left: 0px;
	width: 440px;
	font-family: 'Rubik', sans-serif;
}

input {
    -webkit-writing-mode: horizontal-tb !important;
    text-rendering: auto;
	color: #036cb4;
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: start;
    appearance: auto;
    background-color: -internal-light-dark(rgb(255, 255, 255), rgb(59, 59, 59));
    -webkit-rtl-ordering: logical;
    cursor: text;
    margin: 0em;
	font-family: 'Rubik', sans-serif;
	font-size: 14px;
	padding: 3px 8px;
    border-width: 2px;
	border: 1px solid #ccc;
	border-radius: 4px;
	height: 25px;

}

/*<------------------------------>*/





.accordion {
	background-color: #88dbf2;
	color: #036cb4;
	cursor: pointer;
	padding: 10px;
	width: 100%;
	border: 1px solid #ffffff !important;
	text-align: right;
 	outline: none;
 	transition: 0.4s;
	font-size: 18px;
}


.panel {
 	padding: 10px 10px;
 	display: none;
 	background-color: #baebf7;
 	overflow: hidden;
	border: 1px solid #ffffff !important;

}

.accordion2 {
	background-color: #8ac2ed;
}



.panel.accordion2 {
 	background-color: #cce1f2;

}




.Category_title_div{
	width: 100%;
}

.Category_column{
	float: right;
	width: 20%;
	text-align: right;
}

.Category_column2{
	float: right;
	width: 465px;
}

.Category_column3{
	float: right;
	width: 110px;
}

.Category_column4{
	float: right;
	width: 50px;
}

.Category_bg1{
	background-color: #88dbf2;
	border: 3 solid #ffffff;
	text-align: right;
	padding: 7px;
	margin-top: 8px;
	overflow: overlay;
}

.form-control2 {
	height: 25px;
	padding: 3px 8px;
	font-size: 16px;
	font-weight: bold;
	line-height: 1.42857143;
	color: #036cb4;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	margin-bottom: 0px;
	margin-left: 0px;
	width: 86px;
	font-family: 'Rubik', sans-serif;
	float: right;
}

.form-control3 {
	height: 25px;
	padding: 3px 8px;
	font-size: 16px;
	font-weight: normal;
	line-height: 1.42857143;
	color: #036cb4;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	margin-bottom: 0px;
	margin-left: 0px;
	width: 85px;
	font-family: 'Rubik', sans-serif;
	float: right;
}

.correct_answer{
	background-color: #fcf7c5;
}

.wrong_answer{
	background-color: #f9d7d7;
}


.selected_icone{
	font-size: 24px;
	text-align: center;
	width: 60px;
	background-color: #ffffff;
	padding: 3px;
	border-radius: 4px;
}



.open_game_icone{
	background-color: #536920;
	color: #ffffff;
	font-size: 17px;
	padding: 7px 7px;
	border-radius: 30px;
}


.edit_icone{
	background-color: #036cb4;
	color: #ffffff;
	font-size: 15px;
	padding: 8px 8px;
	border-radius: 30px;
}



.delet_icone{
	background-color: #ff0000;
	color: #ffffff;
	font-size: 18px;
	padding: 6px 9px;
	border-radius: 30px;
}


.duplicate_icone{
	background-color: #662d91;
	color: #ffffff;
	font-size: 16px;
	padding: 9px 9px;
	border-radius: 30px;
}


.delet_icone_sml{
	background-color: #FF0004;
	color: #ffffff;
	font-size: 14px;
	padding: 4px 6px;
	border-radius: 30px;
	margin-top: 6px;
}


.open_game_font{
	color: #536920;
}

.edit_font{
	color: #036cb4;
}



.delet_font{
	color: #FF0004;
}

.duplicate_font{
	color: #662d91;
}





.btn_add_question{
	background-color: #036cb4;
	border-radius: 4px;
	color: #ffffff;
	width: 200px;
	margin-right: auto;
	margin-left: auto;	
	text-align: center;
	margin-top: 60px;
	margin-bottom: 15px;
	padding: 10px;
	font-size: 18px;
}

.btn_add_category{
	background-color: #536920;
	border-radius: 4px;
	color: #ffffff;
	width: 250px;
	text-align: center;
	margin-top: 10px;
	padding: 10px;
	font-size: 20px;
}

.btn_add_category:hover{
	background-color: #51ad32;
}


.btn_white_text{
	margin: 0px;

}

/*<------------------------------>*/


.bottom_edit{
	width: 90%;
	margin-right: auto;
	margin-left: auto;
	margin-top: 20px;
}


.btn_back{
	background-color: #ffffff;
	border-radius: 4px;
	color: #536920;
	width: 250px;
	margin-right: auto;
	margin-left: auto;	
	text-align: center;
	margin-top: 10px;
	padding: 10px;
	font-size: 20px;
	float: right;
	font-weight: bold;
	margin-bottom: 20px;
}

.btn_back:hover{
	background-color: #51ad32;
	color: #ffffff;
}
.btn_save{
	background-color: #ffffff;
	border-radius: 4px;
	color: #536920;
	width: 250px;
	margin-right: auto;
	margin-left: auto;	
	text-align: center;
	margin-top: 10px;
	padding: 10px;
	font-size: 20px;
	float: left;
	font-weight: bold;
	margin-bottom: 20px;
}

.btn_save:hover{
	background-color: #51ad32;
	color: #ffffff;
}
