/* palette

#777 mid-grey
#C4000F dark-red
#0D4AA3 link blue

*/

/* INIT
------------------------------------------------*/
body { font: 80% Verdana, arial, sans-serif; text-align: center; margin: 0; padding: 0; border: 0; background: #fff; }
p,h1,h2,h3,div,form,input,select { border: 0; margin: 0; padding: 0; }
.clear { clear: both; width: auto; height: 1px; overflow: hidden; }
img { border: 0 }

a:link { color: #0D4AA3; background-color: transparent; }
a:visited { color: #0D4AA3; background-color: transparent; }
a:hover, a:active { color: #C4000F; background-color: transparent; }

/* HEADER
------------------------------------------------*/
#head { width: 740px; position: relative; text-align: left; margin: 0 auto; background: url(../images/header.gif); width: 740px; height: 52px; }
#head a { position: absolute; display: block; left: 640px; top: 0; width: 120px; height: 52px; }

/* NAV
------------------------------------------------*/
#nav { width: 100%; background: #C4000F; }
#nav { text-transform: uppercase; display: block; clear: both; float: left;  }
#nav ul { list-style: none; padding: 0; margin: 0; width: 740px; margin: 0 auto; }
#nav li { background-color: #C4000F; display: inline; margin: 0; padding: 0; border: 0; }
#nav a { float: left; padding: .75em 2em .75em 0; text-decoration: none; font-weight: normal; letter-spacing: 0.08em }
#nav a:link, #nav a:visited { color: #fff; background-color: #C4000F; }
#nav a:hover, #nav a:active { color: #fff; background-color: #C4000F; }

/* BREADCRUMB
------------------------------------------------*/
#breadcrumb { padding: 5px 0 7px; background: #fff; color: #000; margin-bottom: 12px; font-size: 90%; border-bottom: 1px solid #C4000F }
#breadcrumb ul { list-style: none; margin: 0; padding: 0; line-height: 1.4; display: inline; }
#breadcrumb li { display: inline; }
#breadcrumb a:link, #breadcrumb a:visited { color: #0D4AA3; background: transparent; text-decoration: underline; }
#breadcrumb a:hover, #breadcrumb a:active { color: #C4000F; background: transparent; text-decoration: none; }
#breadcrumb strong { color: #333; }
#breadcrumb p { display: inline; }

/* CONTENT
------------------------------------------------*/
#container { clear: both; margin: 0 auto; width: 740px; text-align: left; color: #333; }
#content { line-height: 150%; }
#content p { margin-bottom: 1em; }
#content h1 { color: #000; background: #fff; font-size: 150%; line-height: 1; margin: 1em 0 1em; }
#content h2 { clear: both; color: #fff; background: #C4000F; font-size: 100%; padding: 8px; line-height: 1; margin: 2em 0 1em; }
#content h3 { margin: 1.5em 0 0.5em; }

#col1 {	float: left; }
#nav ul { list-style: none; padding: 0; margin: 0; width: 740px; margin: 0 auto; }
#nav li { background-color: #C4000F; display: inline; margin: 0; padding: 0; border: 0; }
#nav a { float: left; padding: .75em 2em .75em 0; text-decoration: none; font-weight: normal; letter-spacing: 0.08em }
#nav a:link, #nav a:visited { color: #fff; background-color: #C4000F; }
#nav a:hover, #nav a:active { color: #fff; background-color: #C4000F; }

.justify { text-align: justify; };

/* BREADCRUMB
------------------------------------------------*/
#breadcrumb { padding: 5px 0 7px; background: #fff; color: #000; margin-bottom: 12px; font-size: 90%; border-bottom: 1px solid #C4000F }
#breadcrumb ul { list-style: none; margin: 0; padding: 0; line-height: 1.4; display: inline; }
#breadcrumb li { display: inline; }
#breadcrumb a:link, #breadcrumb a:visited { color: #0D4AA3; background: transparent; text-decoration: underline; }
#breadcrumb a:hover, #breadcrumb a:active { color: #C4000F; background: transparent; text-decoration: none; }
#breadcrumb strong { color: #333; }
#breadcrumb p { display: inline; }

/* CONTENT
------------------------------------------------*/
#container { clear: both; margin: 0 auto; width: 740px; text-align: left; color: #333; }
#content { line-height: 150%; }
#content p { margin-bottom: 1em; }
#content  h1 { color: #000; background: #fff; font-size: 150%; line-height: 1; margin: 1em 0 1em; }
#content  h2 { clear: both; color: #fff; background: #C4000F; font-size: 100%; padding: 8px; line-height: 1; margin: 2em 0 1em; }
#col1 {	width: 480px; float: left; }

#content p img { margin: 10px; }


/* PRODUCT CHOOSER
------------------------------------------------*/
#prod-chooser { width: 240px; float: right; }
#main-pic { background-image: url(../images/prod_pid.jpg); width: 238px; height: 268px; margin-bottom: 2px; }
#prod-thumbs ul { margin: 0; padding: 0; list-style: none; }
#prod-thumbs li { position: relative; overflow: hidden; display: block; width: 46px; height: 46px; margin: 0 2px 2px 0; padding: 0; float: left; background-position: left top; }
#prod-thumbs .last { margin-right: 0; }
.little-box { overflow: hidden; background-color: #777; width: 46px; height: 46px; margin: 0 0 2px 2px; float: left; }

#prod-thumbs a { display: block; position: absolute; overflow: hidden; width: 46px; height: 46px; text-indent: -1000em; background-repeat: no-repeat; }
#prod-thumbs a:link, #prod-thumbs a:visited { background-position: left top; }
#prod-thumbs a:hover, #prod-thumbs a:active { background-position: right top; }

#li-prod-1, #prod-1 { background-image: url(../images/prod_pid_thumb.jpg); }
#li-prod-2, #prod-2 { background-image: url(../images/prod_site_mon_unit_thumb.jpg); }
#li-prod-3, #prod-3 { background-image: url(../images/prod_gsm_site_mon_unit_thumb.jpg); }
#li-prod-4, #prod-4 { background-image: url(../images/prod_field_management_unit_thumb.jpg); }
#li-prod-5, #prod-5 { background-image: url(../images/prod_mon_officer_trans_thumb.jpg); }
#li-prod-6, #prod-6 { background-image: url(../images/prod_gps_phone_thumb.jpg); }
#li-prod-6, #prod-7 { background-image: url(../images/prod_fau_thumb.jpg); }
#li-prod-6, #prod-8 { background-image: url(../images/prod_gem2_thumb.jpg); }
#li-prod-6, #prod-9 { background-image: url(../images/prod_vv_thumb.jpg); }
#li-prod-6, #prod-10 { background-image: url(../images/prod_tracking_thumb.jpg); }

/*PRODUCT LIST
-----------------------------------------------*/
#plist { float: right; width: 210px; border-left: 1px solid #C4000F; margin-left: 20px; }
#plist ul { position: relative; float: left; margin: 0 0 0 10px; padding: 0; list-style: none; display: inline; }
#plist li { position: relative; display: block; width: 200px; height: 46px; float: left; margin: 0; }
#plist a { display: block; width: 200px; overflow: hidden; height: 46px; text-indent: -1000em; background-repeat: no-repeat; }
#plist a:link, #plist a:visited { background-position: left top; }
#plist a:hover, #plist a:active { background-position: right top; }


#plist #prod-1 { background-image: url(../images/plist-pid.jpg); }
#plist #prod-2 { background-image: url(../images/plist-smu.jpg); }
#plist #prod-3 { background-image: url(../images/plist-gsm-smu.jpg); }
#plist #prod-4 { background-image: url(../images/plist-fmu.jpg); }
#plist #prod-5 { background-image: url(../images/plist-mot.jpg); }
#plist #prod-6 { background-image: url(../images/plist-gps-phone.jpg); }
#plist #prod-7 { background-image: url(../images/plist-fau.jpg); }
#plist #prod-8 { background-image: url(../images/plist-gem2.jpg); }
#plist #prod-9 { background-image: url(../images/plist-voice.jpg); }
#plist #prod-10 { background-image: url(../images/plist-its.jpg); }

/* NEWS
------------------------------------------------*/
#news-excerpt h3 { font-size: 100%; }
#news-excerpt img { float: right; }

/* FOOTER
------------------------------------------------*/
#footer { width: 740px; border-top: 1px solid black; margin-top: 10px; padding-top: 10px; }
#footer span { font-weight: bold; color: #777; background-color: inherit; }
img.footer-icon { float: right; margin: 2px 0 0 10px; }


/* LANGUAGE SELECTOR
------------------------------------------------*/
#lang-select { margin: 5px 0 0; padding: 0; float: left; }
#lang-select ul { list-style: none; margin: 0; padding: 0; }
#lang-select li { padding: 0; margin: 0; border: 0; float: left; }
#lang-select a { width: 20px; height: 15px; border: 0; padding: 0; margin-right: 10px; display: block; background-position: left; }
#lang-select #fr { background-image: url('../images/flags/fr_small.gif'); }
#lang-select #en { background-image: url('../images/flags/en_small.gif'); }
#lang-select #es { background-image: url('../images/flags/es_small.gif'); }
#lang-select #de { background-image: url('../images/flags/de_small.gif'); }
#lang-select #it { background-image: url('../images/flags/it_small.gif'); }
#lang-select #nl { background-image: url('../images/flags/nl_small.gif'); }
