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

body {
margin: 0;
padding: 0;
background: #fff url(../images/BodyBgs.jpg) top;
background-repeat: repeat-x;
}
a {
outline: 0 none;
}
.noshow {
display: none;
}
#cover {
margin: 0 auto;
width: 1000px;
height: auto;
}
#wrapper {
width: 1000px;
margin: 0 auto;
height: auto;
}
img {
border: none;
}
.header {
float: left;
width: 1000px;
height: 103px;
}
.logo {
float: left;
width: 315px;
height: 90px;
margin: 5px 0 0 12px;
display: block;
background-image: url(../images/logo.png);
background-repeat: no-repeat;
}
.headerRight {
float: right;
width: 300px;
height: 90px;
margin: 5px;
}
.headerRight ul {
float: right;
width: 80px;
height: 30px;
margin: 0;
padding: 0;
}
.headerRight li {
list-style: none;
float: left;
margin: 0 7px 0 7px;
}
#getafreequote {
display: block;
width: 179px;
height: 41px;
float: right;
background: url("../images/livechat.png") no-repeat 0% 0%;
}
#getafreequote:hover {
background-position: 0% -42px;
}
#getafreequote span {
display: none;
}
.getafreequoteBtn {
float: right;
width: 250px;
height: 41px;
margin-top: 15px;
}
.BannerArea {
float: left;
width: 1000px;
height: 325px;
/*background: url(../images/bannerArea.jpg);
background-repeat: no-repeat;*/
}
.menuArea {
float: right;
width: 492px;
height: 49px;
background: #03315c;
margin-right: 73px;
margin-top: 5px;
}
.menuArea ul {
margin: 0;
padding: 0;
}
.menuArea li {
float: left;
list-style: none;
margin: 0 18px 0 21px;
line-height: 40px;
}
.menuArea li a {
text-decoration: none;
font-family: Tahoma;
font-size: 15px;
color: #fff;
}
.menuArea li a:hover {
color: #f90;
}
.menuArea li a.active {
color: #f90;
}
.BannerAreaIn {
float: left;
width: 1000px;
height: 325px;
margin-top:6px;
}
.MainBannerRotator {
float: right;
width: 500px;
height: 256px;
margin: 13px 68px 0 0;
}
.hm_rotator {
width: 500px;
height: 256px;
padding: 0;
float: left;
display: inline;
position: relative;
}
#divMainRotator {
margin: 0;
padding: 0;
width: 500px;
height: 256px;
overflow: hidden;
}
#divMainRotatorNav {
position: absolute;
bottom: 0;
top: 257px;
right: 8px;
z-index: 99;
}
#divMainRotatorNav a {
margin: 0 0 0 8px;
background: url(../images/act.jpg);
background-repeat: no-repeat;
text-decoration: none;
color: #cccccc;
font-size: 0.25em;
text-indent: -9999px;
width: 8px;
height: 8px;
display: block;
float: left;
}
#divMainRotatorNav a:hover {
background: url(../images/acth.jpg);
background-repeat: no-repeat;
text-decoration: none;
color: #67948d;
}
#divMainRotatorNav a.activeSlide {
background: url(../images/acth.jpg);
background-repeat: no-repeat;
text-decoration: none;
color: #67948d;
}
#divMainRotatorNav a:focus {
outline: none;
}
#divMainRotator img {
width: 500px;
height: 256px;
float: left;
margin: 0;
}
.mainContentWarp {
float: left;
width: 1000px;
height: auto;
min-height: 500px;
margin-top: 30px;
}
.mainContentWarpLeft {
float: left;
width: 650px;
height: auto;
min-height: 400px;
margin: 5px;
}
.mainContentWarpLeft h1 {
margin: 0;
padding: 0 0 20px 0;
font-family: Tahoma;
font-size: 18px;
color: #3a5885;
font-weight: normal;
}
.mainContentWarpLeft h1 span {
font-family: Arial;
font-size: 11px;
color: #898989;
}
.mainContentWarpLeft p {
margin: 0;
padding: 0;
font-family: Tahoma;
font-size: 12px;
color: #7c7c7c;
font-weight: normal;
line-height: 22px;
text-align: justify;
}
.ImgFloatLeft {
float: left;
margin: 4px 20px 0 0;
}
.HomePageListBox {
float: left;
width: 650px;
height: auto;
margin-top: 20px;
min-height: 300px;
}
.ListSpliteBox {
float: left;
width: 320px;
height: auto;
min-height: 350px;
background: url(../images/ListBoxSplite.jpg) right top;
background-repeat: repeat-y;
}
.ListBoxIn {
float: left;
margin-left: 5px;
width: 300px;
height: 90px;
margin-bottom: 20px;
border-bottom: 1px dashed #ccc;
padding-bottom: 10px;
}
.ListBoxIn p {
margin: 0;
padding: 0;
font-family: Arial;
font-size: 12px;
color: #b1b1b1;
line-height: 20px;
text-align: justify;
}
.ListBoxIn h2 {
margin: 0;
padding: 0;
font-family: Arial;
font-size: 12px;
color: #666;
text-align: left;
font-weight: normal;
}
.ListBoxIn img {
float: left;
margin: 2px 10px 2px 2px;
}
.ListBoxIn h2 a {
text-decoration: none;
font-family: Arial;
font-size: 12px;
color: #666;
}
.ListBoxIn h2 a:hover {
color: #f18a2a;
}
.ListBoxIn p a {
text-decoration: none;
font-family: Arial;
font-size: 12px;
color: #f18a2a;
text-align: right;
float: right;
}
.ListBoxIn p a:hover {
color: #666;
}
#no {
background: none 0%;
}
.mainContentWarpRight {
float: right;
width: 330px;
height: auto;
margin: 5px;
min-height: 400px;
}
.testimonialsBox {
float: right;
width: 305px;
height:200px;
background: url(../images/testimonialsBgs.jpg);
background-repeat: no-repeat;
}
.testimonialsBox img {
float: left;
margin: 4px;
}
.testimonialsBox h1 {
margin: 0;
padding: 0;
font-family: Arial;
font-size: 16px;
color: #333;
font-weight: normal;
line-height: 40px;
}
.testimonialsBox p {
margin: 0;
padding: 4px 5px 5px 5px;
font-family: Arial;
font-size: 12px;
color: #979797;
font-weight: normal;
line-height: 17px;
text-align: justify;
}
.testimonialsBox p span {
color: #ffa63f;
}
.testimonialsBox a {
text-decoration: none;
padding: 0 0 0 8px;
font-family: Arial;
font-size: 12px;
color: #3f5a88;
}
.testimonialsBox a:hover {
color: #000;
}
.HomepageContentBox {
float: right;
width: 295px;
height: auto;
min-height: 350px;
background: url(../images/HomepageaddressBgs.jpg);
background-repeat: repeat-x;
margin-top: 30px;
border: 1px solid #e7e5e1;
padding: 5px;
}
.HomepageContentBox img {
float: left;
margin: 2px;
}
.HomepageContentBox h3 {
margin: 0;
padding: 0 0 10px 0;
font-family: Arial;
font-size: 18px;
color: #333;
font-weight: normal;
}
.HomepageContentBox h3 span {
font-size: 12px;
color: #cccbc8;
}
.HomepageContentBox h1 {
margin: 0;
padding: 0 0 10px 0;
font-family: Arial;
font-size: 18px;
color: #ff9900;
font-weight: normal;
text-transform: uppercase;
}
.HomepageContentBox p {
margin: 0;
padding: 0;
font-family: Arial;
font-size: 12px;
color: #333;
font-weight: normal;
line-height: 20px;
}
.HomepageContentBox p a {
text-decoration: none;
color: #ff9900;
}
.HomepageContentBox p a:hover {
color: #000;
}
.footerArea {
float: left;
width: 100%;
height: 101px;
background: url(../images/footerBgs.jpg);
background-repeat: repeat-x;
margin-top: 40px;
}
.footerAreaIn {
margin: 0 auto;
width: 1000px;
height: 101px;
}
.footerAreaIn ul {
margin: 0;
padding: 0;
}
.footerAreaIn li {
float: left;
list-style: none;
padding: 0 5px 0 5px;
}
.footerAreaIn li a {
text-decoration: none;
font-size: 12px;
font-family: Arial;
color: #999;
}
.footerAreaIn li a:hover {
color: #f90;
}
.footerAreaIn p {
margin: 5px;
padding: 0;
line-height: 20px;
font-size: 12px;
font-family: Arial;
color: #999;
}
.footerLinkBox {
float: left;
width: 700px;
height: 50px;
margin-top: 20px;
}
#facebook {
display: block;
width: 25px;
height: 25px;
float: left;
margin-top: 10px;
background: url("../images/facebookIcon.jpg") no-repeat 0% 0%;
}
#facebook:hover {
background-position: 0% -26px;
}
#facebook span {
display: none;
}
.HomepageContentBox ul {
margin: 0;
padding: 0;
}
.HomepageContentBox li {
list-style: none;
float: left;
margin: 0 10px 0 0;
}
#twiiterIcon {
display: block;
width: 25px;
height: 25px;
float: left;
margin-top: 10px;
background: url("../images/twiiterIcon.jpg") no-repeat 0% 0%;
}
#twiiterIcon:hover {
background-position: 0% -25px;
}
#twiiterIcon span {
display: none;
}
#skypeIcon {
display: block;
width: 25px;
height: 25px;
float: left;
margin-top: 10px;
background: url("../images/skypeIcon.jpg") no-repeat 0% 0%;
}
#skypeIcon:hover {
background-position: 0% -25px;
}
#skypeIcon span {
display: none;
}



