/*
Stylesheet for Office of the Federal Coordinator for Meteorology
Author : BWD
Version 1.0
*/

body, html
{
	background : url('images/site_bg.png') #290A4A repeat-x;  /* was #021D77, Blue */

	background-size : cover;

	margin : 0px;
	padding : 0px;

	font-family : 'Helvetica Neue', 'Open Sans', sans-serif; 
	color: #000000 /* black */
}

#site_container
{
	max-width : 1170px;
	width : 100%;

	margin : 0px auto;
}

#header_container
{
	background : url('images/logo_background.jpg') no-repeat #290A4A; /* was #E4E6F2, Blueish */

	width : 100%;
	height : 115px;
	
}

#logo_container
{
	float : left;
}

#logo_container h1
{
	margin-left : 29px;
	margin-right : 29px;
}

#logo_container h1#site_title
{
	color : #4B1385; /*purple; was #133285 Royal blue */

	margin-top : 9px;
	margin-bottom : 0px;

	font-size : 55px;
	font-weight : 100;
}

#logo_container h1#site_subtitle
{
	color : #4D4C52; /* Gray */

	margin-top : -11px;

	font-size : 13px;
	font-style : italic;
	font-weight : 300;
}

h1, h2, h3, h4, h5, h6
{
	color : #4B1385; /*was #133285 Royal blue */
}

h1.meetings
{
	margin : -8px 0px 10px 0px;

	font-size : 20px;
	font-weight : 700;
}

#meetings_sub_title_container
{
	margin : 0px 0px 40px 0px;
	padding : 0px 0px 16px 0px;

	border-width : 0px 0px 1px 0px;
	border-style : solid;
	border-color : #CDC8B0; /* Gold */
}

span.meetings_sub_title
{
	font-size : 13px;

	padding-left : 14px;
	padding-right : 14px;

	border-width : 0px 0px 0px 1px;
	border-style : solid;
	border-color : #000000;
}

span.meetings_sub_title:first-child
{
	padding-left : 0px;

	border-width : 0px;
}

span.meetings_sub_title:last-child
{
	padding-right : 0px;
}

.navbar_container ul
{
	float : right;

	background : #E4E6F2; /* Blueish */
	height : 115px;

	margin: 0px 0px 5px 0px;
	padding: 0px;

	list-style-type: none;
}

.navbar_container li
{
	float : left;

	height : 111px;
}

.navbar_container li a:link, .navbar_container li a:visited
{
	display: block;

	background : #ECECEC; /* Light gray */
	color : #4B1385; /* was #133285 Royal blue */

	height : 43px;

	margin-left : 5px;
	padding : 61px 26px 0px 26px;

	font-size : 19px;
	text-transform : uppercase;
	text-decoration : none;

	border-width : 5px 0px 0px 0px;
	border-style : solid;
	border-color : #4B1385; /* was 133285 Royal Blue */
}

.navbar_container li a:hover
{
	background : url('images/nav_hover_bg.png') no-repeat;
	background-size : 100% 100%;

	border-width : 0px 0px 0px 0px;
}

.cycle-slideshow img
{
	max-width : 100%;
}

.cycle-slideshow .slide
{
	position : relative;

	max-width : 100%;
	width : 100%;
}

.cycle-slideshow span
{
	display : block;
	position : absolute;

	bottom : 12%;

	max-width : 100%;
	width : 100%;

	text-align : center;

	color : #FFFFFF;

	font-size : 13px;
	letter-spacing : 1px;
	text-transform : uppercase;
}

#pull
{
	display : none;
}

#page_title_container
{
	display : table;



	width : 100%;
	height : 137px;

}


.page_title_bg1
{
	background : url('images/flthunderhead_banner.jpg') no-repeat;
	background-size : cover;
} /* was temp_page_top_pic.png */

#page_title_container h2
{
	display : table-cell;

	color : #FFFFFF;

	margin : 0px 0px 0px 0px;

	padding-left : 50px;

	font-weight : 300;
	font-size : 30px;
	letter-spacing : 4px;

	text-transform : uppercase;

	vertical-align : middle;
}

#page_body_container
{
	background : #FFFFFF;

	max-width : 100%;
	width : 100%;
	min-height : 300px;
}

#page_body_inner_container
{
	font-size : 14px;

	padding : 53px 77px;
}

#page_body_inner_container a:link, #page_body_inner_container a:visited
{
	color : #024098; /* formerly 838FB1 Periwinkle */
}

#site_title a:link, #site_title a:visited
{
	color: #133285;

	text-decoration : none;
}

#page_body_inner_container a:hover
{
	color : #000000;
}

#page_body_container h3
{
	color : #290A4A; /* was #092A6D Dark blue */

	text-transform : uppercase;
}

