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

body{
background-image:url(images/bg.jpg);
background-repeat:no-repeat;
background-position:top center;
background-color:#7d9ab8;
}
#container{
width:960px; margin:0px auto;
}
.clear{clear:both;}
.spacer{width:100%; height:10px;}
#header{
margin:0 auto;
width:960px;
position: relative;
height: 9em;
}
#logo{
background-image:url(images/logo.png);
background-repeat:no-repeat;
float:left;
width: 239px;
height: 81px;
margin-left: 10px;
margin-top: 12px;
}
.font1{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:18px;
color:#537A97;
}
.font2{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:18px;
color:#333;
}
.font3{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
color:#333;
}
#icons{
width:203px;
height:35px;
float:right;
margin-top:10px;
margin-right: 10px;
}
#word{
float:left;
margin-right:15px;
}
#rss{
float:left;
margin-right:15px;
}
#face{
float:left;
margin-right:15px;
}
#tweet{
float:left;
margin-right:15px;
}
#nav{
clear:both;
position:absolute;
bottom:10px;
}
#banner{
margin:20px auto;
width:910px;
height:125px;
background-image:url(images/welcome_banner.jpg);
background-repeat:no-repeat;
border:2px solid #fff;
}
#mainContent{
width:910px;
margin:0px auto;
}
#content{
float:left;
width:540px;
height: 500px;
}
#content p {
padding-left: 20px;
}
#content img {
padding-left: 25px;
}
/*------------------------styles for internal content-----------------------------------------*/
#contentInternal{
float:right;
width:640px;
}
#contentInternal p{
padding-right:20px;
padding-left: 10px;
}
#contentInternal p.more{
text-align:right;
}
#contentInternal p.client{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
}
#contentInternal ul{
list-style:none;
color: #333;
/*border: 1px solid #666;
background-color:#bacada;*/
}
#contentInternal ul li{
font-family:verdana,geneva,arial;
font-size: 11px;
line-height: 300%;
}
#contentInternal ul.process{
list-style:none;
color: #333;
border: 1px solid #666;
background-color:#bacada;
}
#contentInternal ul.process li{
font-family:verdana,geneva,arial;
font-size: 11px;
line-height: 200%;
padding-left:10px;
}
#contentInternal a.client{
font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#000;
	text-decoration:underline;
	font-size:10px;
}
#contentInternal a.client:hover{
	color:#fff;
}

.services{margin-right:10px; padding:5px; border-bottom:1px dashed #fff;}
.services2{margin-right:10px; padding:5px; border-bottom:1px dashed #fff;}
.services:hover{background-color:#bacada;}

#process{border:1px solid #333;background-color:#bacada;padding:5px;}

#design_comp{border:1px solid #333;background-color:#bacada;padding:5px;}

.project{
	float:left;
	width:50%;
}


/*------------------------end styles for internal content-------------------------------------*/

#separator{
width:61px;
height:420px;
background-image:url(images/sidebar_separator.png);
background-repeat:no-repeat;
float:left;
}
#sidebar{
float:right;
width:300px;
background-image:url(images/services_ov.png);
background-repeat:no-repeat;
height: 450px;
padding-top:50px;
}
#sidebar p.side{
margin-left:0px;
padding-top: 0px;
list-style:none;
}
#sidebar p.side{
font-family:verdana,geneva,arial;
font-size: 11px;
line-height: 300%;
padding-left:10px;
}
#sidebar li:hover{background-color:#bacada;}
/*-----------------------styles for internal sidebar----------------------------------------*/
#sidebarInternal{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:12px;
float:left;
width:200px;
height: 420px;
padding-top:0px;
}
#sidebarInternal ul{
list-style:none;
color:#fff;
}
#sidebarInternal li{
list-style:none;
color:#fff;
}
#sidebarInternal p{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
padding-left:10px;
}
#sidebarInternal a.client{
font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#000;
	text-decoration:none;
	font-size:12px;
	padding-left:10px;
}
#sidebarInternal a.client:hover{
	color:#fff;
}
/*-----------------------end styles for internal sidebar------------------------------------*/

/*----------------------styles for services navigation div--------------------------------*/

