@charset "UTF-8";
/* Title: theMednet Home Page
** Description: IE8 Compatible Responsive Registration and Sign In Page
** Author: Pixelkeet - www.pixelkeet.com
** Created: 02-04-2017
** Updated: 02-05-2017
************************************** */

/* =------- Colors --------
Dark Gray: #4d5152
theMednet Blue: #2e388f
Green: #3c9c46
--------------------------- */

/* =------- Containers -------- */
html {
	overflow-x: hidden;
	}

html,
body {
	position:relative;
	height:100%;
	font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
	text-align:center;
	color:#4d5152;
	}

header {
	position: fixed;
  z-index: 900;
	top:0;
  width: 100%;
	background:rgba(255,255,255,0.95);
	}
header .contain-lrg {
	border-bottom:1px solid #dcdcdd;
  padding-bottom:5px;
}

footer .contain {
	max-width: 64em;
	padding: 1.5em 0 1.5em 0;
}

footer .contain-lrg {
	border-top:1px solid #dcdcdd;
	font-size: 95%;
	text-align: left;
}

footer .col1 {
	width:87%;
	text-align: left;
}
footer .col2 {
	width:12%;
	text-align: right;
	font-size: 95%;
}

footer nav {
	font-size: 95%;
	display: inline-block;
}

footer nav a:not(:last-child) {
	margin-right: 1em;
}

.min-header {
	background:none;
	border:none;
	}

.bottom {
	position:absolute;
	left:0;
	bottom:2em;
	width:100%;
	}

.contain {
	box-sizing: border-box;
	margin:0 auto;
	padding:0 1em;
	}

.contain.top {
	margin-top: 4.55em;
	margin-bottom: 3.5em;
	}

.contain-lrg {
	position:relative;
	max-width:61em;
	}

.contain-med-lrg {
	max-width:50em;
	}

.contain-med {
	max-width:30em;
	}

.col {
	display:inline-block;
	vertical-align:top;
	}

.twocol .col {
	width:50%;
}

.logos-box {
	border-top:1px solid #dcdcdd;
	margin-bottom: 1em;
	padding:0;
}
.logos-box h4 {
	margin-top:-0.5em;
}
.logos-box h4 span {
	padding:0 2em;
	text-align: center;
	background: #fff;
}

.logo-wrapper {
	margin: 10px auto;
}

.logos-images {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}

.logos-images.grants {
	justify-content: space-around;
}

.logos-images img {
	height: 45px;
	opacity: 0.5;
}

img.logo-medium {
	height: 60px;
}

img.logo-bigger {
	height: 75px;
}

img.logo-biggest {
	height: 90px;
}

/* = Header */
header .col1 {
	width:20%;
	text-align:left;
	}
header .col2 {
	width:80%;
	text-align:right;
	}

header form input,
header form button {
	margin: 0.8em 0 0 0;
}

/* = Alerts */
.alert {
	padding:1em;
	border:4px solid #89c765;
	font-weight:bold;
	}


/* =------- Typography -------- */
h1,
h2 {
	text-align:center;
	font-weight: 100;
	}

h2,
h3 {
	color:#2e388f;
	}

h4 {
	color: #a7a9ac;
	text-transform: uppercase;
}

h4.border {
	border-top:1px solid #dcdcdd;
	margin-bottom: 0.5em;
	text-align: center;
}
h4.border span {
	position: relative;
	top:-0.6em;
	padding:0 1em;
	text-align: center;
	background: #fff;
	font-weight: normal;
}

h1 {
	margin:3.5em 0 1em 0;
	}

.banner h1 {
	margin:0 0 0.5em 0;
	}

h2 {
	margin:2em 0;
	}

.feature-word {
	font-size: 200%;
	}

.hr-word {
	display:block;
	color: #B9BCC0;
    font-size: 1.5em;
    line-height: 2.5;
    position: relative;
    text-align: center;
	}

.hr-word:before,
.hr-word:after {
	border-top: 1px solid #E1E2E4;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    top: 50%;
    width: 45%;
    z-index: 0;
	}

