/*
Theme Name: Slottsfjellet videreående steinerskole 2016
Theme URI: http://www.vestfold.steinerskolen.no
Version: 1.0
Author: Affair
Description: Theme designed by Affair AS for Steinerskolen i Vestfold
Author URI: http://www.affair.no
*/



/* standard nullstilling av html-koder */
html, body, div, span, object, iframe, header, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
	{
		margin: 0;
		padding: 0;
		border: 0;
		font-weight: inherit;
		font-style: inherit;
		font-size: 100%;
		font-family: inherit;
		vertical-align: baseline;
	}

table
	{
		border-collapse: separate; border-spacing: 0;
	}

caption, th, td
	{
		text-align: left; font-weight: normal;
	}

table, td, th
	{
		vertical-align: middle;
	}

.clearfix,
.cf {
	zoom: 1;
}

.clearfix:before, .clearfix:after, .cf:before, .cf:after {
  content: "";
  display: table;
}

/* fjern anførselstegn (") fra <q>, <blockquote> */
blockquote:before, blockquote:after, q:before, q:after
	{
		content: "";
	}

blockquote, q
	{
		quotes: "" "";
	}




/* fjern ramme på lenkede bilder */
a img
	{
		border: none;
	}


.nf-form-content {
	margin-left: -10px!important;
	margin-right: -10px!important;
}

@media (max-width: 480px) {
	.four-col-list ul li {
		width: 50%!important;
	}
}


/* typografi */

h1
	{
		border-bottom: 1px dotted rgb(77,77,77);
		color: rgb(255,255,255);
		font-family: "Expletus Sans", sans-serif;
		font-size: 41px;
		letter-spacing: 5px;
		line-height: 53px;
		padding-bottom: 30px;
		text-transform: uppercase;
	}

h2
	{
		color: rgb(255,255,255);
		font-family: 'Raleway', sans-serif;
		font-size: 17px;
		line-height: 25px;
		padding: 30px 0 0 0;
	}

h3
	{
		color: rgb(0,0,0);
		font-family: "Expletus Sans", sans-serif;
		font-size: 23px;
		font-weight: 600;
		padding: 25px 0 15px 0;
	}

h4
	{
		color: rgb(176,176,176);
		font-family: 'Droid Serif', serif;
		font-size: 17px;
		font-style: italic;
		line-height: 25px;
		padding-top: 25px;
	}

.white-content > * {
	margin-bottom: 15px;
}

.white-content > *:last-child {
	margin-bottom: 0;
}

blockquote
	{
/*		border-left: 3px solid;
*/		font-family: 'Droid Serif', serif;
		font-size: 20px;
		font-style: italic;
		line-height: 33px;
		margin: 25px 0px 25px 107px;
/*		padding: 0 0 0 25px;
*/	}

a
	{
		color: rgb(63,164,152);
	}

a:hover
	{
		color: rgb(0,0,0);
	}



@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
body {-webkit-text-size-adjust: none;}
}




@media only screen and (max-width: 940px) {



h1
	{
		text-align: center;
	}

h2, h4
	{
		text-align: center;
	}

blockquote
	{
		font-size: 20px;
		font-style: italic;
		line-height: 33px;
		margin: 25px 0px 25px 35px;
/*		padding: 0 0 0 25px;
*/	}

}





@media only screen and (max-width: 768px) {

h1
	{
		font-size: 26px;
		letter-spacing: 3px;
		line-height: 32px;
	}

}



/* basic */

