/*
Description:	CSS 
Author:			Visualcode Limited
Date: 			2012
Version:		1.0
*/

@import url('css/generalform.css');
@import url('css/vcbanner.css');
@import url('css/fancybox.css');
@import url('css/cookie.css');

@font-face {font-family: OpenSans; src: url('fonts/Open_Sans/OpenSans-Regular.ttf');}
@font-face {font-family: OpenSans; font-weight: bold; src: url('fonts/Open_Sans/OpenSans-Bold.ttf');}
@font-face {font-family: OpenSans; font-weight: 500; src: url('fonts/Open_Sans/OpenSans-Semibold.ttf');}
@font-face {font-family: OpenSans; font-weight: 300; src: url('fonts/Open_Sans/OpenSans-Light.ttf');}



/*---------------------------Global Start -----------------------------*/

body { 
	font-weight: normal;
	text-align:center;
  	position:relative;
	margin:0;
	padding:0;	 
	color:#1A1A16; 
	background:#1A1A16 url(/images/foot_tile.gif) repeat;
	}

body,
input,
textarea,
select {
	font:13px OpenSans, trebuchet ms, Helvetica, Arial, sans-serif;
}
	
a:link {
	text-decoration:none;
	color:#46BCD2;
	}

a:visited {
	text-decoration:none;
	color:#46BCD2;
	
	}

a:active {
	text-decoration:none;
	color:#CCC;
	}

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

a img{
	border:none;
	}


h1, h2, h3, h4{
	font-weight:normal;
	line-height:normal;
	text-shadow:0 1px 1px #FFF;
	/*font-family: Georgia, Times, serif;*/
	}
	
h1 {
	font-size: 24px;
	clear:both;
	color:#1A1A16;
	}

h2 {
	font-size: 20px;
	font-weight:normal;
	color:#1A1A16;
	}

h3 { 
	font-size: 18px;
	font-weight:bold;
	}

h4 {
	font-size: 16px;
	font-weight:bold;
	}

hr {
	border: none;
	height: 1px;
	background:#FFF;
	margin: 5px auto;
	padding: 0px !important;
	clear:both; 
	border-top:#ECECEC solid 1px;
	border-bottom:#FFF solid 1px;
	}

p{
	margin:10px 0;
	}

h1.instruction{
	font-weight:bold;
	display:block;
	padding:5px 10px;
	margin:0px 0px 10px 0px;
	background:#FFFFcc;
	border:#FFFF66 dotted 1px;
	}
	
table{margin:0;}	
table td{padding:5px; font:11px "trebuchet ms", arial, helvetica, sans-serif; border-bottom:#DFDFDF solid 1px; vertical-align:top;}	
table td.five{padding:5px;}
table thead td{background:#666; border-top:#FFF solid 1px; border-bottom:#FFF solid 1px; border-right:#FFF solid 1px; color:#FFF; padding-left:5px; font-weight:bold;}
table thead td.none{border-right:none;}	

.clear{clear:both; text-align:center; padding-top:0px; }

.clear a{
	padding:5px 10px !important;
	border:#4A4C4B solid 1px;
	color:#FFF;
	font-weight:bold;
	font-size:85%;
	background:#1A1A16;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	margin-bottom:15px;
	}

.clear p{	
	padding:5px 0px;
	display:block;
	}

a.button {
	padding:5px 10px !important;
	border:#4A4C4B solid 1px;
	color:#FFF;
	font-weight:bold;
	font-size:85%;
	background:#1A1A16;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	margin-bottom:15px;
	}

#container{
	padding:0;
	margin:0px auto;
	position:relative;
	text-align:center;
	background:#FFF url(/images/containerBack.png) repeat center top;
	
	/*background: url(images/grid.gif) repeat-y center top;*/
	}

#headContainer{
	position:relative;
	margin:0px 0px 0px 0;
	height:140px;
	
	}

#header {
	width:930px;
	margin:0px auto;
	padding:0 !important;
	text-align:left;	
	position:relative;
	height:134px;
	border-bottom:#ECECEC solid 1px;
	border-top:#1A1A16 solid 5px;
	}

#Logo {
	margin:0px;
	margin-left:10px;
	padding:10px 0px 0px 0px;
	text-align:left;
	width:220px;
	height:120px;
	float:left;
	}

