body {
	margin: 0px 0 20px 0; padding: 0;
	font-size: 100% ;
	font-family: 'Noto Sans', sans-serif;
	color: #333;
	line-height: 140%;
	background: #fff url(../images/body_bg2.jpg) repeat-x  ;
}

html, body {
	height: 100%;
}

.container {
	width: 1000px;
	margin: 0 auto;
	position: relative;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	
	
}
#header {
	
	height: 90px;
	font-size:10px;
}

#mainContent {
	margin: 0px;
	padding: 0px 5px 20px 10px;
    background: #fff;
	height:auto;
  	
}

#mainContent h1 { 
	font-size: 135%; 
	color: #555; 
	padding:15px 0px 10px 0px;
	margin:0px 0 10px 0;
	line-height: 140%;
	border-bottom: 0px dotted #83bf2f;


}


#mainContent h2 { font-size: 110%; color: #777; font-weight:bold; padding-top: 10px; padding-bottom: 0px;  }

#mainContent h3 { font-size: 90%; color: #666; padding-top: 10px; }

#mainContent p { 
	font-size: 80%;
	color: #333;
	line-height:140%;
	padding: 0px 0 0px 0;
}

#mainContent #leftSide {
	width:680px;
	float:right;
	padding-right:25px;
}

#mainContent #rightSide { 
	padding-right:0px; 
	margin-right: 0px; 
	padding-left: 25px;
	float: right;
	width: 255px;
	 }

#mainContent #rightSide h2 { text-align: right; }
#mainContent #rightSide ul { text-align:right; }
#mainContent #rightSide ul li { list-style-type:none; }

#mainContent #leftSide #services h2 { 
	padding-top: 0px; 
	margin-top:0px; 
	color:#666; 
	font-size:90%; }

#mainContent ol  { }

#mainContent ul {
	margin-left: 10px;
	padding-top:0px;
	padding-bottom: 20px;
	font-size:80%;
	color: #333;
}

#mainContent a { color: #333; text-decoration:underline; }
#mainContent a:hover { color: #83bf2f; }

/* front page display */
#mainContent .display td { width:220px; height:320px; margin:10px 10px 10px 0; padding:10px 10px 10px 0; vertical-align:top;  }
#mainContent .display h2 { color: #333; font-size:13px; text-transform:capitalise; text-indent:5px; padding-top:15px; }
#mainContent .display p { padding: 160px 5px 5px 5px; font-size:11px; }

