/*
* demo.css
* File include item demo only specific css only
******************************************************************************/

.light-style .menu .app-brand.demo {
  height: 64px;
}

.dark-style .menu .app-brand.demo {
  height: 64px;
}

.app-brand-logo.demo {
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  display: -ms-flexbox;
  display: flex;
  width: 27px;
  height: 36.3961px;
}

.app-brand-logo.demo svg {
    width: 27px;
    height: 36.3961px;
}

.app-brand-text.demo {
  font-size: 1.25rem;
  letter-spacing: -0.45px;
}

.app-brand-text.demo span{
	display:block;
	font-size: 1rem;
}

/* ! For .layout-navbar-fixed added fix padding top tpo .layout-page */
.layout-navbar-fixed .layout-wrapper:not(.layout-without-menu) .layout-page {
  padding-top: 64px !important;
}

/* Navbar page z-index issue solution */
.content-wrapper .navbar {
  z-index: auto;
}

/*
* Content
******************************************************************************/

.demo-blocks > * {
  display: block !important;
}

.demo-inline-spacing > * {
  margin: 1rem 0.375rem 0 0 !important;
}

/* ? .demo-vertical-spacing class is used to have vertical margins between elements. To remove margin-top from the first-child, use .demo-only-element class with .demo-vertical-spacing class. For example, we have used this class in forms-input-groups.html file. */
.demo-vertical-spacing > * {
  margin-top: 1rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.demo-vertical-spacing-lg > * {
  margin-top: 1.875rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing-lg.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.demo-vertical-spacing-xl > * {
  margin-top: 5rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing-xl.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.rtl-only {
  display: none !important;
  text-align: left !important;
  direction: ltr !important;
}

[dir='rtl'] .rtl-only {
  display: block !important;
}

/*
* Layout demo
******************************************************************************/

.layout-demo-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 1rem;
}
.layout-demo-placeholder img {
  width: 900px;
}
.layout-demo-info {
  text-align: center;
  margin-top: 1rem;
}

.light-style .select2-dropdown,.dark-style .select2-dropdown{z-index:1095 !important}

/* MODAL POPUP */

@keyframes mdl-fadein {
  0%    { opacity: 0; }
  100%   { opacity: 0.1; }
}

@keyframes mdl-fadeout {
  0%    { opacity: 0.1; }
  100%   { opacity: 0; }
}

@-webkit-keyframes mdl-show {
  0% {
    transform: scale(.5);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes mdl-show {
  0% {
    transform: scale(.5);
  }

  100% {
    transform: scale(1);
  }
}

@-webkit-keyframes mdl-hide {
  0% {
    transform: scale(1);
    opacity: 1;
  }

  100% {
    transform: scale(.5);
    opacity: 0;
  }
}

@keyframes mdl-hide {
  0% {
    transform: scale(1);
    opacity: 1;
  }

  100% {
    transform: scale(.5);
    opacity: 0;
  }
}

html.mdl-shown,
body.mdl-shown {
	height:100%;
	overflow: hidden;
}

.mdl-spinner{color:#0062cc}

.mdl-container {
	display: flex;
	position: fixed;
	z-index: 1090;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	min-height: 100vh;
	align-items: center;
	background: 0 0;
	justify-content: center;
	flex-direction: row;
	overflow-x: hidden;
	overflow-y: auto!important;
	transition: all .15s;
	-webkit-transition: all .15s;
	-o-transition: all .15s; }
	-webkit-overflow-scrolling: touch;
}

.mdl-container.mdl-touch-none {
	opacity:0;
	pointer-events:none;
}

.mdl-container.mdl-backdrop-show {
  background: rgba(0,0,0,.1) !important;
  -webkit-animation: mdl-fadein .15s backwards;
  animation: mdl-fadein .15s backwards;
  animation-iteration-count: 1;
}

.mdl-container.mdl-backdrop-hide {
  background: 0 0!important;
}

.mdl-container.mdl-backdrop-none{
	background: rgba(0,0,0,0) !important;
}

.mdl-container .mdl-popup {
	position: relative;
	display: none;
	justify-content: center;
	align-items: center;
	width: 100%;
	max-width:500px;
	height: 100%;
	margin: 0 15px;
}

.mdl-container .mdl-popup.mdl-md-ws{
	max-width:600px;
}

.mdl-container .mdl-popup.mdl-lg-ws{
	max-width:800px;
}

.mdl-container .mdl-popup.mdl-xl-ws{
	max-width:1000px;
}
.mdl-container .mdl-popup.mdl-xxl-ws{
	max-width:1200px;
}

.mdl-show {
	display: flex !important;
	-webkit-animation: mdl-show .15s backwards;
	animation: mdl-show .15s backwards;
	animation-iteration-count: 1;
}

.mdl-hide {
	display: flex !important;
	-webkit-animation: mdl-hide .15s forwards;
	animation: mdl-hide .15s forwards;
	animation-iteration-count: 1;
}

.mdl-container .mdl-popup .mdl-modal {
	width: 100%;
	margin: auto;
}

.mdl-popup .mdl-modal .mdl-wrapper{
	position: relative;
	background-color:#fff;
	background-clip: padding-box;
	border-radius: 0.3125rem;
	margin:1rem 0;
	box-shadow: 0 2px 14px rgba(38, 60, 85, 0.16);
}

.dark-style .mdl-popup .mdl-modal .mdl-wrapper{
	background-color: #283144;
}

.mdl-popup .mdl-modal .mdl-wrapper.mdl-loading {
	min-height:100px;
	display:flex;
	justify-content:center;
	align-items:center;
}

.mdl-wrapper.mdl-text-center{
	text-align:center;
}

.mdl-wrapper .mdl-close{
	position:absolute;
	right:0;
	top:0;
	display:flex;
	justify-content:center;
	align-items:center;
	width: 1.2em;
	height: 1.2em;
	font-family: monospace;
	font-size: 2.5em;
	cursor:pointer;
}

.mdl-modal-icon {
	display:flex;
	width: 100%;
	align-items: center;
	justify-content: center;
	margin-bottom:1.25rem;
	transform: scale(0.6);
	transform-origin: top center;
	margin-bottom: calc((0.6 - 1) * 150px);
}

.success-icon {
  display: inline-block;
  width: 8em;
  height: 8em;
  font-size: 20px;
  border-radius: 50%;
  border: 4px solid #96df8f;
  background-color: #fff;
  position: relative;
  overflow: hidden;
  transform-origin: center;
  -webkit-animation: showSuccess 180ms ease-in-out;
  animation: showSuccess 180ms ease-in-out;
}

.success-icon__tip {
  width: 2.4em;
  top: 4.3em;
  left: 1.4em;
  transform: rotate(45deg);
  -webkit-animation: tipInPlace 300ms ease-in-out;
  animation: tipInPlace 300ms ease-in-out;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-delay: 180ms;
  animation-delay: 180ms;
  visibility: hidden;
}

.success-icon__long {
  width: 4em;
  transform: rotate(-45deg);
  top: 3.7em;
  left: 2.75em;
  -webkit-animation: longInPlace 140ms ease-in-out;
  animation: longInPlace 140ms ease-in-out;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  visibility: hidden;
  -webkit-animation-delay: 440ms;
  animation-delay: 440ms;
}

.success-icon__tip, .success-icon__long {
  display: block;
  position: absolute;
  height: 4px;
  background-color: #96df8f;
  border-radius: 10px;
}

.error-icon {
  display: inline-block;
  width: 8em;
  height: 8em;
  font-size: 20px;
  border-radius: 50%;
  border: 4px solid #f27474;
  background-color: #fff;
  position: relative;
  overflow: hidden;
  transform-origin: center;
  -webkit-animation: error-icon .5s;
  animation: error-icon .5s;
}

.error-icon__x-mark {
  position: relative;
  flex-grow: 1;
  -webkit-animation: error-x-mark .5s;
  animation: error-x-mark .5s;
}

.error-icon__x-mark-line-left,
.error-icon__x-mark-line-right{
	display: block;
	position: absolute;
	top: 3.5em;
	width: 4em;
	height: .3em;
	border-radius: .4em;
	background-color: #f27474;
}
.error-icon__x-mark-line-left{
	left: 1.8em;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.error-icon__x-mark-line-right{
	right: 1.8em;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
@keyframes showSuccess {
  from {
    transform: scale(0);
  }
  to {
    transform: scale(1);
  }
}

@keyframes tipInPlace {
  from {
    width: 0em;
    top: 0em;
    left: -1.6em;
  }
  to {
    width: 2.4em;
    top: 4.3em;
    left: 1.4em;
    visibility: visible;
  }
}

@keyframes longInPlace {
  from {
    width: 0em;
    top: 5.1em;
    left: 3.2em;
  }
  to {
    width: 4em;
    top: 3.7em;
    left: 2.75em;
    visibility: visible;
  }
}

@-webkit-keyframes error-x-mark{
    0%{
        margin-top:1.625em;
        -webkit-transform:scale(.4);
        transform:scale(.4);
        opacity:0
    }
    50%{
        margin-top:1.625em;
        -webkit-transform:scale(.4);
        transform:scale(.4);
        opacity:0
    }
    80%{
        margin-top:-.375em;
        -webkit-transform:scale(.8);
        transform:scale(.8)
    }
    100%{
        margin-top:0;
        -webkit-transform:scale(1);
        transform:scale(1);
        opacity:1
    }
}
@keyframes error-x-mark{
    0%{
        margin-top:1.625em;
        -webkit-transform:scale(.4);
        transform:scale(.4);
        opacity:0
    }
    50%{
        margin-top:1.625em;
        -webkit-transform:scale(.4);
        transform:scale(.4);
        opacity:0
    }
    80%{
        margin-top:-.375em;
        -webkit-transform:scale(.8);
        transform:scale(.8)
    }
    100%{
        margin-top:0;
        -webkit-transform:scale(1);
        transform:scale(1);
        opacity:1
    }
}
@-webkit-keyframes error-icon{
    0%{
        -webkit-transform:rotateX(100deg);
        transform:rotateX(100deg);
        opacity:0
    }
    100%{
        -webkit-transform:rotateX(0);
        transform:rotateX(0);
        opacity:1
    }
}
@keyframes error-icon{
    0%{
        -webkit-transform:rotateX(100deg);
        transform:rotateX(100deg);
        opacity:0
    }
    100%{
        -webkit-transform:rotateX(0);
        transform:rotateX(0);
        opacity:1
    }
}

/* END MODAL POPUP */

/*
.noUI-hide-tooltip-text .noUi-tooltip{display:none}
.noUI-hide-tooltip-text .noUi-active .noUi-tooltip{display:block}
*/
.noUI-hide-tooltip-text .noUi-tooltip{bottom:-115% !important}

.ak1-wrapper{
	width:100%;
	background-color:#fff;
	border:2px solid #000;
	color:#000 !important;
	letter-spacing:.2px;
	font-size:12px;
}
.ak1-wrapper h6{
	font-size:13px !important;
	color:#000 !important;
	line-height:20px;
	font-weight:bold;
}
.ak1-wrapper h5{
	font-size:15px !important;
	line-height:20px;
	color:#000 !important;
	font-weight:bold;
}
.ak1-wrapper span {
	font-weight:bold;
	text-transform:uppercase;
	padding:3px 0 !important;
}

.ak1-container {
	display:flex;
	flex-direction: row;
	justify-content: center;
	align-items: stretch;
}
.ak1-section {
	display:flex;
	flex-direction:column;
	width:100%;
	padding:1rem;
}
.ak1-section.middle{
	width:35%;
	align-items:center;
	text-align:center;
	padding-left:15px;
	padding-right:15px;
}
.ak1-section:first-child{
	width:65%;
}
.ak1-underline{
	text-decoration:underline;
}
.ak1-bordered{
	border-bottom:1px solid #000;
}
.ak1-blocked{
	display:block;
}
.ak1-table{
	width:100%;
	border-collapse:collapse;
}
.ak1-table td{
	border:1px solid #000;
	padding:10px 5px;
	font-weight:bold;
	font-size:14px;
}
.ak1-education {
	width:100%;
	font-weight:bold;
	text-transform:uppercase;
	flex-grow:1;
}
.ak1-education .ak1-education-info{
	display:flex;
	width:100%;
	margin-top:5px;
}
.ak1-education .ak1-education-info .ak1-education-text{
	position:relative;
	width:100%;
	padding:3px 5px !important;
	margin-right:25px;
	line-height:14px;
}
.ak1-education .ak1-education-info .ak1-education-text:first-child{width:20%}
.ak1-education .ak1-education-info .ak1-education-text:last-child{
	width:16%;
	margin:0
}
.ak1-education .ak1-education-info .ak1-education-text:not(:last-child){padding-right:10px}
.ak1-education .ak1-education-info .ak1-education-text:not(:last-child)::after{
	content:":";
	position:absolute;
	right:-14px;
	top: 3px;
	
}
.ak1-skills{
	width:100%;
	align-items:self_end;
}
.ak1-skills .ak1-ol{
	width:100%;
	padding:0 0 0 1rem;
	margin:2px 0 0 0;
}
.ak1-skills .ak1-ol li{
	width:100%;
	font-weight:bold;
	text-transform:uppercase;
	padding:3px 0 !important;
	border-bottom:1px solid #000;
}
.ak1-header{
	display:flex;
}
.ak1-header .ak1-header-logo{
	padding-right:10px;
}
.ak1-header .ak1-header-logo img{
	width:70px;
	vertical-align:middle;
}
.ak1-header .ak1-header-info{
	width:100%;
	font-weight:bold;
}
.ak1-card-sign{
	border:1px solid #000;
	padding:4px 1px;
	text-align:center;
	font-weight:bold;
	margin:5px 0 3px 0;
}
.ak1-seeker{
	display:flex;
	align-items:center;
}
.ak1-seeker .ak1-seeker-info{
	width:100%;
}
.ak1-seeker .ak1-seeker-info:first-child{
	flex: 0 0 110px;
	white-space:nowrap;
	padding-right:10px;
	font-weight:bold;
}
.ak1-table-number{
	width:100%;
	border-collapse: collapse;
	margin:3px 0;
}
.ak1-table-number td{
	width:22px;
	border:1px solid #000;
	text-align:center;
	vertical-align:middle;
	font-weight:bold;
	padding:3px 1px;
	font-size:14px;
}
.ak1-table-number td.blank{
	border-top:0;
	border-bottom:0;
}
.ak1-applicant{
	display:flex;
	align-items:stretch;
	height:100%;
	margin-top:15px;
}
.ak1-applicant .ak1-applicant-section{
	display:flex;
	flex-direction:column;
	width:100%;
	padding-right:10px;
}
.ak1-applicant .ak1-applicant-section:first-child{
	flex:0 0 125px;
}
.ak1-applicant .ak1-applicant-section:last-child{
	padding:0 0 0 0
}

.ak1-applicant .ak1-applicant-section .ak1-applicant-photo{
	margin:0
}

.ak1-applicant .ak1-applicant-section .ak1-applicant-photo img,
.ak1-applicant .ak1-applicant-section .ak1-applicant-photo div{
	width:125px;
	height:162px;
	background-color:#fff;
	border:2px dashed #000
}
.ak1-applicant .ak1-applicant-section .ak1-applicant-signs{
	font-size:12px;
	text-align:center;
	font-weight:bold;
	margin-top:35px;
}
.ak1-applicant .ak1-applicant-section .ak1-applicant-infos{
	display:flex;
	margin-top:0;
}
.ak1-applicant .ak1-applicant-section .ak1-applicant-infos div,
.ak1-applicant .ak1-applicant-section .ak1-applicant-infos span{
	width:100%;
	font-weight:bold;
	font-size:12px;
	padding:3px 0;
}
.ak1-applicant .ak1-applicant-section .ak1-applicant-infos div:first-child,
.ak1-applicant .ak1-applicant-section .ak1-applicant-infos span:first-child{
	position:relative;
	flex: 0 0 125px;
	padding-right:20px;
}
.ak1-applicant .ak1-applicant-section .ak1-applicant-infos div:first-child::after{
	content:":";
	position:absolute;
	right:10px;
}
.ak1-applicant .ak1-applicant-section .ak1-applicant-infos div:last-child{
	text-transform:uppercase;
	border-bottom:1px solid #000;
}
.ak1-spacer{
	margin:auto 0;
}
.ak1-official-text{
	text-align:center;
	font-weight:bold;
	font-size:12px;
}
.ak1-official-qrcode{
	width:100%;
	text-align:center;
	margin:10px 0;
}
.ak1-official-qrcode img{
	width:100%;
	max-width:180px;
}

@media print {
	@page  { 
		size: auto;
		margin: 0 0 0 0;  
	}
	.pagebreak { page-break-after: always;}
    body * {visibility:hidden}
	.navbar-nav-right,.layout-navbar,.layout-menu,.card.no-print,.mdl-container .modal-header,.mdl-shown .layout-wrapper{
		padding:0 !important;
		margin:0 !important;
		border:0 !important;
		top:0 !important;
		box-shadow:none !important;
		flex-grow:0 !important;
		display:none !important;
	}
	.mdl-container,.mdl-container *{overflow: visible !important;}
	.mdl-container{
		position:relative !important;
		top:0:left:0;height:auto !important;
	}
	.content-wrapper,.content-wrapper .container-xxl,.card,.card-body,.layout-page,.container-fluid,.container-fluid > *,.layout-navbar,.layout-page,.card.mb-4,
	.layout-navbar-fixed .layout-wrapper:not(.layout-without-menu) .layout-page,.layout-navbar-fixed .layout-wrapper:not(.layout-horizontal) .layout-page::before,
	 .content-wrapper > .container-xxl.container-p-y,.mdl-container,.mdl-container .mdl-popup,.mdl-container .mdl-popup .mdl-wrapper,.mdl-container .modal-header,.mdl-container .modal-body{
		padding-top:0 !important;
		padding:0 !important;
		margin:0 !important;
		border:0 !important;
		top:0 !important;
		box-shadow:none !important;
		flex-grow:0 !important;
		visibility:hidden;
	}
	body .print * {
		visibility:visible !important;
		overflow: visible !important;
		page-break-before: none;
		page-break-after: none;
		page-break-inside: avoid;
	}
	.container-xxl{
		max-width:auto;
	}
	.ak1-wrapper h6,.ak1-wrapper h5{
		font-weight:bold
	}
	.content-wrapper{margin:-1.15rem 0 !important}
}