.sectionTitle{	
	clear:right;
	float:right;
	text-align:right;
	width:635px;
	padding-top:30px;
	height:40px;
	font-size:20px;
	display:none;
	}

 #topNav{
 	font-size:12px;
 	text-shadow:0 1px 1px #FFF;
 	color:#FFF;
 	text-align:left;
 	padding:0;
 	margin:0 auto;
 	height:30px;
 	width:690px;
 	clear:right;
 	margin-top:95px;
 	float:right;
 	}
	
 #topNav ul {
	list-style:none; 
	padding:0;
	margin:0px;
	position:relative;
	text-align:left;
	border:none;
	}
	
#topNav ul li {
	display:inline;
	float:left;
	margin:0;
	position:relative;
	text-align:center;
	font-weight:500;
	width:105px;
	margin-right:0px;
	margin-right:10px;
	color:#F9F9F9;
	}

#topNav ul li.long{
	width:150px;
	}

#topNav ul li a{
 	color:#1A1A16;
 	display:block;
 	padding-top:7px;
 	padding-bottom:7px;
 	height:16px;
 	border:#FFF solid 1px;
 	background:#F9F9F9;
 	-moz-border-radius:5px 5px 5px 5px; border-radius:5px 5px 5px 5px;
 	text-shadow:0 1px 1px #FFF;
 	}

#topNav ul li a:hover{
 	background:#ECECEC url(/images/whiteTrans.png) repeat-x;
 	}	
 
#topNav ul li a.on{
 	background:#1A1A16;
 	color:#FFF;
 	text-shadow:0 1px 1px #000;
 	}	
 
#topNav ul li a:hover.on{
	background:#46BCD2;
	color:#FFF;
	text-shadow:0 1px 1px #246976;
	}
	
	
/*Sub Nav*/

#subNav ul {
	list-style:none; 
	padding:5px;
	margin:0px auto;
	position:relative;
	text-align:left;
	border:none;
	font-size:12px;
	width:900px;
	height:27px;
	background:#ECECEC url(images/subNavBack.png) repeat;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	}
	
#subNav ul li {
	display:inline;
	float:left;
	margin:0;
	position:relative;
	text-align:center;
	font-weight:500;
	margin-right:0px;
	margin-right:0px;
	color:#F9F9F9;
	}

#subNav ul li a{
	display:block;
	padding:4px 7px;
	color:#1A1A16;
	background:#f1f1f1;
	border:#FFF solid 1px;
	margin-right:10px;
	text-shadow:0 1px 1px #FFF;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	}

#subNav ul li a:hover{
	background:#ECECEC url(/images/whiteTrans.png) repeat-x;
	}

#subNav ul li a.on{
	color:#FFF;
	background:#46BCD2;
	text-shadow:none;
	}
	
#subNav ul li span{
	display:block;
	padding:4px 7px;
	color:#1A1A16;
	}
	

/* ______________________ Main Area ______________________ */	

#wrapper {
	margin:0px;
	padding:0px !important;
	position:relative;
	}

#wrapperFurther{
	background:#FFF url(/images/containerBack.png) repeat center top;
	}

#flashcontent{
	height:435px;
	background:transparent url(/images/underAuto.gif) no-repeat center bottom;
	margin:0;
	padding:0;
	}
	
.bannerTextOverlay{
	padding:0px 10px;
	}	
	
a .bannerTextOverlay{
	color:#1A1A16;
	}

.contentArea{
	position:relative;
	clear:both;
	padding:5px 10px;
	margin:0 auto;
	width:910px;
	text-align:left;
	border-top:1px solid #FFFFFF;
	border-bottom:#ECECEC solid 1px;
	}

.Content{
	text-align:left;
	margin-top:0px;
	margin-left:0px;
	padding:0;
	width:680px;
	float:right;
	}

.Content ul{
	list-style:none;
	padding-left:10px;
	margin:10px 0px;
	}

.Content ul li{
	margin-bottom:5px;
	background: url(images/bullet.gif) no-repeat 0px 3px;
	padding-left:20px;
	margin-left:25px;
	}


/* ______________________ Left Navigation ______________________ */		

#leftNav {
	width:220px;
	position:relative;
	text-align:left;
	float:left;
	position:relative;
	
	}
	
#leftNav ul{
	list-style:none;
	margin:0px;
	margin-bottom:0px;
	padding:0px;
	position:relative;
	font-size:11px;
	font-weight:500;
	margin-bottom:10px;
	}

#leftNav ul li{
	position:relative;
	padding:0px;
	margin:0;
	border-bottom:#ECECEC solid 1px;
	border-top:#FFF solid 1px;
	}

#leftNav ul li a{
	background:url(/images/bullet.gif) no-repeat 5px 6px;
	display:block;
	padding:5px 5px 5px 25px;
	margin-bottom:1px;
	color:#1A1A16;
	}