.box{border-radius:12px; width: 180px; background-color:#ebebeb;margin:10px 20px 0px 0px;padding:0px 15px 15px 15px; float:left;  box-shadow: 5px 5px 5px #888888; }
.box p{margin:0px; }
.box h2 { padding-top:0px; padding-bottom:0px; margin-top:0px; }
.box ul { padding-left:10px; margin-left:10px; }

.box2{border-radius:12px;  background-color:#ebebeb;margin:10px 20px 0px 0px;padding:0px 15px 5px 15px; float:left;  box-shadow: 5px 5px 5px #888888;}
.box2 p{margin:0px;}
.box2 h2 { padding-top:0px; padding-bottom:0px; margin-top:0px; }
.box2 ul { margin-left:10px; padding-left:10px;
}
.box3{border-radius:12px; border:1px solid #e3e3e3; width: 290px; background-color:#ededed;margin:10px 20px 0px 0px;padding:0px 10px 10px 10px; float:left; box-shadow: 5px 5px 5px #888888; }
.box3 p{margin:0px;}
.box3 h2 { padding-top:5px; padding-left:5px; padding-bottom:0px; margin-top:0px; }
.box3 img { text-align:center; }

#mainContent .display2 td { width:220px; height:220px; margin:0px 10px 10px 0; padding:0px 10px 10px 0; vertical-align:top;  }
#mainContent .display2 h2 {  font-size:13px; text-transform:capitalise; text-indent:0px; padding-top:15px; }
#mainContent .display2 p { padding: 0px 10px 5px 0px;  }

#mainContent .structured-cabling { background: url(../images/bg_structuredcabling2.gif) no-repeat; width:261px; height:155px; padding:85px 0px 5px 10px; box-shadow: 5px 5px 5px #888888; border-left: 1px solid #e5e5e5; border-radius:5px; margin-bottom:40px; }
#mainContent .structured-cabling p { padding-right:10px; }
#mainContent .structured-cabling h3 { color: #333; font-size: 80%; }

#mainContent  .video-distribution  { background: url(../images/bg_videodistribution2.gif) no-repeat; width:261px; height:155px; padding:85px 0px 5px 10px; box-shadow: 5px 5px 5px #888888; border-left: 1px solid #e5e5e5; border-radius:5px;}
#mainContent  .video-distribution p { padding-right:10px; }
#mainContent .video-distribution h3 { color: #333; font-size: 80%;}

#mainContent .audio-distribution { background:url(../images/bg_audiodistribution2.gif) no-repeat;  width:261px; height:155px; padding:85px 0px 5px 10px; box-shadow: 5px 5px 5px #888888; border-left: 1px solid #e5e5e5; border-radius:5px; }
#mainContent .audio-distribution p { padding-right:10px; }
#mainContent .audio-distribution h3 { color: #333; font-size: 80%;}

#mainContent  .phone-intercom { background:url(../images/bg_phone-intercom.gif) no-repeat;  width:261px; height:155px; padding:85px 0px 5px 10px; box-shadow: 5px 5px 5px #888888; border-left: 1px solid #e5e5e5; border-radius:5px;}
#mainContent .phone-intercom p { padding-right:10px;  }
#mainContent .phone-intercom h3 { color: #333; font-size: 80%;}

#mainContent  .home-theatre { background:url(../images/bg_hometheatre2.gif) no-repeat; width:261px; height:155px; padding:85px 0px 5px 10px; box-shadow: 5px 5px 5px #888888; border-left: 1px solid #e5e5e5; border-radius:5px; }
#mainContent .home-theatre p { padding-right:10px; }
#mainContent .home-theatre h3 { color: #333; font-size: 80%;}

#mainContent  .security { background:url(../images/bg_security.gif) no-repeat; width:261px; height:155px; padding:85px 0px 5px 10px; box-shadow: 5px 5px 5px #888888; border-left: 1px solid #e5e5e5; border-radius:5px;}
#mainContent .security p { padding-right:10px;  }
#mainContent .security h3 { color: #333; font-size: 80%;}

table { margin: 0px; padding:0; }
table ul { margin-left: 5px; padding-left: 5px; }


table td { vertical-align:top;   }

.projection { width: 100%; }
.projection td { padding: 10px; }

.touchpanel { width:90%;  }
.touchpanel td { padding-top:0px; }

h2.highlight { width: 100%; padding:20px; background:#006699; color:#fff; font-size:120%; text-align:center; margin: 10px;}

.videoDistribution { width:100%; margin-top:20px; }


.broadcast { width:100%;  }
.broadcast td { padding:10px;}

.broadcast-iphone {float:right; margin-top:20px; }

#mainContent .displayBrochure td {margin:0px 10px 10px 0; padding:0px 10px 10px 0; vertical-align:top;  }

#mainContent .brochure { border:1px solid #ccc; padding:3px; background-color:#ccc; }

/* commonContent */

.commonContent {   font-size: 80%; }
.commonContent_wrapper {
	margin:0 auto;
	width:1000px;
	padding:16px 20px;
	color:#333;
	background:#fff ;
}

/* brands */

#brands { background: #fff; padding:0px;  border-top: 1px dotted #dadcdb; border-bottom: 1px dotted #dadcdb;  text-align:center;  }

#brands img { padding:5px 15px 10px 0;  }

.streambox { width:640px; background: #000; height:340px; text-align: center; padding:40px 20px 20px 20px;}

/* footer styles */

#footer {
	padding: 20px 10px 30px 20px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	
	line-height:150%;
	background: #5b841f;
}
#footer h3 { font-size:80%; padding-bottom:0; }
#footer h3 a { text-decoration:none; }

#footer p { font-size: 80%; color: #fff; text-align:center; }
#footer a { color: #fff;; text-decoration:underline; }
#footer a:hover { color: #333; }

#footer ul {
	margin-left: 0px;
	padding-top:0px;
	padding-bottom: 20px;
	font-size:80%;
	color: #333;
	list-style-type:none;

}

#footer ul a { text-decoration: none; }


.right {
	float:right;
	padding: 5px 10px 10px 20px;
	}

img.right {
	float:right;
	margin: 10px 20px 20px 30px;
	padding: 0px;
	box-shadow: 10px 10px 5px #888888;
	}
	
img.rightNoShadow { 
	float:right;
	margin: 10px 20px 20px 30px;
	padding: 0px;
	}	
	
img.rightNoShadow2 { 
	float:right;
	margin: 10px 0px 20px 30px;
	padding: 0px;
	}	
	
	
.left {
	float:left;
	padding: 5px 50px 20px 0px;
}	

img.left {
	float:left;
	padding: 0px;
	margin: 5px 30px 20px 0px;
	box-shadow: 10px 10px 5px #888888;
}	

img.leftNoShadow { 
	float:left;
	margin: 5px 50px 20px 0px;
	padding: 0px;
	}	


img.imageShadow {
	
	margin: 10px;
	padding: 0px;
	box-shadow: 10px 10px 5px #888888;
	}

.clearfloat { clear:both;}

.clean {margin: 0; padding: 0; }

.link { color: #1a4977; }

a img { border: none; }


#contact-wrapper {
	width:70%;
	border:1px solid #e2e2e2;
	background:#f1f1f1;
	padding:20px;
	font-size:80%;
}
#contact-wrapper div {
	clear:both;
	margin:1em 0;
}
#contact-wrapper label {
	display:block;
	float:none;
	font-size:12px;
	width:auto;
}

#contact-wrapper p.error  { color: #900; } 

form#contactform input {
	border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style:solid;
	border-width:1px;
	padding:5px;
	font-size:14px;
	color:#333;
}
form#contactform textarea {
	font-family:Arial, Tahoma, Helvetica, sans-serif;
	font-size:100%;
	padding:0.6em 0.5em 0.7em;
	border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style:solid;
	border-width:1px;
}

