html {
	height:100%;
	width: 100%;
	-webkit-overflow-scrolling: touch;
	-webkit-tap-highlight-color: #f3f5f6;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
body {
	height:100%;
	margin:0px;
	padding:0px;
	width: 100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-size: 1.0rem;
}
h2 {
	font-size: 14pt;
}

h3 {
	font-size: 12pt;
	color:#172A3F;
}

#header2017,nav,h1 {
	margin:0;
}
#header2017 {	
    background:none;
    background-color: #ffffff;
    border-bottom:2px solid #0053a0;
	}
#header2017 #canvas .logo {
	float: left;
	display: block;
    margin-top:10px;
	margin-right: 10px;
	/**/width: 435px;
    height: 59px;
    background: url(https://cdn.coastalscience.noaa.gov/csmedia/2017/09/NCCOS-with-tag-to-side.png) no-repeat;
    background-size: 100%;
	}		
#header2017 #canvas h1 {
	color: #474747;
	/*text-shadow: 1px 1px 1px rgba(0,0,0,.8);*/
	font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif;
	display: inline block;
    margin-top:20px
      }
#headerrow{
	border-bottom:#FFE766 solid 4px;
}
.row{
	width:96%;
	max-width:1140px;
	margin:0 auto;
	overflow:hidden;
}
/*****Crumbs****/	
#crumbs_storage {
	font-size: 15px;
	font-family: Arial, Helvetica, sans-serif;
      /*color: #818285;*/
      padding: 5px 0 10px 0;
}
#crumbs {
	font-size: 11.5px;
      /*font-size: 11.5px;
	font-size: 1.15rem;*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
      color: #818285;
      padding: 10px 0 10px 2px;
	border-bottom: 1px dotted #CCC;
      margin-bottom: 10px;      
      }
#crumbs_storage a, 	
#crumbs a {
      color: #3333FF;
      text-decoration: none;
      border-bottom: none;
      }  
#crumbs_storage a:hover,    
#crumbs a:hover {
      color: #900;
      border-bottom: 1px solid #900;
      }
/****CONTENT****/
#content {
	width: 80%;
	padding-top:5px;
	font-family:Arial, Helvetica, sans-serif;
}

a {
	color: #777;
	text-decoration: none;
}

a:hover {
	color: #0058A6;
	text-decoration: none;
}

.center {
	margin-left: auto;
	margin-right: auto;
}
#clearboth{
	clear:both;
}

/****** Footer ******/
footer {
	margin-top: 15px;
    margin-bottom: 25px;
	color: #3E4C5B;	
	font-size: 13px;
}
footer nav[role="list"] ul, footer nav[role="link"] ul {
    list-style-type: none;
    margin: 0 auto;
    padding: 5px 0;
}      
footer nav[role="list"] ul li, footer nav[role="link"] ul li {
    border-left: 1px solid #626262;
    padding: 0 6px;
    display: inline;
}      	
footer nav[role="list"] ul li:first-child, footer nav[role="link"] ul li:first-child {
    border: 0;
    padding: 0 6px 0 0;
}               	
footer p {
	padding: 4px 0 3px 0;
	margin: 0;
	line-height: 1.4;
}	
footer a {
	color: #3E4C5B;
	font-weight: normal;
}	
footer a:hover {
	color: #000;
	text-decoration: underline;
}	

/* -----------------------------------------
   Media Queries
----------------------------------------- */

@media screen and (max-width: 1000px) {

body {
	font-size: 12px;
	font-size: 1.2rem;
	}
#content {
	width: 85%;
	}
}  

@media screen and (max-width: 800px) {

#content {
	width: 95%;
	}
	#header2017 #canvas .logo{
    width: 257px;
    height: 67px;
    background: url(https://cdn.coastalscience.noaa.gov/csmedia/2017/07/NCCOS-logo-color.png) no-repeat;
    background-size: 100%;
    }
}

@media screen and (max-width: 770px) {

#header2017 #canvas #logo {
	margin: 10px 10px 0 0;	
	}	
}


@media screen and (max-width: 600px) {
#header2017 #canvas {
	text-align: center;
	}
#header2017 #canvas .logo {
	display: block;
	float: none;
	margin: 0 auto;
	margin-top: 10px;
	}
#header2017 #canvas h1 {
	display: block;
	clear: left;
	text-align: center;	
	padding: 2px 0 10px 0;
	}	
footer {
	text-align: center;
	}	