#leftNav ul li a:hover{
	background:#ECECEC url(/images/bullet_over.gif) no-repeat 5px 6px;
	color:#46BCD2;
	}

#leftNav h2, #leftNav h3{
	padding:20px 0px 5px 0px;
	margin:0;
	border-bottom:#ECECEC solid 1px;
	}		
	
/* ______________________ four Column ______________________ */	
	
.fourCol{
	width:220px;
	float:left;
	margin-right:10px;
	}

.end{
	margin-right:0;
	}
	
/* ______________________ three Column ______________________ */	

#threeCols{clear:both; padding:0px;}
	
#threeCols .first,
#threeCols .second,
#threeCols .third{
	margin:10px 0px;
	width:300px;
	padding:10px;
	float:left;
	margin-right:10px;
	background:#F1F1F1;
	-moz-border-radius:5px 5px 5px 5px; border-radius:5px 5px 5px 5px;
	height:170px;
	}

#threeCols .first{width:290px;}
#threeCols .third{width:290px;margin-right:0;}	
	
/* ______________________ Footer ______________________ */

#footwrapper{
	clear:both;
	background:url(/images/bg-foot.gif) repeat-x;
	padding:20px 0px 10px 0px;
	}
	
	

#footer {
	clear:both;
	position:relative;
	font-size:11px;
	color:#FFF;
	text-align:left;
	margin:0 auto;
	width:930px;
	border:0;
	text-align:left;
	line-height:1.5em;
	border-top:#4A4C4B solid 3px;
	}

#webtag{
	background:url(images/webtag.png) no-repeat;
	width:57px;
	height:165px;
	position:absolute;
	right:5px;
	top:-12px;
	}

#webtag span{
	display:block;
	margin-bottom:0px;
	width:32px;
	height:32px;
	margin-left:15px;
	}
	
#webtag span.top{margin-top:25px;}	

#footer h3{
	margin:15px 0 5px 0;
	color:#000;
	font-weight:bold;
	}

#footer h4{
	color:#4A4C4B;
	margin:15px 0;
	font-weight:500;
	font-size:16px;
	text-shadow:0 1px 1px #010101;
	}

#footer a{
	font-weight:500;
	color:#4A4C4B;
	text-shadow:0 1px 1px #010101;
	}

#footer a:hover{color:#FFF;}


.foot1, .foot2, .foot3, .foot4{
	text-align:left;
	width:220px;
	float:left;
	margin-left:10px;
	height:150px;
	}

.mapIcon { float:right; margin-right:10px; }

.mapContact { float:right; width:300px; }


/*--------------------------- Specific SignUp ---------------------------*/

.mailing{
	clear:both;
	border:#4A4C4B solid 1px;
	border-left:0px;
	border-right:0px;
	padding-top:10px;
	height:34px;
	}

form.signUp{padding:0; position:relative; height:10px; margin:0;}

form.signUp span.footlabel{
	float:left;
	display:block; 
	padding-top:5px; 
	font-weight:500;
	color:#4A4C4B;
	text-shadow:0 1px 1px #010101;
	background: url(/images/mail-icon.png) no-repeat 0px 7px; 
	padding-left:25px;
	}

form.signUp div{display:inline; float:left; clear:none;}
	
form.signUp label{
	width:80px !important;
	margin-bottom:0px;
	margin-left:10px;
	font-size:11px !important;
	
	}	
	
form.signUp input{
	width:95px;
	background:#4A4C4B;
	margin-bottom:0px;
	border:0;
	color:#FFF; 
	}

form.signUp input.button{
	margin-top:-4px;
	text-align:right;
	margin-left:20px;
	background:url(/images/post.png) no-repeat; 
	font-weight:bold; 
	width:90px;
	font-size:11px;
	border:0;
	color:#4A4C4B;
	padding-left:35px;
	cursor:pointer;
	}	

form.signUp span.error{
	position:absolute;
	background:url(/images/speach.png) no-repeat;
	padding:8px 5px 3px 5px;
	text-shadow:none;
	}
		

/*Legal Nav*/

.companylegal{
	text-align:left;
	clear:both;
	width:930px;
	margin:20px 0px;
	}

#legal{float:right; max-width:370px/*ie7*/;}

#legal ul {
	list-style:none; 
	padding:0;
	margin:0px auto;
	position:relative;
	text-align:right;
	border:none;
	float:right;
	}
	
#legal ul li {
	display:inline;
	float:right;
	margin:0;
	position:relative;
	text-align:center;
	}

#legal ul li a{
	display:block;
	padding:0px 5px 0px 5px;
	}

