/**
* File: screen.css
* This file contain CSS styles for screen mode view.
**/
html, body { height:100%;}
body { background:#003267; color:#000; font:normal 11px/140% "Trebuchet MS", Helvetica, sans-serif;}
form, body, iframe { margin:0; padding:0;}
img, table, iframe { border:0;}
p { margin:0; margin-bottom:15px;}
.clear { clear:both; font-size:0; line-height:0;}
li.clear { float:none !important; width:0 !important; height:0 !important; margin:0 !important; padding:0 !important; border:0 !important; list-style:none;}
a { color:#000; text-decoration:underline;}
a:hover { text-decoration:none;}
h1 { margin:0; padding:0;}
h2 { margin:0 0 0.3em; padding:0; color:#003267; font:bold 16px/24px "Trebuchet MS", Helvetica, sans-serif; background:url(../images/dots.png) repeat-x bottom;}
h3 { margin:0 0 0.6em; padding:0; color:#000; font:bold 15px/14px "Trebuchet MS", Helvetica, sans-serif;}
h4 { margin:0 0 0.1em; padding:0; color:#000; font:bold 11px/140% "Trebuchet MS", Helvetica, sans-serif;}
.sub-title { margin-top:-3px; margin-bottom:20px;}
ul { margin:0 0 10px 15px; padding:0; list-style:disc;}
ul li { margin:0; padding:0;}
.img-left { float:left; margin-right:15px;}
.img-right { float:right; margin-left:15px;}
.left { float:left;}
.right { float:right;}
/*--------------- Stucture classes
**/
.page { width:780px; margin:0 auto; padding:0 3px 25px; background:#fff url(../images/bg-page.png) repeat-y;}
.header { position:relative; height:280px; background:url(../images/header.jpg) no-repeat;}
.logo { position:absolute; left:25px; top:0; width:171px; height:252px; background:url(../images/bg-logo.jpg) no-repeat top;}
.logo h1 { padding:109px 0 0; color:#003267; font:normal 10px/12px "Trebuchet MS", Helvetica, sans-serif; text-align:center;}
.logo h1 a { display:block; width:102px; height:102px; margin:0 auto; background:url(../images/logo.png) no-repeat left top; overflow:hidden; text-indent:-9999px;}
.header .phone { position:absolute; right:20px; top:20px; width:367px; background:url(../images/bg-phones.png) repeat-x left top;}
.header .phone { padding-left:10px; color:#fff; font-size:12px; line-height:26px;}
.header .phone a { color:#fff; text-decoration:none;}
.header .phone a:hover { text-decoration:underline;}
* html .header .phone { background:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/bg-phones.png",sizingMethod="scale");}
.mmenu { position:absolute; left:305px; top:200px; margin:0; padding:0; list-style:none;}
.mmenu li { float:left; margin:0 17px 0 0;}
.mmenu li a { display:block; height:22px; overflow:hidden; text-indent:-999px;}
.mmenu li a:hover, .mmenu li.act a { height:37px;}
.mmenu01 { width:81px; background:url(../images/mmenu-home.png) no-repeat left top;}
.mmenu02 { width:206px; background:url(../images/mmenu-leverings.png) no-repeat left top;}
.mmenu03 { width:81px; background:url(../images/mmenu-contact.png) no-repeat left top;}
.center { padding:0 70px 0 28px;}
.left-side { float:left; width:165px; }
.left-side .text { padding:0 6px 0 11px;}
.right-side { float:right; width:477px; overflow:hidden; position: relative; }
#layout_footer { width:786px; margin:0 auto; padding:20px 0; background:url(../images/bg-page-bottom.png) no-repeat left top;}
#layout_footer { color:#8099b3; font:normal 11px/13px "Trebuchet MS", Helvetica, sans-serif; text-align:center;}
#layout_footer a { color:#8099b3; text-decoration:none;}
#layout_footer a:hover { color:#fff;}
/*--------------- Items list
**/
.items { width:110%; margin:0 0 16px; padding:10px 0 4px; list-style:none; background:url(../images/dots.png) repeat-x bottom;}
.items li { float:left; margin:0 13px 13px 0; border:1px solid #000; width: 148px;}
.items h3 { margin:0; padding:0 0 0 10px; color:#000; font:normal 13px/26px "Trebuchet MS", Helvetica, sans-serif; background:url(../images/bg-item-title.png) no-repeat right top;}
.items img { display:block;}
/*--------------- List of buttons
**/
.buttons { width:110%; margin:0; padding:0 0 15px; list-style:none; background:url(../images/dots.png) repeat-x bottom;}
.buttons li { float:left; width:150px; margin:0 13px 5px 0;}
.buttons li a { display:block; width:150px; height:30px; background:url(../images/button.png) no-repeat left top;}
.buttons li a { color:#fff; font:normal 13px/30px "Trebuchet MS", Helvetica, sans-serif; text-indent:10px; text-decoration:none;}
/*--------------- Qick contact info on Index page
**/
.quick-contacts { clear:both; padding:20px 0 0; color:#003267; font-size:12px;}
.quick-contacts a { color:#003267; text-decoration:none;}
.quick-contacts a:hover { text-decoration:underline;}
.buy-now { display:block; width:148px; height:53px; padding:11px 0 0 17px; background:url(../images/buy-now.png) no-repeat left top;}
.buy-now { color:#fff; font:normal 14px/14px Tahoma, Arial, Helvetica, sans-serif; text-decoration:none;}
.buy-now big { font:bold 20px/24px Tahoma, Arial, Helvetica, sans-serif; display:block;}
.pictures { width:110%; margin:0; padding:8px 0 0; list-style:none;}
.pictures li { float:left; margin:0 9px 9px 0;}
.pictures img { display:block; border:1px solid #003267; width:76px; height:76px;}
form { background:url(../images/dots.png) repeat-x bottom; }
form .controls { margin:3em 0; padding:8px 2px; background:url(../images/dots.png) repeat-x top; overflow:hidden }
.price { margin:3em 0; background:url(../images/dots.png) repeat-x top;}
.price-content { padding:8px 2px; background:url(../images/dots.png) repeat-x bottom; overflow:hidden;}
* html .price-content { zoom:1;}
* html .table_title { zoom:1;}
* html .table { zoom:1;}
.controls .button { 
float:right; width:169px; height:28px; margin:2px 0 0; background:url(../images/goto-buy.png) no-repeat left top; border:0; cursor:pointer;
color:#fff; font:bold 12px/28px Tahoma, Arial, Helvetica, sans-serif; text-align:center; text-decoration:none;
}
.table_title { background:#003267; border:1px solid #001f42; margin:0 0 8px; padding:0 6px; overflow:hidden;}
.table_title { color:#fff; font-weight:bold; line-height:23px;}
.table { border:1px solid #7f7f7f; overflow:hidden; margin:0 0 8px; position:relative; line-height:24px;}
.table .left { width:340px; padding:0 0 0 6px; background:url(../images/vdots.png) repeat-y right; }
.table .right { padding:0 6px 0 0;}
.table .th { padding:0 6px; border-bottom:1px solid #000; font-weight:bold;}
.sub-total { position:absolute; right:6px; }
#shipcost1 { bottom: 2em; _bottom: 1.8em; }
#shipcost2 { bottom: 0em; }
.table.shipping { background:#e5e5e5; border-color:#000;}
.table.shipping input { margin:0 10px; padding:0;}
.table.total { background:#ccc;}
.table.total .left { font-weight:bold;}
form { padding:5px 0 0;}
form .field { overflow: hidden; }
form fieldset { margin:3px 0; padding:0; border:0;}
form input { float:left; border:1px solid #000; width:215px;}
form textarea { float:left; border:1px solid #000; width:350px; height:60px;}
body form .field label { width:110px; line-height:20px;}
body form .field .input_wrapper { }
.goto-buy { float:right; width:169px; height:28px; margin:2px 0 0; background:url(../images/goto-buy.png) no-repeat left top; border:0; cursor:pointer;}
.goto-buy { color:#fff; font:bold 12px/28px Tahoma, Arial, Helvetica, sans-serif; text-align:center; text-decoration:none;}
#karibuani { 
position: absolute;
top: 47px;
right: 19px;
}
* { 
_zoom: 1;
min-height: 0;
}
body, textarea, input { 
font-family: sans-serif;
}
table, td, th, textarea, input, button, select { 
font-size: 100%;
}
form { 
margin: 0;
}
textarea {
height: 10em;
width: 20em;
}
a img { 
border: none;
}
#layout-user-info {
font-size: smaller;
text-align: right;
position: absolute;
right: 0;
top: 0;
padding: 0.25em;
}
#layout-user-info .username {
font-weight: bold;
}
.errorpopup { 
visibility: hidden; 
position: absolute; 
left: 0; 
top: 0;
border: solid red 1px; 
width: 300px; 
background: #fee; 
padding: 3px; 
font-size: 0.8em; 
text-align: center;
z-index: 99;
cursor: pointer;
}
.errorpopup .comment { 
margin: 2px;
font-size: 9px;
}
.confirmation .options { 
margin: 1em;
}
#autocomplete-popup { 
position: absolute;
background: white; 
padding: 3px;
border: solid black 1px;
height: 10em;
overflow: auto;
}
.autocomplete-popup-item { 
cursor: pointer;
}
.autocomplete-popup-item:hover { 
background: yellow;
}
.drag_handle { 
cursor: move;
}
.decor { 
font-size: 1px;
line-height: 1px;
}

.shadow_element { 
position: absolute;
}
.shadow { 
}
.shadow .top_left { 
}
.shadow .top { 
}
.shadow .top_right { 
}
.shadow .left { 
}
.shadow .right { 
}
.shadow .bottom_left { 
}
.shadow .bottom { 
}
.shadow .bottom_right { 
}

#rapid-php-calendar-popup-window { 
position: absolute;
padding: 0;
margin: 0;
left: 0;
top: 0;
font-size: smaller;
width: 14em;
background: #eee;
}
#rapid-php-calendar-popup-window table { 
width: 100%;
}
#rapid-php-calendar-popup-window table td { 
text-align: right;
cursor: pointer;
}
#rapid-php-calendar-popup-window table td.current { 
background-color: yellow;
}
#rapid-php-calendar-popup-window .nav { 
cursor: pointer;
font-weight: bold;
}
#rapid-php-calendar-popup-window .controls { 
position: relative;
top: 0px;
left: 0px;
padding: 0;
margin: 0;
height: 1em;
}
#rapid-php-calendar-popup-window .month { 
text-align: center;
}
#rapid-php-calendar-popup-window .nav-left { 
position: absolute;
top: 0px;
left: 0px;
}
#rapid-php-calendar-popup-window .nav-right { 
position: absolute;
top: 0;
right: 0;
}
#rapid-php-calendar-popup-window .header { 
text-align: right;
}
#rapid-php-calendar-popup-window .header img { 
cursor: pointer;
}
input.help,
.overlay_help { 
color: #777;
}

div.fileinputs {
position: relative;
}
div.fakefile {
position: absolute;
top: 0px;
left: 0px;
z-index: 1;
}
input.file {
position: relative;
text-align: right;
moz-opacity: 0;
filter: alpha(opacity=0);
opacity: 0;
z-index: 2;
}

#system_gui_popup_overlay { 
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 1024px;
z-index: 51;
background: #f0f0f0;
opacity: 0.5;
filter: alpha(opacity=50);
}
.system_gui_popup { 
position: absolute;
top: 100px;
left: 100px;
z-index: 60;
}

.input_date select.date_year { 
width: 5em;
}
.input_date select.date_month { 
width: 8em;
}
.input_date select.date_day { 
width: 4em;
}
.input_date select.date_hour { 
width: 3.5em;
}
.input_date select.date_minute { 
width: 3.5em;
}
.input_date select.date_second { 
width: 3.5em;
}
.input_date img { 
vertical-align: bottom;
cursor: pointer;
}
option.default { 
border-bottom: dotted 1px black;
}
.rp_popup_edit { 
position: absolute;
top: 50%;
left: 50%;
margin-left: -15em;
margin-top: -5em;
width: 30em;
height: 10em;
}