/*
MWISMedia New Media Design & Development
Author: David Goadby
 */
 
/* GLOBAL SETTINGS  ---------------------------------------------------------------*/
html { height: 100%; margin-bottom: 1px; }  
html,body{height:100% !important}
p, td, li, ul,ol, h1, h2, h3 ,h4 ,h5 ,h6, label, input, form, select {font: normal 11px Tahoma;margin: 0 0 0 0; padding: 0 0 0 0;color: #000;}
body {margin: 0px;padding: 0px;text-align: center;background: repeat-y url(../images/bg_container.gif);}

#container { width: 1258px;; background: repeat-x url(../images/bg.jpg); }

.truflologo { float:left;}
.homeimage {display:block; clear:both; float:left; margin: 0 0 10px 0;}
.strap { margin: 30px 0 0 0;}
.body_image { float:left; margin: 5px 25px 10px 5px; padding:1px; border:1px solid #ccc;  }
.caption { float:left; background-color:#F2F2F2; font: bold 10px tahoma; color:#333333; text-align:center; margin: 5px 20px 5px 5px; padding:5px 5px 10px 5px; border:1px solid #ccc; width:200px; }
.caption img { margin:auto; padding-bottom:10px;}
.logo { margin: 5px 5px 10px 20px;}

/* LOGIN & LOGO  ---------------------------------------------------------------*/
#login { float:right; width: 340px; height: 105px; background: no-repeat url(../images/login_bg.png);}
#login form { margin: 30px 0 0 20px;}
#login p { display: block; text-align:left;margin: 0 0 3px 0; width: 200px; }
#login label { display:block; float:left; text-transform:uppercase; color:#333; margin:0; text-align: right; width: 60px; padding: 2px 2px 0 0; font-size: 10px; }
#login input.box { border:none; background: no-repeat url(../images/bg_input.jpg); width:125px;height: 12px; padding: 2px; color:#333;}
#login_button { width: 80px; height: 39px; float:right; margin: 0 40px 0 0;}
#login p.log { margin: 13px 0 0 117px; display:block;  float:left; width: 180px; color:#333333;}
#login a { text-decoration:none; color:#333; text-transform:uppercase; font-size: 10px;}

/* NAV ---------------------------------------------------------------*/
#nav { margin: 0 0 25px 0;}
#nav, #nav ul {padding: 0;margin: 0 0 0 0;list-style: none;display:block; width: 1050px;}
#nav li ul {position: absolute;width: 10em;left: -999em;}
#nav li ul li a { background-image: url(../images/libg2.jpg); width: 202px; text-align:left; margin:0; padding:7px  5px 7px 20px; font: bold 11px Tahoma, Helvetica, sans-serif; color:#fff; text-decoration:none; text-transform:uppercase;}
#nav li:hover ul {left: auto;}
#nav li ul li a:hover {text-decoration:none; color:#B73535;}
#nav li:hover ul, #nav li.sfhover ul {left: auto;}
#nav { float:left; margin: 35px 0 0 0;}
#nav li { float:left; list-style:none;}
#nav li a {display:block; font: bold 11px tahoma; color: #fff; text-decoration:none; padding: 14px 15px 12px 20px; background: no-repeat url(../images/bg_li.jpg);}
#nav li a:hover {text-decoration:underline;}
#nav li:hover, #nav li.hover {   
    position: static;   
}  
/* COL ONE  ---------------------------------------------------------------*/
#col_one { float:left; width: 265px; text-align:right; margin: 25px 0 0 0; background: no-repeat url(../images/bg_col_one.jpg);}
#col_one h3, #col_one h4 { background:no-repeat url(../images/bg_h3.jpg); color:#FFFFFF; width: 255px; padding: 10px 10px 8px 10px; font: bold 12px Tahoma, Helvetica, sans-serif;  text-align:left;}
#col_one p { margin: 10px 35px 10px 20px; display:block;}
#col_one strong {}
#col_one em { font-weight: bold; color: #B73535; font-style:normal;}

#col_one form { text-align: left; margin: 0 0 10px 0; display:block; clear:both;}
#col_one select { width:180px; height: 20px; margin: 2px 5px 0 20px; float:left;}
#col_one input { float:left;}
#col_one span { color:#333; line-height: 18px; font-family:tahoma;}

#col_two .name { float:left; width: 175px;font: normal 11px Tahoma;margin: 0 0 0 0; padding: 0 0 0 0;color: #333; display:block; color:#666666; border-top: 1px solid #CCCCCC; border-right: 1px solid #CCCCCC;border-bottom: 1px solid #CCCCCC;padding: 5px; height: 100px;}

/* COL TWO  ---------------------------------------------------------------*/
#col_two { float:left; width: 750px; text-align:left;margin: 20px 0 0 20px;}
#col_two h1 {font: bold 12px tahoma; color: #333; margin: 5px;}
#col_two h2 {font: bold 12px tahoma; color: #B73535; margin: 5px 5px 15px 5px;border-bottom: 1px solid #E9E9E9 ;padding-bottom: 10px;}
#col_two h3 {font: bold 12px tahoma; color: #B73535; margin: 35px 5px 15px 5px; border-top: 1px solid #E9E9E9; padding-top: 10px;}
#col_two h4 {font: bold 12px tahoma; color: #B73535; margin: 35px 5px 15px 5px; border-top: 1px solid #E9E9E9; padding-top: 10px;}
#col_two p {font: normal 12px tahoma; color:#333; margin: 5px 5px 15px 5px; line-height: 24px; }
#col_two ul { margin: 5px 20px 15px 0px;  display:block;}
#col_two li {font: normal 12px tahoma; color:#333; margin: 2px 5px 2px 35px; line-height: 24px; }
#col_two a { color:#B73535;}


/* COL THREE  ---------------------------------------------------------------*/
#col_three { float:right; width: 220px; text-align:right; margin: 25px 0 0 0; background: repeat-y url(../images/bg_col_three.jpg) #333333;}
#col_three h3, #col_three h4 { background:no-repeat url(../images/bg_gg.jpg); color:#FFFFFF; display:block; padding: 10px 10px 8px 30px; font: bold 12px Tahoma, Helvetica, sans-serif;  text-align:left;}

#col_three ul { text-align:left;}
#col_three li { list-style-type:none; line-height:18px; margin-left: 5px;}
#col_three li a { color:#333333; text-decoration:none; font-weight:bold; border-bottom: 1px solid #F3F3F3;display:block; padding: 10px 5px 10px 15px; text-transform:uppercase; background: repeat-x url(../images/bg_3nav.jpg); }
#col_three li a:hover { color:#B73535; text-decoration:underline; }

/* FORM */
#log { border: 1px solid #E7EEF4; width: 450px; margin: 10px 10px 20px 0px; float:left;}
#log p { padding: 5px; display:block; clear:both; }
#log label { float:left;width: 120px; font: normal 12px Tahoma; color:#333; text-align:right; padding: 0 5px 0 0; line-height: 25px; }
#log input { float:left;border: 1px solid #E7EEF4; padding: 5px; line-height: 20px; width: 250px; font: normal 12px Tahoma, Helvetica, sans-serif; color:#333; background: repeat url(../images/input_bg.jpg);}
#log textarea { float:left;border: 1px solid #E7EEF4; height: 75px; line-height: 24px; width: 250px; font: normal 12px Tahoma, Helvetica, sans-serif;color:#333;background: repeat url(../images/input_bg.jpg); }
#log select, #log option {float:left;border: 1px solid #E7EEF4; line-height: 24px; width: 250px; font: normal 12px Tahoma, Helvetica, sans-serif; color:#333; }
#map { border: 1px solid #E7EEF4; width: 238px; margin: 10px 10px 20px 0px; float:left; padding:2px;}
#map_holder { width: 100%; overflow:hidden; height: 325px;}

/* ALT FORM */

#alt_log { border: 1px solid #E7EEF4; width: 725px; margin: 10px 10px 20px 0px; float:left;}
#alt_log p { padding: 5px; display:block; clear:both; }
#alt_log label { float:left;width: 120px; font: normal 12px Tahoma; color:#333; text-align:right; padding: 0 5px 0 0; line-height: 25px; }
#alt_log label.label_width { float:left;width: 70px; font: normal 12px Tahoma; color:#333; text-align:right; padding: 0 5px 0 5px; line-height: 25px; }
#alt_log input { float:left;border: 1px solid #E7EEF4; padding: 5px; line-height: 20px; width: 250px; font: normal 12px Tahoma, Helvetica, sans-serif; color:#333; background: repeat url(../images/input_bg.jpg);}
#alt_log input.input_title { float:left;border: 1px solid #E7EEF4; padding: 5px; line-height: 20px; width: 20px; font: normal 12px Tahoma, Helvetica, sans-serif; color:#333; background: repeat url(../images/input_bg.jpg);}
#alt_log input.input_forename { float:left;border: 1px solid #E7EEF4; padding: 5px; line-height: 20px; width: 100px; font: normal 12px Tahoma, Helvetica, sans-serif; color:#333; background: repeat url(../images/input_bg.jpg); margin-left:10px;}
#alt_log input.input_surname { float:left;border: 1px solid #E7EEF4; padding: 5px; line-height: 20px; width: 100px; font: normal 12px Tahoma, Helvetica, sans-serif; color:#333; background: repeat url(../images/input_bg.jpg); margin-left:10px;}
#alt_log textarea { float:left;border: 1px solid #E7EEF4; height: 75px; line-height: 24px; width: 250px; font: normal 12px Tahoma, Helvetica, sans-serif;color:#333;background: repeat url(../images/input_bg.jpg); }
#alt_log select, #log option {float:left;border: 1px solid #E7EEF4; line-height: 24px; width: 250px; font: normal 12px Tahoma, Helvetica, sans-serif; color:#333; }


.chart { float:left; margin: 10px; padding: 10px; width: 150px; border: 1px solid #EEEEEE; text-align:center;}
.chart h6 { font: normal 12px tahoma; color: #B73535; margin: 5px 5px 15px 5px;}

.contact { float:left; width: 240px; margin: 0 0 5px 5px; background-color:#F4F4F4;}
.contact p { font: normal 11px tahoma;}
.contact em { font-style:normal; color:#B73535; font-weight:bold;}

/* LOGIN TWO */
#login_2 { padding: 10px 0 20px 0; border: 1px solid #EAEAEA;}
#login_2 label { float:left; display:block; font: bold 14px Tahoma, Helvetica, sans-serif; color:#666666; width: 125px; text-align:right; padding: 3px;}
#login_2 .input_field { width: 350px; height: 18px; padding:8px; font-size: 12px; background: no-repeat url(../images/bg_input2.gif); width:366px; height:25px; border:none;}
#error { border: 1px solid #CCCCCC; background-color:#F4F4F4; padding: 5px; margin: 3px;}
#error p { margin: 0; padding:0; font: bold 11px Tahoma, Helvetica, sans-serif; color:#B73535;}



/* STORE PAGE */
#store {}
#store .store { float:left; width:200px; height:125px; border: 1px solid #ccc; padding:0; margin:6px;}
#store p.store_option { margin: 0; padding:0;}
#store .store_option a { background-color:#666; width: 95%; display:block;margin: 85px 0 0 0; padding: 5px; float:left;font: bold 11px Tahoma, Helvetica, sans-serif; color:#FFFFFF; text-decoration:none;}
#store .store_option a:hover { background-color:#B73535;}





/* NEWS    ---------------------------------------------------------------*/
.news { border-bottom: 1px solid #F0F0F0; padding: 10px 0 0 0;}
.newsimage { float:left; margin: 5px 20px 30px 5px; padding:1px; border:1px solid #ccc; }
p.newstext { }

/* FOOTER --------------------------------------------------------------*/
#footer {background: repeat url(../images/foot.gif) #FFFFFF; display:block; clear:both; width: 100%; height:150px; border-top: solid 1px #D7D7D7; text-align:left; }
#footer .left { float:left; padding: 10px; font: normal 10px Tahoma, Helvetica, sans-serif; color: #999;}
#footer .right { float:right; text-align:right;padding: 10px;font: normal 10px Tahoma, Helvetica, sans-serif; color: #999;}
#footer a {font: normal 10px Tahoma, Helvetica, sans-serif; color: #999; text-decoration:none;}
#footer a:hover {font: normal 10px Tahoma, Helvetica, sans-serif; color: #999; text-decoration:underline;}