@charset "UTF-8";
/* CSS Document */

/* --------------------------------------------------------------------------------------------------

PROJECT TITLE:   CKR TRANSPORT
DESIGN BY:       CYBEROPTIK.NET
CONTRIBUTORS:    WARREN GREELEY, RON JOHNSON
LAST UPDATED:    12/21/09

-------------------------------------------------------------------------------------------------- */


/* ---- GLOBAL ELEMENTS -------------------------------------------------------------------------- */

html {height:100%;}
body {padding:0;margin:0;background:#292929;font-size:13px;line-height:18px;color:#666;font-family:Helvetica, Arial, sans-serif;}
p {margin-top:0;}
a {text-decoration:none;color:#cd9307;}
a:hover {text-decoration:underline;}
img {border:0;}
h1, h2, h3, h4, h5, h6 {margin-top:0;}


/* ---- STANDARD ELEMENTS ------------------------------------------------------------------------ */

.alignleft {float:left;}
.alignright {float:right;}
.nomargin {margin:0;}

.pad10 {padding:10px;}
.pad20 {padding:20px;}
.pad30 {padding:30px;}
.pad40 {padding:40px;}
.pad50 {padding:50px;}
.padtop10 {padding-top:10px;}
.padtop20 {padding-top:20px;}
.padtop30 {padding-top:30px;}
.padtop40 {padding-top:40px;}
.padtop50 {padding-top:50px;}
.padbtm10 {padding-bottom:10px;}
.padbtm20 {padding-bottom:20px;}
.padbtm30 {padding-bottom:30px;}
.padbtm40 {padding-bottom:40px;}
.padbtm50 {padding-bottom:50px;}
.padlft10 {padding-left:10px;}
.padlft20 {padding-left:20px;}
.padlft30 {padding-left:30px;}
.padlft40 {padding-left:40px;}
.padlft50 {padding-left:50px;}
.padrgt10 {padding-right:10px;}
.padrgt20 {padding-right:20px;}
.padrgt30 {padding-right:30px;}
.padrgt40 {padding-right:40px;}
.padrgt50 {padding-right:50px;}

.mar10 {margin:10px;}
.mar20 {margin:20px;}
.mar30 {margin:30px;}
.mar40 {margin:40px;}
.mar50 {margin:50px;}
.martop10 {margin-top:10px;}
.martop20 {margin-top:20px;}
.martop30 {margin-top:30px;}
.martop40 {margin-top:40px;}
.martop50 {margin-top:50px;}
.marbtm10 {margin-bottom:10px;}
.marbtm20 {margin-bottom:20px;}
.marbtm30 {margin-bottom:30px;}
.marbtm40 {margin-bottom:40px;}
.marbtm50 {margin-bottom:50px;}
.marlft10 {margin-left:10px;}
.marlft20 {margin-left:20px;}
.marlft30 {margin-left:30px;}
.marlft40 {margin-left:40px;}
.marlft50 {margin-left:50px;}
.marrgt10 {margin-right:10px;}
.marrgt20 {margin-right:20px;}
.marrgt30 {margin-right:30px;}
.marrgt40 {margin-right:40px;}
.marrgt50 {margin-right:50px;}

.black {color:black;}
.red {color:red;}
.gray {color:gray;}
.silver {color:silver;}
.blue {color:blue;}
.green {color:green;}
.orange {color:#F90;}
.optikgreen {color:#74a741;}
.veviablue {color:#09F;}
.white {color:white;}
.gold {color:#e1a721;}

.downsize40 {font-size:60%;}
.downsize20 {font-size:80%;}
.upsize20 {font-size:120%;}
.upsize40 {font-size:140%;} 
.upsize60 {font-size:160%;}
.upsize80 {font-size:180%;}
.upsize100 {font-size:200%;}
.upsize150 {font-size:250%;}


/* ---- STRUCTURAL ELEMENTS ---------------------------------------------------------------------- */

#container {width:850px;margin:0 auto;position:relative;}
#header {float:left;width:100%;height:41px;position:relative;z-index:100;}
#header img {float:right;}
#main {float:left;width:100%;background:white url(../images/main-bkgr.jpg) center top repeat-y;}
#main.homepage {background-image:none;}
#content {width:528px;float:left;padding:30px;}
#content img {padding:3px;border:1px solid #e4ad27;}
#sidebar {float:right;width:262px;padding:15px 0;}
#footer {float:left;width:100%;color:white;text-align:center;padding:20px 0 30px 0;border-top:1px solid white;}
#footer a {color:white;}

.apply a {padding:5px;background:#e4ad27 url(../images/nav-hover.jpg) left bottom repeat-x;color:black;border:1px solid black;text-align:center;font-weight:normal;}


/* ---- NAVIGATION ELEMENTS ---------------------------------------------------------------------- */

#nav {width:850px;float:left;height:38px;background:black;border-top:1px solid white;border-bottom:1px solid white;z-index:10;}
#nav ul {float:right;padding:0;margin:0;list-style:none;}
#nav li {float:left;}
#nav li a {float:left;height:38px;font-family:"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;font-weight:normal;line-height:38px;font-size:14px;color:white;padding:0 20px;}
#nav.subpage li a {padding:0 14px;font-size:13px;border-left:1px solid black;}
#nav li a:hover {text-decoration:none;background:#e4ad27 url(../images/nav-hover.jpg) repeat-x;color:black;}
#nav li.current a {background:url(../images/nav-hover.jpg) repeat-x;color:black;text-decoration:none;}


/* ---- PAGE ELEMENTS ---------------------------------------------------------------------------- */

/* homepage */

#homepage {float:left;width:850px;border-top:1px solid white;z-index:10;}
#homepage-main {float:left;width:850px;background:url(../images/homepage-bkgr.jpg) repeat-y;}
#homepage-content {width:408px;float:left;padding:30px 0 30px 30px;}
#homepage-sidebar {width:381px;float:right;padding:0;}
#homepage-sidebar img {border-bottom:1px solid white;float:left;margin-bottom:20px;}

.testimonials {float:left;border-bottom:1px solid #e4ad27;padding-bottom:20px;margin-bottom:20px;}

#join {float:right;width:154px;font-size:11px;line-height:15px;padding-left:20px;}
#join img {border:2px solid #e4ad27;padding:0;}
#services {float:right;width:220px;font-size:11px;line-height:15px;padding-left:20px;}
#services img {border:2px solid #e4ad27;padding:0;}

#find {float:left;width:232px;color:white;padding:0 15px 25px 15px;}


/* ---- TYPOGRAPHY ELEMENTS ---------------------------------------------------------------------- */

h1 {font-size:20px;color:#e4ad27;font-family:Helvetica, Arial, san-serif;font-weight:bold;margin-bottom:22px;}
h2 {font-size:16px;color:#333;font-family:Helvetica, Arial, san-serif;font-weight:bold;}
h3 {font-size:14px;color:#e4ad27;font-family:Helvetica, Arial, san-serif;font-weight:bold;}
h4 {font-size:12px;color:#333;font-family:Helvetica, Arial, san-serif;font-weight:bold;}
h5 {font-size:11px;color:#e4ad27;font-family:Helvetica, Arial, san-serif;font-weight:bold;}
h6 {font-size:10px;color:#333;font-family:Helvetica, Arial, san-serif;font-weight:bold;}

#header h1.title {position:absolute;top:0;left:0;width:200px;height:100px;z-index:100;background:url(../images/logo.png) no-repeat;}
h1.title a {float:left;width:200px;height:100px;}
h1.title span {display:none;}

#homepage-sidebar a {color:white;}
#homepage-sidebar p {padding:0 20px;}

.address {font-size:14px;color:#e1a721;text-transform:uppercase;font-family:"Myriad Pro", Helvetica, Arial, sans-serif;}
.copyright {color:#999;}
.webdesign {color:#555555;}
#footer .webdesign a {color:#555555;text-decoration:underline;}
#footer .webdesign a:hover {text-decoration:none;color:#777777;}


/* ---- LIST ELEMENTS ---------------------------------------------------------------------------- */

ul {list-style:square;}

ul.conditions {padding:0;margin:0;margin-bottom:18px;list-style:none;float:left;width:100%;color:#06C;}
ul.conditions li {float:left;width:210px;padding-bottom:5px;padding-left:15px;}
ul.contact {padding:0;margin:0;list-style:none;}
ul.contact li {float:left;width:100%;padding-bottom:5px;}

ul.homepage {width:376px;float:left;border:1px solid gray;background:url(../images/list-bkgr.jpg) repeat-x;padding:0;margin:0;list-style:square;padding:15px;}
ul.homepage li {width:165px;margin-left:20px;float:left;}
ul.homepage li span {color:#cd9307;}

ul.form {padding:0;margin:0;list-style:none;}
ul.form li {padding-bottom:10px;float:left;width:100%;}

#find ul {list-style:none;padding:0;margin:0;}


/* ---- FORM ELEMENTS ---------------------------------------------------------------------------- */

#content label {font-size:14px;font-family:Helvetica, Arial, sans-serif;color:#444444;font-weight:bold;float:left;width:100px;}
input.textbox {width:300px;border:2px solid #ccc;font-size:14px;padding:2px;}
input.textbox:hover {border:2px solid #999;}
input.textbox:focus {border:2px solid #e4ad27;}
textarea {font-family:Helvetica, Arial, sans-serif;width:300px;height:70px;border:2px solid #ccc;font-size:14px;padding:2px;}
textarea:hover {border:2px solid #999;}
textarea:focus {border:2px solid #e4ad27;}

ul.quote label {width:150px;font-size:12px;}

/* and boom goes the dynamite */