@import url('Login.css');


/* 
	HEADER 
*/
.flexdown-content {
    float:right;
	left: calc(0vw);
}
.LoginHeaderPane .headerTop .templateTitle
{
    float: right;
    text-align: right;
	margin: 4px;
}

/* Visualsoft */
.dxsplControl_Visualsoft 
{
    font-family: Segoe UI;
}






/* edit*/


.screen__background__shape11 {
	height: 520px;
	width: 520px;
	background: #FFF;	
	top: -50px;
	left: 120px;	
	border-radius: 0 0 0 72px;
}


.screen__background__shape1 {
	display: none!important;
	height: 520px;
	width: 520px;
	background: #FFF;	
	top: -50px;
	right: 120px;	
	border-radius: 0 72px 0 0;
}


.dxeBase_Visualsoft {
	margin-right: 20px;
	}
	
	.dxbButtonSys.dxbTSys{
		margin-right: 20px;
	}
	
	.dxeButtonEdit_Visualsoft {	
	margin-right: 20px;
	}
	
	a.dxbButton_Visualsoft {
		margin-right: -10px;
	}
	
	.logo-en {
display: none!important;
}
	
	.logo-ar {
    display:block!important;
    margin-top: 10%;
    margin-right: 18%;
    width: 100%;
    text-align: center;
    position: absolute;
}

.login__input {

	padding-right: 24px;

}

.svg1 {
		 Height:15px;
		 Width:15px;
         position: absolute;
         top: 45px;
         margin-right: 10px;
}

	.svg2 {
		 Height:15px;
		 Width:15px;
         position: absolute;
         top:115px;
         margin-right: 10px;
}


.dxbButtonSys.dxbTSys {
	

    background-color: #615aa2!important;
    font-weight: 700!important;
    transition: .2s!important;
    font-size: 14px;
    margin-top: 30px;
    margin-left: 15%!important;
    border: none!important;
    text-transform: uppercase!important;
    font-weight: 700!important;
    align-items: center!important;
    width: 35%!important;
    cursor: pointer;
    transition: .2s;
	
}
.register{

	padding: 10px 10px!important;

}

#maintable-ar{
		 margin-left: 15%!important;
		 margin-right: 15%!important;
		 width: 70%; 
		 background: rgb(255 255 255);
         font-size: 1.15rem;
         line-height: 1.5;
        font-family:   "Open Sans",'Noto Kufi Arabic', sans-serif !important;
		 direction:rtl;
		 text-align:right;
}



#kg-ar{
         margin-left: 15%!important;
		 margin-right: 15%!important;
		 width: 70%; 
		 background: rgb(255 255 255);
         font-size: 1.15rem;
         line-height: 1.5;
         font-family: "Roboto", sans-serif;

}

#level-ar{
         margin-left: 15%!important;
		 margin-right: 15%!important;
		 width: 70%; 
		 background: rgb(255 255 255);
         font-size: 1.15rem;
         line-height: 1.5;
         font-family: "Roboto", sans-serif;

}

#back{

 float: right;
	padding: 10px 10px!important;
	width: 70px!important;
    font: 12px 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
    border-radius: 0px;
    
    text-transform: uppercase;
    font-weight: 600;
    font-size: 14px;
     position: relative;
    display: block;
    border-radius: 2px;
    cursor: pointer;
    letter-spacing: 1px;
    outline: none;
    text-decoration: none;
    color: #fff!important;
    -webkit-transition: all ease 0.5s!important;
    -moz-transition: all ease 0.5s!important;
    transition: all ease 0.5s!important;
    background: #615aa2!important;
 margin-right: 15%!important;
  margin-top: 15px!important;

}


#nextbtn{

 float: right;
	padding: 10px 10px!important;
	width: 70px!important;
    font: 12px 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
    border-radius: 0px;
    
    text-transform: uppercase;
    font-weight: 600;
    font-size: 14px;
     position: relative;
    display: block;
    border-radius: 2px;
    cursor: pointer;
    letter-spacing: 1px;
    outline: none;
    text-decoration: none;
    color: #fff!important;
    -webkit-transition: all ease 0.5s!important;
    -moz-transition: all ease 0.5s!important;
    transition: all ease 0.5s!important;
    background: #615aa2!important;
 margin-left: 15%!important;
  margin-top: 15px!important;
text-align: center;
}

#nextbtn:hover{
	border-radius: 20px;
	}

#editbtn{
  
  float: left;
  top: -385px;
  width: 130px;  
  right: 0;
  margin-left: 13%;
  font-size:18px;
  font-weight:600;
}


#iframe1{
	width: 100%;
}

.elementor-616 .elementor-element.elementor-element-d16d45e img {

    margin-right: 25px;
}


/* start support popup*/
.overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.4);
  transition: opacity 500ms;
  visibility: hidden;
  opacity: 0;
}
.overlay:target {
  visibility: visible;
  opacity: 1;
}

.popup {
  margin: 0px auto;
  padding: 20px;
 background: rgba(0, 0, 0, 0.6);
  border-radius: 5px;
  width: 70%;
  position: relative;
  transition: all 0s ease-in-out;
}

.popup .close {
  position: absolute;
  top: 10px;
  right: 30px;
  transition: all 200ms;
  font-size: 30px!important;
  font-weight: bold;
  text-decoration: none;
  color: #fff;
}
.popup .close:hover {
  color: #06D85F;
}
.popup .content {

line-height: 1.8;
  max-height: 50%;
  overflow: auto;
   color: #fff;
  font-size: 18px!important;
  direction: ltr;
}
.popup .support {
   margin-right: 10px;
    float: left;
}

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

  .popup{
    padding: 0px;
	position: fixed; 
    width:100%;
  }
#supportpopup{
    width: 120%;
	  }  
  
  
}	

/* end support popup*/

  #supportico{
margin-right: 88%;
border: none;
float: left;
margin-top: 55px;
background: transparent;
cursor: pointer;
opacity: 0.7;
}

	    #ask{
      display: none!important;
      }

 #askar{
            color: #fff;
            font-family: sans-serif !important;
            display: none;
            font-size: 15px;
            font-style: normal;
            font-weight: 700;
            line-height: 20px !important;
			 margin-left: -3px;
			 padding-bottom: 7px;
        }
.fab:hover #askar {
            display: block;
        }
		@media screen and (max-width: 700px){

  .popup{
    padding: 0px;
	position: fixed; 
    width:100%;
	margin-top: 20%
  }
#supportpopup {
    width: 142%;
    transform: scalex(0.85);
    transform-origin: left center;
    left: -100px;
    position: absolute;
}

 #supportico{
     position: absolute;
    left: 0;
    bottom: 0;
 }
	  

}