/*
*	Theme Name: Hendren Family Foundation - support styles
*	Description: based on HTML5 Blank WordPress Theme 1.4.3
*	Version: 1
*	Author: Jennifer Rice
*	Author URI:: http://nexthorizon.net
*/
/*
-* PURPOSE *-
This file is designed to work with the core HTML5 BLANK 1.4.3 style.css and Bootstrap 4.0.0.
It adds sets up a style template for the theme and shouldn't need much editing. 
Modifications should be made in style-theme.css.


-* THEME STRUCTURE *-
GLOBAL -- core styles applied to basic elements
BASIC -- includes site wide and general styles
	FONTS
	SPACE

FORM ELEMENTS
	BUTTONS
	INPUT

MODAL
HEADER
NAVIGATION
FOOTER

CONTENT - very specific styles
	BANNER
	FORM STYLES
*/

/*------------------------------------*\
    GLOBAL
\*------------------------------------*/

html {
	box-sizing: border-box;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
	margin: 0;
	padding: 0;
}
/* global box-sizing */
body, *:after, *:before {
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-font-smoothing: antialiased;
}

a {
	cursor: pointer;
}
.contentArea a {
	text-decoration: underline;
}
a:hover, a:focus, a:active {
	text-decoration: none;
}
a[href=""], a:not([href]) {
    cursor: default;
}

blockquote {
	position:relative;
	width: 60%;
	min-width: 300px;
	margin: 2em auto;
}
blockquote:before, blockquote:after {
	position: absolute;
	width: .5em;
	height: .5em;
	font-size: 4em;
	line-height: 1em;
	font-family: 'Kanit', sans-serif;
}
blockquote:before {
	content: '\201c';
}
blockquote:after {
	content: '\201D';
}
@media only screen and (min-width: 576px) {
	blockquote:before {
		top: 0;
		left: -.5em;
	}
	blockquote:after {
		bottom: .2em;
		right: -.5em;
	}
}
@media only screen and (max-width: 575px) {
	blockquote { margin:3em auto 2em; padding-bottom:1em; }
	blockquote:before {
		top: -.5em;
		left: 0em;
	}
	blockquote:after {
		bottom: 0em;
		right: 0em;
	}
}
hr {
	border-top: 3px solid #006d6d;
	margin: 1.4em 0;
	clear:both;
}
img { height:auto; }


/*------------------------------------*\
    BASIC
\*------------------------------------*/
/*==================\
  FONTS
\*==================*/
/*** ALL TEXT FONT STYLE ***/
body {
	font-smoothing: antialiased;
	text-rendering: optimizelegibility;
}


/* FONT-FAMILY */



/*** FONT WEIGHT/SIZE ***/



/*** TEXT DECORATION ***/
header nav a, footer nav a, .heading a {
	text-decoration: none !important;
}


/*** FONT MARGIN/BORDER/PADDING ***/
.heading,
.hentry h1, .hentry h2 {
	margin-top: 30px;
	margin-bottom: 30px;
}
.container .heading:first-child, .hentry h2:first-child { margin-top:0; }


/*** ALIGN/FLOAT ***/
.modal-footer { text-align:left; }
.modal .close-box { float:right; }

@media only screen and (max-width: 767px) {
	.heading {
		text-align:center;
	}
}


/*** COLUMNS ***/
.column-2-list li { margin-left: 1em; }
@media only screen and (min-width: 545px) {
	ul.column-2-list, ol.column-2-list {
		-webkit-column-count: 2;
		   -moz-column-count: 2;
			 -o-column-count: 2;
				column-count: 2;
	}
}


/*------------------------------------*\
    SPACE
\*------------------------------------*/
.displayBlock { display: block !important; }

.offScreen {
	position:absolute;
	position:static\9;
	left:-9999px;
}/*displays text in IE9 and under. otherwise use .sr-only - hide text from view but visible by screen reader/web crawler */

/*compensate for default/bootstrap styling*/
.noMargin { margin:0 !important; }
.noPadding { padding:0 !important; }

.clearfix, .col-md-12.contentArea { float:none; clear:both; }

.smallPadding-topBottom { padding-top:1em; padding-bottom:1em; }
.smallPadding-leftRight { padding-left:30px; padding-right:30px; }

.container > .row, .container-flex > .row { margin-left:auto; margin-right:auto; } /*bootstrap is dumb. remove -15px from bootstrap default*/

.container > .row > div[class*="col"] { padding: 0; }

@media only screen and (max-width: 499px) {
	.col-lg-12, .col-md-12, .col-sm-12, .col-xs-12 { padding-left:0; padding-right:0; }
}

.mx-auto { padding-left:0; padding-right:0; } /* undue bootstrap padding on centered elements */

nav ul { margin:0; padding:0; }

section.contentArea, .section.contentArea {
	margin-top: 60px;
	margin-bottom: 60px;
}
section.contentArea-small, .section.contentArea-small {
	margin-top: 40px;
	margin-bottom: 80px;
}
.whiteBackground.contentArea {
	padding-top: 60px;
	padding-bottom: 80px;
	padding-left:0;
	padding-right:0;
}
.whiteBackground .container {
	padding-top: 1.6em;
	padding-bottom: 1em;
}

.inner-page .contentArea {
	margin-top:40px;
}
.inner-page .whiteBackground .container {
	padding-top: 2.6em;
	padding-bottom: 2em;
}