footer p {
	text-align: center;
	}		
footer nav[role="list"] ul {
    list-style-type: none;
    margin: 0 auto;
	margin-top: 10px;
	margin-bottom: 10px;
    padding: 0;
	border-top: 1px solid #CCC;
    } 	
footer nav[role="list"] ul li:first-child {
	border-top: 1px solid #CCC;
	}	
footer nav[role="list"] ul li:first-child, footer nav[role="list"] ul li {
	border-left: none;		
	padding: 0;
	margin: 5px 0;
	}	
footer nav[role="list"] ul li a {
	display: block;
	padding: 10px 6px;
	border-bottom: 1px solid #CCC;
	text-align: center;
	font-size: 14px;
	font-weight: normal;
	line-height: 1;
	}	
footer nav[role="list"] ul li a:hover {
	text-decoration: none;
	background-color: #FFF;
	}	
footer nav[role="link"] {
	display: none;
	}
}

@media screen and (max-width: 500px) {
/*header #canvas #logo {
	background: url(../imgs/nccos.png);
	width: 199px;
	}*/
}
@media screen and (max-width: 320px) {
	
}

@font-face{font-family:'FontAwesome';src:url('https://products.coastalscience.noaa.gov/services/coastalsciencecore/_assets/fonts/fontawesome-webfont.eot');src:url('https://products.coastalscience.noaa.gov/services/coastalsciencecore/_assets/fonts/fontawesome-webfont.eot?#iefix') format('embedded-opentype'),url('https://products.coastalscience.noaa.gov/services/coastalsciencecore/_assets/fonts/fontawesome-webfont.woff') format('woff'),url('https://products.coastalscience.noaa.gov/services/coastalsciencecore/_assets/fonts/fontawesome-webfont.ttf') format('truetype'),url('https://products.coastalscience.noaa.gov/services/coastalsciencecore/_assets/fonts/fontawesome-webfont.svg#FontAwesome') format('svg');font-weight: normal;font-style: normal;}[class^="icon-"]:before,[class*=" icon-"]:before{font-family:FontAwesome;font-weight:normal;font-style:normal;display:inline-block;text-decoration:inherit;}
a [class^="icon-"],a [class*=" icon-"]{display:inline-block;text-decoration:inherit;}
.icon-large:before{vertical-align:middle;font-size:1.3333333333333332em;}
.btn [class^="icon-"],.nav-tabs [class^="icon-"],.btn [class*=" icon-"],.nav-tabs [class*=" icon-"]{line-height:.9em;}
li [class^="icon-"],li [class*=" icon-"]{display:inline-block;width:1.25em;text-align:center;}
li .icon-large:before,li .icon-large:before{width:1.875em;}
ul.icons{list-style-type:none;margin-left:2em;text-indent:-0.8em;}ul.icons li [class^="icon-"],ul.icons li [class*=" icon-"]{width:.8em;}
ul.icons li .icon-large:before,ul.icons li .icon-large:before{vertical-align:initial;}

.icon-folder-open:before{content:"\f07c";}

/*Grid System Styling****Add fourcol 8302018***/
.container{padding-left:20px;padding-right:20px;}
/*.row{width:100%; padding-bottom:5px;max-width:1140px;min-width:755px;margin:0 auto;overflow:hidden;}*/
.row{width:100%; padding-bottom:5px;max-width:1140px;min-width:755px;margin:0 auto;overflow:hidden;}
.onecol,.twocol,.threecol,.fourcol{margin-right:3.8%;float:left;min-height:1px;}
.habonecol {width:80% !important;}
.row .onecol{width:44.75%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.row .twocol{width:16.05%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.row .threecol{width:16.00%;}
.row .fourcol{width:11.45%;}
.last{margin-right:0px;}
section.fourcol.last{text-align:right;}

@media screen and (max-width: 1000px) {
.container{padding-left:5px;padding-right:5px;}
.row{min-width:655px;}
.onecol,.twocol,.threecol,.fourcol{margin-right:3%;}
.row .onecol{width:48.75%;}
.row .twocol{width:15.05%;}
.row .threecol{width:15.00%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.row .fourcol{width:10.45%;}
.last{margin-right:0px;}
section.fourcol.last{text-align:right;}
}

/*
come back to
@media screen and (max-width: 800px) {
.row{min-width:655px; border-bottom:1px #ccc solid;}
.row .twocol{width:17.05%; border-right:1px #ccc solid;}
}
*/
