body{position:relative;}

.savedtime{position:absolute;top:10px;right:10px;color:#CCC;display:none;}
.saved_over{top:-20px !important;}
.game_container .saved_over{top:-60px !important;}

.avg_btn_container, .ui-button-buttonset{
	text-align: center;
	margin-top: 25px;
	margin-bottom: 25px;
}

.avg_btn_container2, .ui-button-buttonset{
	text-align: center;
	display:inline-block;
}

.avg_btn_container .btn, .ui-button, .avg_btn_container2 .btn{
	background: #37114B !important;
	border-color: #37114B !important;

	display: inline-block;
	color: white !important;
	font-size: 20px;
	height: 50px;
	line-height: 50px;
	border-radius: 5px !important;
	padding: 0 20px;
	text-transform: uppercase;
}

.avg_btn_container.btnmin .btn, .ui-button, .avg_btn_container2 .btn{
	color: white !important;
	font-size: 15px;
	height: 35px;
	line-height: 30px;
	border-radius: 5px !important;
	padding: 0 5px;
	text-transform: uppercase;
}

.ui-dialog .ui-dialog-titlebar {
    min-height: 1.7em;
    box-sizing: border-box;
}


.right_menu_btn_small {
	background: #37114B !important;
	border-color: #37114B !important;
	color: white !important;
	font-size: 10px;
	height: 16px;
	line-height: 16px;
	border-radius: 5px !important;
	padding: 2px 5px 2px 5px;
	text-transform: uppercase;
	text-align:center;
	cursor:pointer;
	max-width:150px;
	display:inline-block;
	cursor:pointer;
}
.right_menu_btn a{color:white !important;}

.right_menu_btn {
	background: #37114B !important;
	border-color: #37114B !important;
	color: white !important;
	font-size: 12px;
	height: 35px;
	line-height: 35px;
	border-radius: 5px !important;
	padding: 0;
	text-transform: uppercase;
	text-align:center;
	cursor:pointer;	
	width:180px;
	margin:auto;
}

.right_menu_btn:hover
{
	background: #461d5c !important;
}

.right_menu_btn a{color:white !important;}

.manage_btn{
	background: #37114B;
	border-color: #37114B !important;
	color: white !important;
	font-size: 12px;
	height: 35px;
	line-height: 35px;
	border-radius: 5px !important;
	padding: 0 20px;
	text-transform: uppercase;
	text-align:center;	
	display:inline-block;
	margin-bottom:5px;
	cursor:pointer;
}
.manage_btn a{color:white !important;}

.table_class{display:table;	box-sizing:border-box;width:100%;}
.tr_class{display:table-row;}
.td_class{display:table-cell;padding:0px; vertical-align: middle;}
.maximized{height:100%;width:100%;text-align:center;}
.centered{vertical-align:middle;margin:auto !important;text-align:center;}
.ib{display:inline-block;}
.gameedit{background-color:#CCCCCC;}
/*
.delete,.delete_type{position:absolute;right:-10px;top:-10px;padding:1px;border-radius:2px;opacity:0.6;background-image:url(images/delete.png);background-repeat:no-repeat;width:16px;height:16px;overflow:visible;cursor:pointer;}
*/
.delete:hover{opacity:1;}
.tbl .a_card{cursor:pointer;display:inline-block;background-color:#FFFFFF;margin-right:20px;margin-bottom:20px;text-align:center;}
.a_card img{max-width:100%;max-height:100%;}

/*games*/

.vat{vertical-align:top;}
.am{text-align:middle;}
.box_bgcolor{background-color:#CCCCCC;border-radius:20px;padding:20px;}
#imagesover_main{position:relative;display:inline-block;}


.image_main{position:relative;padding:10px;display:inline-block;}



.vam{vertical-align:middle !important;}
.img_error{border:1px dashed #FF0000;}
.table_error{background-color:#fce0e0;}


.nv{visibility:hidden;}

/*
.delete{padding:1px;border-radius:2px;position:absolute;top:-10px;right:-5px;background-image:url(images/delete.png);background-repeat:no-repeat;width:16px;height:16px;overflow:visible;cursor:pointer;z-index:1;}
*/
.delete:hover{background-size:120% 120%;}

a.add:before{
	background:#2F9E82;
	content: '+';
	width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	border-radius: 10px;
	display: inline-block;
	color: white;
	font-size: 31px;
	vertical-align: middle;
	margin-right: 12px;
	cursor:pointer;
	margin-top:-5px;
	margin-left:6px;
}


a.add:hover:before{
	background: #41b396;
}
.relative{position:relative}

 /* The switch - the box around the slider */


/* Hide default HTML checkbox */
.switch {position:absolute;top:-1000px;left:-1000px;visibility:hidden;}

/* The slider */
.input_slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.input_slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .2s;
  transition: .2s;
}

input:checked + .input_slider {
  background-color: #2196F3;
}

input:focus + .input_slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .input_slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.input_slider.round {
  border-radius: 34px;
}

.input_slider.round:before {
  border-radius: 50%;
} 


/*game edit page with two column*/
.game_container
{
	position:relative;
	width:100%;
	height:100%;
	overflow:visible;
	display:flex;
}
.game_left
{
	width:350px;
	background:#F3F3F3;
	height:100%;
	float:left;
	-moz-box-shadow: 5px 0 3px 0 #F3F3F3;
	-webkit-box-shadow: 5px 0 3px 0 #F3F3F3E;
	box-shadow: 5px 0 3px 0 #F3F3F3;	
}


.game_button_cont{text-align: justify;width:100%;overflow:hidden;padding-left:7px;}
.game_button{text-align:left;width:80px; height:80px;display:inline-block;}
.game_cell_container{padding:7px;box-sizing:border-box;}
.game_cell_container .button_with_info{border-radius:0px !important;}
.fillparent{position:absolute;top:0px;right:0px;left:0px;bottom:0px;}
.game_cell{display:inline-block;}
.game_title{font-size:0.8em;font-weight:600;}
.texttoright{text-align:right;}

.ajaxfileupload{position:absolute;width:100%;top:0px;right:0px;height:100%;opacity:0;cursor:pointer;box-sizing:border-box;left:0px;bottom:0px;}
.txtinput{
	background: white;
	height: 34px;
	line-height: 32px;
	padding: 0 10px 0px 15px;
	border-radius: 10px;
	border: 0;
	font-size: 15px;
	width: 100%;
	box-sizing: border-box;
	outline: none;
}
textarea.txtinput {height:100px !important;font-family: inherit; }
.hidden{display:none !important;}
.hidden2{display:none;}

#left{
	float: left;
	height:100%;
}
.admin_left{width:calc(100% - 270px);}
.updated{border:1px dashed #000000 !important;}
.admin_home .projects .table_class a.ico.deleteico, a.ico.deleteico { background-image: url(images/delete_icon.svg); }
.admin_home .projects .table_class a.ico.editico, a.ico.editico { background-image: url(images/edit.svg); }
.admin_home .projects .table_class a.ico.editico2, a.ico.editico2 { background-image: url(images/edit2.svg); }
.admin_home .ico, a.ico{
	background: no-repeat center;
	background-size: 18px;
	width: 30px;
	height: 30px;
	display: inline-block;
	margin: 0 2px;
	cursor:pointer;
	background-color:#fff;
	border-radius: 15px;
	
}

.admin_home a.ico:hover{
	background-color:#f4f4f4;
	
	
}

.w33{width:32% !important;}
.switchlabel{margin-right:10px;}
.jscolor{width:86px;}
.pass-graybar{width:calc( 100% - 20px ) !important; margin-left:10px !important; height:0px !important;margin-top:3px;}
.pass-colorbar{height:6px !important;top:-9px !important;}


#msg{background-color:#2ecf7a;color:#FFFFFF;font-weight:bold;text-align:center;padding:10px;}

.ui-widget-header
{
	border:none !important;
	background:none !important;
}

.ui-dialog{box-shadow:#CCCCCC 0px 0px 10px inset}
.ui-button{outline: none;}

.actual_state{margin-bottom:15px;display:block;text-align:center;}

.actual_state .userphoto, .userphoto{width:60px;height:60px;margin:auto;border-radius:33px;border: 0px solid #37114B; margin-bottom:8px; overflow:hidden;}
.actual_state .userphoto  img, .userphoto img{overflow:hidden;}

.ui-widget-header{color:#000000 !important;}

.upload_avatar{opacity:0;position:absolute;top:0px;right:0px;cursor:pointer;}

.w150{width:150px;}

/*---------------------------------------------------*/
/*---------------------------------------------------*/
.login_box{
	background: #FFFFFF;
	width: 100%;
	height: 100%;	
	color: #3b3831;
}

.login_box .wrapper{
	width: 380px;
	/*position: absolute;
	left: 50%;
	top: 50%;
	transform: translateX(-50%) translateY(-50%);*/
	text-align: center;
	margin:auto;
}
.login_box .name{
	font-size: 70px;
	display: block;
	margin-bottom: 30px;
	padding: 20px;
	box-sizing: border-box;
}
.login_box .name img{
	max-width:100%;
}

.login_box .real_login
{
	background: url(images/padlock.svg) no-repeat left center;
}

.login_box .header{
	background-size: 25px 34px;
	font-size: 1.6em;
	display: block;
	margin-bottom: 25px;
	font-weight: normal;
	text-transform: uppercase;
	/*padding-left: 37px;*/
	line-height: 34px;
}
.login_box .field{
	margin-bottom: 8px;
}
.login_box .field 
{
	position:relative;
}
.field .state, .edituser .state{position:absolute;top:10px;right:-30px;cursor:pointer;}
.login_box .txtinput, .imrapp .txtinput{
	background: white;
	height: 36px;
	line-height: 36px;
	padding: 0 20px;
	border-radius: 12px;
	border:1px solid #E0E0E0;
	font-size: 18px;
	width: 300px;
	box-sizing: border-box;
	outline: none;
	padding-left:20px;
	margin:3px;
}
.login_box .btn_container{
	margin: 25px 0 60px 0;
}
.btn_container a{
	color: #3d1851;
	text-decoration: underline;
}

.btn_container a:hover{
	color: #74478c;
	/*text-decoration: underline;*/
}
.login_box .button_nickname,
.login_box  .button{
	display: inline-block;
	/*width: 150px;*/
	height: 53px;
	line-height: 53px;
	border: 2px solid white;
	font-size: 24px;
	text-transform: uppercase;
	border-radius: 10px;
	color: white;
	text-decoration: none;
	padding:0 15px 0 15px;
	background-color:#37114B;
	color:#FFFFFF;	
}

.login_box .button:hover{
	
	background-color:#552b6b;
	color:#fff;
}

.portrait img{height:100%;}
.landscape img{width:100%;}

.blue_button{background-color:#459af1 !important;}
.green_button{background-color:#2ecf7a !important;}
.orange_button{background-color:#37114B !important;}
.button_with_info
{
	display:inline-block;
	color: white !important;
	font-size: 12px;
	border-radius: 10px !important;
	text-align:center;
	cursor:pointer;	
	padding:6px;
	font-weight:600;
}
.button_img{
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 20px;
    display: inline-block;
    color: white;
    font-size: 30px;
    vertical-align: middle;
    margin-right: 6px;
    cursor: pointer;


}

.disabled{pointer-events:none !important;opacity:0.3 !important;cursor:default;}


.ar{text-align:right !important;}
.al{text-align:left !important;}
.ac{text-align:center !important;vertical-align:middle;}
.ar{text-align:right;}
.fl{float:left;}

video
{
	max-width:800px;
	height:auto;
}


.fa{width:16.5px;height:16.5px;}

.fa-exclamation-triangle{color:red !important;}

.bordered td,.bordered .td_class{border:1px solid #0000CC;min-width:100px;padding:5px;}
.noborder .td_class{
	border: none !important;
}

/* fa checkbox and radio */

.fa-checkbox,
.fa-radio
{
	position: absolute;
	right: 9000px;
	visibility:hidden;
}
.fa-label{font-size:30px;margin-left:15px;cursor:pointer;}

/*Check box*/
input[type="radio"] + .fa-label:before
{
	radius:
}
input[type="checkbox"] + .fa-label:before
{
	content: "\f096";	
}
input[type="radio"] + .fa-label:before
{
	content: "\f10c";
}
input[type="checkbox"] + .fa-label:before,
input[type="radio"] + .fa-label:before
{

	font-family: "FontAwesome";
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing:antialiased;
	width: 1em;
	display: inline-block;
	margin-right: 5px;
	margin-top:3px;
}
input[type="checkbox"]:checked + .fa-label:before
{
	content: "\f14a";	
}
input[type="radio"]:checked + .fa-label:before
{
	content: "\f111";	
}


input[type="checkbox"]:checked + .fa-label:before,
input[type="radio"]:checked + .fa-label:before
{
	color: #B53022;
	animation: effect 250ms ease-in;
}
@keyframes effect{
	0%{transform: scale(0);}
	25%{transform: scale(1.3);}
	75%{transform: scale(1.4);}
	100%{transform: scale(1);}
}

.absolute_top_right{position:absolute;top:0px;right:10px;}

.none{display:none !important;}


.uploadimage{
	width:26px;
	height:26px;	
	background:url(./images/photo_upload.svg) no-repeat;
	background-size: 26px 26px;
	cursor:pointer;
	background-color: #F3F3F3;	
	position:relative;
}
.uploadimage input{opacity:0;width:22px;height:22px;cursor:pointer;}
.deleteimage{
	width:26px;
	height:26px;
	background-image: url(./images/delete_icon.svg);
	background-size: 26px 26px;
	cursor:pointer;
	background-color: #F3F3F3;	
}
.imageops .deleteimage{margin-top:3px;}


.two_column{}
.two_column .cl{float:left;}
.two_column image{max-width:50%;float:left;}

.upload_progress {
    position: absolute;
    bottom: -5px;
    left: 3px;
    font-size: 8px;
    z-index: 10;
}
.guide_line .upload_progress{color:#000000;}
.upload_multimedia input{cursor:pointer;width:25px;}


.guide_line_container .tr_class .td_class:nth-child(1){vertical-align:top;text-align:right;width:150px;}
.guide_line_container .tr_class .td_class:nth-child(2){vertical-align:top;text-align:left;width:calc(100% - 150px);height:100%;}
.guide_line_container .td_class{background-color:#CCCCCC;padding:10px;}
.guide_line_container{border-spacing:0 !important;width:100%;height:100%;}
.guide_line_container, .guide_line_container textarea{width:100%;height:100%;}
.guide_line_container img{max-width:100%;height:auto;}

#guidebox li a{display:block;min-height:15px;}

.error
{
	color:#F7786B;
	font-size:20px;
	overflow:hidden;
	font-weight:600;
}

.imgcont{width:100%;height:100%;text-align:center;}
.imgcont img{max-width:100%;margin:auto;}

.clone_button{background-color:#f46036 !important;}


/*uploaded image*/
.nc_left .image{position:relative;display:block;float:left;margin-right:10px;}
.nc_left .image img{max-height:66px;max-width:100px;}

.reply_input_cont .image{}
.chatspace .nc_left .image img{max-height:110px;max-width:150px;}
.nc_left .image_cont,
.reply_input_cont .image_cont,
.element_rows .image_cont,
.a_mainimage.image_cont
{
	position:relative;display:inline-block;
}
.nc_left .image_cont .delete_image,
.reply_input_cont .image_cont .delete_image,
.element_rows .image_cont .delete_image,
.image_elm .delete_image,
.image_cont .delete_image,
.imagecontainer .delete_image

{
    color: #00000;
    font-family: 'Helvetica', 'Arial', sans-serif;
    font-size: 21px;
    font-weight: bold;
    text-align: center;
    width: 25px;
    height: 25px;
    border-radius: 40px;	
	position:absolute;
	top:0px;
	right:0px;
	background-color:#FFFFFF;
	cursor:pointer;
}
.nc_left .image_cont .delete_image:hover, .reply_input_cont .image_cont .delete_image:hover
{
	background-color:#CCCCCC;
	color:#FFFFFF;
}



.wmodal{text-align:center;}

/*
.with_placeholder:empty:not(:focus)::before {
    content: attr(data-text);
    color: #C2C2C2;
}
*/
.with_placeholder{text-align:center;color:#666666;;}
.with_placeholder:empty:not(:focus):before {
  content: attr(data-text);
  pointer-events: none;
  display: block; /* For Firefox */
  color:#CCCCCC;
}



.template{position:absolute;top:-1000px;left:-1000px;display:none;}
.progress{font-size:1em;color:#F3F3F3;}

.left_result .rate .dislike, .left_result .rate .like
{
	pointer-events:none !important;opacity:0.3 !important;cursor:default;	
}


.wnr{width:49%;}
.wnr > * {float:left;}
.wnr > input {width:50px;}


#upload_status{
	position:absolute;
	width:300px;
	height:10px;
	top:10px;
	left:calc(50% - 150px);
	border-radius:10px;
	font-size:20px;
	font-weight:600;
	text-align:center;
	background-size:10px 30px;	
	background-image: linear-gradient(135deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);	
	height:10px;
	background-color:#CCCCCC;
	border-radius:10px 10px 10px 10px;
	height:10px;
	display:none;
}
#upload_status .perc_left{
	background-size:10px 30px;
	background-image: linear-gradient(135deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);	
	height:10px;
	width:0%;
	background-color:#34c2e3;
	border-radius:10px 10px 10px 10px;
	float:left;
}

.max_height{height:100%;}

.loading{
	background:url(images/loading2.gif);
	background-size:50px 50px;
	position:absolute;
	top:calc(50% - 25px);
	left:calc(50% - 25px);
	width:50px;
	height:50px;
	z-index:15;
}


.blockMsg{padding:20px !important;background-color:#FBEEC1 !important;color:#000000;box-sizing:border-box;border:0 !important;}
.he{display:none;}

input:focus::placeholder {
  color: transparent;
}


select{
  font-size: 16px;
  font-family: sans-serif;
  font-weight: 700;
  color: #444;
  line-height: 1.3;
  padding: .6em 1.5em .5em .8em;
  box-sizing: border-box;
  margin: 0;
  border: 1px solid #aaa;
  box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
  border-radius: .5em;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: #fff;
}
/*.select-container{width: calc(100% - 35px) !important;} */
.select-container {position:relative;display:inline-block;}
.select-container::after {
    content: ' ';
    position: absolute;
    top: 15px;
    right: 10px;
    width: 10px;
    height: 10px;
    background: #FFFFFF;
    background-color: rgb(255, 255, 255);
    pointer-events: none;
    background-color: #00BFFF;
    clip-path: polygon(100% 0%, 0 0%, 50% 100%);
    cursor: pointer;
}

.ac{text-align:center;}
.acc{margin:auto;}

.cont_editable{
	background-color: #F8F8F8;
	border: 3px solid #F1F1F1;	
	min-height: 25px;
	min-width: 200px;	
	line-height: 25px;	
}

.rightmenu {
  position: absolute;
  top: -40px;
  right: 10px;
}
.tr_class .rightmenu{top:-30px;}
.rightmenu > div {
  overflow: auto;
  padding: 10px;
}

.search_term {
  outline: none;
  display: inline-block;
  width: 160px;
  float: right;
  padding-right: 30px !important;
  background: url(images/search.svg) no-repeat;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
  background-size: 20px 20px;
  background-position: 134px 8px;
	height: 36px;
	line-height: 36px;
	padding: 0 20px 0 20px !important;
	padding-right: 20px;
	border-radius: 12px !important;
	border: 1px solid #E0E0E0 !important;
	font-size: 15px;
	box-sizing: border-box;
	outline: none;
	margin: 3px;  
}
.tr_class.search{height:20px;}

.add a::before {

    background: #2F9E82;
    content: '+';
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 10px;
    display: inline-block;
    color: white;
    font-size: 31px;
    vertical-align: middle;
    margin-right: 12px;
    cursor: pointer;
    margin-top: -5px;

}

.mark{background-color: #F6798A;}

.loading{
	background:url(images/loading2.gif) no-repeat;
	background-size:50px 50px;
	position:absolute;
	top:calc(50% - 25px);
	left:calc(50% - 25px);
	width:50px !important;
	height:50px !important;
	z-index:15;
	box-sizing:border-box;
}

.main_menu li.selected, .col21 li.selected, .left_menu li.selected, .menu .selected{
	background-color:#37114B;
	color:#FFFFFF !important;
}
.menu .selected a{color:#FFFFFF !important;}


.guide_wrapper {max-height:50%;}