/* Master layout */

/* COLORS 

primary colors:
	blue -- #009CDC
	
Others:


*/

@font-face {
	font-family:'Rochester';
	src:url('../fonts/Rochester-Regular-webfont.eot'); /* IE8 */
	src:url('../fonts/Rochester-Regular-webfont.eot?iefix') format('embedded-opentype'), /* IE9 */
		url('../fonts/Rochester-Regular-webfont.ttf') format('truetype'); /* The rest of the world */
	font-weight:normal;
    font-style:normal;
}

@font-face {
	font-family:'GoudyOS-bold';
	src:url('../fonts/goudy_old_style_bold-webfont.eot'); /* IE8 */
	src:url('../fonts/goudy_old_style_bold-webfont.eot?iefix') format('embedded-opentype'), /* IE9 */
		url('../fonts/goudy_old_style_bold-webfont.ttf') format('truetype'); /* The rest of the world */
	font-weight:normal;
    font-style:normal;
}

/************************************************************
Global styles */

html {

}
body {
	margin:0;
	padding:0;
	font: 12pt "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:300;
	color:#333;
}

strong {
	font-weight:bold;
}

/* Links */
a:link,
a:visited,
a:hover,
a:active {
	text-decoration:none;
	color: #009cdc;
}
a img {
	border:none;
}
img {
	max-width:100%;
}
a[href^="tel:"] {
	color:inherit;
	cursor:inherit;
	font-weight:normal;
}

* {
	outline:none;
}

/* Headings */
h1,h2,h3,h4,h5,h6 {
	font-family: Georgia,Times,"Times New Roman",serif;
}
h1 {
	font-size:200%;
}
h2 {
	font-size:175%;
}
h3 {
	font-size:160%;
}
h4 {
	font-size:140%;
	margin: 0;
}

h1 > span,h2 > span,h3 > span,h4 > span,h5 > span,h6 > span {
	font-style: italic;
}

address {
	font-style:inherit;
}

/*--------------Header / Navigation----------------*/

header a {
	display: inline-block;
	box-sizing:border-box;
	padding:10px;
}

header a:link, header a:visited {
	color:#FFF;
	font-weight: bold;
	-webkit-transition:all 0.2s ease 0s;
	transition:all 0.2s ease 0s;
}

header a:hover, header a:active {
	
	-webkit-transition:all 0.2s ease 0s;
	transition:all 0.2s ease 0s;
}

body > header {
	position: relative;
	background:url('../images/blue-texture.jpg') repeat center top;
	background-size:cover;
	color:#FFF;
	background-color: #6fbbe8;
	
	font-size:14px;
}

.logo {
	display: inline-block;
	vertical-align: middle;
	margin:0 auto;
}

.main-logo {
	height:131px;
	width:271px;
	background:url('../images/graceLogo.png') no-repeat center center;
}

header .main-logo {
/*
	margin-top:15px;
	display: inline-block;
	vertical-align: middle;
	padding-left:5%;
	padding-right:5%;
*/

	position: absolute;
	top:36px;
	left:46%;
	margin-left:-97px;
}

#top-nav {
	
	position: absolute;
	top:0;
	right:0;

	text-align: right;
}

.icon-links {
	list-style: none;
	padding:0;
	margin:0 auto;
	display: inline-block;
}

body > header .icon-links {
	margin:10px auto;
}

.icon-links li {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	background-image:url('../images/icon_sprite.png');
	background-repeat:no-repeat;
}

.image-link {
	display: block;
	height:100%;
	width:100%;
	text-align: left;
	text-indent: -9999px;
}

.icon-links li + li {
	margin-left:10px;
}

.facebook {
	background-position:-31px 0;
	height:26px;
	width:26px;
}

.linkedin {
	background-position: -58px 0;
	height:27px;
	width:27px;
}

.share {
	background-position: -86px 0;
	height:29px;
	width:29px;
}

#top-nav .contact-link {
	vertical-align: middle;
	font-size: 110%;
	opacity: 1;
	-webkit-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
	border-right: 1px solid #DDD;
	line-height: .25;
	padding-right: .75em;
	margin-right: .5em;
}

#top-nav .contact-link:hover {
	opacity: 1;
	filter: Alpha(opacity=100);
	-webkit-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
}

#search-box {
	background:none;
	
}