.hr-word:before {
	left: auto;
    right: 0;
	}

a {
	text-decoration:none;
	color:#2e388f;
	}
a:hover {
	color:#1ca9e1;
	}

.fineprint {
	display: block;
	font-size: 80%;
}

header a {
	color:#777;
	}

header a:hover {
	color:#1ca9e1;
	}

footer,
footer a {
	color:#a7a9ac;
}
footer a:hover {
	color:#4d5152;
}

.experts-link {
	color: #2e388f;
	transition: color 100ms;
}

.experts-link:hover {
	color: #545CA3;
}

.center {
	text-align:center;
	}

/* =------- Branding -------- */
.logo {
	display:inline-block;
	width:160px;
	height:39px;
	padding: 1em  0 1em 0;
	text-indent:-9999px;
	background: url(../img/logo-themednet-160x39.svg) no-repeat center;
	}

/* =------- Form Elements -------- */
label {
	margin-bottom:0.5em;
	display:inline-block;
	text-align:left;
	}

input,
textarea,
select,
button {
	-webkit-box-sizing: border-box !important;
  -moz-box-sizing: border-box !important;
  box-sizing: border-box !important;
	border-radius:0.2em;
	margin:0 0 0.5em 0;
	padding:0.7em 1.2em;
	-webkit-transition:	all 0.5s ease;
  -moz-transition:	all 0.5s ease;
  -o-transition:		all 0.5s ease;
	transition:			all 0.5s ease;
	}

input,
textarea,
select {
	border:1px solid #949797;
	background: #fff;
	}

select {
	-webkit-appearance: none;
	padding-right: 65px;
	background: url(../img/icon-arrow-down-full-gray-20.png) 100% center no-repeat;
	background: url(../img/icon-arrow-down-full-gray-20.svg) 100% center no-repeat;
	background-size: 35px;
	color:#aaa;
}
select:focus {
	color:#4d5152;
}
select:focus {
	-webkit-appearance: none;
	padding-right: 65px;
	background: url(../img/icon-arrow-down-full-blue-20.png) 100% center no-repeat;
	background: url(../img/icon-arrow-down-full-blue-20.svg) 100% center no-repeat;
	background-size: 35px;
}

input:focus,
textarea:focus,
select:focus {
	border:1px solid #2e388f;
	}

textarea {
	min-height:15em;
	}

label.checkbox,
label.radio  {
	position:relative;
	overflow:hidden;
	margin-bottom:0;
	}

label.checkbox span,
label.radio span {
	display:inline-block;
	margin:0 0.125em 0.25em 0.125em;
    border-radius:4px;
	padding:1em;
	-webkit-box-shadow: inset 0px 0px 0px 1px #03a9f4;
    -moz-box-shadow: 	inset 0px 0px 0px 1px #03a9f4;
    box-shadow: 			inset 0px 0px 0px 1px #03a9f4;
	color:#03a9f4;
	}

label.checkbox span:hover,
label.radio span:hover {
	color:#a8529f;
	font-weight:bold;
	-webkit-box-shadow: inset 0px 0px 0px 2px #a8529f;
    -moz-box-shadow: 	inset 0px 0px 0px 2px #a8529f;
    box-shadow: 			inset 0px 0px 0px 2px #a8529f;
	}

label.checkbox input,
label.radio input {
    position:absolute;
    top:-20px;
	}

label.checkbox input:checked + span,
label.radio input:checked + span {
    background:#a8529f;
    color:#fff;
	}

.fineprint.details {
	opacity:0.5;
	/* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  /* IE 5-7 */
  filter: alpha(opacity=50);
}

/* = Buttons */
button {
	display:inline-block;
	margin-top:1em;
	color:#fff;
	font-weight:bold;
	text-decoration:none;
	background:#2e388f;
}
button:hover {
	color:#fff;
	background:#1ca9e1;
	}

/* =------- Icons -------- */
.icon {
	display:inline-block;
	text-indent:-9999px;
	}

.icon.search,
.icon.chat,
.icon.people {
	width:40px;
	height:40px;
	}

