body {
	/*
	background:#000 url("../images/wj-welcome-background.jpg") no-repeat top;
	*/
	background-color: #fff;
	margin: 0px 0px; 
	padding: 0px;
	font-family: verdana, trebuchet ms, arial, verdana, sans-serif;
	color: #333;
	font-size: 14px;
}

.clear { clear: both;}

.search {color: #000; float: none; !important}
.search-head {float: right; margin: 10px 0 0 0;}

h1.pagetitle {color: #036; font-weight: bold; font-size: 18px; margin: 0; padding: 0;}

.content {font-size: 12px; line-height: 18px; padding: 50px 30px 30px 30px;}

.search-mobile a {color: #999; text-decoration: none;}
.search-mobile a:visited {color: #999; text-decoration: none;}
.search-mobile a:hover {color: #fff; text-decoration: none;}

.mobilenav {padding: 20px 30px;}
.mobilenav ul {list-style-type: none; margin: 0; padding: 0;}
.mobilenav ul li {margin: 0 0 5px 0; padding: 0; font-size: 16px; font-weight: bold;}
.mobilenav ul li a {color: #fff; text-decoration: none;}
.mobilenav ul li a:visited {color: #fff; text-decoration: none;}
.mobilenav ul li a:hover {color: #fff; text-decoration: underline;}

.post_date_m {position: absolute; width: 50px; text-align: center; margin: 4px 0px 0px 6px; color: #900; font-family: arial, verdana, helvetica; font-size: 11px; text-transform: uppercase;}
.post_date_d {position: absolute; width: 50px; text-align: center; margin: 23px 0px 0px 6px; color: #900; font-family: arial, verdana, helvetica; font-size: 30px; text-transform: uppercase;}
.post_date_y {position: absolute; width: 50px; text-align: center; margin: 44px 0px 0px 6px; color: #900; font-family: arial, verdana, helvetica; font-size: 11px; text-transform: uppercase;}

.post_title {margin: 0 0 20px 0;}
.post_title a {color: #369; font-weight: bold; font-size: 16px; text-decoration: none;}
.post_title a:visited {color: #369; text-decoration: none;}
.post_title a:hover {color: #369; text-decoration: underline;}

.post_byline {color: #666; font-size: 11px;}
.post_tags {font-size: 10px; color: #900;}
.post_tags a {color: #900; text-decoration: none;}
.post_tags a:visited {color: #900; text-decoration: none;}
.post_tags a:hover {color: #900; text-decoration: underline;}
.post_body a {color: #900; text-decoration: none;}
.post_body a:visited {color: #900; text-decoration: none;}
.post_body a:hover {color: #900; text-decoration: underline;}

.story-date {width: 80px; float: left;}

.share-button {width: 150px; padding: 5px 0; background-color: #369; color: #fff; margin: 20px 0; text-align: center;}
.share-button a {color: #fff; text-decoration: none;}
.share-button a:visited {color: #fff; text-decoration: none;}
.share-button a:hover {color: #fff; text-decoration: none;}

.frontpage_sectiontitle {background-color: #369; margin: 0px 0px 10px 0px; padding: 6px 0px 6px 8px; color: #FFF; font-size: 12px; font-weight: bold; font-family: arial, verdana, helvetica; }

.wrapper-sectionpic {width: 100%; background:#fff url("images/sectionpic-responsive.jpg") no-repeat top; width: 100%; height: 120px; min-height: 120px;}

@media screen and (min-width: 0px) and (max-width: 1100px) {

	

	@media screen and (min-width: 1024px) and (max-width: 1100px) {
	
		.menu-mobile {display: none;}
		.search-mobile {display: none;}
		
		.wrapper-header {width: 100%; min-height: 110px; height: 110px; background:#000 url("http://www.thearda.com/images/header-bg.jpg") no-repeat top;}
		.container-header {width: 100%; margin: 0 auto;}
		.header-logo {position: absolute; margin: 0 0 0 0;}
		.header-slogan {position: absolute; margin: 18px 0 0 260px; }
		.topnav {position: absolute; margin: 70px 0 0 225px; float: right;}
		.topnav img {height: 38px;}
	
		.headernav {float: right; margin: 10px 30px 0px 0px; color: #999; font-size: 12px;}
		.headernav a {color: #999; text-decoration: none;}
		.headernav a:visited {color: #999; text-decoration: none;}
		.headernav a:hover {color: #fff; text-decoration: none;}
	
		.search {margin: 10px 30px 0 0; font-size: 12px; }
		
		.wrapper-footer {width: 100%; background-color: #0f3e51; margin-top: 50px;}
		.footer-container {width: 100% margin: 0px auto; padding: 0px; min-height: 250px;}

		.footer-social {width: 100%; text-align: center; margin: 0px 0px 0px 0px; padding-top: 50px;}
		.footer-info {width: 100%; text-align: center; margin: 0px 0px 0px 0px; padding-top: 50px; font-family: arial, verdana, sans-serif;}

		.footer-social-title {color: #00abe6; text-transform: uppercase; font-size: 18px; margin: 0px 0px 0px 0px;}

		.footer-links-group {margin: 0px 0px 0px 0px; width: 90%; text-align: center;}
		.footer-links {float: right; margin: 0px 0px 0px 35px; text-align: center; text-transform: uppercase; font-size: 12px;}
		.footer-links a {color: #fff; text-decoration: none;}
		.footer-links a:visited {color: #fff; text-decoration: none;}
		.footer-links a:hover {color: #ff0; text-decoration: none;}

		.footernav {margin: 50px 0px 0px 0px; color: #fff;}
		.footernav a {color: #fff; text-decoration: none;}
		.footernav a:visited {color: #fff; text-decoration: none;}
		.footernav a:hover {color: #900; text-decoration: none;}

		.footernav2 {margin: 10px 0px 0px 0px; color: #fff;}
		.footernav2 a {color: #fff; text-decoration: none;}
		.footernav2 a:visited {color: #fff; text-decoration: none;}
		.footernav2 a:hover {color: #900; text-decoration: none;}
		
		.footerlines {display: none;}

		.copyright {color: #fff; font-size: 14px; text-transform: uppercase; margin: 20px 0px 0px 0px; padding: 0px 0px 40px 0px;}
		
		.front-mainpic-wrapper {width: 100%; background:#fff url("http://www.thearda.com/images/background-frontpage-mobile.jpg") no-repeat top;}
		.front-mainpic-container {display: none; width: 1100px; margin: 0 auto;}
		.front-mainpic-container-mobile {width: 96%; margin: 0 2%; text-align: center; padding-top: 20px;}
		.front-mainpic-container-mobile img {width: 48%; margin: 5px;}
		
		.front-sponsor-mobile {width: 96%; margin: 0 2%; text-align: center; padding: 10px 0;}
		.front-sponsor-mobile img {margin: 0 10px;}
		
		.front-search-mobile {width: 100%; margin: 0 auto; text-align: center; padding: 10px 0 20px 0;}
		
		.front-content-left {float: left; width: 94%; margin: 0 3%;}
		.front-content-right {width: 94%; margin: 40px 3%;}
	
		.front-content-left-left {width: 45%; float: left; border-right: 2px dotted #ccc; padding-right: 20px;}
		.front-content-left-right {width: 45%; float: right;}
	
		.front-rightside-holder {width: 100% padding: 15px; border: 1px solid #00abe6; margin: 10px 0px 20px 0px;}
		.front-rightside-title {color: #00abe6; font-weight: bold; font-size: 14px; margin: 0px 0px 10px 0px;}
		.front-rightside-title a {color: #00abe6; text-decoration: none;}
		.front-rightside-title a:visited {color: #00abe6; text-decoration: none;}
		.front-rightside-title a:hover {color: #00abe6; text-decoration: underline;}

		.frontpage_callout_textbox_container {border: 1px solid #CCC; padding: 5px 10px; margin-bottom: 10px;}
		.frontpage_callout_textbox_title {font-family: arial,verdana,helvetica; font-size: 14px; font-weight: bold; margin: 5px 0px 5px 5px;}

		h3.front-heading {color: #00abe6; text-transform: uppercase; font-weight: normal; font-family: arial, verdana, sans-serif; font-size: 20px; margin: 0px; padding: 0px;}
		h4.feature-title {font-weight: bold; margin: 0px 0px 10px 0px; padding: 0px;}
		.heading-twowords {font-weight: bold; color: #05394d;}

		.feature-holder {margin: 20px 0px;}
		.feature-holder a {color: #369; text-decoration: none;}
		.feature-holder a:visited {color: #369; text-decoration: none;}
		.feature-holder a:hover {color: #369; text-decoration: underline;}
		
		.content-main {width: 60%; float: left;}
		.content-sidebar {width: 30%; float: right;}
		
		.wrapper-sectionpic-mobile {display: none;}
		
		.col1 {width: 30%; float: left;}
		.col2 {width: 30%; float: left; margin: 0 30px 0 50px;}
		.col3 {width: 30%; float: left;}
		
	}
	
	@media screen and (min-width: 768px) and (max-width: 1023px) {	
		
		@media screen and (min-width: 768px) and (max-width: 1023px) {
			
			.wrapper-header {width: 100%; min-height: 110px; height: 110px; background:#000 url("http://www.thearda.com/images/header-bg.jpg") no-repeat top;}
			.container-header {width: 100%; margin: 0 auto;}
			.header-logo {position: absolute; margin: 0 0 0 0;}
			.header-slogan {display: none; position: absolute; margin: 18px 0 0 260px; }
			.topnav {display: none;}
	
			.headernav {float: right; margin: 10px 30px 0px 0px; color: #999; font-size: 12px;}
			.headernav a {color: #999; text-decoration: none;}
			.headernav a:visited {color: #999; text-decoration: none;}
			.headernav a:hover {color: #fff; text-decoration: none;}
	
			.search {float: right; margin: 10px 30px 0 0; font-size: 12px; color: #fff;}
			.search-mobile {display: none;}
		
			
			.wrapper-footer {width: 100%; background-color: #0f3e51; margin-top: 50px;}
			.footer-container {width: 100% margin: 0px auto; padding: 0px; min-height: 250px;}

			.footer-social {width: 100%; text-align: center; margin: 0px 0px 0px 0px; padding-top: 50px;}
			.footer-info {width: 100%; text-align: center; margin: 0px 0px 0px 0px; padding-top: 50px; font-family: arial, verdana, sans-serif;}

			.footer-social-title {color: #00abe6; text-transform: uppercase; font-size: 18px; margin: 0px 0px 0px 0px;}

			.footer-links-group {display: none; margin: 0px 0px 0px 0px; width: 90%; text-align: center;}
			.footer-links {float: right; margin: 0px 0px 0px 35px; text-align: center; text-transform: uppercase; font-size: 12px;}
			.footer-links a {color: #fff; text-decoration: none;}
			.footer-links a:visited {color: #fff; text-decoration: none;}
			.footer-links a:hover {color: #ff0; text-decoration: none;}

			.footernav {display: none; margin: 80px 0px 0px 0px; color: #fff;}
			.footernav a {color: #fff; text-decoration: none;}
			.footernav a:visited {color: #fff; text-decoration: none;}
			.footernav a:hover {color: #900; text-decoration: none;}

			.footernav2 {margin: 10px 0px 0px 0px; color: #fff;}
			.footernav2 a {color: #fff; text-decoration: none;}
			.footernav2 a:visited {color: #fff; text-decoration: none;}
			.footernav2 a:hover {color: #900; text-decoration: none;}
		
			.footerlines {display: none;}

			.copyright {color: #fff; font-size: 14px; text-transform: uppercase; margin: 20px 0px 0px 0px; padding: 0px 0px 40px 0px;}
			
			.front-mainpic-wrapper {width: 100%; background:#fff url("http://www.thearda.com/images/background-frontpage-mobile.jpg") no-repeat top;}
			.front-mainpic-container {display: none; width: 1100px; margin: 0 auto;}
			.front-mainpic-container-mobile {width: 96%; margin: 0 2%; text-align: center; padding-top: 20px;}
			.front-mainpic-container-mobile img {width: 48%; margin: 5px;}
		
			.front-sponsor-mobile {width: 96%; margin: 0 2%; text-align: center; padding: 10px 0;}
			.front-sponsor-mobile img {margin: 0 10px;}
		
			.front-search-mobile {width: 100%; margin: 0 auto; text-align: center; padding: 10px 0 20px 0;}
		
			.front-content-left {float: left; width: 94%; margin: 0 3%;}
			.front-content-right {width: 94%; margin: 40px 3%;}
	
			.front-content-left-left {width: 45%; float: left; border-right: 2px dotted #ccc; padding-right: 20px;}
			.front-content-left-right {width: 45%; float: right;}
	
			.front-rightside-holder {width: 100% padding: 15px; border: 1px solid #00abe6; margin: 10px 0px 20px 0px;}
			.front-rightside-title {color: #00abe6; font-weight: bold; font-size: 14px; margin: 0px 0px 10px 0px;}
			.front-rightside-title a {color: #00abe6; text-decoration: none;}
			.front-rightside-title a:visited {color: #00abe6; text-decoration: none;}
			.front-rightside-title a:hover {color: #00abe6; text-decoration: underline;}

			.frontpage_callout_textbox_container {border: 1px solid #CCC; padding: 5px 10px; margin-bottom: 10px;}
			.frontpage_callout_textbox_title {font-family: arial,verdana,helvetica; font-size: 14px; font-weight: bold; margin: 5px 0px 5px 5px;}

			h3.front-heading {color: #00abe6; text-transform: uppercase; font-weight: normal; font-family: arial, verdana, sans-serif; font-size: 20px; margin: 0px; padding: 0px;}
			h4.feature-title {font-weight: bold; margin: 0px 0px 10px 0px; padding: 0px;}
			.heading-twowords {font-weight: bold; color: #05394d;}

			.feature-holder {margin: 20px 0px;}
			.feature-holder a {color: #369; text-decoration: none;}
			.feature-holder a:visited {color: #369; text-decoration: none;}
			.feature-holder a:hover {color: #369; text-decoration: underline;}
			
			.content-main {width: 60%; float: left;}
			.content-sidebar {width: 30%; float: right;}
			
			.content-main img {width: 80%;}
			
			.wrapper-sectionpic-mobile {display: none;}
			
			.col1 {width: 30%; float: left;}
		.col2 {width: 30%; float: left; margin: 0 30px 0 50px;}
		.col3 {width: 30%; float: left;}
			
		}
		
		@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
		
			.wrapper-header {width: 100%; min-height: 110px; height: 110px; background:#000 url("http://www.thearda.com/images/header-bg.jpg") no-repeat top;}
			.container-header {width: 100%; margin: 0 auto;}
			.header-logo {position: absolute; margin: 0 0 0 0;}
			.header-slogan {display: none; position: absolute; margin: 18px 0 0 260px; }
			.topnav {display: none;}
	
			.headernav {float: right; margin: 10px 30px 0px 0px; color: #999; font-size: 12px;}
			.headernav a {color: #999; text-decoration: none;}
			.headernav a:visited {color: #999; text-decoration: none;}
			.headernav a:hover {color: #fff; text-decoration: none;}
	
			.search {float: right; margin: 10px 30px 0 0; font-size: 12px; color: #fff;}
			.search-mobile {display: none;}
		
			
			.wrapper-footer {width: 100%; background-color: #0f3e51; margin-top: 50px;}
			.footer-container {width: 100% margin: 0px auto; padding: 0px; min-height: 250px;}

			.footer-social {width: 100%; text-align: center; margin: 0px 0px 0px 0px; padding-top: 50px;}
			.footer-info {width: 100%; text-align: center; margin: 0px 0px 0px 0px; padding-top: 50px; font-family: arial, verdana, sans-serif;}

			.footer-social-title {color: #00abe6; text-transform: uppercase; font-size: 18px; margin: 0px 0px 0px 0px;}

			.footer-links-group {margin: 0px 0px 0px 0px; width: 100%; text-align: center;}
			.footer-links {float: right; margin: 0px 0px 0px 35px; text-align: center; text-transform: uppercase; font-size: 12px;}
			.footer-links a {color: #fff; text-decoration: none;}
			.footer-links a:visited {color: #fff; text-decoration: none;}
			.footer-links a:hover {color: #ff0; text-decoration: none;}

			.footernav {margin: 80px 0px 0px 0px; color: #fff;}
			.footernav a {color: #fff; text-decoration: none;}
			.footernav a:visited {color: #fff; text-decoration: none;}
			.footernav a:hover {color: #900; text-decoration: none;}

			.footernav2 {margin: 10px 0px 0px 0px; color: #fff;}
			.footernav2 a {color: #fff; text-decoration: none;}
			.footernav2 a:visited {color: #fff; text-decoration: none;}
			.footernav2 a:hover {color: #900; text-decoration: none;}
		
			.footerlines {display: none;}

			.copyright {color: #fff; font-size: 14px; text-transform: uppercase; margin: 20px 0px 0px 0px; padding: 0px 0px 40px 0px;}
			
			.front-mainpic-wrapper {width: 100%; background:#fff url("http://www.thearda.com/images/background-frontpage-mobile.jpg") no-repeat top;}
			.front-mainpic-container {display: none; width: 1100px; margin: 0 auto;}
			.front-mainpic-container-mobile {width: 96%; margin: 0 2%; text-align: center; padding-top: 20px;}
			.front-mainpic-container-mobile img {width: 48%; margin: 5px;}
		
			.front-sponsor-mobile {width: 96%; margin: 0 2%; text-align: center; padding: 10px 0;}
			.front-sponsor-mobile img {margin: 0 10px;}
		
			.front-search-mobile {width: 100%; margin: 0 auto; text-align: center; padding: 10px 0 20px 0;}
		
			.front-content-left {float: left; width: 94%; margin: 0 3%;}
			.front-content-right {width: 94%; margin: 40px 3%;}
	
			.front-content-left-left {width: 45%; float: left; border-right: 2px dotted #ccc; padding-right: 20px;}
			.front-content-left-right {width: 45%; float: right;}
	
			.front-rightside-holder {width: 100% padding: 15px; border: 1px solid #00abe6; margin: 10px 0px 20px 0px;}
			.front-rightside-title {color: #00abe6; font-weight: bold; font-size: 14px; margin: 0px 0px 10px 0px;}
			.front-rightside-title a {color: #00abe6; text-decoration: none;}
			.front-rightside-title a:visited {color: #00abe6; text-decoration: none;}
			.front-rightside-title a:hover {color: #00abe6; text-decoration: underline;}

			.frontpage_callout_textbox_container {border: 1px solid #CCC; padding: 5px 10px; margin-bottom: 10px;}
			.frontpage_callout_textbox_title {font-family: arial,verdana,helvetica; font-size: 14px; font-weight: bold; margin: 5px 0px 5px 5px;}

			h3.front-heading {color: #00abe6; text-transform: uppercase; font-weight: normal; font-family: arial, verdana, sans-serif; font-size: 20px; margin: 0px; padding: 0px;}
			h4.feature-title {font-weight: bold; margin: 0px 0px 10px 0px; padding: 0px;}
			.heading-twowords {font-weight: bold; color: #05394d;}

			.feature-holder {margin: 20px 0px;}
			.feature-holder a {color: #369; text-decoration: none;}
			.feature-holder a:visited {color: #369; text-decoration: none;}
			.feature-holder a:hover {color: #369; text-decoration: underline;}
			
			.content-main {width: 60%; float: left;}
			.content-sidebar {width: 30%; float: right;}
			
			.content-main img {width: 80%;}
			
			.wrapper-sectionpic-mobile {display: none;}
			
		.col1 {width: 90%; margin: 0 auto;}
		.col2 {width: 90%; margin: 0 auto;}
		.col3 {width: 90%; margin: 0 auto;}
		
		}

	}
	
	@media screen and (min-width: 481px) and (max-width: 767px) {
		
		.wrapper-header {width: 100%; min-height: 110px; height: 110px; background:#000 url("http://www.thearda.com/images/header-bg.jpg") no-repeat top;}
		.container-header {width: 100%; margin: 0 auto;}
		.header-logo {position: absolute; margin: 0 0 0 0;}
		.header-slogan {display: none;}
		.topnav {display: none;}

		.headernav {float: right; margin: 20px 30px 0px 0px; color: #999; font-size: 12px;}
		.headernav a {color: #999; text-decoration: none;}
		.headernav a:visited {color: #999; text-decoration: none;}
		.headernav a:hover {color: #fff; text-decoration: none;}

		.search {display: none; float: right; margin: 10px 30px 0 0; font-size: 12px; color: #fff;}
		.search-mobile {float: right; margin: 10px 30px 0 0; font-size: 12px; color: #fff;}
	
		
		.wrapper-footer {width: 100%; background-color: #0f3e51; margin-top: 50px;}
		.footer-container {width: 100% margin: 0px auto; padding: 0px; min-height: 250px;}

		.footer-social {width: 100%; text-align: center; margin: 0px 0px 0px 0px; padding-top: 50px;}
		.footer-info {width: 100%; text-align: center; margin: 0px 0px 0px 0px; padding-top: 50px; font-family: arial, verdana, sans-serif;}

		.footer-social-title {color: #00abe6; text-transform: uppercase; font-size: 18px; margin: 0px 0px 0px 0px;}

		.footer-links-group {display: none; margin: 0px 0px 0px 0px; width: 90%; text-align: center;}
		.footer-links {float: right; margin: 0px 0px 0px 35px; text-align: center; text-transform: uppercase; font-size: 12px;}
		.footer-links a {color: #fff; text-decoration: none;}
		.footer-links a:visited {color: #fff; text-decoration: none;}
		.footer-links a:hover {color: #ff0; text-decoration: none;}

		.footernav {display: none; margin: 80px 0px 0px 0px; color: #fff;}
		.footernav a {color: #fff; text-decoration: none;}
		.footernav a:visited {color: #fff; text-decoration: none;}
		.footernav a:hover {color: #900; text-decoration: none;}

		.footernav2 {margin: 10px 0px 0px 0px; color: #fff;}
		.footernav2 a {color: #fff; text-decoration: none;}
		.footernav2 a:visited {color: #fff; text-decoration: none;}
		.footernav2 a:hover {color: #900; text-decoration: none;}
	
		.footerlines {display: none;}

		.copyright {color: #fff; font-size: 14px; text-transform: uppercase; margin: 20px 0px 0px 0px; padding: 0px 0px 40px 0px;}
		
		.front-mainpic-wrapper {width: 100%; background:#fff url("http://www.thearda.com/images/background-frontpage-mobile.jpg") no-repeat top;}
		.front-mainpic-container {display: none; width: 1100px; margin: 0 auto;}
		.front-mainpic-container-mobile {width: 96%; margin: 0 2%; text-align: center; padding-top: 20px;}
		.front-mainpic-container-mobile img {width: 100%; margin: 5px 0;}
		
		.front-sponsor-mobile {width: 96%; margin: 0 2%; text-align: center; padding: 10px 0;}
		.front-sponsor-mobile img {margin: 0 10px;}
		
		.front-search-mobile {width: 100%; margin: 0 auto; text-align: center; padding: 10px 0 20px 0;}
		
		.front-content-left {width: 94%; margin: 0 3%;}
		.front-content-right {width: 94%; margin: 40px 3%;}
	
		.front-content-left-left {width: 96%; margin: 0 3%; }
		.front-content-left-right {width: 96%; margin: 0 3%; }
	
		.front-rightside-holder {width: 100% padding: 15px; border: 1px solid #00abe6; margin: 10px 0px 20px 0px;}
		.front-rightside-title {color: #00abe6; font-weight: bold; font-size: 14px; margin: 0px 0px 10px 0px;}
		.front-rightside-title a {color: #00abe6; text-decoration: none;}
		.front-rightside-title a:visited {color: #00abe6; text-decoration: none;}
		.front-rightside-title a:hover {color: #00abe6; text-decoration: underline;}

		.frontpage_callout_textbox_container {border: 1px solid #CCC; padding: 5px 10px; margin-bottom: 10px;}
		.frontpage_callout_textbox_title {font-family: arial,verdana,helvetica; font-size: 14px; font-weight: bold; margin: 5px 0px 5px 5px;}

		h3.front-heading {color: #00abe6; text-transform: uppercase; font-weight: normal; font-family: arial, verdana, sans-serif; font-size: 20px; margin: 0px; padding: 0px;}
		h4.feature-title {font-weight: bold; margin: 0px 0px 10px 0px; padding: 0px;}
		.heading-twowords {font-weight: bold; color: #05394d;}

		.feature-holder {margin: 20px 0px;}
		.feature-holder a {color: #369; text-decoration: none;}
		.feature-holder a:visited {color: #369; text-decoration: none;}
		.feature-holder a:hover {color: #369; text-decoration: underline;}
		
		.wrapper-sectionpic {display: none;}
		.wrapper-sectionpic-mobile {width: 100%; }
		.wrapper-sectionpic-mobile img {width: 100%;}
		
		.col1 {width: 90%; margin: 0 auto;}
		.col2 {width: 90%; margin: 0 auto;}
		.col3 {width: 90%; margin: 0 auto;}
		
	}
	
	@media screen and (min-width: 321px) and (max-width: 480px) {
		
		.wrapper-header {width: 100%; min-height: 110px; height: 110px; background:#000 url("http://www.thearda.com/images/header-bg.jpg") no-repeat top;}
		.container-header {width: 100%; margin: 0 auto;}
		.header-logo {position: absolute; margin: 0 0 0 0;}
		.header-slogan {display: none;}
		.topnav {display: none;}

		.headernav {display: none; float: right; margin: 10px 30px 0px 0px; color: #999; font-size: 12px;}
		.headernav a {color: #999; text-decoration: none;}
		.headernav a:visited {color: #999; text-decoration: none;}
		.headernav a:hover {color: #fff; text-decoration: none;}

		.search {display: none; float: right; margin: 10px 30px 0 0; font-size: 12px; color: #fff;}
		.search-mobile {display: none; float: right; margin: 10px 30px 0 0; font-size: 12px; color: #fff;}
	
		
		.wrapper-footer {width: 100%; background-color: #0f3e51; margin-top: 50px;}
		.footer-container {width: 100% margin: 0px auto; padding: 0px; min-height: 250px;}

		.footer-social {width: 100%; text-align: center; margin: 0px 0px 0px 0px; padding-top: 50px;}
		.footer-info {width: 100%; text-align: center; margin: 0px 0px 0px 0px; padding-top: 50px; font-family: arial, verdana, sans-serif;}

		.footer-social-title {color: #00abe6; text-transform: uppercase; font-size: 18px; margin: 0px 0px 0px 0px;}

		.footer-links-group {display: none; margin: 0px 0px 0px 0px; width: 90%; text-align: center;}
		.footer-links {float: right; margin: 0px 0px 0px 35px; text-align: center; text-transform: uppercase; font-size: 12px;}
		.footer-links a {color: #fff; text-decoration: none;}
		.footer-links a:visited {color: #fff; text-decoration: none;}
		.footer-links a:hover {color: #ff0; text-decoration: none;}

		.footernav {display: none; margin: 80px 0px 0px 0px; color: #fff;}
		.footernav a {color: #fff; text-decoration: none;}
		.footernav a:visited {color: #fff; text-decoration: none;}
		.footernav a:hover {color: #900; text-decoration: none;}

		.footernav2 {margin: 10px 0px 0px 0px; color: #fff;}
		.footernav2 a {color: #fff; text-decoration: none;}
		.footernav2 a:visited {color: #fff; text-decoration: none;}
		.footernav2 a:hover {color: #900; text-decoration: none;}
	
		.footerlines {display: none;}

		.copyright {color: #fff; font-size: 14px; text-transform: uppercase; margin: 20px 0px 0px 0px; padding: 0px 0px 40px 0px;}
		
		.front-mainpic-wrapper {width: 100%; background:#fff url("http://www.thearda.com/images/background-frontpage-mobile.jpg") no-repeat top;}
		.front-mainpic-container {display: none; width: 1100px; margin: 0 auto;}
		.front-mainpic-container-mobile {width: 96%; margin: 0 2%; text-align: center; padding-top: 20px;}
		.front-mainpic-container-mobile img {width: 100%; margin: 5px 0;}
		
		.front-sponsor-mobile {width: 96%; margin: 0 2%; text-align: center; padding: 10px 0;}
		.front-sponsor-mobile img {margin: 0 10px;}
		
		.front-search-mobile {width: 100%; margin: 0 auto; text-align: center; padding: 10px 0 20px 0;}
		
		.front-content-left {width: 94%; margin: 0 3%;}
		.front-content-right {width: 94%; margin: 40px 3%;}
	
		.front-content-left-left {width: 96%; margin: 0 3%; }
		.front-content-left-right {width: 96%; margin: 0 3%; }
	
		.front-rightside-holder {width: 100% padding: 15px; border: 1px solid #00abe6; margin: 10px 0px 20px 0px;}
		.front-rightside-title {color: #00abe6; font-weight: bold; font-size: 14px; margin: 0px 0px 10px 0px;}
		.front-rightside-title a {color: #00abe6; text-decoration: none;}
		.front-rightside-title a:visited {color: #00abe6; text-decoration: none;}
		.front-rightside-title a:hover {color: #00abe6; text-decoration: underline;}

		.frontpage_callout_textbox_container {border: 1px solid #CCC; padding: 5px 10px; margin-bottom: 10px;}
		.frontpage_callout_textbox_title {font-family: arial,verdana,helvetica; font-size: 14px; font-weight: bold; margin: 5px 0px 5px 5px;}

		h3.front-heading {color: #00abe6; text-transform: uppercase; font-weight: normal; font-family: arial, verdana, sans-serif; font-size: 20px; margin: 0px; padding: 0px;}
		h4.feature-title {font-weight: bold; margin: 0px 0px 10px 0px; padding: 0px;}
		.heading-twowords {font-weight: bold; color: #05394d;}

		.feature-holder {margin: 20px 0px;}
		.feature-holder a {color: #369; text-decoration: none;}
		.feature-holder a:visited {color: #369; text-decoration: none;}
		.feature-holder a:hover {color: #369; text-decoration: underline;}
		
		.wrapper-sectionpic {display: none;}
		.wrapper-sectionpic-mobile {width: 100%; }
		.wrapper-sectionpic-mobile img {width: 100%;}
		
	.col1 {width: 90%; margin: 0 auto;}
		.col2 {width: 90%; margin: 0 auto;}
		.col3 {width: 90%; margin: 0 auto;}
		
	}
	
	@media screen and (min-width: 0px) and (max-width: 320px) {
		
		.wrapper-header {width: 100%; min-height: 110px; height: 110px; background:#000 url("http://www.thearda.com/images/header-bg.jpg") no-repeat top;}
		.container-header {width: 100%; margin: 0 auto;}
		.header-logo {position: absolute; margin: 0 0 0 0;}
		.header-logo img {width: 60%;}
		.header-slogan {display: none;}
		.topnav {display: none;}

		.headernav {display: none; float: right; margin: 10px 30px 0px 0px; color: #999; font-size: 12px;}
		.headernav a {color: #999; text-decoration: none;}
		.headernav a:visited {color: #999; text-decoration: none;}
		.headernav a:hover {color: #fff; text-decoration: none;}

		.search {display: none; float: right; margin: 10px 30px 0 0; font-size: 12px; color: #fff;}
		.search-mobile {display: none; float: right; margin: 10px 30px 0 0; font-size: 12px; color: #fff;}
	
		/*.menu-mobile {position: absolute; margin: 130px 0 0 0px; z-index: 5000; }*/
		
		.content {font-size: 12px; line-height: 18px; padding: 80px 30px 30px 30px;}
		
		.wrapper-footer {width: 100%; background-color: #0f3e51; margin-top: 50px;}
		.footer-container {width: 100% margin: 0px auto; padding: 0px; min-height: 250px;}

		.footer-social {width: 100%; text-align: center; margin: 0px 0px 0px 0px; padding-top: 50px;}
		.footer-info {width: 100%; text-align: center; margin: 0px 0px 0px 0px; padding-top: 50px; font-family: arial, verdana, sans-serif;}

		.footer-social-title {color: #00abe6; text-transform: uppercase; font-size: 18px; margin: 0px 0px 0px 0px;}

		.footer-links-group {display: none; margin: 0px 0px 0px 0px; width: 90%; text-align: center;}
		.footer-links {float: right; margin: 0px 0px 0px 35px; text-align: center; text-transform: uppercase; font-size: 12px;}
		.footer-links a {color: #fff; text-decoration: none;}
		.footer-links a:visited {color: #fff; text-decoration: none;}
		.footer-links a:hover {color: #ff0; text-decoration: none;}

		.footernav {display: none; margin: 80px 0px 0px 0px; color: #fff;}
		.footernav a {color: #fff; text-decoration: none;}
		.footernav a:visited {color: #fff; text-decoration: none;}
		.footernav a:hover {color: #900; text-decoration: none;}

		.footernav2 {margin: 10px 0px 0px 0px; color: #fff;}
		.footernav2 a {color: #fff; text-decoration: none;}
		.footernav2 a:visited {color: #fff; text-decoration: none;}
		.footernav2 a:hover {color: #900; text-decoration: none;}
	
		.footerlines {display: none;}

		.copyright {color: #fff; font-size: 14px; text-transform: uppercase; margin: 20px 0px 0px 0px; padding: 0px 0px 40px 0px;}
		
		.front-mainpic-wrapper {width: 100%; background:#fff url("http://www.thearda.com/images/background-frontpage-mobile.jpg") no-repeat top;}
		.front-mainpic-container {display: none; width: 1100px; margin: 0 auto;}
		.front-mainpic-container-mobile {width: 96%; margin: 0 2%; text-align: center; padding-top: 20px;}
		.front-mainpic-container-mobile img {width: 100%; margin: 5px 0;}
		
		.front-sponsor-mobile {width: 96%; margin: 0 2%; text-align: center; padding: 10px 0;}
		.front-sponsor-mobile img {margin: 0 10px;}
		
		.front-search-mobile {width: 100%; margin: 0 auto; text-align: center; padding: 10px 0 20px 0;}
		
		.front-content-left {width: 94%; margin: 0 3%;}
		.front-content-right {width: 94%; margin: 40px 3%;}
	
		.front-content-left-left {width: 96%; margin: 0 3%; }
		.front-content-left-right {width: 96%; margin: 0 3%; }
	
		.front-rightside-holder {width: 100% padding: 15px; border: 1px solid #00abe6; margin: 10px 0px 20px 0px;}
		.front-rightside-title {color: #00abe6; font-weight: bold; font-size: 14px; margin: 0px 0px 10px 0px;}
		.front-rightside-title a {color: #00abe6; text-decoration: none;}
		.front-rightside-title a:visited {color: #00abe6; text-decoration: none;}
		.front-rightside-title a:hover {color: #00abe6; text-decoration: underline;}

		.frontpage_callout_textbox_container {border: 1px solid #CCC; padding: 5px 10px; margin-bottom: 10px;}
		.frontpage_callout_textbox_title {font-family: arial,verdana,helvetica; font-size: 14px; font-weight: bold; margin: 5px 0px 5px 5px;}

		h3.front-heading {color: #00abe6; text-transform: uppercase; font-weight: normal; font-family: arial, verdana, sans-serif; font-size: 20px; margin: 0px; padding: 0px;}
		h4.feature-title {font-weight: bold; margin: 0px 0px 10px 0px; padding: 0px;}
		.heading-twowords {font-weight: bold; color: #05394d;}

		.feature-holder {margin: 20px 0px;}
		.feature-holder a {color: #369; text-decoration: none;}
		.feature-holder a:visited {color: #369; text-decoration: none;}
		.feature-holder a:hover {color: #369; text-decoration: underline;}
		
		.wrapper-sectionpic {display: none;}
		.wrapper-sectionpic-mobile {width: 100%; }
		.wrapper-sectionpic-mobile img {width: 100%;}
		
		.col1 {width: 90%; margin: 0 auto;}
		.col2 {width: 90%; margin: 0 auto;}
		.col3 {width: 90%; margin: 0 auto;}
		
	}
	
}

@media screen and (min-width: 1101px) {

	.menu-mobile {display: none;}
	.search-mobile {display: none;}
	.front-mainpic-container-mobile {display: none;}
	.front-sponsor-mobile {display: none;}
	.front-search-mobile {display: none;}

	.wrapper-header {width: 100%; min-height: 110px; height: 110px; background:#000 url("http://www.thearda.com/images/header-bg.jpg") no-repeat top;}
	.container-header {width: 100%; max-width: 1100px; margin: 0 auto;}
	.header-logo {position: absolute; margin: 0 0 0 0;}
	.header-slogan {position: absolute; margin: 18px 0 0 260px; }
	.topnav {position: absolute; margin: 68px 0 0 225px; float: right;}
	
	.headernav {float: right; margin: 10px 0px 0px 0px; color: #999; font-size: 12px;}
	.headernav a {color: #999; text-decoration: none;}
	.headernav a:visited {color: #999; text-decoration: none;}
	.headernav a:hover {color: #fff; text-decoration: none;}
	
	
	.wrapper-content {background:#fff url("http://www.thearda.com/images/wrapper-bg.jpg") no-repeat top;}
	.container-content {width: 100%; max-width: 1100px; margin: 0 auto; min-height: 500px;}
	
	.wrapper-footer {width: 100%; background-color: #0f3e51; margin-top: 50px;}
	.footer-container {width: 1100px; margin: 0px auto; padding: 0px; min-height: 250px;}

	.footer-social {float: right; margin: 0px 20px 0px 0px; width: 250px; padding-top: 50px;}
	.footer-info {width: 850px; margin: 0px 0px 0px 50px; padding-top: 50px; font-family: arial, verdana, sans-serif;}

	.footer-social-title {color: #00abe6; text-transform: uppercase; font-size: 18px; margin: 0px 0px 0px 0px;}

	.footer-links-group {margin: 0px 0px 0px 0px; width: 850px;}
	.footer-links {float: right; margin: 0px 0px 0px 35px; text-align: center; text-transform: uppercase; font-size: 12px;}
	.footer-links a {color: #fff; text-decoration: none;}
	.footer-links a:visited {color: #fff; text-decoration: none;}
	.footer-links a:hover {color: #ff0; text-decoration: none;}

	.footernav {margin: 10px 0px 0px 0px; color: #fff;}
	.footernav a {color: #fff; text-decoration: none;}
	.footernav a:visited {color: #fff; text-decoration: none;}
	.footernav a:hover {color: #900; text-decoration: none;}

	.footernav2 {margin: 10px 0px 0px 0px; color: #fff;}
	.footernav2 a {color: #fff; text-decoration: none;}
	.footernav2 a:visited {color: #fff; text-decoration: none;}
	.footernav2 a:hover {color: #900; text-decoration: none;}

	.copyright {color: #fff; font-size: 14px; text-transform: uppercase; margin: 20px 0px 50px 0px;}
	
	.front-wrapper-content {width: 1060px; margin: 0 auto; padding: 60px 20px 60px 20px;}
	
	.front-mainpic-wrapper {width: 100%; background:#fff url("http://www.thearda.com/images/background-frontpage-mobile.jpg") no-repeat top;}
	.front-mainpic-container {width: 1100px; margin: 0 auto;}
	.sponsors {position: absolute; margin: 18px 0px 0px 868px; z-index: 1000;}
	.sponsor-logos {position: absolute; margin: 60px 0px 0px 35px;}
	
	.front-content-left {float: left; width: 650px; margin: 0 50px 0 0;}
	.front-content-right {float: left; width: 350px; margin: 0 0 0 0;}
	
	.front-content-left-left {width: 45%; float: left; border-right: 2px dotted #ccc; padding-right: 20px;}
	.front-content-left-right {width: 45%; float: right;}
	
	.front-rightside-holder {width: 285px; padding: 15px; border: 1px solid #00abe6; margin: 10px 0px 20px 0px;}
	.front-rightside-title {color: #00abe6; font-weight: bold; font-size: 14px; margin: 0px 0px 10px 0px;}
	.front-rightside-title a {color: #00abe6; text-decoration: none;}
	.front-rightside-title a:visited {color: #00abe6; text-decoration: none;}
	.front-rightside-title a:hover {color: #00abe6; text-decoration: underline;}

	.frontpage_callout_textbox_container {border: 1px solid #CCC; padding: 5px 10px; margin-bottom: 10px;}
	.frontpage_callout_textbox_title {font-family: arial,verdana,helvetica; font-size: 14px; font-weight: bold; margin: 5px 0px 5px 5px;}

	h3.front-heading {color: #00abe6; text-transform: uppercase; font-weight: normal; font-family: arial, verdana, sans-serif; font-size: 20px; margin: 0px; padding: 0px;}
	h4.feature-title {font-weight: bold; margin: 0px 0px 10px 0px; padding: 0px;}
	.heading-twowords {font-weight: bold; color: #05394d;}

	.feature-holder {margin: 20px 0px;}
	.feature-holder a {color: #369; text-decoration: none;}
	.feature-holder a:visited {color: #369; text-decoration: none;}
	.feature-holder a:hover {color: #369; text-decoration: underline;}
	
	.content-main {width: 60%; float: left;}
	.content-sidebar {width: 30%; float: right;}
	
	.wrapper-sectionpic-mobile {display: none;}
	
	.col1 {width: 30%; float: left;}
	.col2 {width: 30%; float: left; margin: 0 30px 0 50px;}
	.col3 {width: 30%; float: left;}

}