/* Author: Abdalla A */
/* Note: Designed by @abdu_amigo */
/* powered by: DNet.sa */




body{
	top: 0px;
	left: 0px;
	background: #F7F7F7 0% 0% no-repeat padding-box;
	opacity: 1;
}
@font-face { 
	font-family: neo-sans;
	src: url('../fonts/@font-face/family-neo-sans-w23.ttf');
}
@font-face { 
	font-family: neo-sans-medium;
	src: url('../fonts/neo-sans/neo-sans-Medium.ttf');
}
h1,h2,h3,h4,h5,h6,p,li,span,p,label,td,th,small{
	font-family: neo-sans !important ;
}
.content{
	font-family: neo-sans !important ;
}
a{
	color: white;
    text-decoration: none;
}a:hover{
	color: white;
    text-decoration: none;
}
.hide{
	display: none !important;
}
.text-purple{
	color: #574ec6;
}
.btn-purple{
	background: #574ec6;
	color: white;
}
.btn-purple:hover{
	background:white;
	color: #574dc6;
	border: 1px solid #574dc6;
}
.text-lightgreen{
	color: #1fbbb3;
}
.text-lightgreen:hover{
	color: #1fbbb3;
}
.text-grey{
	color: #62666c;
}
/***********************************************/
/* Note: header section */
/***********************************************/

#header{
	background: white;
	height: 250px;
	max-height: 250px;
}
#header .container{
	max-width: 1550px !important;
}
#header .btn{
	font-family: neo-sans;
	text-align: center;
	border-color: snow;
	letter-spacing: 0px;
	color: #574EC6;
	opacity: 1;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	box-shadow: 0px 3px 6px #00000029;
	border-radius: 10px;
	padding: 1em 15px;
	font-size: 19px;
}
#header .fa-plus:before{
    line-height: 1.8;
}
#header .fa-plus{
    float: right;
}


/***********************************************/
/* Note: career list section */
/***********************************************/

#career .white{
	background: #FFFFFF 0% 0% no-repeat padding-box;
	box-shadow: 0px 3px 6px #0000001D;
	border-radius: 10px;
	opacity: 1;
}
#career .white:hover{
	transform: scale(1.0);
    border: 1px solid #1fbbb33d;
}
#career h3{
	color: #1fbbb3;
}
#career p{
	color: #919191;
	opacity: 1;
	letter-spacing: 0px;
	text-align: right;
}
#career .btn-primary{
	background: #574EC6 0% 0% no-repeat padding-box;
	box-shadow: 0px 3px 6px #00000029;
	border-radius: 10px;
	opacity: 1;
    padding: 1em 3em;
    font-family: neo-sans;
    border-color: snow;
    margin-top: -10px;
}
#career .btn-primary:hover{
	background: white;
    border: 1px solid #574EC6;
    color: #574EC6;
    transition-delay: 2s;
}
#ajax_table .row .col-md-2{
	max-width: 10.666667% !important;
}
#ajax_table{
	margin-bottom: 6em;
}


/***********************************************/
/* Note: footer section */
/***********************************************/
#footer{
	padding: 5em;
	background: var(--unnamed-color-1fbbb3) 0% 0% no-repeat padding-box;
	background: #1FBBB3 0% 0% no-repeat padding-box;
	box-shadow: 0px 0px 10px #00000048;
	opacity: 1;
}
#footer .fa{
	font-size: 2em;
    letter-spacing: 10px;
}