#search { /* search form */
	position: relative;
	display: inline-block;
	width:100%;
	min-width:30px;
	min-height:30px;
	cursor:pointer;
	z-index: 0;
}

#search input[type="text"] {
	display: inline-block;
	width:0;
	
	border-radius:4px;
	border:none;
	
	box-sizing:border-box;
	padding:7px 5px;
	
	-webkit-transition:width 0.3s ease 0s;
	transition:width 0.3s ease 0s;
	
	/* keep hidden unless focused */
	width:25px; 
	text-indent:-9999px;
	
	background:url('../images/icon_sprite.png') no-repeat -116px 2px transparent;
	background-image:none;
	
	opacity: 0.4;
	filter:Alpha(opacity=40);
	
	z-index: 0;
	color:transparent;
}

#search:hover input[type="submit"] {
	opacity: 1;
	filter:Alpha(opacity=100);
	/* cursor:pointer; */
	
	-webkit-transition:all 0.3s ease 0s;
	transition:all 0.3s ease 0s;
}

#search input[type="text"]:focus {
	width:160px;
	opacity: 1;
	text-indent:0;
	
	background-image:none;
	background-color:#FFF;
	color:#333;
	
	-webkit-transition:all 0.3s ease 0s;
	transition:all 0.3s ease 0s;
}

#search input[type="submit"] {
	display: inline-block;
	height:25px;
	width:25px;
	border:none;
	background:url('../images/icon_sprite.png') no-repeat -116px 0 transparent;
	cursor:pointer;
	
	-webkit-transition:all 0.2s ease 0s;
	transition:all 0.2s ease 0s;
	
	position: absolute;
	right:5px;
	top:2px;
	z-index: -1;
	opacity: 0.4;
	filter:Alpha(opacity=40);
}

#search input[type="text"]:focus + input[type="submit"] {
	position: relative;
	top:0;
	margin-left:10px;
	z-index: 3;
	opacity: 1;
}

.faded {
	opacity: 0.4;
	filter:Alpha(opacity=40);
	-webkit-transition:all 0.2s ease 0s;
	transition:all 0.2s ease 0s;
}

.faded:hover, .faded a:hover, .faded a:link {
	opacity: 1;
	filter:Alpha(opacity=100);
	-webkit-transition:all 0.2s ease 0s;
	transition:all 0.2s ease 0s;
}

header nav ul {
	list-style: none;
	padding:0;
}

header nav ul li {
	position: relative;
	display: inline-block;
}

#main-nav {
	text-align: center;
	font-size:16px; /* keeps from changing size with text controls */
}


/* Drop down for all header navigation */

header nav li {

}

header nav ul ul {
	display: block;
	position: absolute;
	top:100%;
	left:-9999px;
	
	margin:0;
	padding:10px 0;
	min-width:215px;
	background-color:#028ec8;
	border-radius:10px;
	text-align: center;
	
	border:1px solid #037daf;
	
	opacity: 0;
	filter:Alpha(opacity=0);
}

header nav ul ul:after, header nav ul ul:before {
	content:"";
	border-bottom:10px solid #028ec8;
	border-left:10px solid transparent;
	border-right:10px solid transparent;
	
	position: absolute;
	bottom:100%;
	left:50%;
	margin-left:-10px;
	-moz-transform:scale(.9999);
	transform:scale(.9999);
	
	z-index: 5;
}

header nav ul ul:before {
	border-bottom:11px solid #037daf;
	border-left:11px solid transparent;
	border-right:11px solid transparent;
	margin-left:-11px;
	z-index: 0;
}

header nav > ul > li:hover ul {
	/* left:0; */
	left:auto;right:50%;margin-right:-100px; /* keeps menu centered (if default width) */
	
	opacity: 1;
	filter:Alpha(opacity=100);
	z-index: 5;
	
	-webkit-transition:opacity 0.3s ease 0s;
	transition:opacity 0.3s ease 0s;
}

header nav ul ul > li {
	position: relative;
	width:100%;
}

header nav ul ul > li + li:after {
	content:"";
	display: block;
	width:84%;
	height:1px;
	background-color:#037daf;
	
	position: absolute;
	bottom:100%;
	left:8%;
}

header nav ul ul > li > a {
	width:100%;
}