#LinkedIn {
display: block;
width: 25px;
height: 25px;
float: left;
margin-top: 10px;
background: url("../images/LinkedIn.jpg") no-repeat 0% 0%;
}
#LinkedIn:hover {
background-position: 0% -25px;
}
#LinkedIn span {
display: none;
}









#yahooIcon {
display: block;
width: 25px;
height: 25px;
float: left;
margin-top: 10px;
background: url("../images/yahooIcon.jpg") no-repeat 0% 0%;
}
#yahooIcon:hover {
background-position: 0% -25px;
}
#yahooIcon span {
display: none;
}
#gmailIcon {
display: block;
width: 25px;
height: 25px;
float: left;
margin-top: 10px;
background: url("../images/gmailIcon.jpg") no-repeat 0% 0%;
}
#gmailIcon:hover {
background-position: 0% -25px;
}
#gmailIcon span {
display: none;
}
.BannerInLeft {
float: left;
width: 400px;
height: 210px;
margin: 10px 10px 10px 10px;
}
.BannerInLeft h1 {
margin: 0;
padding: 0;
font-family: Arial;
font-size: 29px;
color: #fff;
font-weight: normal;
}
.BannerInLeft p {
margin: 0;
padding: 0;
font-family: Arial;
font-size: 12px;
color: #fff;
font-weight: normal;
line-height: 20px;
}
#viewSiteBtns {
display: block;
width: 236px;
height: 98px;
float: left;
margin-top: 10px;
background: url("../images/viewSiteBtns.png") no-repeat 0% 0%;
}
#viewSiteBtns:hover {
background-position: 0% -98px;
}
#viewSiteBtns span {
display: none;
}
.BannerLeft2 {
float: left;
width: 400px;
height: 80px;
margin-left: 10px;
}
.BannerLeft2 h2 {
margin: 0;
padding: 0;
font-family: Arial;
font-size: 18px;
color: #666;
font-weight: normal;
}
.BannerLeft2 p {
margin: 0;
padding: 10px 0 0 0;
font-family: Arial;
font-size: 12px;
color: #666;
font-weight: normal;
}
.BannerLeft2 img {
float: right;
margin: 3px;
}
#arrow {
display: block;
width: 50px;
float: right;
height: 50px;
margin-top: 10px;
background: url("../images/arrow.jpg") no-repeat 0% 0%;
}
#arrow:hover {
background-position: 0% -50px;
}
#arrow span {
display: none;
}
#portfolio {
position: relative;
width: 100%;
height: 790px;
}
.client {
width: 220px;
float: left;
position: relative;
height: 219px;
margin: 0 26px 40px 0;
}
#JS .client {
display: none;
}
.thumbnail {
background: url(img/thumbnail_bg.png) no-repeat;
width: 220px;
height: 160px;
}
.thumbnail img {
border: 1px solid #fff;
margin: 1px;
}
.client h2 {
font-size: 14px;
text-align: center;
margin: 5px 0 0;
}
.client p {
text-align: center;
color: #acacac;
}
.client_desc {
position: absolute;
top: 2px;
left: 2px;
width: 216px;
height: 152px;
background: url(img/client_desc_bg.png);
}
.client_desc p {
color: #fff;
margin-top: 20px;
}
.client_desc strong {
margin-right: 5px;
}
.client-more {
text-align: center;
margin: 0 20px;
}
.client-more a {
color: #fff;
font-weight: 700;
background-image: url(img/red.png);
border: 1px solid #a00;
padding: 5px;
}
#portfolio-nav {
margin-bottom: 40px;
line-height: 39px;
height: 39px;
margin-top: 40px;
}
#portfolio-nav li {
float: left;
width: 33%;
text-align: center;
}
#portfolio-nav li a {
background: url(img/white_bullet.png) no-repeat left center;
padding-left: 30px;
font-size: 18px;
color: #8d8d8d;
text-transform: uppercase;
}
#portfolio-nav .activeSlide a {
background-image: url(img/white_bullet_selected.png);
}
#portfolio .page {
width: 960px;
}
.naver {
z-index: 100;
position: absolute;
bottom: 0;
left: 0;
height: 39px;
line-height: 39px;
width: 960px;
text-align: center;
}
#JS .naver {
display: none;
}
.naver a {
margin-right: 20px;
color: #acacac;
font-size: 14px;
}
#client {
margin-top: 80px;
}
.client-details {
float: right;
width: 300px;
}
.client-details h1 {
font-size: 20px;
margin-bottom: 20px;
}
.client-details p {
margin-bottom: 10px;
text-align: justify;
}
.client-gallery {
float: left;
width: 625px;
}
.client-gallery img {
width: 620px;
height: auto;
border: 1px solid #fff;
outline: #d9d9d9 1px solid;
margin-bottom: 30px;
}