/***********************************************/
/* Note: Job detail section */
/***********************************************/
#job-d .container{
	background: #FFFFFF 0% 0% no-repeat padding-box;
	box-shadow: 0px 3px 6px #00000029;
	border-radius: 10px;
	opacity: 1;
}
#job-d .small{
	color: red;
}
#job-d .content-pre{
	white-space: pre;
}
#job-d h2{
	color: #1FBBB3;
}
#job-d .location{
	background-image: url('../img/location.svg');
    height: 30px;
    background-repeat: no-repeat;
    background-position: right;
    opacity: 1;
    font-family: neo-sans;
    color: #919191;
    line-height: 2;
}
#job-d .content{
	color: #302E43;
	font-family: neo-sans-medium;
}
#job-d img{
    max-width: 100%;
}
#job-d .btn{
	background: #574EC6 0% 0% no-repeat padding-box;
	box-shadow: 0px 3px 6px #00000029;
	border-radius: 10px;
	opacity: 1;
	border-color: snow;
	padding: 0.6em 2em;
    font-size: 23px;
    font-family: neo-sans;
}
#job-d .form-control{
	font-family: neo-sans;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	box-shadow: 3px 3px 2px #00000015;
	border: 1px solid #E5E5E5;
	border-radius: 10px;
	opacity: 1;
}
#job-d input{
	height: 50px;
}
#job-d select{
	height: 50px;
}
#job-d ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #E5E5E5;
  opacity: 1; /* Firefox */
}
#job-d table {
	font-size: 1em;
}

#job-d .ui-draggable, .ui-droppable {
	background-position: top;
}
#job-d .custom-select{
	transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	color: #495057;
}
#job-d .calendar{
	background: url('../img/calendar.svg') no-repeat;
    background-position: 3%;
}
#job-d .fa-sort{
	margin-top: 12px;
    position: absolute;
    left: 2em;
    color: #C9C9C9;
}
#job-d label{
	color: #919191;
	padding: 0.5em
}


#job-d .card{
	border: 1px solid transparent;
    opacity: 1;
    padding: 15px;
}
.parsley-errors-list{
	text-align: right;
    color: #d85656;
}
#job-d .card h6{
	color: #1fbbb3;
}
#job-d .card a{
	color: #574dc6;
}
#job-d .card .txt{
	color: #574dc6;
}
#recaptcha {
	float: left;
}
.table td, .table th{
	border-top: 1px solid transparent;
}
#loginp{
	margin-right: 25%
}
#forgot{
	margin-right: 25%
}
#registerp{
	margin-right: 25%
}
#loginp ::placeholder {
	font-family: neo-sans;
}
#job-n .nav-tabs{
	border-bottom: none !important;
}
#job-n .nav-link.active{
	border-bottom: 3px solid #1fbbb3;
	border-color: #fff #fff #1fbbb3;
}
#job-n .nav-tabs .nav-link{
	background: white;
}
#job-n .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover{
	border-color: #fff #fff #fff;
}
#job-n:focus-visible{
	outline: white;
}
#job-n button:focus{
	outline: 5px auto transparent;
	border-bottom: 4px solid #1fbbb3 !important;
}

