body {
	background: url(../images/bg.jpg) repeat;
	font-family: 'Open Sans', sans-serif;
    letter-spacing: -0.25px;
}

div.debug {
	position: absolute;
    z-index: 10;
    background: #F44336;
    padding: 5px 10px;
    color: #fff;
    font-weight: bold;
    right: 0;
}

p.compulsory {
    display: inline-block;
    background: #17a2b8;
    padding: 5px 10px;
    color: #fff;
    font-size: small;
    font-weight: bold;
}


div.comp {
	position: absolute;
    z-index: 10;
    background: #17a2b8;
    padding: 5px 10px;
    color: #fff;
	font-size:small;
    font-weight: bold;
    left: 0;
	top: 0;
}

.btn.disabled, .btn:disabled {
    opacity: .35;
}

.bg-fa-red {background:#df2526;}
.bg-fa-blue {background: #092042; }

/* Add an arrow after action */
.action {
	color: #0d64c1;
    font-weight: bold;
}

.action.yellow {
	color:#ffc107
}

.action::before {
  font-family: "Font Awesome 5 Pro";
  content: "\f101";
  padding-right:5px;
}

.block-title-blue .action, .block-title-purple .action, .block-title-black .action {
	color: #ffc107;
}

.block-title {
	padding: 100px 70px 40px 40px;
    background: url('../images/title-bg.png') no-repeat left top;
    background-size: 100% 100%;
 }
 
 .block-title-green {
	padding: 60px 70px 80px 40px;
    background: url('../images/title-bg-green.png') no-repeat left top;
    background-size: 100% 100%;
 }
 
 .block-title-blue {
	padding: 60px 70px 80px 40px;
    background: url('../images/title-bg-blue.png') no-repeat left top;
    background-size: 100% 100%;
 }
 
 .background-image-div .block-title-blue, .background-image-div .block-title-green
 {
	 padding: 100px 70px 40px 40px;
 }
 
 .block-title-purple {
	padding: 60px 70px 80px 40px;
    background: url('../images/title-bg-purple.png') no-repeat left top;
    background-size: 100% 100%;
 }
 
 .block-title-black {
	padding: 100px 70px 40px 40px;
    background: url('../images/title-bg-black.png') no-repeat left top;
    background-size: 100% 100%;
 }
 
.block-title img.logo, .block-title-black img.logo, .block-title-blue img.logo, .block-title-green img.logo {
	position: absolute;
    top: -50px;
    width: 80px;
}

.block-title .title-continue, .block-title-black .title-continue, .block-title-blue .title-continue, .block-title-green .title-continue {
	position: absolute;
    margin-top: 10px;
}

div.errors {
	margin: 0 0 20px 0;
    color: red;
    font-weight: bold;
}

.svg-clip {
  width: 0;
  height: 0;
}

h1 {font-weight:800; font-size: 2.2rem;}
h1 span {font-weight:300; display:block;}


.lead{font-size: 1rem;}


.knowledge-check label:hover, .knowledge-check input:hover {
	cursor: pointer;
}

.knowledge-check .input-group.disabled label:hover, .knowledge-check .input-group.disabled input:hover {
	cursor: default;
}

div.remember {
	background: #0068B2;
    color: #fff;
    padding: 14px;
}

.fa-yellow {
	color:#f2c714;
}


/* Form Style */
.btn-login {
  /* font-size: 0.9rem; */
  border-radius: 1.25rem;
}

.form-control, .custom-select {
	border-radius: 1.25rem;
}

.form-label-group {
  position: relative;
  margin-bottom: 1rem;
}

.form-label-group>div>input,.form-label-group>div>select {
  padding: 0.75rem 1.5rem;
  height: auto;
}

.form-label-group>label, .form-label-group>div>label {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  height: auto;
  font-weight: bold;
}

.custom-control {
    padding: 0.5rem 1.5rem;
}

.custom-control-lg .custom-control-label::before,
.custom-control-lg .custom-control-label::after {
    top: 0.1rem !important;
    left: -2rem !important;
    width: 1.25rem !important;
    height: 1.25rem !important;
}

.custom-control-lg .custom-control-label {
    margin-left: 0.5rem !important;
    font-size: 1rem !important;
}

.bv-form .help-block {
    margin-bottom: 0;
    color: red;
}
.fm-margin-b-0 {margin-bottom:0px;}
.fm-margin-b-5 {margin-bottom:5px;}
.fm-margin-b-10 {margin-bottom:10px;}
.fm-margin-b-15 {margin-bottom:15px;}
.fm-margin-b-20 {margin-bottom:20px;}
.fm-margin-b-25 {margin-bottom:25px;}
.fm-margin-b-30 {margin-bottom:30px;}
.fm-margin-b-35 {margin-bottom:35px;}
.fm-margin-b-40 {margin-bottom:40px;}
.fm-margin-b-50 {margin-bottom:50px;}

.fm-margin-r-0 {margin-right:0px;}
.fm-margin-r-5 {margin-right:5px;}
.fm-margin-r-10 {margin-right:10px;}
.fm-margin-r-15 {margin-right:15px;}
.fm-margin-r-20 {margin-right:20px;}
.fm-margin-r-25 {margin-right:25px;}
.fm-margin-r-30 {margin-right:30px;}
.fm-margin-r-35 {margin-right:35px;}
.fm-margin-r-40 {margin-right:40px;}
.fm-margin-r-50 {margin-right:50px;}

.fm-margin-l-0 {margin-left:0px;}
.fm-margin-l-5 {margin-left:5px;}
.fm-margin-l-10 {margin-left:10px;}
.fm-margin-l-15 {margin-left:15px;}
.fm-margin-l-20 {margin-left:20px;}
.fm-margin-l-25 {margin-left:25px;}
.fm-margin-l-30 {margin-left:30px;}
.fm-margin-l-35 {margin-left:35px;}
.fm-margin-l-40 {margin-left:40px;}
.fm-margin-l-50 {margin-left:50px;}

.fm-margin-t-0 {margin-top:0px;}
.fm-margin-t-5 {margin-top:5px;}
.fm-margin-t-10 {margin-top:10px;}
.fm-margin-t-15 {margin-top:15px;}
.fm-margin-t-20 {margin-top:20px;}
.fm-margin-t-25 {margin-top:25px;}
.fm-margin-t-30 {margin-top:30px;}
.fm-margin-t-35 {margin-top:35px;}
.fm-margin-t-40 {margin-top:40px;}
.fm-margin-t-50 {margin-top:50px;}
.fm-margin-t-60 {margin-top:60px;}
.fm-margin-t-70 {margin-top:70px;}
.fm-margin-t-80 {margin-top:80px;}

.fm-padding-t-0 {padding-top:0px;}
.fm-padding-t-5 {padding-top:5px;}
.fm-padding-t-10 {padding-top:10px;}
.fm-padding-t-15 {padding-top:15px;}
.fm-padding-t-20 {padding-top:20px;}
.fm-padding-t-25 {padding-top:25px;}
.fm-padding-t-30 {padding-top:30px;}
.fm-padding-t-35 {padding-top:35px;}
.fm-padding-t-40 {padding-top:40px;}
.fm-padding-t-50 {padding-top:50px;}

.fm-padding-b-0 {padding-bottom:0px;}
.fm-padding-b-5 {padding-bottom:5px;}
.fm-padding-b-10 {padding-bottom:10px;}
.fm-padding-b-15 {padding-bottom:15px;}
.fm-padding-b-20 {padding-bottom:20px;}
.fm-padding-b-25 {padding-bottom:25px;}
.fm-padding-b-30 {padding-bottom:30px;}
.fm-padding-b-35 {padding-bottom:35px;}
.fm-padding-b-40 {padding-bottom:40px;}
.fm-padding-b-50 {padding-bottom:50px;}

.fm-padding-l-0 {padding-left:0px;}
.fm-padding-l-5 {padding-left:5px;}
.fm-padding-l-10 {padding-left:10px;}
.fm-padding-l-15 {padding-left:15px;}

.fm-padding-r-0 {padding-right:0px;}
.fm-padding-r-5 {padding-right:5px;}
.fm-padding-r-10 {padding-right:10px;}
.fm-padding-r-15 {padding-right:15px;}

@media (max-width: 576px) {
	.container {padding-left:30px; padding-right:30px;}
	
	.block-title-green {
		    padding: 50px 30px 80px 20px;
	}
	
	#chalkboard {
		min-height: 250px !important; 
		background-size: 100% 95% !important; 
	}
	
	h1 {font-size:1.8rem;}
	
	#chalkboard p {
		padding: 0 11% 0 !important;
		font-size: 1.3rem !important;
		line-height:initial !important;
	}
}

