@charset "UTF-8";
  /* CSS Document */


body {
	background: #212121 url('images/bg.jpg') top repeat-x;
	margin-top: 0px;
	margin: 0 auto;
	padding-top: 0px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #cccccc;
	height: 100%;

}
/* This class is used for all the main text on your website */
.general-text {
	font-family:  “Trebuchet MS”, sans-serif;
	font-size: 13px;
	line-height: 21px;
	color: #767676;

}


.footer-text {
font-family:  “Trebuchet MS”, sans-serif;
	font-size: 12px;
	line-height: 20px;
	color: #353535;
	}
.services-text {
font-family:  “Trebuchet MS”, sans-serif;
	font-size: 14px;
	line-height: 20px;
	color: #3399cc;
	;margin:0; padding:0;font-weight:bold;}
	
.services-text2 {
font-family:  “Trebuchet MS”, sans-serif;
	font-size: 12px;
	line-height: 20px;
	color: #767676;
	margin:0; padding:0;
	}

.contact-text {
font-family:  “Trebuchet MS”, sans-serif;
	font-size: 12px;
	line-height: 20px;
	color: #767676;
	margin:0; padding:0;}
	
	
/*classed used for majority of headings */
h3 {
	margin: 0 0 20px 0;
	color: #b8b8b8;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 18px;
	line-height: 28px;
	font-weight: lighter;

}
h2 {font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;font-size: 21px;font-weight: lighter;color: #212121;}
/*This class is used to define headers of sections, like for example contact etc.. */
.section-name {
	margin: 0px;
	color:#B8B8B8;
	font-family: "Myriad Pro", Arial, Helvetica, sans-serif;
	font-size: 24px;
	letter-spacing: -1px;
}
/* Style for anchors */
a {
	color: #3399cc;
	text-decoration: underline;
}
a:hover {
	color: #437fc3;
}
/* Wrapper with width of 960px, centered */
#wrapper {
	width: 870px;
	
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto;
}
/* HEADER */

#header {
	width: 870px;
	height: 120px;
	background-image:url(images/bg-header.jpg);
}
#logo {
	width:411px;
	float: left;
	height: 120px;
}
/* class for describing the position of logo img */
.imgHeader {
	height: 47px;
	margin-top: 30px;
	margin-left: 30px;
}
/* END OF HEADER */