@media(max-width:767px){
	#header .container img{
		width: 45%;
		max-width: 100%;
	}
	#header {
		height: auto !important;
	}
	#header .container .col-xs-3{
		width: 30% !important;
	}
	#header .container .col-xs-9{
		width: 70% !important;
	}
	#header .img-responsive{
		width: 100px;
	}
	.navbar-light .navbar-toggler{
		border-color: rgb(1 182 175);
	}
	#job-d .container{
		padding-right: 1rem !important;
	}
	.form-group label{
		float: right
	}
	#career h3{
		font-size: 14px !important;
	}
	#career p{
		font-size: 14px;
	}
	#job-n .btn{
		padding: 0.5em 1em !important;
	}
	#navbarNavDropdown{
		margin-top: 20px;
		margin-bottom: 20px;
	}
	#loginp{
		margin-right: 0px !important;
	}
	#forgot{
		margin-right: 0px !important;
	}
	#career .mt-4{
		margin-top: 1.5rem!important;
	}
	#career .mr-3{
		margin-right: 0rem!important;
	    margin-left: 1rem!important;
	}
	#career .btn-primary{
		padding: 10px 1em !important;
		font-size: 16px !important;
	}
	#loadNews .btn-primary{
		position: inherit;
		margin-top: 1em !important;
		padding: 20px 1em !important;
	}
	#footer{
		padding: 2em !important;
	}
	#footer .text-left{
		width: 50%;
	}
	#footer .text-right{
		width: 50%;
	}
	#ajax_table .row .col-md-2{
		max-width: 8em !important;
	}
	#ajax_table .row .media-body{
		max-width: 14em !important;
	}
	#career .btn-primary{
		margin-top: 15px !important; 
	}
	
}
@media(max-width:320px){
	#career .btn-primary{
		font-size: 11px !important;
	}
}
@media(max-width:1200px){

}
/***********************************************/
/* Note: New Job section */
/***********************************************/
#job-n .container{
	background: #FFFFFF 0% 0% no-repeat padding-box;
	box-shadow: 0px 3px 6px #00000029;
	border-radius: 10px;
	opacity: 1;
}
#job-n h2{
	color: #1FBBB3;
}
#job-n .location{
	background-image: url('../img/location.svg');
    height: 30px;
    background-repeat: no-repeat;
    background-position: right;
    opacity: 1;
    font-family: neo-sans;
    color: #919191;
    line-height: 2;
}
#job-n .content{
	color: #302E43;
	font-family: neo-sans-medium;
}
#job-n img{
    max-width: 100%;
}
#job-n .btn{
	background: #574EC6 0% 0% no-repeat padding-box;
	box-shadow: 0px 3px 6px #00000029;
	border-radius: 10px;
	opacity: 1;
	border-color: snow;
	padding: 0.6em 4em;
    font-size: 23px;
    font-family: neo-sans;
}
#job-n .form-control{
	font-family: neo-sans;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	box-shadow: 3px 3px 2px #00000015;
	border: 1px solid #E5E5E5;
	border-radius: 10px;
	opacity: 1;
}
#job-n input{
	height: 50px;
}
#job-n select{
	height: 50px;
}
#job-n ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #E5E5E5;
  opacity: 1; /* Firefox */
}
#job-n table {
	font-size: 1em;
}

#job-n .ui-draggable, .ui-droppable {
	background-position: top;
}
#job-n .custom-select{
	transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	color: #e5e5e5;
}
#job-n .calendar{
	background: url('../img/calendar.svg') no-repeat;
    background-position: 3%;
}
#job-n .fa-sort{
	margin-top: 12px;
    position: absolute;
    left: 2em;
    color: #C9C9C9;
}
#job-n label{
	color: #919191;
	padding: 0.5em
}
.table th{
	color: #919191;
}
.table span{
	color: #919191;
}

@media(max-width:700px)
{
	.table td, .table th{
		padding: 0.20rem;
	}
}
#back .row{
	background: url('../img/back-btn.svg') no-repeat;
    background-position: 100%;
    font-family: neo-sans;
    color: #707070;
    padding-right: 3em;
    font-size: 21px;
}


/******************************************/
/** Note: dashboard
/******************************************/

#dashboard .container{
	background: #FFFFFF 0% 0% no-repeat padding-box;
	box-shadow: 0px 3px 6px #00000029;
	border-radius: 10px;
	opacity: 1;
}
#dashboard h2{
	color: #1FBBB3;
}

#dashboard .row .nav .active{
	background: #574EC6 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 10px;
    opacity: 1;
    padding: 6px 16px;
    font-family: neo-sans;
    margin: 0px;
    border-color: snow;
    color: white;
    margin-top: 4px;
}

#dashboard .row .nav p{
	margin: 3px;
    font-size: 17px;
}

#dashboard .row .nav-link{
	box-shadow: 0px 3px 6px #00000029;
    border-radius: 10px;
    opacity: 1;
    padding: 6px 16px;
    font-family: neo-sans;
    margin: 3px;
    border-color: snow;
    line-height: 2;
    color: #574dc6;
    margin-top: 15px;
}

#dashboard .fa-3x{
	color: #574dc6
}
#dashboard .fa-file-pdf-o{
	float: left;
    padding-right: 5px;
    margin-top: 3px;
}
#dashboard .fa-info-circle{
	float: left;
    line-height: 2;
}
#dashboard .fa-check-circle-o{
	float: left;
    line-height: 2;
}

