# news.css
# Northeast Wood Stove & Fireplace CSS
# ©2010 Koolcow Webworks LTD

html {
 margin:0 auto;
}

body {
 background-color:#000;
 margin:0 auto;
 width:950px;
}

div.header {
 width:950px;
 height:300px;
 margin:0;
 padding:0;
 background-image:url('images/header.jpg')
}

a.bannerbadge {
 position:relative;
 top:25px;
 left:725px;
}

#button1,#button2,#button3,#button4,#button5,#button6,#button7,#button8,#button9,#button10,#button11,#button12,#button13,#button14 {
 background-image:url(images/log.gif);
 background-size: cover;
 height:50px;
 width:200px;
 font:bold 13pt arial;
 color:#fff;
 text-align:center;
 cursor:pointer;
 line-height:50px;
 vertical-align:middle;
 letter-spacing:-1px;
 margin:0 0 5px;
}

a.menu {
 text-decoration:none;
 color:#fff;
}

a.menu:hover {
 text-decoration:none;
 color:#fff;
}

a {
 text-decoration:none;
 color:#ff9;
}

a:hover {
 text-decoration:none;
 color:#f99;
}

div.nav {
 float:left;
}

div.main {
 width:690px;
 min-height:765px;
 margin:0 0 0 220px;
 padding:10px 20px;
 background:#151515;
 color:#fff;
 font:normal 11pt arial;
}

div.pagehead {
 padding:10px 0;
 text-align:center;
 font:bold italic 12pt Arial;
 color:#c00;
}

div.pageheadbig {
  font-family: 'ChunkFiveRegular', sans-serif;
  font-size:24pt;
  text-align:center;
  padding:30px 0 0 0;
}

div.bigshadow {
  text-shadow:2px 2px 5px #000, 4px 4px 5px #333;
  background-color:#600;
}
div.bigshadowgray {
  text-shadow:2px 2px 5px #000, 4px 4px 5px #333;
  background-color:#444;
}

div.subhead {
 margin:30px 0 0 0;
 padding:2px 5px;
 font:bold italic 12pt Arial;
 background:url('images/subhead.png') repeat-y;
 color:#fff;
 width:380px;
}

div.secthead {
 margin:20px 0 0 0;
 padding:5px 0 0 0;
 font:bold 12pt Arial;
 color:#ff5;
}

div.footer {
 clear:both;
 margin:20px 0;
 padding:10px;
 text-align:center;
 font:bold italic 11pt arial;
 color:#fff;
 background:#320;
}

div.counter {
 float:right;
 position:relative;
 top:10px;
 text-align:right;
 font:9pt arial black;
 color:#000;
 height:100px;
}

h1 {
  font-size:150%;
  color:#77c;
  margin:0px;
  padding:0px;
  height:10px;
}

div.highlight {
  font-family: 'ChunkFiveRegular', sans-serif;
  font-size:200%;
  color:#fff;
  background-color:#a00;
  text-align:center;
  padding:30px;
  margin:10px 10px 20px 0;
}

h2 {
  font-size:130%;
  color:#ff9;
  margin:0px;
  padding:0px;
  height:10px;
}

h2.green {
  color:#3f3;
}

li {
  padding:0 0 5px 0;
}

.ltred    { color:#f99; }
.ltyellow { color:#ff9; }
.ltgreen  { color:#9f9; }
.ltblue   { color:#99f; }
.ltpurple { color:#f9f; }
.red      { color:#f00; }
.yellow   { color:#ff0; }
.white    { color:#fff; }

hr { border:1px solid #431; }

@font-face {
  font-family: 'ChunkFiveRegular';
  src: url('fonts/Chunkfive-webfont.eot');
  src: url('fonts/Chunkfive-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/Chunkfive-webfont.woff') format('woff'),
       url('fonts/Chunkfive-webfont.ttf') format('truetype'),
       url('fonts/Chunkfive-webfont.svg#UmbrageRegular') format('svg');
  font-weight: normal;
  font-style: normal;
}

.table { display:table; }
.row { display:table-row; }
.cell { display: table-cell; text-align: left; padding: 5px; }
.rightcell { display: table-cell; text-align: right; padding: 5px;}
textarea, input, select { background-color: #dca; color:#320; font-weight: bold; resize: none; }
#submit { background-color: #600; color:#fff; }

.cl-logos {
	float: left; 
	padding: 0;
	margin: 0 32px;
	idth: 33%;
}
.cl-logos:hover {
	filter: brightness(1.3);
}
.clearfloat {
	clear:both;
}

.fireside {
	max-width:150px; float:left;
}

/*577/576*/
@media only screen and (min-width: 769px) {
	div.mobile-nav { display: none; }
}
@media only screen and (max-width: 768px) {
	img.fireside {
		max-width:120px; float:none;
	}

	body {
		width:100%;
		background-color:#000;
		margin:0 auto;
	}
	img {
		width: 100%;
		height: auto;
	}
	div.header {
		width:100%;
		height:auto;
		margin:0;
		padding:0;
		background-image:url('images/header.jpg');
		background-size: contain;
	}
	div.mobile-nav {
		background-color:#444;
		color:#fff!important;
		border-radius:5px;
		font:bold 11pt Arial;
		padding:10px;
		float: right;
	}
	div.nav {
		width:100%;
		position: absolute;
		top: 0;
		left: 0;
		display:none;
		float:none;
		margin:0 auto;
		background-color:#333;
		z-index: 1000;
		border-radius:10px;
		
	}
	div.nav:target {
		display: inline-block;
	}	
	div.main {
		width:90%;
		min-height:765px;
		margin:0 10px;
		padding:10px;
		background:#151515;
		color:#fff;
		font:normal 11pt arial;
	}
	#button1,#button2,#button3,#button4,#button5,#button6,#button7,#button8,#button9,#button10,#button11,#button12,#button13,#button14 {
		width: 80%;
		margin: 5px auto;
	}
  .cl-logos {
	  float: left; 
	  margin: 0 auto;
}

}