header nav ul ul > li + li:hover:after {
	background-color:transparent;
	
}
header nav ul ul > li > a:hover, header nav ul ul > li > a:active {
	background-color:#6fbbe8;
}

/* Change font sizes for specific navigation bars */
#main-nav ul ul > li > a {
	font-size:90%;
}
.nav-bar ul ul > li > a {
	font-size:120%
}


/* -- End drop down navigation -- */


.nav-part {
	margin:0;
	display: inline-block;
	text-transform: uppercase;
	font-weight:200;
	font-size:95%;
	
	border-top:1px solid #414244;
	border-bottom:1px solid #414244;
}

.nav-part > ul > li + li {
	margin-left:3%;
}

body > header .nav-part {
	vertical-align: bottom;
	margin-bottom:35px;
	position: relative;
	max-width:345px;
	width:34.25%;
	
	padding:10px 1%;
	box-sizing:border-box;
}

#main-nav .spacer {	
	display: inline-block;
	margin:15px auto 0;
	width:30%;
	height:165px;
	
	padding-left:5%;
	padding-right:5%;
	box-sizing:border-box;
}

body > header .nav-bar {
	margin-top:5px;
}

.nav-bar {
	margin:0 auto;
	border-top: 5px solid #028ec8;
	border-bottom: 5px solid #028ec8;
	background-color:#009cdc;
	text-align: center;
}

.nav-bar ul {
	margin:0 auto;
	padding:10px 0;
}

.nav-bar > ul > li + li {
	margin-left:25px;
}

.nav-bar ul li a {
	font: 20px Georgia,Times,"Times New Roman",serif; /* 125% */
	font-weight:500;
	text-transform:capitalize;
}

/*------------- Footer -------------*/

body > footer {
	position: relative;
	padding:35px 0;
	background-color: #028ec8;
	color:#FFFFFF;
}

#bottom {
	position: relative;
	margin:0 auto;
	font-size:87%;
	box-sizing:border-box;
	padding-right:130px;
}

#bottom p {
	margin:0;
	max-width:690px;
}

#bottom p > a {
	display: inline-block;
	color:#FFFFFF;
}

#bottom p > a + a {
	position: relative;
	margin-left:22px;
}

#bottom p > a + a:after {
	content:"/";
	
	position: absolute;
	top:0;
	right:100%;
	margin-right:8px;
}

.equal-housing {
	background-position:0 0;
	height:33px;
	width:30px;
}

#bottom .icon-links {
	display: inline-block;
	vertical-align: middle;
	position: absolute;
	top:-8px;
	right:0;
}

/* Text Size Controls */

#text-control {
	position: fixed;
	z-index: 100;
	top:60%;
	right:0;
	
	text-align: center;
	color:#FFF;
	font-size:18px;
	
	background-color:#009cdc;
	-moz-border-radius:10px 0 0 10px;
	border-radius:10px 0 0 10px;
}

#text-control button, #text-control span {
	position: relative;
	display:block;
	width:100%;
	margin:0;
	border:none;
	border-radius:0;
	background-color:#009cdc;
	color:#FFF;
	font-size:24px;
	
	box-sizing:border-box;
	padding:10px 15px;
}

#text-control span {
	border-top: 1px solid #4D7550;
	border-bottom: 1px solid #4D7550;
}

#text-control button:first-child {
	border-radius:10px 0 0 0;
}
#text-control span + button {
	border-radius:0 0 0 10px;
}

#text-control button {
	cursor: pointer;
}

/************************************************************
Circle Image */

.circle {
	position: relative;
	margin:0;
	display: inline-block;
	width:220px;
	height:220px;
	/* padding-bottom:10%; */
	border:6px solid #FFF;
	-moz-border-radius:50%;
	-webkit-border-radius:50%;
	border-radius:50%;
	box-shadow: 0px 5px 8px 1px #BBB;
	z-index: 0;
	
	overflow: hidden;
	
	-webkit-transition:all 0.25s ease 0s;
	transition:all 0.25s ease 0s;
}

.circle.large {
	height:275px;
	width:275px;
	border-width:9px;
	z-index: 3;
	margin-left:-35px;
	margin-right:-35px;
	margin-bottom:-35px;
}

.circle img {
	display: block;
	height:100%;
	position: absolute;
	top:0;
	left:-15%;
	
	max-width:none;
	min-width:100%;
}