#page_body_container ul
{
	display : block;

	margin : 0px;
	padding : 0px;

	position : relative;

	overflow : hidden;
}

#page_body_container ul li
{
	background : url('images/bluebullet.jpg') 0px 7px no-repeat;

	padding-left : 20px;
}

#page_body_container th, #page_body_container td
{
	padding : 0px 5px;
}

#page_body_container th
{
	border-bottom : 4px solid #4B1385; /* was #2A398A Royal blue */
}

#page_body_container td
{
	border : 1px solid #C7C7C7; /* Gray */
}

.caption_pic
{
	float : right;

	background : pink;

	margin-left:15px;
	margin-right : -77px;
	margin-bottom : 0px;
}

.featured_pic
{
	border: 0.5px solid rgba(0,0,0,1.00);

	margin : 0px;
	padding : 0px;
}

.caption_pic .caption
{
	display : table;
	position : relative;

	background : url('images/arrow.png') 22px 18px no-repeat #959CAD; /* Blue Gray */
	color : #FFF;

	max-width : 100%;
	width : 100%;

	height : 40px;

	margin : -5px 0px 0px 0px;

	font-size : 12px;
	text-transform : uppercase;
}

.caption_pic .caption span
{
	display : table-cell;
	vertical-align : middle;

	padding-left : 45px;
}

.featured_pic.meetings
{
	float : left;

	padding-left : 0px;
}

#left_sidebar
{
	float : left;
	max-width : 234px;
	width : 100%;
	padding-right : 59px;
	}

#left_sidebar.meetings h3
{
	color : #585341; /*was #B2AC97 Gold */

	margin-top: 1em;
	margin-bottom : 0px;

	font-size : 20px;
	font-weight : 300;

	padding-bottom : 12px;

	border-width : 0px 0px 1px 0px;
	border-style : solid;
	border-color : #E1E1E1; /* Gray */
}

#left_sidebar.meetings h3.side_menu:first-child
{
	margin-top : 0px;
}

#left_sidebar.meetings ul
{
	left : 0px;

	margin : 0px 0px 0px 0px;
	padding : 0px 0px 0px 0px;
}

#left_sidebar.meetings ul li
{
	background : url("images/bluebullet.jpg") 0px 19px no-repeat;
	color : #133285; /* Royal blue */

	height : 28px;

	list-style-image: none;
	list-style-type : none;

	margin : 0px;
	padding : 14px 0px 0px 17px;

	font-size : 11px;

	border-width : 0px 0px 1px 0px;
	border-style : solid;
	border-color : #E1E1E1; /* Gray */
}

#left_sidebar.meetings ul.skinny li
{
	background : none;

	height : 18px;

	padding : 3px 0px 0px 0px;
}

p.featured_pic_meetings_caption
{
	float : left;

	font-size : 13px;
}

#left_sidebar h4
{
	color: #092a6d;

	margin-top : 0px;
	margin-bottom : 5px;

	font-size : 20px;
	font-weight : 400;
	line-height : 22px;
	letter-spacing : -1px;
	text-transform : uppercase;
}

#left_sidebar .left_sidebar_subtitle
{
	display : block;

	padding-bottom : 10px;

	font-style : italic;
	font-size : 11px;
	font-weight : 700;
	text-transform : uppercase;

	border-style : solid;
	border-color : #E2E2E2; /* Gray */
	border-width : 0px 0px 2px 0px;
}

#left_sidebar p
{
	font-size : 12px;

}

#footer_container
{
	color : #FFFFFF;

	max-width : 1170px;
	width : 100%;
	height : 127px;

	border-top : 2px solid black;
}

#footer_container p
{
	display : block;

	max-width : 1170px;
	width : 100%;

	margin-top : 35px;

	font-family : Arial, sans-serif;
	font-size : 13px;
	text-align : center;
}

#footer_container span
{
	display : inline-block;

	padding : 0px 22px;

	border-width : 0px 1px 0px 0px;
	border-style : solid;
	border-color : #FFFFFF;
}

#footer_container span:last-child
{
	border-width : 0px;
}

#footer_container a
{
	color : #FFFFFF;

	text-decoration : none;
}

/* Homepage */

#hpslider_container
{
	width : 100%;
}

#partnerlogos_container
{
	width : 100%;
	height : 70px;

	text-align : center;

	position : relative;

	margin-top : -35px;

	z-index : 500;
}

.partnerlogo
{
	margin-right : 2px;
}

.partnerlogo:last-child
{
	margin-right : 0px;
}

#tagline_container
{
	background : url('images/partnerlogo_bg.png') #FFFFFF repeat-x; /* #E7E7E7; /* Gray */

	width : 100%;
	height : 129px;

	margin-top : -35px;

	border-bottom : 6px solid #4B1385; /* was 051278 Royal blue */
}