/* Animations */
.stack__item--reject,
.stack__item--accept {
	pointer-events: none;
}

/***********************************************/
/******************** yuda *********************/
/***********************************************/

.stack--yuda .stack__item--reject {
	-webkit-animation: yudaReject 0.5s forwards;
	animation: yudaReject 0.5s forwards;
}

@-webkit-keyframes yudaReject {
	to {
		opacity: 0;
		-webkit-transform: translate3d(0,200px,0);
		transform: translate3d(0,200px,0);
	}
}

@keyframes yudaReject {
	to {
		opacity: 0;
		-webkit-transform: translate3d(0,200px,0);
		transform: translate3d(0,200px,0);
	}
}

.stack--yuda .stack__item--accept {
	-webkit-animation: yudaAccept 0.5s forwards;
	animation: yudaAccept 0.5s forwards;
	-webkit-transform-origin: 50% 300%;
	transform-origin: 50% 300%;
}

@-webkit-keyframes yudaAccept {
	to {
		opacity: 0;
		-webkit-transform: rotate3d(0,0,1,20deg);
		transform: rotate3d(0,0,1,20deg);
	}
}

@keyframes yudaAccept {
	to {
		opacity: 0;
		-webkit-transform: rotate3d(0,0,1,20deg);
		transform: rotate3d(0,0,1,20deg);
	}
}