/* Navigation Bar */  
  
#menu {  
    z-index: 1000;
	position: relative;
    list-style:none;  
    width:1000px;  
    margin:0px auto 0px auto;  
    height:33px;  
    padding:10px 0px 0px 10px;
   
    background: #83bf2e url(../images/bg_nav.jpg) repeat-x;  
  
 
}  
  
#menu li {  
   float:left;  
    text-align:center;  
    position:relative;  
	padding: 0px 20px 4px 0px;  
    margin-right:30px;  
    margin-top:0px;  
    border:none;  
}  
  
#menu li:hover {  
    border: 1px solid #777777;  
    padding: 0px 9px 4px 9px;  
      
    /* Background color and gradients */  
      
    background: #ffffff;  
    background: -moz-linear-gradient(top, #ffffff, #ffffff);  
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#ffffff));  
      
    /* Rounded corners */  
      
    -moz-border-radius: 5px 5px 0px 0px;  
    -webkit-border-radius: 5px 5px 0px 0px;  
    border-radius: 5px 5px 0px 0px;  
}  
  
#menu li a {  
    font-family:Arial, Helvetica, sans-serif;  
    font-size:15px;   
    color: #EEEEEE;  
    display:block;  
    outline:0;  
    text-decoration:none;  
    text-shadow: 1px 1px 1px #000;  
}  
  
#menu li:hover a {  
    color:#161616;  
    text-shadow: 1px 1px 1px #FFFFFF;  
}  
#menu li .drop {  
    padding-right:21px;  
    background:url("../images/drop.png") no-repeat right 9px;  
}  
#menu li:hover .drop {  
    background:url("../images/drop.png") no-repeat right 9px;  
}  
  
/* Drop Down */  
  
.dropdown_1column,   
.dropdown_2columns,   
.dropdown_3columns,   
.dropdown_4columns,  
.dropdown_5columns {  
    margin:4px auto;  
    float:left;  
    position:absolute;  
    left:-999em; /* Hides the drop down */  
    text-align:left; 
	
    padding:10px 5px 10px 5px;  
    border:1px solid #777777;  
    border-top:none;  
      
    /* Gradient background */  
    background:#ffffff;  
    background: -moz-linear-gradient(top, #ffffff, #dddddd);  
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#dddddd));  
  
    /* Rounded Corners */  
    -moz-border-radius: 0px 5px 5px 5px;  
    -webkit-border-radius: 0px 5px 5px 5px;  
    border-radius: 0px 5px 5px 5px;  
}  
  
.dropdown_1column {width: 140px;}  
.dropdown_2columns {width: 280px;}  
.dropdown_3columns {width: 420px;}  
.dropdown_4columns {width: 560px;}  
.dropdown_5columns {width: 700px;}  
  
#menu li:hover .dropdown_1column,   
#menu li:hover .dropdown_2columns,   
#menu li:hover .dropdown_3columns,  
#menu li:hover .dropdown_4columns,  
#menu li:hover .dropdown_5columns {  
    left:-1px;  
    top:auto;  
}  
  
