/*Resource page above the fold style*/

body {
	padding-top: 70px;
}

a.top {
	position: fixed;
	padding: 1.5em;
	right: -webkit-calc(50% - 450px);
	right: calc(50% - 450px);
	bottom: 450px;
	background-color: #00ab9c;
	border-radius: 50%;
	color: white;
	font-weight: 700;
	transition: all 0.3s;
	-webkit-transform: scale(0);
	transform: scale(0);
	z-index: 10000000;
}

a.top.show {
	-webkit-transform: scale(1);
	transform: scale(1);
}

a.top span {
	display: block;
	padding-top: 0.2em;
}

a.top span.arrow {
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 0.5em;
	height: 0.5em;
	border-left: 2px solid white;
	border-top: 2px solid white;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

section.header {
	padding: 0em calc((100% - 1180px)/ 2);
	text-align: center;
	background-image: url(/wp-content/themes/angelsense/images/resource_page/resources_desktop.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 1920px 218px;
	height: 218px;
	position: relative;
}

section.header h1 {
	position: absolute;
	top: 50%;
	left: 50%;
	font-size: 2.7rem;
	font-weight: 600;
	color: white;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.8);
}

section.contact {
	position: absolute;
	top: 350px;
	right: calc(50% - 600px);
	width: 20%;
	z-index: 10000;
	box-sizing: border-box;
	padding: 1em 1.5em;
	background-color: #f4fffe;
	border: 1px solid #d8d8d8;
	border-radius: 8px;
}

section.contact div.message {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transition: all 0.3s;
	background-color: black;
	font-size: 1.3rem;
	color: #00ab9c;
	visibility: hidden;
	padding: 1em;
	opacity: 0;
	background-color: #f4fffe;
	z-index: 10000000;
}

section.contact div.message.show {
	visibility: visible;
	opacity: 1;
}

section.contact strong {
	color: #00ab9c;
}

section#form {
	padding-top: 2em;
	padding-left: calc((100% - 1180px)/ 2);
	padding-right: 40%;
}

section#form h2 {
	font-size: 1.5rem;
	color: #00ab9c;
	font-weight: 600;
}

section#form span.message {
	font-weight: 700;
	background-color: #f26522;
	color: white;
	display: block;
	margin-top: 0.5em;
	padding: 0.5em;
	max-height: 0;
	visibility: hidden;
	opacity: 0;
	transition: all 0.3s;
	position: relative;
}

section#form span.message.show {
	opacity: 1;
	max-height: 3em;
	visibility: visible;
	left: 0;
}

section#form form {
	padding-top: 2em;
	padding-bottom: 2em;
	border-bottom: 2px solid #d8d8d8;
}

section.contact form input[type="email"],
section.contact form select,
section#form form input[type="submit"],
section#form form select {
	border: none;
}

section#form form label {
	position: relative;
}

/*section#form form label:after {*/
/*	content: "»";*/
/*	position: absolute;*/
/*	top: 50%;*/
/*	right: 1em;*/
/*	-webkit-transform: translateY(-50%) rotate(-270deg);*/
/*	transform: translateY(-50%) rotate(-270deg);*/
/*	color: #b5afaf;*/
/*}*/

section.contact form label {
	position: relative;
	display: inline-block;
	width: 100%;
}

/*section.contact form label:before {*/
/*	content: "»";*/
/*	position: absolute;*/
/*	top: 60%;*/
/*	right: 10px;*/
/*	z-index: 10000;*/
/*	-webkit-transform: translateY(-50%) rotate(-270deg);*/
/*	transform: translateY(-50%) rotate(-270deg);*/
/*}*/

section.contact form input[type="email"],
section.contact form select,
section#form form select {
	border: 1px solid #d8d8d8;
	border-radius: 8px;
	padding: 1em 0.5em;
	background-color: white;
	color: #b5afaf;
	width: 250px;
	transition: all 0.4s;
	position: relative;
}

section.contact form input[type="email"],
section.contact form select {
	display: block;
	margin-top: 0.7em;
	width: 100%;
}

section.contact form input[type="email"]:focus,
section.contact form select:focus,
section#form form select:focus {
	border-color: #00ab9c;
	outline: 0;
}

section.contact form input[type="submit"],
section#form form input[type="submit"] {
	border: 1px solid #d8d8d8;
	border-radius: 8px;
	padding: 1em 2.5em;
	background-color: #00ab9c;
	color: white;
	font-weight: 700;
}

section.contact form input[type="submit"] {
	width: 100%;
	margin-top: 0.7em;
}

section.contact form input[type="submit"]:focus,
section#form form input[type="submit"]:focus {
	outline: 0;
}

section.contact div.recommend {
	margin-top: 1em;
	padding: 1em;
	background-color: white;
	border: 1px solid #00ab9c;
	border-radius: 8px;
}