.icon.search {
	background:url(../img/icon-search-gray-40.png) center no-repeat;
	background:url(../img/icon-search-gray-40.svg) center no-repeat;
	}
.icon.chat {
	background:url(../img/icon-chat-gray-40.png) center no-repeat;
	background:url(../img/icon-chat-gray-40.svg) center no-repeat;
	}
.icon.people {
	background:url(../img/icon-people-gray-40.png) center no-repeat;
	background:url(../img/icon-people-gray-40.svg) center no-repeat;
	}

footer .social{
	display: inline-block;
	margin-right: 1em;
	text-indent: -9999px;
	width:17px;
	opacity: 0.6;
}
.social.facebook {
	background:url(../img/icon-facebook-gray-17.png) center no-repeat;
	background:url(../img/icon-facebook-gray-17.svg) center no-repeat;
}
.social.twitter {
	background:url(../img/icon-twitter-gray-17.png) center no-repeat;
	background:url(../img/icon-twitter-gray-17.svg) center no-repeat;
}
.social.google{
	background:url(../img/icon-google-17.png) center no-repeat;
	background:url(../img/icon-google-17.svg) center no-repeat;
}
.social.linkedin {
	background:url(../img/icon-linkedin-17.png) center no-repeat;
	background:url(../img/icon-linkedin-17.svg) center no-repeat;
}
footer .social:hover{
	opacity: 1;
}

/* =------- Modifiers -------- */
.ie8 {
	display:none;
}

.mobile {
	display:none;
	}

.full-width {
	width:100%;
	}

.side-padding {
	margin:0 1em;
	}

	button.green {
		background: #3c9c46;
	}
	button.green:hover {
		background: #78c260;
	}

/* =------- Pages -------- */

/* = Home */
.home .contain.top h2 {
	margin: 5.5em 0 2.5em 0;
	}
.home .contain.top h3 {
	margin-top: 0;
	margin-bottom: 0.8em;
	}
.home .twocol .col {
	box-sizing: border-box;
	font-size: 110%;
	text-align: left;
	}
.home .twocol .col1 {
	padding:0 1em 0 2.5em;
	}
.home .twocol .col2 {
	padding:0 2.5em 0 3em;
	}
.home .twocol .col1 .row {
	margin-bottom: 3em;
	}
.home .twocol .col1 .icon {
	vertical-align: top;
	display: inline-block;
	opacity:0.5;
	/* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  /* IE 5-7 */
  filter: alpha(opacity=50);
	margin-right: 1em;
	}
.home .twocol .col1 .text {
	display: inline-block;
	width:80%;
	}

/* =------- Media Queries -------- */

@media (max-width:46em) {
	.desktop {
		display: none;
	}
	.mobile {
		display: block;
	}
	header {
		position: static;
	}
	header .col2 {
		display: none;
		}
	header .col1 {
		width:100%;
		text-align: center;
		}
	header .logo {
		margin:1em 0 1em 0;
		width:200px;
	}
	header .contain {
		border-bottom: none;
	}
	.home .contain.top {
		margin-top:0;
	}
	.home .contain.top h2 {
		margin:0em 0 0.5em 0;
		font-size: 120%;
	}
	.home .twocol .col {
		width:100%;
		padding:0;
	}

	.home form .fineprint {
		text-align: center;
	}

	.home .twocol .col1 {
		margin-top: 2em;
		border-top:1px solid #dcdcdd;
		padding-top: 2em;
		font-size: 100%;
	}
	.home .twocol .col1 .row {
		margin-bottom: 2em;
	}
	.home .twocol .col1 .icon {
		width: 30px;
		height: 30px;
	}

	.logos-box h4 span {
		padding:0;
	}

	.logo-wrapper {
		width: 100%;
		margin: 10px 0;
	}

	footer .col {
		width:100%;
		text-align: center;
	}
	footer .social-block {
		display: block;
		margin-bottom: 1em;
	}
	footer nav {
		margin:0;
		padding: 0 0.5em;
		line-height: 2em;
		margin-bottom: 1em;
	}
	footer nav a {
		margin-right: 0.8em;
	}

}