#col1{
float:left;
margin-right: 10px;
margin-top: 45px;
width: 200px;
height: 200px;
}
#col1 ul{
list-style:none;
font-family:verdana,geneva,arial;
font-size: 11px;
line-height: 100%;
padding-left:10px;
margin-left:-10px;
}
#buffer{
width:910px;
height:300px;
margin:0 auto;
}
/*----------------------------styles for footer area--------------------------------*/
#footer{
clear:both;
padding-top:10px;
width: 910px;
height:200px;
margin:0px auto;
border-top:1px solid #000;
}
#foot1{
position:relative;
float:left;
width:300px;
height:180px;
margin-top:25px;
}
#foot2{
background-image: url(images/photo_footer.png);
background-repeat: no-repeat;
position:relative;
float:left;
width:600px;
height:180px;
border-left:1px solid #333;
margin-top:25px;
}
#photo_text{
width:280px;
margin-left:150px;
}
#foot4{
padding-top:30px;
clear:both;
text-align:center;
}
#foot4 p{
text-align:center;
}
h2{
        font-family:verdana,geneva,arial;
        font-size: 16px;
        color: #666;
		background-color:#bacada;
		border:1px solid #333;
		padding:3px;
}
h3 
{
        font-family:verdana,geneva,arial;
        font-size: 10px;
		padding-top:12px;
        color: #000;
}
h5
{
		font-family:verdana,geneva,arial;
        font-size: 10px;
        color: #000;
}
p
{
        font-family:verdana,geneva,arial;
        font-size: 10px;
        color: #000;
        line-height: 170%;
        text-indent: 0em;
        text-align: left;
        
}
/* All link_2 links: */

a.link_2:link 
{
        font-family:verdana,geneva,arial;
        color: #000;
        font-size:10px;
        font-weight: 700;
        text-decoration: underline;
}

a.link_2:visited 
{
        font-family:verdana,geneva,arial;
        color: #000;
        font-size:10px;
        font-weight : 700;
        text-decoration: underline;
}

a.link_2:hover 
{
        font-family:verdana,geneva,arial;
        color: #fff;
        font-size:10px;
        font-weight : 700;
}

a.link_2:active 
{
        font-family:verdana,geneva,arial;
        color: #000;
        font-size:10px;
        font-weight: 700;
        text-decoration: underline;
}

/* All link_1 links: */

a.link_1:link 
{
        font-family:verdana,geneva,arial;
        color: #000;
        font-size:10px;
        font-weight: 700;
        text-decoration: underline;
}

a.link_1:visited 
{
        font-family:verdana,geneva,arial;
        color: #000;
        font-size:10px;
        font-weight : 700;
        text-decoration: underline;
}

a.link_1:hover 
{
        font-family:verdana,geneva,arial;
        color: #fff;
        font-size:10px;
        font-weight : 700;
}

a.link_1:active 
{
        font-family:verdana,geneva,arial;
        color: #000;
        font-size:10px;
        font-weight: 700;
        text-decoration: underline;
}

/* All link_3 links: */

a.link_3:link 
{
        font-family:verdana,geneva,arial;
        color: #000;
        font-size:10px;
        font-weight: 700;
        text-decoration: underline;
}

a.link_3:visited 
{
        font-family:verdana,geneva,arial;
        color: #000;
        font-size:10px;
        font-weight : 700;
        text-decoration: underline;
}

a.link_3:hover 
{
        font-family:verdana,geneva,arial;
        color: #666;
        font-size:10px;
        font-weight : 700;
}

a.link_3:active 
{
        font-family:verdana,geneva,arial;
        color: #000;
        font-size:10px;
        font-weight: 700;
        text-decoration: underline;
}
/*-------------------------------------Style for tooltip-----------------------------------*/
#tooltip.pretty {
	font-family: Arial;
	text-align:center;
	border: none;
	width: 110px;
	padding-top:15px;
	height: 50px;
	color:#000;
	background: url('images/bubble.png');
	background-repeat:no-repeat;
}
/*-------------------------------------Style for wordpress popup-------------------------------*/

.wp-popup {  /* This is the class of the div that holds everything */ 
position: relative;
float:right;
margin-left:15px;
width:34px;
height:33px;   
}   
  