.circle.center img {
	left:0;
}

.circle:hover {
	-o-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-webkit-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
	
	-webkit-transition:all 0.25s ease 0s;
	transition:all 0.25s ease 0s;
}

/************************************************************
Miscellaneous */

/* keeps content within target width (1000px) */
.contain {
	position: relative;
	max-width:1000px;
	margin:0 auto;
}

.contain-careers {
	text-align: center;
}

.button, a.button:link, a.button:visited {
	position: relative;
	display: inline-block;
	color:#009cdc;
	text-transform: uppercase;
	text-align: center;
	font-size: 95%;
	line-height:1;
	font-weight:bold;
	cursor:pointer;
	
	box-sizing:border-box;
	padding:25px 5%;
	
	border:1px solid #009cdc;
	
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
}

.button.small, a.button.small {
	padding:12px 5%;
	border:none;
	background-color:#717074;
	color:#FFF;
}

.button.small:hover, a.button.small:hover, a.button.small:active {
	background-color:inherit;
	color:#009CDC !important;
}

.button.small:hover:after, a.button.small:hover:after, a.button.small:active:after {
	background-position: -163px 0;
}

.button.small.alt, a.button.small.alt {
	background-color:#717074;
}

.button.simple:after, a.button.simple:after, .button.small.simple:after, a.button.small.simple:after {
	content:none;
}

.button.alt, a.button.alt:link, a.button.alt:visited {
	border-color:#FFF;
	color:#FFF;
}

.button:after, a.button:link:after, a.button:visited:after {
	content:"";
	display: inline-block;
	height:15px;
	width:21px;
	margin-left: 20px;
	margin-bottom:-1px;
	
	background:url('../images/icon_sprite.png') no-repeat -163px 0;
}

.button:hover, a.button:hover, a.button:active, .button.sel, a.button.sel {
	background-color: #009cdc;
	color:#FFF !important;
}

.button.alt:hover, a.button.alt:hover, a.button.alt:active {
	color:#717074 !important;
	background-color:#FFF;
	border-color:#717074;
}

.button:hover:after, a.button:hover:after, a.button:active:after, .button.sel:after, .button.alt:after, a.button.alt:after, .button.small:after, a.button.small:after {
	background-position: -163px -16px;
}

.button.alt:hover:after, a.button.alt:hover:after, a.button.alt:active:after {
	background-position: -185px 0;
}


.arrow-link, a.arrow-link {
	position: relative;
	font-style:italic;
	text-transform: uppercase;
	font-size:90%;
	
	box-sizing:border-box;
	padding-right:35px;
}

.arrow-link:after, a.arrow-link:after {
	content:"";
	display: inline-block;
	height: 15px;
	width: 21px;
	background: url('../images/icon_sprite.png') no-repeat -163px 0;
	
	-webkit-transition: all 0.3s ease 0s;
	transition:all 0.3s ease 0s;
	
	position: absolute;
	right:5px;
	top:50%;
	margin-top:-8px;
}

.arrow-link:hover:after, a.arrow-link:hover:after, a.arrow-link:active:after {
	right:0;
	
	-webkit-transition: all 0.3s ease 0s;
	transition:all 0.3s ease 0s;
}

/* Text alignment */
.left { text-align:left !important; }
.center { text-align:center !important; }
.right { text-align:right !important; }

/* Font sizes */
small { font-size:90%; }
big { font-size:115%; }


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

.half {

}

.main {
	width:60%;
	max-width:600px;
}

.main.full {
	width: 100%;
	max-width: 100%;
}

.side {
	width:30%;
	max-width:300px;
	margin-left:8%;
	
	text-align: center;
}

.col.side h2 {
	border-bottom: 1px solid #CCC;
	padding-bottom: .5em;
	margin-bottom: .4em;
	width: 85%;
}

.col.side .address h3 {
	font-size: 250%;
}

.col.side p {
	margin:15px 0;
}

/* Fix extra button padding in Firefox */
input[type="submit"]::-moz-focus-inner {
	border:none;
	padding:0;
	line-height:1;
}
/************************************************************
Layout: Columns */

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

#content .leftCol {
	width:26%;
	padding-right:3%;
}
#content .rightCol {
	width:70%;
}