/******************************************/
/** Note: Application table for applicants 
/******************************************/
#applications tr th{
	color: #574dc6;
}
#applications tr td{
	color: #6f6f6f;
}
input{
	height: 60px !important;
}
/******************************************/
/** Note: login with social media account 
/******************************************/
#loginp h4{
	color: #1fbbb3
}
/* Shared */
#loginp .loginBtn {
  box-sizing: border-box;
  position: relative;
  /* width: 13em;  - apply for fixed size */
  margin: 0.2em;
  padding: 0 15px 0 46px;
  border: none;
  text-align: left;
  line-height: 34px;
  white-space: nowrap;
  border-radius: 0.2em;
  font-size: 16px;
  color: #FFF;
}
#loginp .loginBtn:before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  top: 0;
  left: 0;
  width: 50px;
  height: 100%;
}
#loginp .loginBtn:focus {
  outline: none;
}
#loginp .loginBtn:active {
  box-shadow: inset 0 0 0 32px rgba(0,0,0,0.1);
}
.text-thaat{
	color: #574dc6
}




/* Ratings */
#job-d .rating {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center
}

#job-d .rating>input {
    display: none
}

#job-d .rating>label {
    position: relative;
    width: 2em;
    color: #FFD600;
    cursor: pointer;
	font-size: 20px;
}

#job-d .rating>label::before {
    content: "\2605";
    position: absolute;
    opacity: 0
}

#job-d .rating>label:hover:before,
.rating>label:hover~label:before {
    opacity: 1 !important
}

#job-d .rating>input:checked~label:before {
    opacity: 1
}

#job-d .rating:hover>input:checked~label:before {
    opacity: 0.4
}

#job-d .table td, .table th{
	padding: .12rem;
}
.verified_check {
	background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="lightgreen" class="bi bi-check-circle-fill" viewBox="0 0 16 16" >  <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/></svg>') left no-repeat !important;
	background-position-x: 2% !important;
}

/* Note: DNet */
/*------------------- Croppie CSS --------------------
	---------------------------------------------
*/

.crop-image{
	width: 150px;
	height: 150px;
	background-color: #f9f9f9;
	border: 1px dashed #d0d0d0;
	position: relative;
}
.crop-image .editor-file:hover+.ci-preview-labels{
	background-color: #FFF;
}
.cr-viewport.cr-vp-square{
	width: 100% !important;
	height: 100% !important;
}
.cr-boundary .cr-image, .cr-slider-wrap .cr-slider{
	display: none;
}
.crop-image .editor-file {
	cursor: pointer;
	position: absolute;
	opacity: 0;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
}
.z-10{
	z-index: 10;
}
.ci-preview-labels{
	width: 100%;
	position: absolute;
}
.ci-preview-labels {
		height: 100%;
		text-align: center;
		cursor: default;
		display: flex;
		align-items: center;
	}
	.ci-preview-labels div {
		margin: auto;
		color: #b3b3b3;
	}
	.ci-preview-labels i {
		font-size: 3em;
		margin-bottom: 0.5rem;
	}
	.ci-preview-labels p {
		margin: 0px;
		font-size: 13px;
	}
	.ci-preview-labels p a {
		color: #b3b3b3;
	}
	.ci-preview-labels:hover div,
	.ci-preview-labels:hover div p a {
		color: #888;
	}
	.ci-preview-labels div a:hover {
		text-decoration: underline;
	}
	.change-pic {
		position: absolute;
		bottom: 20px;
		color: #212121 !important;
		padding: 5px 10px;
		border-radius: 2px;
		background-color: rgba(255, 255, 255, 0.3);
	}
	.change-pic:hover {
		background-color: rgba(255, 255, 255, 0.7);
	}
	body[dir="ltr"] .change-pic {
		left: 10px;
	}
	body[dir="rtl"] .change-pic {
		right: 10px;
	}
	.c-info{
		color: #616161;
	}

	body[dir="rtl"] .c-layout-header .c-cart-menu{
	left: 0px;
	right: unset;
	}
	.c-page-breadcrumbs{
		margin-top: 0px !important;
	}