.text-blue { color:#006FDD;}

.container{
height: 100%;
align-content: center;
}

.card{
height: auto;
margin-top: auto;
margin-bottom: auto;
width: auto;
background-color: rgba(0,0,0,0.5) !important;
}

.social_icon span{
font-size: 60px;
margin-left: 10px;
color: #FFC312;
}

.social_icon span:hover{
color: white;
cursor: pointer;
}

.card-header h3{
color: white;
}

.social_icon{
position: absolute;
right: 20px;
top: -45px;
}

.input-group-prepend span{
width: 50px;
background-color: #FFC312;
color: black;
border:0 !important;
}

input:focus{
outline: 0 0 0 0  !important;
box-shadow: 0 0 0 0 !important;
color:#0080FF !important;
font-weight:bold;
}

.remember{color: white;}

.remember input{
width: 20px;
height: 20px;
margin-left: 15px;
margin-right: 5px;
}

.login_btn{
color: black;
font-weight:bold;
background-color: #FFC312;
}

.login_btn:hover{
background-color: white;
}

.login_btn:active {
	position:relative;
	top:1px;
}

.links{color: white;}

.links a{margin-left: 4px;}
.topbanner {
	text-align:center;
    max-width: 100%;
    height: 90px;
	align-content: center;
}

.topbanner  a img {
    max-width: 100%;
}

.slideshow {
z-index:6;
position:relative;
padding:0;
text-align:center;
}
.slideshow a img {
border:none;
}
.slideshow li.slide {
list-style-type:none;
}
.slideshow .slides {
height:90px;
margin:0;
}

.slideshow .slides li.slide {
visibility:hidden;
position:absolute;
left:130px;
top:0px;
}

@media only screen and (max-width: 768px) {
	.slideshow .slides li.slide {left:0px;}
}
.animated {         
           -webkit-animation-duration: 8s;
            animation-duration: 8s;
            -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
         }
         
         @-webkit-keyframes fadeIn {
            0% {opacity: 0;}
            100% {opacity: 1;}
         }
         
         @keyframes fadeIn {
            0% {opacity: 0;}
            100% {opacity: 1;}
         }
         
         .fadeIn {
            -webkit-animation-name: fadeIn;
            animation-name: fadeIn;
         }
	
.animated-slide-left{position:relative;animation:animateleft 0.4s}
@keyframes animateleft{
	from{left:-300px;opacity:0} to{left:0;opacity:1}
}

.animated-slide-right{position:relative;animation:animateright 0.4s}
@keyframes animateright{
	from{left:300px;opacity:0} to{left:0;opacity:1}
}

.animated-slide-top{position:relative;animation:animatetop 0.4s}
@keyframes animatetop{
	from{top:-300px;opacity:0} to{top:0;opacity:1}
}


.progressbar { counter-reset:step;}
.progressbar li { list-style-type:none; float:left; width:33.33%; position:relative; text-align:center; font-size:18px;}
.progressbar li:before {
	content: counter(step);
	counter-increment:step;
	width:50px;
	height:50px;
	line-height:50px;
	border:2px solid #ddd;
	display:block;
	text-align:center;
	margin:0 auto 10px auto;	
	border-radius:50%; 
	background-color:#0080FF;	
	z-index:999999;	
	}
.progressbar li:after {
	content:' ';
	position:absolute;
	width:80%;
	margin-left:30px;
	height:2px;
	background-color:#ddd;
	top:30px;
	left:-50%;
	}	
	.progressbar li:first-child:after { content:none;}
	.progressbar li.active { color:blue;}
	.progressbar li.active:before { border-color:yellow;}
	.progressbar li.active+ li:after { background-color:yellow;}
	
	input[type=text] ,input[type=password]  {
  max-width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  box-sizing: border-box;
}

select  {
  max-width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  box-sizing: border-box;
}
.error_form { color:#F00;  padding:10px;}

	.rowreg > .columnreg {
  padding: 0 8px;
}

.rowreg:after {
  content: "";
  display: table;
  clear: both;
}

.columnreg {
  float: left;
  width: 25%;
}

.modal {
  display: none;
  position: fixed;
  z-index: 99999999;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  width: 90%;
  max-width: 1200px;
}

.closereg {
  color: white;
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}

.closereg:hover,
.closereg:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

.mySlides {
  display: none;
}

.cursor {
  cursor: pointer;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  background-color: #0080FF;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: #0080FF;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

img {
  margin-bottom: -4px;
}

.caption-container {
  text-align: center;
  background-color: black;
  padding: 2px 16px;
  color: white;
}

.demo {
  opacity: 0.6;
}

.activereg,
.demo:hover {
  opacity: 1;
}

img.hover-shadow {
  transition: 0.3s;
}

.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.btn114blue {
	 border:none;
	-moz-box-shadow:inset 0px 1px 0px 0px #54a3f7;
	-webkit-box-shadow:inset 0px 1px 0px 0px #54a3f7;
	box-shadow:inset 0px 1px 0px 0px #54a3f7;
	background-color:#0080FF;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:3px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family: 'promptmedium', tahoma; 
	font-size:17px;
	padding:6px 24px;
	text-decoration:none;
}
.btn114blue:hover {
	background-color:#0061a7;
}
.btn114blue:active {
	position:relative;
	top:1px; 
}

.text-orange {color:#FFA500;}
.text-gold {color:#FFD700;}
.text-white {color:#FFF;}
.text-black {color:#000;}

.menu-wrap {
	position: absolute;
	width: 40px;
	height: 40px;
	top: 100px;
	right: 100px;
	cursor: pointer;
	display:inline-block;
}

.menu-wrap .toggler {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  cursor: pointer;
  width: 50px;
  height: 50px;
  opacity: 0;
}

.menu-wrap .hamburger {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 60px;
  height: 60px;
  padding: 1rem;
  background: var(--primary-color);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Hamburger Line */
.menu-wrap .hamburger > div {
  position: relative;
  flex: none;
  width: 100%;
  height: 1px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.4s ease;
}

/* Hamburger Lines - Top & Bottom */
.menu-wrap .hamburger > div::before,
.menu-wrap .hamburger > div::after {
  content: '';
  position: absolute;
  z-index: 1;
  top: -10px;
  width: 100%;
  height: 1px;
  background: inherit;
}

/* Moves Line Down */
.menu-wrap .hamburger > div::after {
  top: 10px;
}

/* Toggler Animation */
.menu-wrap .toggler:checked + .hamburger > div {
  transform: rotate(135deg);
}

/* Turns Lines Into X */
.menu-wrap .toggler:checked + .hamburger > div:before,
.menu-wrap .toggler:checked + .hamburger > div:after {
  top: 0;
  transform: rotate(90deg);
}

/* Rotate On Hover When Checked */
.menu-wrap .toggler:checked:hover + .hamburger > div {
  transform: rotate(225deg);
}

.og-close {
	position: absolute;
	width: 40px;
	height: 40px;
	top: 100px;
	right: 100px;
	cursor: pointer;
	display:inline-block;

}

.og-close::before,
.og-close::after {
	content: '';
	position: absolute;
	width: 100%;
	top: 50%;
	height: 1px;
	background: #FFF;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);
}

.og-close::after {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.og-close:hover::before,
.og-close:hover::after {
	background: #FFD700;
}