/* Columns */  
  
.col_1,  
.col_2,  
.col_3,  
.col_4,  
.col_5 {  
    display:inline;  
    float: left;  
    position: relative;  
    margin-left: 5px;  
    margin-right: 5px;  
}  
.col_1 {width:130px;}  
.col_2 {width:270px;}  
.col_3 {width:410px;}  
.col_4 {width:550px;}  
.col_5 {width:690px;}  
  
/* Right alignment */  
  
#menu .menu_right {  
    float:rightright;  
    margin-right:0px;  
}  
#menu li .align_right {  
    /* Rounded Corners */  
    -moz-border-radius: 5px 0px 5px 5px;  
    -webkit-border-radius: 5px 0px 5px 5px;  
    border-radius: 5px 0px 5px 5px;  
}  
#menu li:hover .align_right {  
    left:auto;  
    rightright:-1px;  
    top:auto;  
}  
  
/* Drop Down Content Stylings */  
  
#menu p, #menu h2, #menu h3, #menu ul li {  
    font-family:Arial, Helvetica, sans-serif;  
    line-height:14px;  
    font-size:12px;  
    text-align:left;  
    text-shadow: 1px 1px 1px #FFFFFF;  
}  

#menu h2 {  
    font-size:20px;  
    font-weight:200;  
    letter-spacing:-1px;  
    margin:7px 0 14px 0;  
    padding-bottom:14px;  
	color: #4f731b;
    border-bottom:1px solid #4f731b;  
}  
#menu h3 {  
    font-size:14px;  
    margin:7px 0 14px 0;  
    padding-bottom:7px;  
    border-bottom:1px solid #999;  
	color: #679624;
	
}  

#menu li:hover div h3 a { color: #679624; }

#menu p {  
    line-height:18px;  
    margin:0 0 10px 0;  
}  
  
#menu li:hover div a {  
    font-size:12px;  
    color:#222;  
}  


#menu li:hover div a:hover {  
    color:#888;  
}  
.strong {  
    font-weight:bold;  
}  
.italic {  
    font-style:italic;  
}  
.imgshadow {  
    background:#FFFFFF;  
    padding:4px;  
    border:1px solid #777777;  
    margin-top:5px;  
    -moz-box-shadow:0px 0px 5px #666666;  
    -webkit-box-shadow:0px 0px 5px #666666;  
    box-shadow:0px 0px 5px #666666;  
}  
.img_left { /* Image sticks to the left */  
    width:auto;  
    float:left;  
    margin:5px 15px 5px 5px;  
}  
#menu li .black_box {  
    background-color:#333333;  
    color: #eeeeee;  
    text-shadow: 1px 1px 1px #000;  
    padding:4px 6px 4px 6px;  
  
    /* Rounded Corners */  
    -moz-border-radius: 5px;  
    -webkit-border-radius: 5px;  
    border-radius: 5px;  
  
    /* Shadow */  
    -webkit-box-shadow:inset 0 0 3px #000000;  
    -moz-box-shadow:inset 0 0 3px #000000;  
    box-shadow:inset 0 0 3px #000000;  
}  
#menu li ul {  
    list-style:none;  
    padding:0;  
    margin:0 0 12px 0;  
}  
#menu li ul li {  
    font-size:12px;  
    line-height:20px;  
    position:relative;  
    text-shadow: 1px 1px 1px #ffffff;  
    padding:0;  
    margin:0;  
    float:none;  
    text-align:left;  
    width:220px;  
}  
#menu li ul li:hover {  
    background:none;  
    border:none;  
    padding:0;  
    margin:0;  
}  
#menu li .greybox li {  
    background:#F4F4F4;  
    border:1px solid #bbbbbb;  
    margin:0px 0px 4px 0px;  
    padding:4px 6px 4px 6px;  
    width:116px;  
  
    /* Rounded Corners */  
    -moz-border-radius: 5px;  
    -webkit-border-radius: 5px;  
    border-radius: 5px;  
}  
#menu li .greybox li:hover {  
    background:#ffffff;  
    border:1px solid #aaaaaa;  
    padding:4px 6px 4px 6px;  
    margin:0px 0px 4px 0px;  
}  

/* SLIDESHOW */

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  height: 220px;
  padding: 0px 0 0 0;
  margin: 20px 0 0 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }
  
.padtop { padding-top:15px; }