/* This styles the call us now section in the upper right corner */
#call-us-now {
	padding-top: 40px;
	width: 370px;
	padding-right: 30px;
	float:right;
	height: 75px;
	text-align:right;
}
#call-us-now p {
	font-size: 0.8em;
	color: #A7A7A7;
	float:right;
	font-weight: lighter;
	font-family: "Myriad Pro", Arial, Helvetica, sans-serif;
}
#call-us-now img {
	margin-top: 0px;
	float: right;
	width: 40px;
	padding-top: 3px;
	margin-right: 15px;
}
.box-slogan {
	float: left;
	width: 200px;
	height: 220px;
	margin-top: 30px;
}
.slogan {
	color: #212121;
	font-size: 36px;
	margin: 0px;
	font-family:"Myriad Pro", "Trebuchet MS", Arial, Helvetica, sans-serif;
	letter-spacing: -2px;
	padding: 0px;
}
.slogan-description {
	margin: 0px;
	margin-left: 150px;
	color: #212121;
	font-size: 18px;
	font-family:"Myriad Pro", "Trebuchet MS", Arial, Helvetica, sans-serif;
	letter-spacing: -1px;
	margin-top: 0px;
}
.box-image {
	height: 220px;
	width: 200px;
	padding-left: 30px;
	margin-top: 30px;
	float: left;
}
.box-divider {
	width: 200px;
	height: 2px;
	background-image:url(images/divider.jpg);
	background-repeat: repeat-x;
	margin-top: 30px;
}
.slogan-description-2 {
	
	color: #656565;
	font-size: 13px;
	letter-spacing: -0.5px;
	line-height: 20px;
	margin: 0;
	margin-top: 30px;
	width: 440px;
}
.clear {
	clear: both;
}
#wrapper-content {
	width: 870px;
}
#spacing-left {
	width: 1px;
	height: 280px;
	background-image:url(images/left-spacing.jpg);
	float: left;
}
#spacing-right {
	width: 1px;
	height: 280px;
	background-image:url(images/right-spacing.jpg);
	float: left;
}
#box {
	float: left;
	width: 870px;
	height: 250px;

	border-top: 0px;
	background-image:url(images/bg-box.jpg);
	background-repeat:repeat-x;
}
#boxsmall {
	float: left;
	width: 870px;
	height: 100px;

	border-top: 0px;
	background-image:url(images/bg-box.jpg);
	background-repeat:repeat-x;
}
#boxsmall-text {float:left;padding: 20px 0 0 20px;}
#boxsmall-pic {float:right;}
.box-element {
	width: 750px;
	height: 278px;
	background-image:url(images/bg-box.jpg);
	background-repeat:repeat-x;
}
/* CSS used for styling main content of website, in other words, part of the website between moving slogans and footer. Keep in mind that this part has fixed height.*/
#mainContent {
	width: 870px;

	background: url(images/bg-content.jpg) top no-repeat;
	margin-top:0px;
}
/* We devided whole space into two columns, each of 440px width */
.left-column {
	width: 500px;
	float: left;

	margin-right: 30px;
	margin-top: 30px;
	margin-bottom: 0px;
	padding-left: 10px;
}
.right-column {
	width:300px;
	float: right;
	padding-right: 10px;
	margin-top: 30px;

}
/* This class is used if you want to to divided one of the columns once again. You can use following classes and divide it into two columns, each with width of 215px */
.column-subdivision-left {
	float: left;
	width: 215px;
	margin-right: 5px;
}
.column-subdivision-right {
	float:right;
	width: 215px;
	margin-left: 5px;
}
/* INDEX */
/* This class is used to style featured services on main page */
.service {
	float: left;
	width: 440px;
	margin-top: 0px;
	padding: 0px;
}
.service-name {
	margin: 0px;
	padding: 0px;
	margin-top: 0px;
	color: #b8b8b8;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: lighter;
	line-height: 20px;
}
.short-description {
	font-family:  “Trebuchet MS”, sans-serif;
	font-size: 12px;
	line-height: 20px;
	color: #3399cc;
	margin: 0px;
	margin-top: 2px;
}
.arrow {
	width: 20px;
	margin-top: 7px;
	float: left;
}
.learn-more {
	float: left;
	margin-top: 10px;
	margin-left: 5px;
	font-size: 14px;
}
/* Accordion */
/* This class is used to style arrow next to Accordion headr */
.Accordion-icon-img {
	width: 20px;
	float: left;
}
/*Stylng for Accordion title */
.AccordionItem-title {
	float: left;
	margin: 0px;
	margin-left: 10px;
	color: #b8b8b8;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 18px;
}
.AccordionItem-title:hover {
	color: white;
}
ul.list {
	list-style-image:url(images/arrow4.jpg);
	margin:0px 0px 0px 20px;
	padding-left: 23px;
}
ul.list li {
	font-size: 13px;
	margin-bottom: 5px;
	color: #767676;
	font-style:italic;
	border-bottom: 1px solid #2c2c2c; 
	padding: 0 0 6px 0;
}
#a1 {
	width: 210px;
}
/*NAVIGATION*/

/* END OF NAVIGATION */

/* CONTACT SECTION */
/* Here are css properties for elements on "contact us" section. Fieldset encapsulates all the elements on the left half. */
.contact-fieldset {
	width: 460px;
	border: none;
	padding: 0px;
	margin-top: 0px;
}
/* This class style all labes that are used in the contact form */
.contact-label {
	color: #767676;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align:left;
	width: 100px;
	float: left;
}
/* This class styles all the input fields in contact form */
.contact-input {
	width: 200px;
	margin-right: 5px;
	margin-bottom: 4px;
	padding: 5px;
	background-color: #141414;
	border: 1px solid #767676;
	font-size: 12px;
	font-family:Arial, Helvetica, sans-serif;
	color:white;
	letter-spacing: 1px;
}
/* This class handles the main input message box */
.contact-body {
	width: 320px;
	background-color: #141414;
	color: white;
 	border: 1px solid #767676;
	padding: 5px;
	line-height: 15px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	letter-spacing: 1px;
}
/* This class is used to style the "SEND" button on the end of contact form */
.contact-button {
	text-align: right;
	padding: 6px;
	margin-left: 100px;
	background-color: #141414;
	border: 1px solid #B8B8B8;
	color: white;
	font-size: 0.7em;
}
/* END OF CONTACT SECTION */

/* FOOTER */

/* Main styling for the main #footer div */

/* END OF FOOTER */

/*DIVIDERS */
/*Horizontal divider - parallel with x-axis */
 .divider-y {
	width: 440px;
	height: 2px;
	background-image:url(images/divider-y.jpg);
	background-repeat: repeat-x;
	margin-top: 10px;
	margin-bottom: 10px;
}
/*Vertical divider - parallel with y-axis */
.divider-x {
	width:2px;
	height:300px;
	float: left;
	border-right: solid 1px #2c2c2c;
	margin-top: 30px;
} 