div.wp-popup em {   /*This is only here to be search engine friendly.  We do not need to see the text thus the crazy indent*/
    background: url(images/blog_bubble.png) no-repeat;   
    width: 75px;   
    height: 50px;   
    position: absolute;
	/*These are the actual coordinates of the image in the em tags as they relate to the .rss-popup div*/   
    top: 30px; /*This is where the image starts, then it animates to the coordinates in the function*/  
    left: 0px;   
    text-align: center;   
    text-indent: -9999px;   
    z-index: 0;   
    display: none;   
}   
  
#wp-icon {   /* This is the icon that you mouse over in order to trigger the animation */
    width: 34px;   
    height: 33px;   
    background: url(images/wordpress_small.png) no-repeat 0 0;   
    text-indent: -9999px;   
    margin: 0 auto;   
    display: block;   
}
/*-------------------------------------Style for rss popup-----------------------------------*/
  
.rss-popup {  /* This is the class of the div that holds everything */ 
position: relative;
float:right;
margin-left:15px;
width:34px;
height:33px;   
}   
  
div.rss-popup em {   /*This is only here to be search engine friendly.  We do not need to see the text thus the crazy indent*/
    background: url(images/rss_bubble.png) no-repeat;   
    width: 75px;   
    height: 50px;   
    position: absolute;
	/*These are the actual coordinates of the image in the em tags as they relate to the .rss-popup div*/   
    top: 30px; /*This is where the image starts, then it animates to the coordinates in the function*/  
    left: -20px;   
    text-align: center;   
    text-indent: -9999px;   
    z-index: 2;   
    display: none;   
}   
  
#rss-icon {   /* This is the icon that you mouse over in order to trigger the animation */
    width: 34px;   
    height: 33px;   
    background: url(images/rss_small.png) no-repeat 0 0;   
    text-indent: -9999px;   
    margin: 0 auto;   
    display: block;   
}  
/*-------------------------------------Style for facebook popup------------------------------*/

.fb-popup {  /* This is the class of the div that holds everything */ 
position: relative;
float:right;
margin-left:15px;
width:34px;
height:33px;   
}   
  
div.fb-popup em {   /*This is only here to be search engine friendly.  We do not need to see the text thus the crazy indent*/
    background: url(images/facebook_bubble.png) no-repeat;   
    width: 75px;   
    height: 50px;   
    position: absolute;
	/*These are the actual coordinates of the image in the em tags as they relate to the .rss-popup div*/   
    top: 30px; /*This is where the image starts, then it animates to the coordinates in the function*/  
    left: -20px;   
    text-align: center;   
    text-indent: -9999px;   
    z-index: 2;   
    display: none;   
}   
  
#fb-icon {   /* This is the icon that you mouse over in order to trigger the animation */
    width: 34px;   
    height: 33px;   
    background: url(images/facebook_small.png) no-repeat 0 0;   
    text-indent: -9999px;   
    margin: 0 auto;   
    display: block;   
}  
/*-------------------------------------Style for Twitter popup-------------------------------*/
  
.twit-popup {  /* This is the class of the div that holds everything */ 
position: relative;
float:right;
margin-left:15px;
width:34px;
height:33px;   
}   
  
div.twit-popup em {   /*This is only here to be search engine friendly.  We do not need to see the text thus the crazy indent*/
    background: url(images/twitter_bubble.png) no-repeat;   
    width: 100px;   
    height: 75px;   
    position: absolute;
	/*These are the actual coordinates of the image in the em tags as they relate to the .rss-popup div*/   
    top: 30px; /*This is where the image starts, then it animates to the coordinates in the function*/  
    left: -43px;   
    text-align: center;   
    text-indent: -9999px;   
    z-index: 2;   
    display: none;   
}   
  
#twit-icon {   /* This is the icon that you mouse over in order to trigger the animation */
    width: 34px;   
    height: 33px;   
    background: url(images/twitter_small.png) no-repeat 0 0;   
    text-indent: -9999px;   
    margin: 0 auto;   
    display: block;   
} 
/*------------------------------------newform----------------------------------*/
#style label.error{ 
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:10px;
	color:#FFFFFF;
	text-align:left;
	width:200px;
	height:15px; 
	padding-left:20px;
}