/*BANNER GALLERY*/

.clear {
	clear: both;
}
#wrapperG {
	width:1000px;
	overflow:hidden;
	position:relative;
}
.main {
	margin:0;
}
.gallery {
	width:100%;
	overflow:hidden;
	position:relative;
	background:url(../images/bg-gallery-c.gif) repeat-x;
}
.gallery-holder {
	width:100%;
	overflow:hidden;
	background:url(../images/bg-gallery.jpg) no-repeat 50% 0;
}
.w1 {
	float:left;
	position:relative;
	left:50%;
}
.w2 {
	float:left;
	position:relative;
	left:-50%;
}
.gallery .mask {
	width:1000px;
	overflow:hidden;
	position:relative;
	height:256px;
}
.gallery .mask ul {
	margin:0;
	padding:0;
	list-style:none;
	overflow:hidden;
	height:9999px;
	position:absolute;
	top:0;
	left:0;
	width:1070px;
}
.gallery .visual {
	margin:0 0 0 17px;
	float:left;
	display:inline;
}
.visual img {
	vertical-align:top;
}
.gallery li {
	width:100%;
	position:relative;
	overflow:hidden;
	height:325px;
	margin:0 0 30px;
}
.gallery .container {
	position:absolute;
	bottom:0;
	right:70px;
	width:321px;
}
* html .gallery .container {
	bottom:0;
}
.gallery .container-top {
	width:147px;
	height:65px;
	padding:0 0 11px;
}
.gallery .container-bottom {
	width:147px;
	height:103px;
}
.gallery h2 {
	margin:0 0 4px;
	color:#000;
	font-size:19px;
	line-height:24px;
}
.cufon-active .gallery h2 {
	font-size:24px;
	font-weight:bold;
}
.cufon-active .gallery h2 a {
	font-weight:normal;
}
.gallery h2 a {
	color:#b43d25;
	padding:0 0 0 13px;
	background:url(../images/separator2.gif) no-repeat 4px 55%;
}
.gallery h2 a:hover {
	color:#939393;
	text-decoration:none;
}
.gallery .container img {
	vertical-align:top;
	margin:0 0 0 -13px;
}
.gallery .text-block {
	width:277px;
	font-size:12px;
	line-height:15px;
	margin:0 0 0 36px;
	padding:2px 0 4px;
	background:url(../images/divider.gif) no-repeat;
}
.gallery .title {
	margin:0 0 1px;
}
.gallery .text-block p {
	margin:0;
}
.switcher-holder {
	position:absolute;
	right:251px;
	top:-63px;
	width:92px;
	height:44px;
	overflow:hidden;
}
.switcher {
	background:url(../images/bg-pager.png) no-repeat;
	width:92px;
	height:44px;
	padding:11px 0 0 26px;
}
.switcher a {
	text-indent:-9999px;
	width:19px;
	height:19px;
	float:left;
	margin:0 2px 0 0;
	overflow:hidden;
	position:relative;
	background:url(../images/bg-arrows.gif) no-repeat;
}
.switcher a:hover {
	background-position:0 -21px;
}
.switcher .next {
	background-position:-21px 0;
}
.switcher .next:hover {
	background-position:-21px -21px;
}
#main {
/*	border-top:1px solid #fff;
	border-bottom:3px solid #32516f;*/
	padding:58px 0 0;
	position:relative;
	/*background:#32516f url(../images/bg-main.jpg) no-repeat 50% -1px;*/
}
#main .area {
	position:relative;
}
/*INSIDE PAGES*/