.gallery-name {
	letter-spacing: -1px;
	margin-left: 30px;
	margin-top: 30px;
	margin-bottom: 0px;
	color:#B8B8B8;
	font-family: "Myriad Pro", Arial, Helvetica, sans-serif;
	font-size: 24px;
	letter-spacing: -1px;
}

ul#nav{list-style-type: none;height: 41px;margin: 0;background:url('images/navbg.jpg') repeat-x;padding-left: 10px;}
ul#nav li{display: block;float: left;line-height: 41px;margin: 0; padding: 0;}
ul#nav a, ul#nav a:link, ul#nav a:visited{display: block;text-decoration: none;color: white;font-size: 13px;font-weight:bold;padding: 0 15px;font:Geneva, Arial, Helvetica, sans-serif;text-transform:uppercase;}
ul#nav li a:hover, ul#nav li a:active{background: url('images/navbg-hover.jpg');}
ul#nav li.on{background: url('images/navbg-on.jpg') bottom center no-repeat;}

#footer{height: 125px;margin-top:100px; background: #141414 url('images/footertop.jpg') top repeat-x;  border-top: 1px #555555;}	
#footer-text {margin: 0 auto; padding: 15px 0 0 0; width:870px; text-align:center;}

#footer a {
	color: #3b3b3b;
	text-decoration: underline;
}
#footer a:hover {
	color: #cccccc;
}

#services-pic {width: 47px; float:left;}
#services-text {width: 430px;float:left; padding: 0 0 0 15px;}

#servicespro-pic {width: 50px; height:50px; float:left; background-color:#141414; border: 1px solid #343434; padding:6px;}
#servicespro-text {float:left; padding: 0 0 0 15px;}

img {border:0;}

legend {color:#2f5ab0; font-family: Arial, sans-serif; font-size: 16px; padding: 10px 5px 10px 5px;}
fieldset {margin:0; padding: 0 0 10px 10px;  }

a:link {color: #437fc3;}
a:visited {color: #437fc3;}
a:hover {color: #FFFFFF;}
.small-text {color:#CCCCCC; font-family: Arial, sans-serif; font-size: 9px; margin:0; padding:0;}

input {height: 20px; border: 1px solid #3a3a3a; background-color:#232323; font-size: 12px; padding: 5px;color:#cccccc;}
input:hover {border: 1px solid #4f4f4f; background-color:#000;}
select {font-size:16px;background-color:#232323;color:#cccccc;}
textarea {background-color:#232323;color:#cccccc;font-family: Arial, sans-serif; padding: 10px 0 0 10px;}

/* network */

#network-bg {background:url('images/network_bg.jpg') repeat-x top; height: 27px;}
#network-wrap {width: 870px; margin: 0 auto; text-align:right;}
#network-wrap img {margin-left: 15px;}

.servicesbox {
border-color:#343434;
border-style:solid;
border-width:1px;
margin-bottom:30px;
width:309px;
background-color:#141414;
font-size:14px;
margin-top:15px;
}

.servicesbox a.selected {
background-color:#1f516c;
background:url('images/navbg.jpg') repeat-x;
background-repeat:repeat-x;
border-bottom:1px solid #343434;
color:#FFFFFF;
display:block;
font-weight:bold;
padding:8px 15px;
text-decoration:none;
}
.servicesbox a:hover {
color:#418fb6;
font-weight:bold;
}
.servicesbox a {
background-image:url('images/arrow2.jpg');
background-position:left center;
background-repeat:no-repeat;
border-bottom:1px solid #343434;
color:#7F7974;
display:block;
font-weight:normal;
padding:8px 8px 8px 26px;
text-decoration:none;
}

.pic img {background-color:#141414; border: 1px solid #343434; padding:7px;}

#eyes
{
  display: block;
  width: 264px;
  height: 26px;
  background: url(images/eyes.jpg) no-repeat 0 0;

}

#eyes:hover
{ 
  background-position: 0 -26px;
}

#eyes span
{
  display: none;
}

#report
{
  display: block;
  width: 264px;
  height: 48px;
  background: url(images/report.jpg) no-repeat 0 0;

}

#report:hover
{ 
  background-position: 0 -48px;
}

#report span
{
  display: none;
}

.report1 {width:200px;float:left;margin-right:20px;font-size:13px;font-weight:bold;color:#418fb6;}
.report2 {width:200px;float:left;font-size:13px;font-weight:bold;color:#418fb6;}