body {
    font-family: 'Open Sans', Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: normal;
    margin: 0;
    padding: 0;
    background-color: #f1f1f1;
    -webkit-font-smoothing: antialiased;
}

a:hover { text-decoration: none; }

hr { margin: 20px 20px 0; }

.wrapper {
    height: 100vh;
    background: #f2f2f2;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    -webkit-flex-wrap: wrap;
    overflow-y: auto;
}
.wrapper-inner { 
    max-width: 700px;
    min-height: 700px;
    margin: 10px;
}
.portal-wrapper .wrapper-inner { 
    padding-top: 85px ;
}
.flex {
  	display: flex;
    align-items: center;
    flex-wrap: wrap;  
    display: -webkit-flex;
    -webkit-align-items: center;
    -webkit-flex-wrap: wrap;
}
.logo {
    max-width: 100%;
    max-height: 100px;
    padding: 10px;
}
.bg-fff {
	background: #fff; 
}
.title {
    display: inline-block;
    font-weight: 600; 
    padding: 10px 20px; 
    margin: 0;
}
.registration-btn {
    background: #3e875f;
    color: #fff !important;
    padding: 10px;
    display: block; 
} 
.box-gap {
	padding: 0 10px;
	margin-bottom: 10px;
}
.box-gap:last-of-type, .JSstudent_pick .box-gap:last-of-type { margin-bottom: 0; }

.JSstudent_pick .box-gap:first-of-type { margin-top: 0; }

.label {
	font-size: 90%;
    color: inherit; 
    padding: 0;
    display: inline-block;
}
input[type=text], input[type=password], input[type=email], input[type=numeric]  {
    background: #ebeff0; 
    border: none;   
}
.sign-in-btn {
    background-color: #2c4145;
    color: #fff;
    border: none;
    padding: 8px 0;
    width: 40%;
    margin: 15px 15px 0 0;
    font-size: 90%;
}
.sign-in-btn:hover, .registration-btn:hover {
	opacity: .8;
}
.new-psw-btn { 
    color: inherit;
    margin: 5px 0;
    display: inline-block;
}
.logo-selltico {
    font-weight: 600;
    font-size: 85%;
    display: block; 
    color: inherit; 
}
.logo-selltico img {
	max-height: 16px;
}
.error {
    color: #f00;
    font-size: 12px; 
}
.login_registration_form > div {
    display: none;
    padding: 15px 0;
}
.login_registration_form > .JSstudent_registration {
    padding-top: 70px;
    padding-bottom: 40px;
}
.login_registration_form .show {
    display: block;
}
.JSstudent_pick .box-gap { 
    margin: 15px 0;
    font-weight: 600;
    font-size: 18px;
    background: #f2f2f2;
    height: 90px;
    cursor: pointer;
}
.student-name { flex: 1; }

.student-img-wrapper { height: 55px; }

.student-img-wrapper img { max-height: 55px; }

.nav-tabs li { 
    flex:1; 
    min-width: 50%;
    margin-bottom:0;
}

.nav-tabs .nav-link { color: #333; }

.nav-tabs .nav-link.active { background: #fff; }

.nav-tabs .nav-link { border: 0; }

.nav-tabs { background: #ebebeb}

.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { 
    border-bottom: 0; 
}
.nav-tabs >li { margin-bottom:0; }

@media screen and (min-width: 576px) {

    .portal-wrapper .wrapper-inner { padding-top: 50px; }

	.left-border:after {
	    content: '';
	    width: 1px;
	    display: inline-block;
	    height: 80%;
        min-height: 120px;
	    background: #3f424c;
	    position: absolute;
	    top: 50%;
	    transform: translateY(-50%);
	    left: 0;
	}
    .nav-tabs li { min-width: auto; }
}