.inside #main {
	padding: 100px 0 20px 0;
}
.inside .item {
	margin: 0px;
}
/* root element for scrollable */
.scrollable {
	/* required settings */
	position:relative;
	overflow:hidden;
	/* vertical scrollables have typically larger height than width but not now */
	height: 665px;
	width: 700px;
	margin: o auto;
}
/* root element for scrollable items */
.scrollable .items {
	position:absolute;
	/* this time we have very large space for the height */
	height:20000em;
}
.galleryIMG {
	height: 320px;
	background: no-repeat top left;
	width: 700px;
	
}
.prev, .next {
	cursor: pointer;
}
.navi {
	position: absolute;
	top: 0px;
	right: 50px;
	width: 350px;
}
.navi a {
	margin:0 0 4px;
	color:#FFF;
	font-size:13px; font-family:Arial;
	line-height:22px;
	font-weight: bold;
	color: #FFF !important;
	width: 200px;
	text-decoration: none !important;
}
.navi a:hover {
	text-decoration: none;
}
.navi div.active .title {
	color: #33CCFF !important;
	font-size: 15px;
	line-height: 25px; padding-bottom:5px;
	text-decoration: none; border-bottom:1px dotted #FFF;
}
.navi .nav-link {
	color:#FFF !important;
	
	font-weight: normal; font-family:Arial;
	font-size: 11px !important;
}

.slider-nav span {
	display: none;
}
.navi .active span {
	display: inline; font-family:Arial; font-size:12px; color:#03315C; line-height:20px; text-align:left;
}
.navi h1{ margin:0; padding:5px 0 5px 0; font-family:Arial; font-size:16px; color:#03315C;}