button, input, optgroup, select, textarea {
	font-family: 'Inter', sans-serif;
}
/* CSS for Scrollbar-The emerging W3C standard
   that is currently Firefox-only */
   * {
	scrollbar-width: thin;
	scrollbar-color: #cacaca #ffffff;

  }
  
  /* Works on Chrome/Edge/Safari */
  *::-webkit-scrollbar {
	width: 12px;
  }
  *::-webkit-scrollbar-track {
	background: #ffffff;
  }
  *::-webkit-scrollbar-thumb {
	background-color: #cacaca;
	border-radius: 40px;
	border: 3px solid #ffffff;
  }
  h1, h2, h3, h4, h5, h6 {
    font-weight: 400;
    margin-top: 0;
    font-family: 'Space Grotesk', sans-serif;
    color: #ffffff !important;}
	
  header
  {
	display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    justify-content: space-between;
    height: 100%;
  }
.link-color
{
	color: #ffffff;
	font-weight: 600;
}
.link-color:hover
{
	text-decoration: underline;
	color: #ffffff;
}
.font-12px
{
	font-size: 12px;
	line-height: 14px;
}
.font-18px
{
	font-size: 18px !important;
	line-height: 18px !important;
}
.font-20px
{
	font-size: 20px;
	line-height: 20px;
}
.bold
{
	font-weight: 600;
}
.input-field
{
	margin: 10px 0 0 0;

}
.input-field input
{
border-bottom: 1px solid #bbc5e9 !important;
color: #ffffff;
box-shadow:none !important;
padding: 2px !important;
}
.input-field input:not([type]):focus:not([readonly]), .input-field input[type=text]:not(.browser-default):focus:not([readonly]), .input-field input[type=password]:not(.browser-default):focus:not([readonly]), .input-field input[type=email]:not(.browser-default):focus:not([readonly]), .input-field input[type=url]:not(.browser-default):focus:not([readonly]), .input-field input[type=time]:not(.browser-default):focus:not([readonly]), .input-field input[type=date]:not(.browser-default):focus:not([readonly]), .input-field input[type=datetime]:not(.browser-default):focus:not([readonly]), .input-field input[type=datetime-local]:not(.browser-default):focus:not([readonly]), .input-field input[type=tel]:not(.browser-default):focus:not([readonly]), .input-field input[type=number]:not(.browser-default):focus:not([readonly]), .input-field input[type=search]:not(.browser-default):focus:not([readonly]), .input-field textarea.materialize-textarea:focus:not([readonly])
{
	
    -webkit-box-shadow: 0 1px 0 0 #1B223A;
    box-shadow: 0 1px 0 0 #1B223A;
}

.input-field input:not([type]):focus:not([readonly])+label, .input-field input[type=text]:not(.browser-default):focus:not([readonly])+label, .input-field input[type=password]:not(.browser-default):focus:not([readonly])+label, .input-field input[type=email]:not(.browser-default):focus:not([readonly])+label, .input-field input[type=url]:not(.browser-default):focus:not([readonly])+label, .input-field input[type=time]:not(.browser-default):focus:not([readonly])+label, .input-field input[type=date]:not(.browser-default):focus:not([readonly])+label, .input-field input[type=datetime]:not(.browser-default):focus:not([readonly])+label, .input-field input[type=datetime-local]:not(.browser-default):focus:not([readonly])+label, .input-field input[type=tel]:not(.browser-default):focus:not([readonly])+label, .input-field input[type=number]:not(.browser-default):focus:not([readonly])+label, .input-field input[type=search]:not(.browser-default):focus:not([readonly])+label, .input-field textarea.materialize-textarea:focus:not([readonly])+label
{
	color: #ffffff !important;
}
[type="checkbox"].filled-in:checked+span:not(.lever):after
{
	border: 1px solid #fff;
	background-color: #fff;
}
[type="checkbox"].filled-in:checked+span:not(.lever):before {
    top: 0;
    left: 1px;
    width: 8px;
    height: 13px;
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    border-right: 2px solid #3278bd;
    border-bottom: 2px solid #3278bd;
    -webkit-transform: rotateZ(37deg);
    transform: rotateZ(37deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}
[type="checkbox"].filled-in:not(:checked)+span:not(.lever):after
{
	border: 1px solid #ffffff !important;
}
[type="checkbox"]+span:not(.lever)
{
	height: 20px;
    line-height: 20px;
}
.input-field input[type=date]:focus + label,
.input-field input[type=text]:focus + label,
.input-field input[type=email]:focus + label,
.input-field input[type=password]:focus + label {
  color:#ffffff;
}

.input-field input[type=date]:focus,
.input-field input[type=text]:focus,
.input-field input[type=email]:focus,
.input-field input[type=password]:focus {
  border-bottom: 1px solid #ffffff !important;
  box-shadow: none;
}
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
  box-shadow: 0 0 0 1000px #3278bd inset !important;
  -webkit-text-fill-color: rgb(219, 233, 21) !important;
}
.input-field label {
    color: #bbc5e9;
    position: absolute;
    top: 0.3rem;
    left: 0.75rem;
    font-size: 16px;
    cursor: text;
    transition: .2s ease-out;
}
.main-contain
{
	height:100%;
	display:-ms-flexbox;
	display:flex;
	-ms-flex-direction:row;
	flex-direction:row;
	overflow:hidden;
}
.content
{
	width: 100%;
	background-color:#3278bd;
	padding: 50px 80px;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex: 1;
	flex: 1;
	overflow: auto;
	position: relative;
	color: #d5d9e7;
}
.auth-content {
    width: 100%;
    max-width: 500px;
	margin: auto;
	
	display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: end;
    justify-content: center;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
.auth-content .logo
{
	width: 100%;
	text-align:center;
	display: none;
	
}
.auth-content .logo img
{
	width: auto;
}
.artwork .logo
{
	width: 100%;
	margin: 0 0 40px 0;
	display: block;
	
}

.auth-content footer
{
	bottom: 0;
}
.auth-sidebar
{
	width: 40%;	
	-ms-flex-positive: 0;
	flex-grow: 0;
	position: relative;
}
.auth-sidebar .auth-sidebar-content
{
	background: #1B223A url("../img/login/bg-image.jpg") no-repeat 50% top; 
	background-size:cover;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-pack: justify;
	justify-content: space-between;
	height: 100%;
}

.auth-sidebar .artwork
{
	width: 100%;
	margin: auto;
	max-width: 95%;
	display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: end;
    justify-content: space-between;
    -ms-flex-positive: 1;
    flex-grow: 1;

}
.heading1
{
	font-size: 28px;
	line-height: 30px;
	font-weight: 800;
	font-family: 'Space Grotesk', sans-serif;
}
.heading2
{
	font-size: 18px;
	line-height: 22px;
}
.large-button
{
	background: transparent;
	font-size: 18px;
	font-weight: 600;
	
	line-height: 22px;
	color: #ffffff;
	border: 0px;
	border-radius: 50px;
	padding: 10px 30px;
	outline: none;
	border: 1px solid #ffffff;
}
.small-button
{
	background-color: #1B223A;
	font-size: 12px;
	line-height: 12px;
	text-transform: uppercase;
	color: #ffffff;
	border: 0px;
	border-radius: 20px;
	padding: 10px 20px;

}
.large-button:hover, .small-button:hover
{
	color: #3278BD;
	background-color: #ffffff;
	-webkit-transition: background-color .3s;
    transition: background-color .3s;
   
}
.social-media
{
	display: block;
}
.for-small-device
{
	display: none;
}
.social-media a
{
	border: 1px solid #1b223a;
	border-radius: 50px;
	text-align: center;
	color: #1b223a;
	padding: 5px;
	width: 40px;
	height: 40px;
	display: inline-flex;
	justify-content: center;
}
.social-media a + a
{
	margin-left: 20px;
}
.social-media a i
{
	font-size: 20px;
	line-height: 20px;
	padding: 5px;
}
.facebook:hover {
	background: #ffffff;
	color: #3B5998;
	transition: background-color .5s, color .5s;
  }
  
  .google:hover {
	background: #ffffff;
	color: #dd4b39;
	transition: background-color .5s, color .5s;
  }
  
  .linkedin:hover {
	background: #ffffff;
	color: #007bb5;
	transition: background-color .5s, color .5s;
  }
  .youtube:hover {
	background: #ffffff;
	color: #ff0000;
	transition: background-color .5s, color .5s;
  }
  hr.divider {
    overflow: visible;
    padding: 0;
    margin-bottom: 10px;
    border: none;
    border-top: 1px solid #ffffff;
    color: #ffffff;
    text-align: center;
	opacity: .5;
}
hr.divider:after {
    content: 'Or';
    display: inline-block;
    position: relative;
    top: -13px;
    font: normal 16px/16px 'Space Grotesk', sans-serif;
    padding: 0 16px;
    background: #3278bd;
}
ul.password-instruction li
{
	list-style-type: disc;
	text-indent: 19px;
}
.view-strength
{
	top:15px;
	right: 12px;
	display: block;

}
.view-strength .strength-bar
{
	width: 60px;
	height: 10px;
	border-radius: 5px;
	background-color: #e8e8e8;
	display: inline-block;
	overflow: hidden;
}
.view-strength .strength-bar span
{
	width: 70%;
	height: 11px;
	display: block;
}
.view-strength .strength-bar span.medium
{
	background-color: #efa310;
}
.strength
{
	font-size: 12px;
	line-height: 30px;
}
input.p-r-100px
{
	padding-right: 100px !important;
	box-sizing: border-box !important;
}

@media screen and (max-width: 1200px) {
	.heading1 {
		font-size: 25px;
		line-height: 30px;
	}

}
@media screen and (max-width: 992px) {
	
	.auth-sidebar
	{
		display: none;
	}
	.for-small-device
	{
		display: block;
		color: #1B223A;
	}
	.for-small-device .social-media a
	{
		border:none;
		border-radius: 50px;
		text-align: center;
		color: #ffffff;
		border: 1px solid #ffffff;
		
	}
	.facebook, .facebook:hover {
		background: #3B5998;
		color: #3B5998;
	  }
	  
	  .google, .google:hover {
		background: #dd4b39;
		color: #ffffff;
	  }
	  
	  .linkedin, .linkedin:hover {
		background: #007bb5;
		color: #ffffff;
	  }
	  .youtube, .youtube:hover {
		background: #ff0000;
		color: #ffffff;
	  }
	  .text-xs-center
	  {
		  text-align: center;
		  color:#ffffff;
	  }
	  .sm-width-100
	  {
		  width: 100%;
	  }
	  .auth-content .logo
	{
		width: 100%;
		text-align:center;
		display: block;
		height: 100px;
		
	}
	.artwork .logo
	{
		width: 100%;
		margin: 40px 0;
		display: none;
		
		
	}
}

@media screen and (max-width: 767px) {


}
@media screen and (max-width: 576px) {


}