#tagline_container h2
{
	color : #340D5D; /* was #072C86 Blue */

	margin : 0px;
	padding : 60px 50px 0px 50px;

	text-align : center;
	text-transform : uppercase;
	font-weight : 300;
	letter-spacing : 4px;
}

#latest_news_container
{
	width : 100%;

	background : url('images/news_bg.png') repeat-x; /* #E7E7E7; /* Gray */
}

#latest_news_title_container
{
	max-width : 1098px;
	width : 100%;
	height : 58px;

	padding : 30px 36px 0px 36px;
}

#latest_news_container h2
{
	color : #340D5D; /* was #072C86 Blue */

	margin : 0px;

	font-size : 22px;
	text-transform : uppercase;
}

#latest_news_body_container
{
	max-width : 1106px;
	width : 100%;

	padding : 0px 32px;
}

.latest_news_block
{
	float : left;

	background : #FFFFFF;

	max-width : 315px;
	width : 100%;
	height : 350px;

	margin-right : 8.5px;
	padding : 4px 23px;

	border : 1px solid #DADBDC; /* Light gray */
}

.latest_news_block:nth-child(3)
{
	margin-right : 0px;
}

.latest_news_block h3
{
	color : #6E429D; /* was #1F438C Navy blue */

	margin-bottom : 0px;

	line-height : 20px;
	font-weight : 300;
	text-transform : uppercase;
}

.news_date
{
	margin-top : 7px;
	margin-bottom : 9px;

	font-size : 10px;
	font-style : italic;
	font-weight : bold;
	text-transform : uppercase;
}

.news_body
{
	height : 195px;

	border-width : 2px 0px;
	border-style : solid;
	border-color : #E6E6E6; /* Gray */
}

.news_body p
{
	font-size : 12px;
}

.read_more
{
	display : block;

	color : black;

	margin-top : 18px;

	text-align : center;
	text-decoration : none;

	font-family : Times, serif;
	font-style : italic;
	font-size : 18px;
	letter-spacing : 1px;
}

#mission_statement_container
{
background-color :#323232; 
	
	max-width : 1168px;
	width : 100%;
	padding : 40px 0px 49px 0px;
}

#mission_statement_container p
{
	color : #FDFDFE; /* Off-white */
	margin : 0px;
	text-shadow : 1px 1px 1px #000000;
	padding : 0px 85px;

	text-align : left;
	letter-spacing : 1px;
}

