/* HOMEPAGE TEMPLATE */

.image-font {
	text-align:center;
	color:#000;
	font-size:10px;
	font-style:italic;
	background-color:#ddd;
	border:#999 1px solid;
	height:auto;
	width:198px;
	padding:8px;
 }

/* homepage arrow */

#arrow  a:link, a:visited, a:hover { text-decoration: none; }
#arrow .chart-locator { font-size:26px; font-weight:500; color:#fff; }	
#arrow .chart-locator a:link { font-size:26px; font-weight:500; color:#fff; text-decoration: none; }
#arrow .chart-locator a:hover { font-size:26px; font-weight:500; color:#fff; text-decoration: none; }
#arrow .chart-locator a:visited { font-size:26px; font-weight:500; color:#fff; text-decoration: none; }
#arrow .download-charts { color:#fff; font-size:13px; font-style:italic; text-decoration:none; }
#arrow .download-charts a:link { color:#fff; font-size:13px; font-style:italic; text-decoration:none; }
#arrow .download-charts a:hover { color:#fff; font-size:13px; font-style:italic; text-decoration:none; }
#arrow .download-charts a:visited { color:#fff; font-size:13px; font-style:italic; text-decoration:none; }

/* homepage arrow for mobile */

#arrow-mobile  a:link, a:visited, a:hover { text-decoration: none; }
#arrow-mobile .chart-locator { font-size:17px; font-weight:500; color:#fff; }	
#arrow-mobile .chart-locator a:link { font-size:20px; font-weight:500; color:#fff; text-decoration: none; }
#arrow-mobile .chart-locator a:hover { font-size:20px; font-weight:500; color:#fff; text-decoration: none; }
#arrow-mobile .chart-locator a:visited { font-size:20px; font-weight:500; color:#fff; text-decoration: none; }