#legal ul li a:hover{
	color:#FFFFFF;
	}
	


 
 /*BLOCK List*/
 
 ul.block, ul.blockGallery{
 	margin:0;
 	padding:0;
 	}
ul.blockGallery{
	Margin-top:15px;
  	}
 
 ul.block li, ul.blockGallery li{
 	display:block;
 	width:160px;
 	height:160px;
 	float:left;
 	margin:0 7px 10px 0;
 	padding:0;
 	text-align:center;
 	background:none;
 	}
 
 ul.blockGallery li{
 	height:107px;
 	}
 
 ul.block li a span, ul.blockGallery li a span{
 	display:block;
 	height:110px;
 	padding:0;
 	vertical-align:middle;
 	}
 
 ul.blockGallery li a span{
 	height:100px;
 	}
 
 ul.block li a, ul.blockGallery li a{
 	color:#FFF;
 	text-shadow:0 1px 1px #000;
 	display:block;
 	padding:0px;
 	height:160px;
 	font-weight:bold;
 	background:url(images/darkBack.png) repeat;
 	}
 
ul.blockGallery li a {
 	height:110px;
 	}
 
ul.block li a:hover, ul.blockGallery li a:hover{
 	background:url(images/liteBack.png) repeat;
 	color:#FFF;
 	text-shadow:0 1px 1px #1d3909;
 	}
 
/* Portfolio */

.thumbList{
	
	}

.thumb{	
	width:220px;
	background:#FFF;
	float:left;
	margin-right:10px;
	margin-bottom:10px;
	position:relative;
	}

.thumbend{
	margin-right:0;
	}

	
	
.thumbDesc{
	display:none;
	background:#46BCD2 url(/images/thumbTile.png) repeat;
	position:absolute;
	top:0px;
	left:0px;
	width:180px;
	padding:10px 20px;
	height:150px;
	font-size:11px;
	}

.thumb a:hover .thumbDesc{display:block; color:#FFF; cursor:pointer/*ie7*/;}
	
.thumb a h3{
	margin:0;
	padding:0;
	font-size:14px;
	padding-left:0px;
	text-shadow:none;
	height:35px;
	overflow:hidden;
	padding-top:70px;
	color:#FFF;
	line-height:16px;
	}
	
#portfolioImages img{
	margin-top:10px;	
	}
	
#portfolioDesc h1{
	font-size:18px;
	}

#portfolioDesc h3{
	font-size:14px;
	font-weight:bold;
	border-bottom:none !important;
	clear:both;
	}

#portfolioDesc .content{
	font-size:12px;
	line-height:18px;
	}

#portfolioDesc .url a{
	margin:10px 0px;
	padding:5px 0px;
	border:#F1F1F1 solid 1px;
	font-weight:bold;
	font-size:11px;
	display:block;
	text-align:center;
	width:105px;
	background:#1A1A16;
	color:#FFF;
	text-shadow:none;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	}

#portfolioDesc .url a:hover{
	background:#46BCD2;
	}

#portfolioDesc ul.category {
	list-style:none; 
	padding:0;
	margin:0px auto;
	position:relative;
	text-align:left;
	border:none;
	font-size:11px;
	}

#portfolioDesc ul.category li {
	display:inline;
	float:left;
	position:relative;
	margin:0px 5px 5px 0;
	border:none;
	}
	
#portfolioDesc ul.category li a {
	display:block;	
	text-align:center;
	font-weight:bold;
	padding:7px 10px;
	color:#1A1A16;
	background:#ECECEC;
	border:#FFF solid 1px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	}

#portfolioDesc ul.category li a:hover{
	background:#ECECEC url(/images/whiteTrans.png) repeat-x;
	}
	
.client_location{
	clear:both;
	margin-top:10px;
	background:url(/images/babypin.png) no-repeat 0px 5px;
	padding-left:25px;
	padding-top:10px;
	height:25px;
	font-size:11px;
	border-top:#FFF solid 1px;
	}	
	
/* Portfolio Navigation */	

.portNav{
	height:21px;
	padding:5px 0px 5px 53px;
	border-top:#F1F1F1 solid 1px;
	border-bottom:#F1F1F1 solid 1px;
	}

.portNav .thumbs{
	width:42px;
	height:21px;
	float:left;
	padding:0px 5px;
	margin:0px 5px;
	border-left:#F1F1F1 solid 1px;
	border-right:#F1F1F1 solid 1px;
	}

.portNav .thumbs a{
	background:transparent url(../images/thumbBack.png) no-repeat 0 0;
	display:block;
	}