#mission_statement_container a:link
{color: #FDFDFE;}

#mission_statement_container a:visited { color:#9999CC;}

#mission_statement_container a:hover {color: #676767}

.clear
{
	width : 0px;
	height : 0px;

	clear : both;
}


@media only screen and (max-device-width : 1190px), (max-width : 1190px)
{
	#left_sidebar.meetings
	{
		float : none;

		background : #F5F7FF; /* Light blue */

		max-width : 100%;

		margin-left : auto;
		margin-right : auto;

		padding : 0px;

		border-width : 1px;
		border-style : solid;
		border-color : #C7C7C7; /* Gray */

		padding : 15px;
	}

	.featured_pic.meetings
	{
		max-width : 100%;


		float : none;

		margin : 15px 0px 0px 0px;

		padding-left : 0px;
	}

	#partnerlogos_container
	{
		background : url('images/partner_bg.png') 0px 35px repeat-x #DDDDDD; /* A Gray */

		height : auto;

		padding-top : 30px;
	}

	#latest_news_body_container
	{
		max-width : 95%;
		width : auto;
		height : auto;

		padding : 0px;
		margin : 0px auto;

		text-align : center;
	}

	.latest_news_block
	{


		text-align : left;

		max-width : 25%;

		vertical-align : top;
	}

	.latest_news_block
	{
		display : inline-block;

		float : none;

		height : auto;

		margin-right : 9px;
		padding : 4px 23px;

		border : 1px solid #DADBDC; /* Light gray */
	}

	.latest_news_block:nth-child(3)
	{
		margin-right : 0px;
	}

	.news_body
	{
		height : 300px;
	}

	.read_more
	{
		padding-bottom : 15px;
	}

	#footer_container
	{
		max-width : 95%;
		width : 100%;

		margin-left : auto;
		margin-right : auto;
		margin-bottom : 30px;

		padding-left : 0px;
		padding-right : 0px;
	}

	#footer_container span
	{
		display : block;

		border-width : 0px;
	}
}

@media only screen and (max-device-width : 970px), (max-width : 970px)
{
	#header_container
	{
		background-size : cover;

		height : auto;

		text-align : center;

		margin-top : -10px;
	}

	#logo_container
	{
		float : none;

		max-width : 100%;
		width : 100%;
	}

	.navbar_container
	{
		max-width : 100%;
		width : 100%;
		height : 117px;

		text-align : center;

		overflow : hidden;
	}

	.navbar_container ul
	{
		display : inline;

		position : relative;

		background : none;

		float : none;

		max-width : auto;
		width : auto;

		margin : 0px auto;

		text-align : center;
	}

	.navbar_container ul li
	{
		float : none;

		display : inline-block;

	}

	.navbar_container li a:hover
	{

	}

	#tagline_container
	{
		height : auto;

		padding-bottom : 30px;
	}

	.cycle-slideshow span
	{
		bottom : 20%;
	}
}

@media only screen and (max-device-width : 890px), (max-width : 890px)
{
	#latest_news_title_container
	{
		padding-left : 0px;
		padding-right : 0px;

		text-align : center;
	}

	.latest_news_block, .latest_news_block:nth-child(3)
	{
		display : block;

		max-width: 315px;
  		width: 100%;
  		height: auto;

  		margin-bottom : 30px;
  		margin-left : auto;
  		margin-right : auto;
	}

	.news_body
	{
		height : auto;
	}
}

@media only screen and (max-device-width : 824px), (max-width : 824px)
{
	#left_sidebar
	{
		float : none;

		background : #F5F7FF; /* Light blue */

		max-width : 100%;

		margin-left : auto;
		margin-right : auto;

		padding : 0px;

		border-width : 1px;
		border-style : solid;
		border-color : #C7C7C7; /* Gray */

		padding : 15px;
	}
}

@media only screen and (max-device-width : 625px), (max-width : 625px)
{
	.navbar_container li a:link, .navbar_container li a:visited
	{
		padding : 61px 13px 0px;
	}
}

@media only screen and (max-device-width : 545px), (max-width : 545px)
{
	.navbar_container
	{
		height : auto;
	}

	.navbar_container a#pull
	{
		display: block;
		position: relative;

		background : #6E429D; /* was #133285 Navy blue */
		color : #FFFFFF;

		height : 40px;

		font-size : 18px;
		font-weight : bold;
		text-transform : uppercase;
		text-decoration : none;

		padding : 16px 32px 0px 35px;
	}

	.navbar_container a#pull:after
	{
		content:"";
		background: url('images/nav-icon.png') no-repeat;
		width: 30px;
		height: 30px;
		display: inline-block;
		position: absolute;
		right: 30px;
		top: 19px;
	}

	.navbar_container ul
	{
		display : none; /* If we don't have this here, menu will pop open on resize when we don't want it to. */

		max-width : 100%;
		width : 100%;
		height : auto;

		margin : 0px;
		padding : 0px;
	}

	.navbar_container ul li, .navbar_container ul li:last-child
	{
		float : none;

		background : #4A536C;

		display : block;
		height : 40px;

		max-width : 100%;
		width : 100%;

		margin : 0px;
		padding : 0px;

		border-width : 0px 0px 1px 0px;
		border-style : solid;
		border-color : #C0C0C0;
	}

	.navbar_container ul li a:link, .navbar_container ul li a:visited, .navbar_container ul li:last-child a:link, .navbar_container ul li-last-child a:visited
	{
		background : #4A536C;
		color : #FFFFFF;

		display : block;

		max-width : 100%;
		height : 40px;

		font-size : 22px;

		margin : 0px;
		padding : 0px;

		text-transform : none;

		border-width : 0px;
	}

	.navbar_container li a:hover, .navbar_container li:last-child a:hover
	{


		margin : 0px;
		border-width : 0px;

	}

	.navbar_container ul li:hover ul, .navbar_container li.sfhover ul
	{
		left: auto;
	}

	.caption_pic, .featured_pic
	{
		max-width : 100%;
		width : 100%;

		float : none;

		margin : 0px;

		padding-left : 0px;
	}

	.caption_pic
	{
		border-width : 0px 1px 0px 0px;
		border-style : solid;
		border-color : #959CAD; /* Blue Gray */
	}

	span.meetings_sub_title
	{
		display : block;

		padding : 0px;

		border-width : 0px;
	}

	#page_body_container table
	{
		border-collapse: collapse;
		width : 100%;

		overflow-x : auto;
		display : block;
	}

	.cycle-slideshow span
	{
		bottom : 30%;
	}
}

@media only screen and (max-device-width : 450px), (max-width : 450px)
{
	.latest_news_block, .latest_news_block:nth-child(3)
	{
		display : block;

		max-width: 80%;
  		width: 100%;
  		height: auto;

  		margin-bottom : 30px;
  		margin-left : auto;
  		margin-right : auto;
	}


}
