/* --------------------------------------------------------------
MEDIA QUERIES
-------------------------------------------------------------- */

/* Custom code for 360px header image title media queries */
@media screen and (max-width: 450px) {
  #header #logo-title {
    display: none;
  }
}

@media handheld, only screen and (max-width: 1024px) {
  #header.header-large, #header.header-small {
    padding: 14px 0px 14px 0px;
  }
  #header #logo img.logo-dark {
    padding-left: 10px;
  }
}


/* --------------------------------------------------------------
HEADER / NAVIGATION
-------------------------------------------------------------- */
#header.header-small {
    padding: 14px 0px;
}

#header .site-title {
	display: block;
	position: relative;
	font-size: 1.8em;
	font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
	font-weight: 400;
	letter-spacing: -1px;
	line-height: 1.1;
	margin: -2px 0px 0px 2px;
	padding-left: 20px;
	}

/* Main navigation font to bold */
#navigation {
	font-weight: bold;
	}

/* --------------------------------------------------------------
FEATURED IMAGE
-------------------------------------------------------------- */


/* Custom color for featured image text in all pages */

.headline.img-headline {
	color: #ffb833; /* Original was white #ffffff */
  	text-shadow: 2px 2px #000000; /* This wasnt here originally */
	position: absolute;
	top: 50%;
	width: 88%;
	font-size: 4em;
	text-align: center;
	letter-spacing: -2px;
	padding: 0px 6%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	}



/* --------------------------------------------------------------
SLIDER
-------------------------------------------------------------- */


/* Custom color for front page slider h1 */

.slideshow .headline a {
    color: #ffb833 !important;
  	text-shadow: 2px 2px #000000;
	}


/* Custom color and bold for front page slider exceprt */
.slideshow .text-white p {
  	font-weight: bold;
  	color: #ffb833;
  	padding: 20px;
	}


/* Remover "learn more" -button from front page slider */
.slideshow .text-white .more-link {
    color: #000 !important;
    border: 2px solid #000;
 	display: none;
	}


/* styling for both css and generated arrows */
.sf-arrows .sf-with-ul:after {
  border-top-color: rgb(0, 0, 0); /* edit this to suit design (no rgba in IE8) */
}


/* styling for right-facing arrows */
.sf-arrows ul .sf-with-ul:after {
	margin-top: -3px;
	margin-right: -3px;
	border-color: transparent;
	border-left-color: rgb(0, 0, 0); /* edit this to suit design (no rgba in IE8) */
	}



/* --------------------------------------------------------------
FOOTER
-------------------------------------------------------------- */


/* Divides two footer widget to 50% width instead of default four */
.footer-widgets .widget {
    width: 50%;
	}


/* Resize social media icons on footer*/
.social-icons li a {
    font-size: 2em;    
    padding: 3px;
    border-radius: 20px;
	}