.portNav .thumbs a:hover{
	background:transparent url(../images/thumbBack_on.png) no-repeat 0 0;
	display:block;
	}

.portNav .left, #portfolioDesc .right{
	width:21px;
	height:21px;
	float:left;
	}

.portNav .left a, #portfolioDesc .right a{
	background:transparent url(images/circle.png) no-repeat 0 0;
	display:block;
	}

.portNav .left a:hover, #portfolioDesc .right a:hover{
	background:transparent url(images/circle_on.png) no-repeat 0 0;
	display:block;
	}

#portfolioImages{
	font-size:11px;
	font-weight:500;
	}	
	
	
.pager{
	clear:left;
	text-align:center;
	font-size:11px;
	border-top:#ECECEC solid 1px;
	margin-bottom:10px;
	font-weight:500;
  }
  
.pagerWrap{
	border-top:#FFF solid 1px;
	padding-top:5px;
	} 

.pager .next, .pager .previous{
	float:right;
	padding:3px 0;
	}
 
.pager .numbers{
	height:21px;
	float:right;
	border-top:none;
	border-bottom:none;
	padding:0px 5px 0px 10px;
	margin:0px 10px;
	
  }

.pager .numbers a{
  	display:block;
  	height:21px;
  	width:21px;
  	padding:3px 0;
  	text-align:center;
  	background:transparent url(../images/circle.png) no-repeat 0 0;
  	float:left;
  	margin-right:5px;
  	color:#1A1A16;
  	}
  
.pager .numbers a:hover{
	background:transparent url(../images/circle_over.png) no-repeat 0 0;
	color:#FFF;
	}

.pager .numbers a.current{
	background:transparent url(../images/circle_on.png) no-repeat 0 0;
	color:#FFF;
	}

/*___ PLANNER ___*/

#planner p.instructions{
	background:#ffffe6;
	border:#ffffb3 solid 1px;
	padding:10px;
	margin-bottom:10px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	}
	
#planner form label{
	width:250px;
	margin-right:10px;
	}	

#planner form .boolean label{
	width:450px;
	}
	
/* Blog List */

.blogentry{
	position:relative;
	}
	
.datetab{
	width:40px;
	height:83px;
	background:url(/images/date-tab.png) no-repeat;
	z-index:20;
	position:absolute;
	right:0px;
	top:0px;
	}

.datetab span{
	display:block;
	text-align:center;
	color:#FFF;
	font-weight:bold;
	padding-top:10px;
	line-height:12px;
	}

.blogpost{
	border-right:#CCC solid 4px;
	padding-right:10px;
	margin-right:36px;
	font-size:10px;
	}

.blogpost h2, .blogpost h1{
	margin:5px 0px;
	padding:0px;
	}

.blogpost h2 a{
	color:#1A1A16;
	}

.blogpost h2 a:hover{
	text-decoration:underline;
	}	
	
.blogStripCont{
	border-right:#CCC solid 4px;
	padding:1px 10px 1px 0px;
	margin-right:36px;
	}
	
p.blogButton {
	background:url(/images/post.png) no-repeat; 
	font-weight:bold; 
	font-size:11px;
	border:0;
	padding:5px 0px;
	margin:0px;
	padding-left:35px;
	height:35px;
	border-right:#CCC solid 4px;
	margin-right:36px;
	}

#blogPager p{float:left; margin-right:15px;}

#blogPager p a{	
	padding:5px 10px !important;
	border:#4A4C4B solid 1px;
	color:#FFF;
	font-weight:bold;
	font-size:85%;
	background:#1A1A16;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	}
	
.cloud1 {
   font-size: 90%;
}
.cloud2 {
   font-size: 100%;
}
.cloud3 {
   font-size: 120%;
}
.cloud4 {
   font-size: 140%;
}
.cloud5 {
   font-size: 160%;
}	
	
/* Support Pages */	

#supportDesk{
	background:#1A1A16;
	color:#FFF;
	padding:1px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	position:relative;
	}

#supportDesk p{
	padding:5px 10px;
	margin:0px;
	border:#4A4C4B solid 1px;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	}

#supportDesk a, #supportDesk b{
	font-weight:500;
	text-shadow:0 1px 1px #010101;
	}
	
#supportDesk a{color:#4A4C4B;}

#helpTop, #helpBot{
	height:32px;
	width:16px;
	position:absolute;
	top: 10px;
	left:-16px;
	z-index:10;
	background-image: url(images/help.png);
	}
	
#support ul li{
	margin-bottom:5px;
	background: url(images/help_16.png) no-repeat 0px 0px;
	padding-left:20px;
	margin-left:25px;
	}