/* ~~ Let's do this thing! ~~ */

body {
	font: 90%/1.4 Arial, Helvetica, sans-serif;
	background: #666666;
	margin: 0;
	padding: 0;
	color: #000;
}

#ad-left {
  background: url("../images/blank_left.jpg") no-repeat;
  height: 100%;
  width: 543px;
  position: fixed;
  top: 0;
  left: 0;
  overflow:hidden;
  text-indent:100%;
  white-space:nowrap;
}

#ad-right {
    background: url("../images/blank_right.jpg") no-repeat;
    height: 100%;
    width: 543px;
    position: fixed;
	top: 0;
	right: 0;
    height: 100%
    overflow:hidden;
	text-indent:100%;
	white-space:nowrap;
}

ul, ol, dl { 
	padding-right: 40px;
	padding-left: 15px;
	margin: 0;
}

h1 {
	margin-top: 0;
	padding-right: 40px;
	padding-left: 15px;
	font-family: 'Coda', cursive;
/*	text-transform: uppercase;*/

}

h2, h3, h4, h5, h6, p, p2 {
	margin-top: 0;
	padding-right: 40px;
	padding-left: 15px;
}
a img {
	border: none;
}

a:link {
	color: #000;
	text-decoration: none;
	
}
a:visited {
	color: #000;
}
a:hover, a:active, a:focus {
	text-decoration: none;
}

/* ~~ Header, logo and top navigation.  Look at all those divs! ~~ */

.header {
	width: 995px;
	background: #666666;
	position: relative;
	height: 140px;
	margin: 0 auto; /* super centering power! */
}

#logo {
    font-family:Arial, Helvetica, sans-serif;
    font-size:.8em;
    font-weight:bold;
    list-style:none;
}

#logo a {
    position: absolute;
    height: 140px;
    width: 494px;
    color: #666666;
    text-decoration: none;
    padding: 0;
    background: url("../images/sarlogo_2018.png") no-repeat;
}

#navlist1 {
    font-family:Arial, Helvetica, sans-serif;
    font-size:.8em;
    font-weight:bold;
    list-style:none;
}

#navlist1 a {
height: 102px;
width: 107px;
margin-left: 495px;
margin-top: 26px;
padding:0;
position:absolute;
background:url("../images/articles.png") no-repeat; 
}

#navlist1 a:hover { 
    background-position:0 -102px;
}

#navlist2 {
    font-family:Arial, Helvetica, sans-serif;
    font-size:.8em;
    font-weight:bold;
    list-style:none;
}

#navlist2 a {
height: 102px;
width: 127px;
margin-left:602px;
margin-top:26px;
padding:0;
position:absolute;
background-image:url("../images/archive.png");  

}

#navlist2 a:hover { 
    background-position:0 -102px;
}

#navlist3 {
    font-family:Arial, Helvetica, sans-serif;
    font-size:.8em;
    font-weight:bold;
    list-style:none;
}

#navlist3 a {
height: 102px;
width: 79px;
margin-left:729px;
margin-top:26px;
padding:0;
position:absolute;
background-image:url("../images/store.png");  

}

#navlist3 a:hover { 
    background-position:0 -102px;
}

#navlist4 {
    font-family:Arial, Helvetica, sans-serif;
    font-size:.8em;
    font-weight:bold;
    list-style:none;
}

#navlist4 a {
height: 102px;
width: 70px;
margin-left:808px;
margin-top:26px;
padding:0;
position:absolute;
background-image:url("../images/info.png");  

}

#navlist4 a:hover { 
    background-position:0 -102px;
}

#navlist5 {
    font-family:Arial, Helvetica, sans-serif;
    font-size:.8em;
    font-weight:bold;
    list-style:none;
}

#navlist5 a {
height: 102px;
width: 118px;
margin-left:878px;
margin-top:26px;
padding:0;
position:absolute;
background-image:url("../images/advertise.png");  

}

#navlist5 a:hover { 
    background-position:0 -102px;
}

.roadblock-hdr {
    position: relative;
	width: 995px;
	background: #000000;
	padding: 0px 0 0px 0;
	margin-left:5px;
	margin: 0 auto; /* super centering power! */
}

/* ~~ Super Mega Ultra Container ~~ */

.content_container {
	width: 995px;
	position: relative;
	margin: 0 auto; /* even more super centering power! */
	background: #ccc url(../images/content_bg.gif) repeat-y 50% 0;
}

/* ~~ Login & Search Bar ~~ */

.topbar {
	width: 995px;
	position: relative;
	padding: 0px 0 0px 0;
	min-height: 38px;
	background: #000;
}

#login {
    font-family:Arial, Helvetica, sans-serif;
    font-size:.9em;
    font-weight:bold;
    color: #00cc33;
    list-style:none;
    padding: 7px 0 7px 15px;
	display: inline;
  	float: left;
}

#search {
    font-family:Arial, Helvetica, sans-serif;
    font-size:.9em;
    font-weight:bold;
    color: #00cc33;
    list-style:none;
    padding: 7px 10px 7px 0;
	display: inline;
	text-align: right;
  	float: right;
}

/* ~~ All content below Login & Search Bar ~~ */

.content {
	position: relative;
	margin: 15px 0 0 10px;
	background: transparent;
	width: 700px;
	float: left;
}

.sidebar {
	position: relative;
	margin-left: 700px;
	width: 295px;
	background: transparent;
	padding-bottom: 5px;
	padding-top: 15px;
	font: 90%/1.4 Arial, Helvetica, sans-serif;
    font-weight:bold;
    color: #FFFFFF;
    text-align: center;
    list-style:none;
}

/* ~~ Peanut Butter Footer Time! ~~ */

.footer {
	position: relative;
	padding-top: 10px;
	padding-bottom: 10px;
	background: #000;
	text-align: center;
	font: 75%/1.4 Arial, Helvetica, sans-serif;
	color: #CCCCCC;
	clear: both;
}

.footer a {
    color: #CCCCCC;
    text-decoration: none;

/* ~~ Float/Clear bits ~~ */

.fltrt {
	float: right;
	margin-left: 8px;
}
.fltlft { 
	float: left;
	margin-right: 8px;
}
.clearfloat { 
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}