body {font-family:'Andika', sans-serif; background:#777;}

/* Fonts */

@font-face {font-family:'above_demoregular';
    src: url('../fonts/above__-_personal_use_only-webfont.woff2') format('woff2'),
         url('../fonts/above__-_personal_use_only-webfont.woff') format('woff');
    font-weight:normal; font-style:normal;}

/* The Usuals */

h1, h3, h4 {font-family:'above_demoregular';}
h2, p {font-family:'Andika', sans-serif;}

h1 {font-size:22px; line-height:30px; padding:5px 4px 4px 4px; color:#b90b14; border:#aaa 1px solid; border-left:none; border-right:none; margin:0 0 20px 0;}
h2 {background:#045a86; color:#fff; font-size:20px; line-height:26px; padding:5px 10px; text-transform:uppercase;}
h3 {font-size:22px; line-height:30px; color:#b90b14; border-bottom:#b90b14 1px solid;}
h4 {font-size:20px; line-height:26px; color:#045a86; margin:15px 0;}

p {color:#333; font-size:15px; line-height:24px; margin:16px 0;}

a {color:#045a86;}
a:hover {color:#995556;}

ul {margin:5px 5px 10px 15px; padding:0;}
li {margin:0 0 0 15px; padding:0 0 2px 0; font-size:14px; line-height:21px; color:#333;}

hr {color:#995556; background:#995556; height:1px; border:0; margin:12px 0;}

@media only screen and (max-width:1200px) {
	h1, h3 {font-size:2.1vw; line-height:3vw;}
	h2 {font-size:1.8vw; line-height:2.5vw;}
	h4 {font-size:1.7vw; line-height:2.4vw;}
	p {font-size:1.28vw; line-height:2.1vw;}
	li {font-size:1.22vw; line-height:1.75vw;}
}

@media only screen and (max-width:1000px) {
	h1, h3 {font-size:2.3vw; line-height:3.2vw;}
	h2 {font-size:1.9vw; line-height:2.6vw;}
	h4 {font-size:1.8vw; line-height:2.5vw;}
	p {font-size:1.45vw; line-height:2.5vw;}
	li {font-size:1.36vw; line-height:2.1vw;}
}

@media only screen and (max-width:850px) {
	h2 {font-size:2.1vw; line-height:2.8vw;}
	p {font-size:1.6vw; line-height:2.7vw;}
	li {font-size:1.5vw; line-height:2.3vw;}
}

@media only screen and (max-width:639px) {
	h1 {margin:0 0 15px 0; padding:4px 3px 3px 3px;}
	h2 {font-size:2.2vw; line-height:2.8vw; padding:4px 8px;}
	h4 {font-size:1.9vw; line-height:2.8vw; margin:10px 0;}
	p {font-size:1.6vw; line-height:2.5vw; margin:12px 0;}
	li {font-size:1.6vw; line-height:2.5vw;}
}

/* Common Elements */

.product_list .column {padding:5px!important;}

 .redlink {color:#f00;}
 .redlink:hover {text-decoration:underline;}

/* Shell */

.ziprepeat {background:url("../images/zip_repeat.png") top repeat-y; background-size:100%; position:relative; margin-right:-46%;}
.ziptop {background:url("../images/zipper_top.png") top no-repeat; background-size:100%;}

.bodyarea {background:#fff;}

/* Sidebar - Nav & Contact */

.navigation ul {margin:0; padding:35% 0 0 8%;}
.navigation ul li {margin:0 0 17px 0; padding:0 0 0 25px; list-style:none; font-family:'above_demoregular'; font-size:14px; line-height:18px; background:url("../images/bullet.png") 0 3px no-repeat; background-size:15px;}
.navigation ul a {color:#fff;}
.navigation ul a:hover, .navigation ul li.on a {color:#66b0d6;}

@media only screen and (max-width:1200px) {
	.navigation ul {padding-left:7%;}
	.navigation ul li {font-size:1.25vw; line-height:1.5vw; background-size:13px; padding-left:23px;}
}

@media only screen and (max-width:1000px) {
	.navigation ul {padding-left:6%;}
	.navigation ul li {font-size:1.35vw; line-height:1.7vw; background-size:12px; padding-left:19px;}
}

@media only screen and (max-width:850px) {
	.navigation ul {padding-left:5%;}
	.navigation ul li {font-size:1.45vw; line-height:1.7vw; background-size:10px; padding-left:15px; margin-bottom:15px;}
}

@media only screen and (max-width:639px) {
	.navigation ul {padding-left:4%;}
	.navigation ul li {font-size:1.55vw; line-height:1.8vw; background-size:7px; padding-left:10px; margin-bottom:12px; background-position:0 2px;}
}

/* Sidebar - Call Us */

.callus {width:52%; padding-top:20px;}

/* Header */

.header img {width:82%;}

/* Home Elements */

.banner {border:#66afd6 5px solid; border-left:none; border-right:none;}

.products {background:#e2f4fe; padding:10px; margin:20px 0 0 0;}

/* Main Body Area */

.mainbody {padding:30px 35px 25px 40px; position:relative;}

@media only screen and (max-width:850px) {
	.mainbody {padding:25px 25px 15px 30px;}
}

@media only screen and (max-width:639px) {
	.mainbody {padding:15px 15px 15px 20px;}
}

/* Footer */

.footer {background:#eee;}