html
	{
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

body
	{
		background: rgba(0,0,0,0.9);
		color: rgb(110,110,110);
		font-family: 'Raleway', sans-serif;
		font-size: 17px;
		line-height: 25px;
	}

.wrap
	{
		margin: 0 auto;
/*		max-width: 1254px;
*/		width: 100%;
	}

.white-back
	{
		background: rgb(255,255,255);
		width: 100%;
	}

.white-content
	{
		margin: 0 auto;
		max-width: 786px;
		padding: 60px 0 95px 0;
		width: 100%;
	}

article .intro
	{
		width: 100%;
	}

article .intro .wrap
	{
/*		background: blue;
*/		margin: 0 auto;
		width: 100%;
/*		max-width: 1254px;
*/	}

article .intro .left {
	background-size: cover !important;
	-webkit-background-size: cover; /* For WebKit*/
	-moz-background-size: cover;    /* Mozilla*/
	-o-background-size: cover;      /* Opera*/
	float: left;
	height: 860px;
	width: 50%;
}

article .intro .left.style--contain {
	background-size: contain !important;
	background-repeat: no-repeat!important;
	-webkit-background-size: contain; /* For WebKit*/
	-moz-background-size: contain;    /* Mozilla*/
	-o-background-size: contain;      /* Opera*/
}

article .intro .right
	{
		float: left;
		height: 640px;
/*		height: 573px;
		padding: 120px 10% 0 10%;
*/		padding: 220px 10% 0 10%;
		width: 30%;
		overflow-y: auto;
		/*max-width: 380px;*/
	}

.clear
	{
		clear: both;
	}


.simple-content-header {
	margin-bottom: 40px;
}

.simple-content-header h1 {
	color: rgb(110,110,110);
	line-height: initial;
	border-bottom: 0;
	text-align: left;
	padding-bottom: 0;
}

@media (min-width: 769px) {
	.first-page-section {
		margin-top: 70px;
	}
}

@media (min-width: 941px) {
	.first-page-section {
		margin-top: 120px;
	}
}

@media only screen and (max-width: 940px) {


.white-content
	{
		margin: 0 auto;
		max-width: 786px;
		padding: 55px 5% 45px 5%;
		width: 90%;
	}

article .intro .left, article .intro .right
	{
		float: none;
		padding-left: 5%;
		padding-right: 5%;
		width: 90%
	}

article .intro .left
	{
		height: 350px;
	}

article .intro .right
	{
		height: auto;
		padding-top: 50px;
		padding-bottom: 50px;
		max-width: none;
	}

}




/* front page */

article .intro .front-img
	{
		background-size: cover !important;
		-webkit-background-size: cover; /* For WebKit*/
		-moz-background-size: cover;    /* Mozilla*/
		-o-background-size: cover;      /* Opera*/
		height: 600px;
		width: 100%;
		z-index: -999;
	}

.white-content-front a.cta2
	{
		background-color: rgb(63,164,152);
		border: 2px solid rgb(255,255,255);
	    border-radius: 50%;
/*	    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
*/		color: white;
		cursor: pointer;
		display: inline-flex;
		font-family: "Expletus Sans", sans-serif;
		font-size: 34px;
		font-weight: 600;
		height: 100px;
		left: 20%;
		line-height: 43px;
		padding: 30px;
		position: absolute;
		text-align:center;
		text-decoration: none;
		text-transform: uppercase;
		top: 540px;
		width: 120px;
		height: 120px;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

.white-content-front a.cta
	{
		background-color: rgb(63,164,152);
	    border-radius: 3px;
		color: white;
		cursor: pointer;
		display: inline-block;
		font-family: "Expletus Sans", sans-serif;
		font-size: 24px;
		font-weight: 600;
		margin: 35px auto 50px auto;
		padding: 20px 30px 15px 30px;
		text-align:center;
		text-decoration: none;
		text-transform: uppercase;
	}

.white-content-front a.cta:hover
	{
		background-color: rgb(0,0,0);
	}

.white-content-front a.cta2:hover
	{
		background-color: rgb(0,0,0);
	}

article .intro .front-txt
	{
		padding: 120px 10% 30px 10%;
		width: 80%;
		max-width: 1254px;
	}

.front-txt h1
	{
		border-bottom: 1px dotted rgb(176,176,176);
		color: rgb(0,0,0);
		font-size: 46px;
		line-height: 57px;
		text-align: center;
	}

.white-content-front
	{
		margin: 0 auto;
		max-width: 1254px;
		padding: 0px 10% 95px 10%;
		text-align: center;
		width: 80%;
	}

	.instagram {
		background: #f1f1f1;
		padding: 40px 0;
	}

	.instagram .white-content-front {
		padding-bottom: 0;
	}

	.instagram h2 {
		color: #000;
		font-size: 28px;
		text-align: left;
		margin-bottom: 20px;
		padding: 0 10px;
	}

white-content-front h1
	{
		color: rgb(0,0,0);
	}

.front-txt h2
	{
		color: rgb(110,110,110);
		font-size: 21px;
		line-height: 30px;
	}

.bullets
	{
		margin: 35px 0 0 0;
	}

.bullets .box, .bullets .box-1
	{
		float: left;
		margin-left: 5%;
		width: 30%;
	}

.bullets .box-1
	{
		margin-left: 0 !important;
	}

.bullets h2
	{	color: rgb(0,0,0);
		font-family: "Expletus Sans", sans-serif;
		font-size: 23px;
		font-weight: 600;
		padding: 0px 0 15px 0;
	}

.icon-1, .icon-2, .icon-3
	{
		display: block;
		height: 170px;
		margin: 0 0 25px 0;
		width: 100%;
	}

.icon-1
	{
		background: url(/wp-content/themes/steiner/img/o.svg) no-repeat center center;
	}

.icon-2
	{
		background: url(/wp-content/themes/steiner/img/h.svg) no-repeat center center;
	}

.icon-3
	{
		background: url(/wp-content/themes/steiner/img/s.svg) no-repeat center center;
	}


/* Sliding Marketing */
.sm_button.rounded {margin-top: 25px;}



@media only screen and (max-width: 940px) {


article .intro .front-img
	{
		height: 350px;
	}

article .intro .front-txt
	{
		padding-left: 0;
		padding-right: 0;
		padding-top: 50px;
		width: 100%;
	}

.white-content-front a.cta2
	{
		background-color: rgb(63,164,152);
		border: none;
	    border-radius: 3px;
		color: white;
		cursor: pointer;
		display: inline-block;
		font-family: "Expletus Sans", sans-serif;
		font-size: 24px;
		font-weight: 600;
		height: auto;
		left: inherit;
		margin: 10px auto 40px auto;
		padding: 20px 30px 15px 30px;
		position: inherit;
		text-align:center;
		text-decoration: none;
		text-transform: uppercase;
		top: inherit;
		width: auto;
	}

}




@media only screen and (max-width: 768px) {

.front-txt h1
	{
		font-size: 26px;
		letter-spacing: 3px;
		line-height: 32px;
	}

.front-txt h2
	{
		color: rgb(110,110,110);
		font-size: 17px;
		line-height: 25px;
	}

.bullets .box, .bullets .box-1
	{
		float: none;
		width: 100%;
		margin: 0 0 35px 0;
	}

}




/* article */

.white-content img.size-thumbnail
	{
		float: left;
		margin: 5px 20px 15px 0;
		width: 100%;
		max-width: 250px;
	}

.white-content img.size-medium
	{
		height: auto;
		width: 100%;
		max-width: 786px;
	}

@media only screen and (max-width: 468px) {

.white-content img.size-thumbnail
	{
		float: none;
		height: auto;
		max-width: none;
	}

}


.white-content h1,
.white-content h2,
.white-content h3 {
	font-family: "Expletus Sans", sans-serif;
}

.white-content h1 {
	font-size: 41px;
}

.white-content h2,
.white-content h3 {
	font-size: 23px;
	font-weight: 600;
	padding: 25px 0 15px 0;
}

.white-content h1,
.white-content h2,
.white-content h3,
.white-content h4,
.white-content p {
	color: #000;
}

/* header */

header {
	min-height: 70px;
	background: rgba(0,0,0,0.9);
	position: fixed;
	width: 100%;
	z-index: 999;
	top: 0;
}

.wrap .logo
	{
		background: rgb(255,255,255);
		/* height: 60px; */
		width: 100%;
		position: relative;
	}

.logo .logo-1
	{
		float: left;
		margin-top: 10px;
		width: 50%;
	}

.logo .logo-2
	{
		float: left;
		margin-top: 5px;
		text-align: right;
		width: 50%;
	}

.logo .logo-1 img, .logo .logo-2 img
	{
		margin: 0 30px 0 30px;
		width: 250px;
	}

	.social-icons {
		position: absolute;
		top: 0;
		right: 30px;
		bottom: 0;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
	}

	.social-icon {
		display: inline-block;
		margin-left: 15px;
	}

	.social-icon img {
		display: block;
		width: 18px;
		height: auto;
	}

	@media only screen and (max-width: 940px) {
		.social-icons {
			right: calc(5% + 80px);
		}
	}

	@media only screen and (max-width: 380px) {
		.social-icons {
			display: none;
		}
	}

nav
	{
		margin: 0 auto;
		text-align: right;
		width: 100%;
		max-width: 1254px;
	}

nav ul
	{
		float: right;
		font-family: "Expletus Sans", sans-serif;
		font-size: 12px;
		font-weight: 700;
		letter-spacing: 1px;
		list-style: none;
		text-transform: uppercase;
	}

nav li
	{
		float: left;
	}

nav li a
	{
		color: rgb(255,255,255);
		display: block;
		text-decoration: none;
		padding: 15px 15px 10px 15px;
	}

nav li a:hover
	{
		background: rgb(255,255,255);
		color: rgb(0,0,0);
	}

nav li.current-page-item a, nav li.current-menu-item a, nav li.current-page-parent a, nav li.current-menu-ancestor a
	{
		background: rgb(77,77,77);
	}

nav li.current-page-item a:hover, nav li.current-menu-item a:hover
	{
		color: rgb(255,255,255);
/*		cursor: default;
*/	}

nav ul ul
	{
		display: none;
		position: absolute;
		text-align: left;
	}

nav ul li:hover ul
	{
		display: block;
	}

nav ul ul li
	{
		border-top: dotted 1px rgba(176,176,176,0.6);
		background: rgb(77,77,77);
		float: none;
		margin: 0;
	}

nav ul ul li a:hover
	{
		background: rgb(0,0,0);
		color: rgb(255,255,255);
	}

.current_page_item.menu-item-38
	{
		display: none;
	}


@media only screen and (max-width: 768px) {

	header {
		min-height: 59px;
		position: inherit;
	}

.logo .logo-1
	{
		float: none;
		margin-top: 0px;
		width: auto;
	}

.logo .logo-2
	{
		float: none;
		margin-top: 0px;
		text-align: left;
		width: auto;
	}

.logo .logo-1 img
	{
		margin: 10px 0px 0 10px;
		width: 200px;
	}

.logo .logo-2 img
	{
		display: inherit;
		margin: 5px 0px 0 10px;
		width: 230px;
	}

}

@media only screen and (max-width: 468px) {

.logo .logo-2 img
	{
		display: none;
	}
}



/* footer */

footer
	{
		padding: 0 0 70px; 0;
	}

footer h2.widgettitle
	{
		border-bottom: 1px dotted rgb(77,77,77);
		color: rgb(255,255,255);
		font-family: "Expletus Sans", sans-serif;
		font-size: 21px;
		letter-spacing: 2px;
		line-height: 27px;
		margin: 0 auto;
		padding-bottom: 10px;
		text-align: center;
		text-transform: uppercase;
		max-width: 612px;
	}

footer .textwidget
	{
		color: rgb(255,255,255);
		font-size: 15px;
		padding: 10px 0 0 0;
		text-align: center;
	}

footer .textwidget a:hover
	{
		color: rgb(255,255,255);
	}



/* søknadsskjema */

form h5
	{
		color: rgb(0,0,0);
		font-family: 'Raleway', sans-serif;
		font-size: 17px;
		font-weight: 600;
		font-style: italic;
		line-height: 25px;
		padding: 30px 0 20px 0;
	}

form input
	{
	    border: 1px solid #e3e3e3;
	   	border-radius: 3px;
		font-family: 'Raleway', sans-serif;
		font-size: 14px;
		font-weight: 500;
		margin-bottom: 10px;
		padding: 10px;
		width: 100%;
		-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
	    box-sizing: border-box;         /* Opera/IE 8+ */
	    -webkit-appearance: none;
	   -moz-appearance: none;
	   appearance: none;
	}

/* body select.select_box */
body select
	{
	    appearance: none;
	    border: 1px solid #e3e3e3;
	    border-radius: 3px;
	    background: url("https://image.ibb.co/iMeAJv/selectbox_arrow.png") right center no-repeat;
	    background-color: #fff;
	    color: #444444;
	    display: block;
		font-family: 'Raleway', sans-serif;
	    font-size: 14px;
		font-weight: 500;
	    height: auto;
	    line-height: 16px !important;
	    max-width: 100%;
	    padding: 10px 70px 10px 13px !important;
	    /* this is must */ -webkit-appearance: none;
		-moz-appearance: none;
	}

/* body select.select_box option */
body select option
	{
  	  padding: 0 4px;
	}

/* for IE and Edge */
select::-ms-expand
	{
  	  display: none;
	}

select:disabled::-ms-expand
	{
    	background: #f60;
	}

input[type="submit"], .wpcf7 input[type="button"], .btn, .nf-field-element input.btn {
		background-color: rgb(63,164,152);
		border: none;
		border-radius: 3px;
		color: white;
		cursor: pointer;
		float: left;
		font-family: "Expletus Sans", sans-serif;
		font-size: 20px;
		font-weight: 600;
		padding: 15px 20px 10px 20px;
		text-align:center;
		text-transform: uppercase;
		width: auto;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
	}

input[type="submit"]:hover, .wpcf7 input[type="button"]:hover {
	background-color:#000;
}

.nf-field-element input.btn {
	background-color: rgb(63,164,152)!important;
}

.nf-field-element input.btn:hover {
	background-color: #000!important;
	color: #fff!important;
}

.blog .right,
.category .right {
	background: rgba(0,0,0,0.9);
	color: #d4d4d4;
}

.blog .container,
.category .container {
	box-sizing: border-box;
	/*max-width: 720px;*/
	padding: 20px;
	margin: 0 -10px;
	margin-top: 40px;
	position: relative;
	display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: stretch;
}

.blog .container h1,
.category .container h1 {
	color: #000;
	margin-top: 20px;
	border-bottom: 0;
}

@media only screen and (max-width: 940px) {
	.blog .container,
	.category .container {
		margin-top: 70px;
	}
}

@media only screen and (max-width: 768px) {
	.blog .container,
	.category .container {
		margin-top: 0;
	}
}

.blog article .wrap,
.category article .wrap {
	background: #fff;
	overflow: hidden;
}

.blog .container,
.category .container * {
	box-sizing: border-box;
}

.nyhet {
	width: calc(50% - 20px);
	margin: 0 10px 40px;
}

@media only screen and (min-width: 768px) {
	.nyhet {
		width: calc(33.3333% - 20px);
	}
}

.nyhet a {
	text-decoration: none;
	color: #000;
}

.nyhet a:hover,
.nyhet a:focus {
	color: #000;
}

.nyhet a:hover h3,
.nyhet a:focus h3 {
	text-decoration: underline;
}

.nyhet h3 {
	color: #000;
}

.nyhet img {
	width: 100%;
	height: auto;
}

.nyhet-bilde {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding-bottom: 100%;
	width: 100%;
	display: block;
}

.taxonomy-description {
	margin-bottom: 40px;
	padding: 20px 0 0;
}

.taxonomy-description > * {
	margin-bottom: 20px;
}

.taxonomy-description > *:last-child {
	margin-bottom: 0;
}

.sp-logos {
	display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  justify-content: center;
	padding: 0 40px;
	max-width: 380px;
	margin: 40px auto 0;
}

.sp-logos a {
	display: inline-flex;
	align-items: center;
  justify-content: center;
	line-height: 0;
}

.sp-logos a img {
	height: 100%;
  width: auto;
  max-height: 100px;
}

@media (min-width: 480px) {
	.sp-logos a img {
	  max-height: 140px;
	}
}
