/* ========== Basic main body layout ============ */
html { background: #ffffff; }
body { background: transparent url('/images/bg-top.jpg') repeat-x; }

/* ========== B2 custom styling ========== */
* { padding: 0; margin: 0; font-family: Verdana, Helvetica, sans-serif; font-size: 97%; }
img { border: none; margin: 0; padding: 0; }
a { color: #000; text-decoration: underline; margin: 0; padding: 0; }
a:hover { color: #000; text-decoration: underline; margin: 0; padding: 0; }
h1 { margin: 0; font-size: 110%; font-weight: bold; }
h2 { font-size: 110%; font-weight: bold; }
p { color: #777777; }
ul { margin: 0;	padding: 0; }
.right { float: right; }
.left { float: left; }
.center { text-align: center; }
table { color: #7B7B7B; text-decoration: none; margin: 0; padding: 0; }

/*======== wrapper =============*/
#wrapper { position: relative; padding: 20px 0 0 0; width: 1000px; margin: 0 auto; }
#main-page { width: 980px; margin: 0; padding: 0; border: 10px solid #cccccc; background: #fff; z-index: 0; }

a { text-decoration: underline; }
a:hover { text-decoration: none; color:#000099;}

#main ul { margin-left: 30px; font-size: 95%; }
#main ul li { padding: 3px; }

/* =========== footer details =============== */
#footer { clear: both; width: 980px; height: 200px; margin: 0; color: #777777; border-top: 10px solid #cccccc; z-index: 0; }
#footer ul { float: right; list-style: none; width: 980px; margin: 0 auto; }
#footer li { float: left; padding: 0 0 0 15px; margin: 0; }
#footer li a { color: #777777; text-decoration: none; }
#footer li a:hover { text-decoration: none; color:#000099;}
#footer p, #footer a, #footer a:hover { color: #222222; padding: 0; }
#footer a { color: #222222; font-weight: bold; } 
#footer a:hover { color: #000099; font-weight: bold; } 

div.featurebox { position: relative; width: 240px; border-right: 10px solid #cccccc; float: left; padding: 0; height: 200px; }
div.featurebox .title { font-weight: 800; }
div.end { width: 230px; float: left; }
div.end p { width: 100%; }

.arial { font-family: "Arial"; }
.solsgirthlogo { position: absolute; bottom: 0; right: 0; margin: 0 15px 0 0; padding: 0 0 15px 0; z-index: 1; }
#google { position: absolute; top: 0; left: 0; z-index: 1; }

/* ========= details within main-page =========== */
#head { width: 980px; margin: 0; padding: 0; }
#head h1 { font-size: 190%; padding: 20px 20px 0 0; margin: 0; float: right; color:#7B7B7B;	font-weight: 100; }

/* ======= home page ======= */
#home-middle { border-top: 10px solid #cccccc; text-align: center; width: 100%; margin: 0 0 0 0; }
#home-middle h1 { font-size: 26px; color:#7B7B7B; margin: 95px 0 50px 0; font-weight: 100; }
#home-middle h1 a{ font-size: 26px; color:#7B7B7B; font-weight: 100; text-decoration: none; }
#home-middle h1 a:hover{ font-size: 26px; color:#7B7B7B; font-weight: 100; text-decoration: underline; }

/*========= main content =============*/
#main { position:relative; clear: both; width: 980px; padding: 0; margin: 0; height: 390px; }

/*========= left content =============*/
#left-col { position: absolute; top: 0; left: 0; width: 565px; margin: 0; padding: 15px 0 0 25px; }

.back { position: absolute;	top: 0;	left: 0px; }
#left-col p { position: absolute; color: #FFFFFF; font-size: 0.7em;	z-index: 5; }
#left-col fieldset p { position: static; color: #000; font-size: 1em; }

#open p {	top: 155px; left: 5px; z-index: 50; }
#plot1 p {	top: 122px; left: 115px; z-index: 50; }
#plot17 p { top: 135px; left: 200px; z-index: 50; }
#plot18 p { top: 150px; left: 290px; z-index: 50; }
#plot19 p { top: 120px; left: 355px; z-index: 50; }
#plot20 p { top: 94px; left: 415px; z-index: 50; }
#plot21 p { top: 130px; left: 475px; z-index: 50; }
#plot22 p { top: 185px; left: 410px; z-index: 50; }
#plot23 p { top: 245px; left: 320px; z-index: 10; }
#plot24 p { top: 205px; left: 230px; z-index: 15; }
#plot25 p { top: 180px; left: 125px; z-index: 25; }

#dev2 p {	top: 220px; left: 45px; }
#dev3 p { top: 185px; left: 110px; }
#dev4 p { top: 150px; left: 155px; }
#dev5 p { top: 118px; left: 205px; }
#dev6 p { top: 95px; left: 230px; }
#dev7 p { top: 75px; left: 270px; }
#dev8 p { top: 60px; left: 300px; }
#dev9 p { top: 35px; left: 350px; }
#dev10 p { top: 42px; left: 435px; }
#dev11 p { top: 105px; left: 485px; }
#dev12 p { top: 130px; left: 470px; }
#dev13 p { top: 160px; left: 454px; }
#dev14 p { top: 195px; left: 430px; }
#dev15 p { top: 235px; left: 410px; }
#dev16 p { top: 260px; left: 330px; }

/*========= right content =============*/
#right-col { width: 360px; margin: 0 0 0 600px; padding: 15px 0 10px 0; }
#right-col ul { color: #2A629E; }
#right-col h1 { margin-bottom: 10px; color: #7B7B7B; font-size: 12px;  }
#right-col p { margin: 5px 0; line-height: 1.4em; font-size: 11px; }
#right-col p span { color: #7B7B7B; }

.justify { text-align: justify; padding: 0 10px 0 0; }

#designs ul { width: 360px;	}
#designs li { width: auto; color: #000; list-style: none; float: left; padding: 0x; margin: 15px 0 0 15px; text-decoration: underline; }
#designs ul a { color: #000; text-decoration: underline; }

/* ======== Main menu ======== */
#main-menu { float: left; margin: 15px 0 5px 0; padding: 0; }

/* === db form general === */
form { clear: both; width: 100%; }
form span { width: 63%; float: right; text-align: left; }
form fieldset { border: none; }
form legend { padding-bottom: 10px; color: #7B7B7B; font-size: 100%; font-weight: bold; }
form input, form textarea, form select { border: 1px solid #999; width: 75%; padding: 2px; }
form input.button { background-color: #7b7b7b; color: #fff; border: 1px solid #333; padding: 2px; width: 150px; }
#left-col form fieldset p { margin-left: 7px; }

.row { width: 500px; font-size: 0.9em; margin: 5px 0 0 30px; float: left; line-height: 12px; }
.col1 { width: 35%; float: left; text-align: left; color: #000; padding: 0 5px 0 0; }
.col2 { width: 63%; float: right; text-align: left; }
label.check { width: 500px; float: left; text-align: left; color: #000; padding: 0 5px 5px 0; }

.required .label { color: #f00; }
.required input, .required textarea { border: 1px solid #f00; }
.required select { color: #000; }
.checkbtn {  padding: 0 0 0 50px; }
.indent { padding: 0 0 0 125px; }
legend { font-size: 0.9em; }

/* ============== callback form ====================== */
#callback form { clear: both; width: 230px; margin: 25px 0 0 5px; }
#callback .row { width: 215px; clear: both; font-size: 0.9em; margin: 5px 0 0 0px; padding: 0 0 0 4px; float: left; line-height: 20px; }
#callback .col1 { width: 30%; float: left; text-align: left; color: #000; padding: 0 2px 0 0; }
#callback .col2 { width: 68%; float: right; text-align: left; }
#callback input, #callback textarea, #callback select { width: 90%; }
#callback .button { width: 110px; margin; 10px 0 0 0; }
#callback legend { font-size: 0.9em; margin: 5px 0 0 0; }
#callback fieldset { border: none; margin-top: 10px; }
#callback input {  background:url('/images/input.gif') repeat-x; color: #000; }

/* =============== enquiry form ====================== */
#enquiry fieldset { border: hidden; }
#enquiry textarea { height: 50px; }

/* =============== download form ====================== */
#download { margin-top: 10px;}
#download .row { width: 220px; line-height: 18px; margin-left: 10px; }
#download .col1 { width: 30px; }
#download .col2 { width: 170px; }
form#download .col2 input { width: 150px; }
#download .col2 input.button { width: 100px; }
#download legend { display: none; color: #222; }

/* =============== tooltip ================ */

#tooltip a { text-decoration: none; color: #ffffff; z-index: 5; }
#tooltip a:hover { position: relative; cursor: help; color: #222222;  }
#tooltip a span { display: none; width: 65px; z-index: 100; }
#tooltip a:hover span { display: block; position: absolute; top: 15px; left: 30px; padding: 5px; margin: 10px; z-index: 100; background: #f0f0f0; border: 1px dotted #c0c0c0; }
#tooltip.dark a { color: #666; margin: 0 0 4px 0; }

td { padding: 4px 0; }

#tooltip2 p { padding: 2px 0; border: 1px solid #444; }
#tooltip2 a { padding: 2px; background-color: #eee; text-decoration: none; color: #444; z-index: 5; }
#tooltip2 a:hover { position: relative; cursor: help; color: #444; z-index: 100; }
#tooltip2 span { display: none; width: 200px;}
#tooltip2 a:hover span { display: block; position: absolute; top: 15px; left: 30px; padding: 5px; margin: 10px; z-index: 100; background: #f0f0f0; border: 1px dotted #c0c0c0; font-size: 11px; color: #444444; } 
#tooltip2.dark a { color: #666; margin: 0 0 4px 0; }

/* ==================================== */

#popuplist li { list-style: none; float: left; padding: 0px 30px 0px 10px; margin: 0px 0 0 20px; }
#popuplist img { border: 1px solid #ffffff; }
#popuplist img a:hover { border: 1px solid #ff0000; }

/*
#footer p.panel-header { margin: 0; margin-bottom: 5px; padding: 5px 2px 3px 2px; color: #222; font-weight: normal; background: url(../images/light-hd-full-build.gif) 0px; }
#footer p.panel-header a { text-decoration: none; }
div.end { padding-top: 0px; }
*/

.gmnoprint span { width: 100px; height: 40px; white-space: normal; clear: both; position: absolute; bottom: 0; right: 0;}
.gmnoprint span a { width: 50px; height: 10px; white-space: normal; float: left; clear: both;}

#popuplist li.padding1 { list-style: none; float: left; padding: 0px 0px 10px 0px; margin: 0px 0 0 -30px; }
#popuplist li.padding2 { list-style: none; float: left; padding: 0px 0px 10px 0px; margin: 0px 0 0 40px; }