label#name_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#coname_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#slogan_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#nature_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#target_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#url_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#color_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#navlinks_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#vision_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#sites_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#special_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#yourname_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#youremail_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#email_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#message_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#code_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#wrong_code{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

#response{height:400px;}
#response p{ color:#fff;font-weight:bold;margin:6px 0px; }
#response p.reply{ color:#666666; font-size:115%; }
#checkmark{ position:relative;top:0px;left:0px; }

#style{
padding:20px;
border:1px solid #666;
}
#style label{
display:block;
font-weight:bold;
text-align:left;
width:180px;
color:#000;
}
#style input{
font-size:12px;
width:250px;
margin-bottom: 10px;
}
#style .button{
margin-top:10px;
width:80px;
height:30px;
text-align:center;
line-height:31px;
color:#000;
font-size:11px;
font-weight:bold;
border:1px solid #666;
}
#style .small{
color:#000;
display:block;
font-size:12px;
font-weight:normal;
text-align:left;
width:180px;
}

/*---------------------------------questionnaire-----------------------------------*/
#quest label.error{ 
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:10px;
	color:#FFFFFF;
	text-align:left;
	width:200px;
	height:15px; 
	padding-left:20px;
}

label#name_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#email_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#message_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#code_error{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

label#wrong_code{background: transparent url(/images/exclamation.png) no-repeat scroll left;}

#response{height:400px;}
#response p{ color:#FFF;font-weight:bold;margin:6px 0px; }
#response p.reply{ color:#666666; font-size:115%; }
#response p.admin_reply{ color:#fff; font-size:115%; }
#checkmark{ position:relative;top:0px;left:0px; }

#quest{
padding:20px;
border:1px solid #666;
}
#quest label{
font-size:14px;
display:block;
font-weight:bold;
text-align:left;
width:300px;
color:#000;
}
#quest input{
font-size:12px;
width:400px;
margin-bottom: 10px;
}
#quest textarea{
margin-bottom: 10px;
}
#quest .button{
margin-top:10px;
width:80px;
height:30px;
text-align:center;
line-height:31px;
color:#000;
font-size:11px;
font-weight:bold;
border:1px solid #666;
}
#quest .small{
color:#000;
display:block;
font-size:12px;
font-weight:normal;
text-align:left;
width:300px;
}


/*---------------------------------fancy_box---------------------------------------*/ 
#img_container{width:650px;margin:20px 0 0 30px;}

div.img
{
  margin-right: 30px;
  margin-bottom:30px;
  height: auto;
  width: auto;
  float: left;
  border: 1px solid #bacada;  
  text-align: center;
}	
div.img img:hover {background-color:#fff;}

div.img img
{
  display: inline;
  padding: 10px;
}

/*-----------------------------------hosting chart style------------------------------------*/

#chart_holder{
width:800px; margin:200px auto;
}

p
{
        font-family:verdana,geneva,arial;
        font-size: 10px;
        color: #000;
        line-height: 170%;
        text-indent: 0em;
        text-align: left;
        
}

/* comparison style */

caption 
{
        text-align: left;
        margin: 0 0 .5em 0;
        font-weight: bold;
}

thead.thead th 
{
        border-right: 1px solid #fff;
        border-bottom: 1px solid #fff;
        padding: 0em;
        background: #036;
        color: #fff;
        font-family: calibri;
        font-size: 12px;
}

tbody.tbody th
{
        font-weight: normal;
        background: #658cb1;
        border-right: 1px solid #fff;
        border-bottom: 1px solid #fff;
        padding: .5em;

}

tbody.tbody td
{
        border-right: 1px solid #fff;
        border-bottom: 1px solid #fff;
        padding: .5em;
}

tr.alternate
{
        background: #D7E0EA;
}

tr.alternate th
{
        background: #8AA9C7;
}

tr.alternate_2
{
        background: #b0c4d7;
}
/*--------------------------------portfolio page----------------------------------------*/

div.port{
float:left;
border-bottom:1px dashed #fff;
border-left:1px dashed #fff;
}