.mobile-blue-box a:link, a:visited, a:hover {  text-decoration: none; }
.mobile-blue-box { color:#fff; font-weight: bold; }
.mobile-blue-box a:link { color:#fff; font-weight: bold; text-decoration: none; }
.mobile-blue-box a:hover { color:#fff; font-weight: bold; text-decoration: none; }
.mobile-blue-box a:visited { color:#fff; font-weight: bold; text-decoration: none; }

.question-bold { 
	font-weight:bold;
}
	
.answer-bold { 
	font-weight:bold;
}
	
.mobile-accordion-text {
	font-size:13px; 
	font-style:italic;
}

.mobile-accordion-text-arrow {
	font-size:13px; 
	font-style:italic;
}

/*background image*/

#divID {
	height:1080px; background-position:top center; background-size:cover
}

div.container.header{
	padding:140px 25px 0 25px;
}
	span.header-title {
		font-size:40px; font-weight:500; color:#fff; text-shadow: 1px 1px 3px black;
	}
	
	div.img-responsive {
		width:320px; background-image:url(../images/arrow-button-with-icon-320.png); background-repeat:no-repeat; height:72px; border:0;
	}
		div#arrow {
			padding:5px 0 0 20px;
		}
	
	
/*products & services*/

div.container.product-services {
	padding:230px 25px 0 25px;
}
	span.title {
		font-size:30px; font-weight:500; color:#fff; text-shadow: 1px 1px 3px black;
	}
	
	div > div > div.column {
		width:auto; height:610px; background-color:#f5f5f5; margin-bottom:10px;
	}
		div.column-header {
			width:auto; height:180px; background-color:#004496; padding:26px 13px 0 13px;
		}
			img.img-responsive.one {
				padding:0 0 10px 0;
			}

			p.main-title {
				color:#FFF; font-weight:500; font-size:18px
			}

			p.sub-title {
				color:#FFF; font-size:13px; font-style:italic;
			}
		
		div.column-content {
			padding:20px;
		}


		div.column-header-two {
			width:auto; height:180px; background-color:#004496; padding:22px 13px 0 13px;
		}

			img.img-responsive.two {
				padding:0 0 6px 0;
			}

			img.img-responsive.three {
				padding:0 0 24px 0;
			}
		
		div.column-header-four {
			width:auto; height:180px; background-color:#004496; padding:24px 13px 0 13px;
		}

			img.img-responsive.four {
				padding:0 0 8px 0;
			}

/*NOAA's Office of Coast Survey*/

div.container.about-ocs {
	margin-top:170px;
}
	div.row.about-ocs {
		padding:0 10px;
	}
		img.img-responsive.about-ocs {
			text-align:left;
		}
		
		div.about-ocs.description {
			height:auto;
		}

			p.about-ocs.description {
				font-size:28px; font-weight:500; color:#fff; line-height:1.2em;
			}

/*Announcements, Blog and Feature*/

div.container.bottom-content {
	margin-top:28px;
}
	
	div.row.bottom-content {
		padding:0 10px;
	}

		p.section-title {
			font-size:30px; font-weight:bold; color:#000;
		}

		div.section > div.section-box {
			background-color:#f5f5f5; padding:20px; height:179px; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.19);
		}

		div.section-box > .section-image {
			float:left; padding-right:20px;
		}

		div.section-box > div.section-content > p.item-title {
			font-weight:bold;
		}

		div.section > p.section-link {
			margin-top:5px;
		}

div.section > div.section-highlight {
	background-color:#f5f5f5; padding:5px 20px 10px 20px; height:447px; width:auto; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.19);
}

	div.section-highlight > div.row > h4.highlight-title {
		padding-left:15px;
	}

/*mobile */

div.container.mobile {
	padding:10px 0 0 0;
}
	span.mobile-header-title {
		font-size:22px; font-weight:bold; color:#666;
	}

	div.img-responsive.mobile-arrow {
		width:320px; background-image:url(../images/mobile-arrow-button-with-icon-320.png); background-repeat:no-repeat; height:72px; border:0; margin:15px 0 5px 0
	}

		#arrow-mobile {
			padding:13px 0 0 25px;
		}

		span.mobile-accordion-text-arrow {
			color:#fff;
		}

div.mobile-about-ocs > p.description {
	text-align:left; font-weight: bold;
}

div.mobile-about-ocs > div.learn-more {
	width:auto; height:auto; background-color:#0087e5; color:#fff; font-weight: bold; padding:15px 0; margin:20px 0 0 0;
}

/*feature article*/

div.mobile-feature-article {
	background-color:#f5f5f5; padding:10px 0;
}

/*announcements & blog*/

div.mobile-feature-article-link {
	width:auto; height:auto; background-color:#0087e5; color:#fff; font-weight: bold; padding:15px; margin:-30px 30% auto 30%;
}

h2.mobile-section-title {
	font-weight: bold;
}

div.mobile-section-content > img.mobile-image {
	margin-bottom:10px; min-height:100%;
}

div.mobile-section-content > p.mobile-content-title {
	font-weight: bold;
}

div.mobile-more-link {
	width:auto; height:auto; background-color:#0087e5; color:#fff; font-weight: bold; padding:15px 3px; margin:-30px 0 auto 0;
}

div.mobile-more-link > a > span {
	color:#fff; font-weight: bold;
}

/* media queries */

@media (max-width: 439px) {
	.mobile-accordion-text {
		display:none;
	}
	
	.button-name {
		padding-top: 11px;
	}
}

 @media (min-width: 439px) {
	 .button-name-center {
		 padding-top: 11px;
	 }
 }
	
@media (max-width: 1199px) {
	#mobile-news-image {
		height: 172px;
	}
	#mobile-post-image {
		height: 172px;
	}
}

@media (max-width: 991px) {
	#mobile-news-image {
		height: 147px;
	}
	#mobile-post-image {
		height: 147px;
	}
}
	
@media (max-width: 577px) {
	#mobile-news-image {
		height: auto;
	}
	#mobile-post-image {
		height: auto;
	}
}