
/* arabic */
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Cairo'), local('Cairo-Regular'), url(../fonts/SLXGc1nY6HkvalIkTpu0xg.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE80-FEFC;
}
/* latin-ext */
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Cairo'), local('Cairo-Regular'), url(../fonts/SLXGc1nY6HkvalIvTpu0xg.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Cairo'), local('Cairo-Regular'), url(../fonts/SLXGc1nY6HkvalIhTps.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

html,body,p,td,span,tr,div,a{font-family:cairo,'open sans'}








/* Add here all your CSS customizations */

.loader {
  width: 250px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  font-family: helvetica, arial, sans-serif;
  text-transform: uppercase;
  font-weight: 900;
  color: rgba(0, 136, 204, 1);
  letter-spacing: 0.2em;
}
.loader::before, .loader::after {
  content: "";
  display: block;
  width: 15px;
  height: 15px;
  background:rgba(0, 136, 204, 1);
  position: absolute;
  -webkit-animation: load .7s infinite alternate ease-in-out;
          animation: load .7s infinite alternate ease-in-out;
}
.loader::before {
  top: 0;
}
.loader::after {
  bottom: 0;
}

@-webkit-keyframes load {
  0% {
    left: 0;
    height: 30px;
    width: 15px;
  }
  50% {
    height: 8px;
    width: 40px;
  }
  100% {
    left: 235px;
    height: 30px;
    width: 15px;
  }
}

@keyframes load {
  0% {
    left: 0;
    height: 30px;
    width: 15px;
  }
  50% {
    height: 8px;
    width: 40px;
  }
  100% {
    left: 235px;
    height: 30px;
    width: 15px;
  }
}





#UpdatePanel1{margin-top:25px}		




[data-tooltip] {
  position: relative;
  z-index: 2;
  cursor: pointer;
}

/* Hide the tooltip content by default */
[data-tooltip]:before,
[data-tooltip]:after {
  visibility: hidden;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  pointer-events: none;
}

/* Position tooltip above the element */
[data-tooltip]:before {
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-bottom: 5px;
  margin-left: -190px;
  padding: 7px;
  width: 350px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #000;
  background-color: rgba(23, 23, 23, 1);/* hsla(0, 0%, 20%, 0.9);*/
  color: #fff;
  content: attr(data-tooltip);
  text-align: center;
  font-size: 14px;
  line-height: 1.2;
}

/* Triangle hack to make tooltip look like a speech bubble */
[data-tooltip]:after {
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -5px;
  width: 0;
  border-top: 5px solid #000;
  border-top: 5px solid hsla(0, 0%, 20%, 0.9);
  border-right: 5px solid transparent;
  border-left: 5px solid transparent;
  content: " ";
  font-size: 0;
  line-height: 0;
}

/* Show tooltip content on hover */
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
  visibility: visible;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}










.icon-to-top {
	-webkit-transition: all 0.3s ;
	transition: all 0.3s ;
	background: #282d36 ;
	border-radius: 7px 7px 0 0   ;
	top: 0px ;
	color: #FFF ;
	display: block ;
	height: 30px ;
	
	padding: 5px 10px 25px ;
	/*position: absolute ;*/
	/*right: 10px !important;*/
	text-align: center ;
	text-decoration: none ;
	min-width: 50px ;
	/*z-index: 1040 ;*/
	/*z-index: 1019 ;*/
	text-align:center ;

}

html .icon-to-top:hover {
	opacity: 1 !important;
	height:50px;
}

html .icon-to-top.visible {
	opacity: 0.75 ;
}

html .icon-to-top span {
	display: inline-block !important;
	padding: 0 5px !important;
}

html.ie11 .icon-to-top {
	/*right: 25px !important;*/
	text-align:center
}

/* Responsive */
@media (max-width: 991px) {
	html .icon-to-top.hidden-mobile {
		display: none !important;
	}
}






/* Add here all your CSS customizations */
.thumb-info {
    text-align:center;
    margin-bottom:0 !important;
}
.thumb-info input[type="image"]{
    width:150px;
    height:150px;
    margin:0 auto;
    border-radius:100% !important;
    overflow:hidden;
}
.edit-user-details__avatar__change .btn-default {
    max-width:150px;
    margin:0 auto;
    position:relative;
    padding:10px 10px 10px 30px;
}
.edit-user-details__avatar__change .btn-default:before {
    position:absolute;
    left:17px;
    top:50%;
    transform:translateY(-50%);
    content:'';
    width:20px;
    height:20px;
    background:url(../img/upload-button.png) no-repeat;
    background-size:20px auto;
    transition:all 0.3s ease;

}
.edit-user-details__avatar__change .btn-default:focus:before,
.edit-user-details__avatar__change .btn-default:hover:before {
    background:url(../img/upload-button-w.png) no-repeat;
    background-size:20px auto;

}
.edit-user-details__avatar__change .btn-default:focus,
.edit-user-details__avatar__change .btn-default:hover {
    background:#0088cc;
    border-color:#0088cc;
    color:#fff;

}
.edit-user-details__avatar {
    margin-bottom:15px;
}
.nav-tabs {
    padding:15px 0 0;
}
.nav-tabs .nav-link{
    position:relative;
}
.nav-tabs input[type="radio"]{
    box-sizing: border-box;
    padding: 0;
    opacity: 0;
    position: absolute;
    left: 0;
    right:0;
    top:0;
    bottom:0;
}
.nav-tabs .nav-item .btn {
    padding:0;
    margin-bottom:0;
}
.card-body .checkbox-custom {
    margin-bottom:10px !important;
}
.experience-field span {
    display:block;
    margin-bottom:7px;
    margin-top:7px;

}
/*.scrolling-wrapper .table .form-control:not(.form-control-sm):not(.form-control-lg) {
    width:100% !important;
}*/
.scrolling-wrapper .table th, .scrolling-wrapper .table td {
    vertical-align:middle;text-align:center;
}
.scrolling-wrapper .table tr.bg-light {
    background: #e1e1e1 !important;
    color: #333;
    text-transform: uppercase;
    font-weight: 700;
   
}

table .form-control:not(.form-control-sm):not(.form-control-lg){padding: 0;min-height: auto;}
.bg-light{    background: #e1e1e1 !important;
    color: #333;
    text-transform: uppercase;
    font-weight: 700;}
.pager_row{}

.preview_data_line{    border-bottom: 1px dashed #CCC;
    width: 90%;
    display: block;}
    
 textarea.form-control:read-only,input.form-control:read-only{/*    background-color: transparent;
    border-width: 0;
    outline: none;
    padding-left: 0;*/}











.inputControlGrid
		{
			
			
			border-style:solid !important;
			border-width:0 !important;
			color:#495057 !important;
			background-color:Transparent !important;
			
		}	
		
		.top_controls_container{text-align:center}
		.top_controls_container input[type="image"]{margin:0 5px;width:28px;}
		table.table input{border:none;outline:none}
		table.table select{border:none;outline:none}
		
		.table-striped input,.table-striped select{background:none !important}
		.content ul a{font-size: 0.85rem;font-weight: 700;color: #777;padding: 5px 0;}
		a:hover{color:#0088cc !important}
		.notification-menu .title{color:#777}
		.notification-menu .title:hover{color:#0088cc !important}
		
		.dropdown-menu a:hover{color:rgba(236, 237, 240, 1) !important}
        .nav-pills a:hover{color:rgba(236, 237, 240, 1) !important}





table.table input {
    border: inherit;
    outline: inherit
}

table.table select {
    border: inherit;
    outline: inherit
}