.contentArea img {
	padding:0 0 1em;
	display:inline-block;
}
.inner-page img.alignLeft {
	margin:.5em 2em 1em 0;
	float:left;
}
@media only screen and (max-width: 600px) {
	img.alignnone { margin-right:0; }
}


/*------------------------------------*\
    FORM ELEMENTS
\*------------------------------------*/
/*==================\
  BUTTONS
\*==================*/
a, button, input, .btn { transition:.5s; }
.btn.bigButton {
	text-decoration: none;
	-webkit-border-radius:60px;
	   -moz-border-radius:60px;
	        border-radius:60px;
	-webkit-box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.6);
	   -moz-box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.6);
	        box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.6);
}
.contentArea .bigButton { margin-top:30px; }

.btn.smallButton { 
    font-size: 1em;
    padding: .2em 1em 1.5em;
}
.standard .menu-button {
	-webkit-border-radius: 2px;
	   -moz-border-radius: 2px;
	     -o-border-radius: 2px;
	        border-radius: 2px;
	height: 1.6em;
	text-decoration: none;
	font-size: 1.4em;
	padding: 0.1em;
}
.standard .menu-button:hover, .standard .menu-button:active, .standard .menu-button:focus {
}

.social {
	padding: .1em 0;
}
.social:hover, .social:active, .social:focus {
	position:relative;
	top:-5px;
}
.modal .close {
	border-radius:20px;
	height:20px;
	width:20px;
	padding:0 0 3px;
	opacity:.7;
	position:absolute;
	right:6px;
	top:6px;
}


/*==================\
  INPUT
\*==================*/
input[type="text"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="tel"],
select,
textarea,
.form-control {
	-webkit-box-shadow: inset 0px 10px 5px -5px rgba(0,0,0,0.1);
	   -moz-box-shadow: inset 0px 10px 5px -5px rgba(0,0,0,0.1);
	        box-shadow: inset 0px 10px 5px -5px rgba(0,0,0,0.1);
	border-top:0;
	border-right:0;
	border-left:0;
	font-size:1em;
}

textarea {
	min-height:4em;
}

/*------------------------------------*\
    MODAL
\*------------------------------------*/
.modal img {
    max-width: 568px;
    max-height: 500px;
    margin: auto;
    display: block;
}

/*------------------------------------*\
    HEADER
\*------------------------------------*/
header {
}
/* .companyLogo {display:inline;}
@media only screen and (max-width: 991px) {
	.companyLogo {
		display: block;
		margin-left: auto;
		margin-right: auto;
		max-width: 320px;
	}
} */
header .companyLogo, footer .companyLogo {
	max-width:300px;
	margin: .8em 0;
	padding:0;
}

.nav-toggle { display:none; }


/*------------------------------------*\
    NAVIGATION
\*------------------------------------*/
header nav {
	font-size: 1.2em;
}
nav ul { list-style: none; }
nav li, nav a { display: inline-block; }
nav li a {
	text-decoration: none;
	border-bottom: 1px solid transparent;
}


header nav li { padding-bottom:.4em; }
header nav > ul > li > a {
    font-size: 1.1em;
    border-bottom: 1px solid #455668;
	width: 130px;
	padding-bottom: .1em;
	margin-left: 1em;
}
header nav a:hover, header nav a:focus, header nav a:active {
	border-bottom: 1px solid #ffffff;
}
header ul ul {
	background-color: rgb(234,234,234);
	border-radius: 0 0 1em 1em;
	padding:1em;
}


/*------------------------------------*\
    FOOTER
\*------------------------------------*/
footer { position:relative; }
footer .section-inner { padding-top: 60px; }

footer address { margin: 0; }


/*** footer nav ***/ 
footer nav li {
    font-size: 1.4em;
    margin: 0 .2em;
}
footer nav a {
	padding: .2em 1em;
}
footer nav a:hover, footer nav a:focus, footer nav a:active {
}
footer nav ul {
	margin: 1em 0 0;
	padding: 0;
	text-align:center;
}
footer .section-inner > .container { margin-bottom:1em; }

/*** copyright ***/
.copyright small {
	padding: .6em 0;
	font-size: 1em;
}

/*------------------------------------*\
	CONTENT
\*------------------------------------*/

/*==================\
  BANNER
\*==================*/
.bigBanner {
	background-position: center;
	background-size: cover;
	position: relative;
}
.bigBanner-inner {
	position: absolute;
	bottom: 30px;
	width: 100%;
	-webkit-box-shadow: 0px 1px 7px 0px rgba(0,0,0,0.6);
	   -moz-box-shadow: 0px 1px 7px 0px rgba(0,0,0,0.6);
	        box-shadow: 0px 1px 7px 0px rgba(0,0,0,0.6);
}
.bigBanner .heading {
	text-align: center;
	font-size: 2.2em;
	padding-top:30px;
}
.bigBanner .bannerInner p {
	margin-bottom: 30px;
}

/*** default **
@media only screen and (min-width: 1200px) {
	.bigBanner {
		height:550px;
		background-position: top;
	}
}
@media only screen and (min-width: 500px) and (max-width: 1199px) {
	.bigBanner {
		height:550px;
		background-position: top;
	}
}
@media only screen and (max-width: 499px) {
	.bigBanner {
		height:550px;
		background-position: top;
	}
}*/

/*==================\
  FORM STYLES
\*==================*/
.contact-form .transparent-lightGrey { padding:30px 30px 1px 30px; }
.contact-form .form-group { margin-bottom:30px; }
.contact-form .submit { /*margin-top:30px;*/ margin-bottom:0; }
.contact-form .btn { width:180px; }