/* ============================= CSS ====================== 
Website Name: pINKStudios
Version: 3.0
Website: www.pinkstudios.net
Author: Marii
========================================================= */

*{
margin:0px;
padding:0px;
}

a{
font:13px Tahoma, Arial, Helvetica, sans-serif; 
font-weight:normal; 
color:#669933; 
text-decoration:none;
}

a:hover{color:#ff6666; text-decoration: underline;}

ul, li {
list-style-image: none;
list-style-type: none;
}

img{border:0px; background-position: center;}

h2{
font-family: Lucida Grande, Georgia, Times, Arial, Tahoma;
font-size: 25px;
color: #ccc;
font-weight: normal;
padding-top: 10px;
padding-bottom: 10px;
}

p{
font-family: Tahoma;
font-size: 12px;
text-align: justify;
}

.clear  { clear:both;}

.vline{border-right: 1px solid #CCCCCC;}

.fRight{
float: right;
}

html{
width:100%;
height:100%;
}

body{
font-family: Tahoma;
color: #666666;
font-size: 11px;
line-height: 18px;
background-repeat: repeat-x;
}

/* ============================= classs by color ====================== */
.pink{
color: #ff3693;
}

.orange{
color: #CC6600;
}

/* ============================= main ====================== */

#main{
margin:0 auto;
overflow:hidden;
background-color: #FFF;
/*background-color: #414141;*/
/*width: 980px;*/

}

/* ============================= HEADER ====================== */
/* ============================= header ====================== */

#header{
background-image: url(images/header.gif);
background-repeat: repeat-x;
height: 116px;
background-position:top;
margin: 0 auto;
}

#headerWrapper{
margin:0 auto;
overflow:hidden;
width: 980px;
}

/* ============================= logo ====================== */
#logo{
background-image: ("images/logo_pinkstudios.png") no-repeat transparent;
width: 275px;
height: 92px;
padding: 0px 0px 0px 0px;
position: absolute;
top:13px;
margin:0px;
}

/* ============================= menu ====================== */
#navBar{
float:right;
width:65%;
}

#navMenu{
margin: 47px 0px 0px 0px;
color: #fff;
font-size: 13px;
font-variant: small-caps;
}


/* ============================= menu ====================== */

#nav-bar{
background-image: url(images/menu_bg.gif);
background-repeat: repeat-x;
height: 34px;

}

#nav-menu{
width: 970px;
margin: 0px auto 0px;
}

#nav-menu ul{
background-position: center;
width: 980px;
margin: 0 0 0 62px;
padding: 0 0 0 62px;

}

#nav-menu li{
list-style-type:none;
float:left;
padding:0px 0px 0px 0px;
}

/* ============================= banner ====================== */
#bannerBg{
background-image: url(images/gradient_background.gif);
height: 246px;
background-repeat: repeat-x;
}


#banner{
clear: both;
/*background: url(images/banner_bg.jpg) repeat-x scroll 0 0;*/
background: transparent url(images/banner.png) no-repeat scroll center top;
height: 247px;
background-position:top;
margin: 0 auto;
}

#newBanner{
background: transparent url(images/feat-main.gif) no-repeat scroll center top;
height: 247px;
background-position:top;
margin: 0 auto;
}

#bannerMenuBg{
background-color: #FFFFFF;
width: 100%;
}

#bannerMenu{
background-color: #fff;
width: 1000px;
height: 94px;
position: relative;
margin: 0 auto;
}

.bannerItems{
width: 250px;
padding: 8px 0px 8px 0px;
float: left;
}

.item1Left{
background-image: url(images/pinkcheckmark.gif);
background-repeat: no-repeat;
width: 29px;
height: 29px;
float: left;
margin: 17px 0px 0px 4px;
}

.item1Left img{
margin: 17px 0px 0px 4px;
}

.item1Right{
}

.item1Right img{
padding: 0 0 0 12px;
}

/* ============================= wrapper ====================== */

#mainWrapper{
/*background: #FFF url(images/white_bg.gif) repeat-y;*/
margin: 0px auto 0px;
width: 1000px;
}

#wrapper{
width:970px;
margin: 0 auto;
}

#mainContent{
background-color: #fff;
}

/* ============================= main page ====================== */




/* ============================= left side ====================== */

#left{
width:660px;
float:left;
position: relative;
padding-bottom: 30px;
overflow: hidden;
padding-top: 10px;
padding-right: 20px;
padding-left: 20px;
background-color: #FFF;
}

/* ============================= right side ====================== */

#right{
width:260px;
float:right;
padding:0px;
position: relative;
overflow: hidden;
padding-top: 10px;
padding-right: 19px;
padding-left: 20px;
background-color: #FFF;
border-left: 1px solid #CCCCCC;
}

/* ============================= right side ====================== */

#columnLeft{
width:300px;
float:left;
padding:0px;
position: absolute;
overflow: hidden;
padding-top: 10px;
padding-right: 20px;
padding-left: 20px;
background-color: #FFF;
}

#columnRight{
width:300px;
float:right;
padding:0px;
position: relative;
overflow: hidden;
padding-top: 10px;
padding-right: 20px;
padding-left: 20px;
background-color: #FFF;
}

/* ============================= details ====================== */

.pinkArrow{
background:url(images/pink_arrow.gif) 0 6px no-repeat; 
height:16px; 
padding:0 0 1px 16px; 
font:12px/14px Tahoma, Arial, Helvetica, sans-serif; 
font-weight:normal; 
color:#72ab13; margin-top:14px;
}

.inline{
display: inline;
float: left;
padding: 5px;
}

.width250{
width: 250px;
float: left;
padding: 0 0 31px 28px;
}

.width300{
width: 300px;
}

.width850{
width: 850px;
margin: 0 auto;
}

.width900{
width: 900px;
margin: 0 auto;
}

/* ============================= social networking ====================== */

#socnetw{
width:280px;
float:left;
position: relative;
overflow: hidden;
}

#socnetw img{
float:left;
padding:20px;
position: relative;
}

/* ============================= main sideboxes ====================== */
/* ============================= sidebox 1 ====================== */

#box1{
font-family: Cambria, Georgia, Tahoma, Arial;
font-size: 16px;
color: #339999;
width:237px;
padding: 3px 9px;
margin: 30px 0px 0px 16px;
float:left;
position: relative;
/*border-bottom: 1px solid #999;*/
}

#box1 img{
padding: 19px 9px;
}

#box1 .title{
font-family: Cambria, Georgia, Tahoma, Arial;
font-size: 16px;
color: #666;
float: left;
padding: 16px 0 0px 8px;
}

#box1 h2{
font-family: Verdana;
font-size: 11px;
text-transform: uppercase;
color: #669999;
float:left;
padding: 16px 0px 15px 0px;
}



/* ============================= side-menu ====================== */

#menu-items{
width:250px;
margin: 0 22px;
float:left;
position: relative;

}

#menu-items p{
margin: 8px 0px 0px 14px;
padding: 0px 0 0 14px;
font-family: Lucida Sans Unicode,Trebuchet MS, Arial, sans-serif;
font-size: 12px;
color: #669999;
/*border-bottom: 1px dotted #999;*/
}

#menu-items a{
font:12px Tahoma, Arial, Helvetica, sans-serif; 
font-weight:normal; 
color:#669933; 
text-decoration:none;
}

#menu-items a:hover{
color:#339999; 
text-decoration:underline;
}

#menu-items .title{
margin: 30px 0 0;
padding: 3px 9px;
font-family: Cambria, Garamond, Lucida Grande, Arial;
font-size: 28px;
color: #666;
border-bottom: 1px solid #999;
}

.quote{
font-family: Cambria, Tahoma, Georgia, Arial;
font-size: 14px;
color: #cc9900;
border-left: 1px solid #CCC;
padding: 5px;
/*margin: 0 0 0 19px;*/
}


/* ============================= pages ====================== */

.line{
border: 1px dotted #ccc;
}

#featured{
width: 805px;
height: 300px;
padding: 40px 0 0;
}


#featured-box1{
background-image: url(images/featured_services_box1.png);
background-repeat: no-repeat;
width: 200px;
height: 263px;
float: left;
padding: 0px 0px 0px 0px;
/*margin: 0px 13px 0px 0px;*/
}


#featured-box2{
background-image: url(images/featured_services_box2.png);
background-repeat: no-repeat;
width: 200px;
height: 263px;
float: left;
padding: 0px 0px 0px 0px;
/*margin: 0px 13px 0px 0px;*/
}


#featured-box3{
background-image: url(images/featured_services_box3.png);
background-repeat: no-repeat;
width: 200px;
height: 263px;
float: left;
padding: 0px 0px 0px 0px;
/*margin: 0px 13px 0px 0px;*/
}

#featured-box4{
background-image: url(images/featured_services_box4.png);
background-repeat: no-repeat;
width: 200px;
height: 263px;
float: left;
padding: 0px 0px 0px 0px;
/*margin: 0px 13px 0px 0px;*/
}

.featured-image {
margin: 54px 0px 0px 0px;
}

.featured-description{
font-family: Tahoma, Arial;
font-size: 12px;
color:#666;
padding: 8px 13px 0px 5px;
text-indent: 5px;
}

#title{
margin: 30px 0 0;
padding: 3px 9px;
font-family: Cambria, Garamond, Lucida Grande, Arial;
font-size: 28px;
color: #666;
border-bottom: 1px solid #999;
}

#title a{
font-family: Cambria, Garamond, Lucida Grande, Arial;
font-size: 28px;
color: #666;
}

#title img{
padding: 10px 0px 0px 10px;
}

#subtitle {
width:580px;
padding: 0px;
}

#subtitle p{
font-family: Lucida Grande, Cambria, Tahoma, Arial,Helvetica,sans-serif;
font-size: 18px;
line-height: 18px;
text-align: justify;
color: #cc6600;
padding: 32px 0 0 40px;
text-transform: uppercase;
}

#subtitle h1{
font-family: Lucida Grande, Cambria, Tahoma, Arial,Helvetica,sans-serif;
font-size: 14px;
line-height: 18px;
text-align: justify;
color: #cc6600;
padding: 16px 0 0 40px;
}

.large-text{
margin: 30px 0 0;
font-family: Cambria, Garamond, Lucida Grande, Arial;
font-size: 22px;
color: #666;
}

.med-text{
margin: 30px 0 0;
font-family: Cambria, Garamond, Lucida Grande, Arial;
font-size: 18px;
color: #339999;
}


#content{
width:605px;
padding: 15px 20px 15px 40px;
}

#content p{
font-family:Tahoma;
font-size: 12px;
color: #666666;
line-height: 18px;
text-align: justify;
padding-bottom: 10px;
}

#content .thankyou{
width: 600px;
height: 90px;
background-color: #ccc;
border: 1px solid #669933;
}


#faq{
}

.indent{
color: #666;
border-left: 1px solid #ddd;
margin: 0px 18px 0 25px;
padding: 0px 0px 0px 17px;
font-style: italic;
}

.indent-feedback{
color: #666;
border-left: 1px solid #ddd;
margin: 0px 18px 0 25px;
padding: 0px 0px 0px 17px;
}

.fdbk-name{color: #FF3399; font-weight: bold; float: right;}
.fdbk-company{color: #999999; font-weight: bold; float: right;}
.fdbk-website{color: #999999; float: right; }

/* ============================= portfolio ====================== */

#portfolio-wrapper{
width: 650px;
}

.portfolio-left{
width: 250px;
float: left;
padding: 0 0 31px 28px;
}

.portfolio-right{
width: 300px;
height: 280px;
float: left;
padding: 0px 0px 0px 13px;
}

.portfolio-top{
width: 650px;
float: left;
padding: 0px 0px 22px 28px;
}

.portfolio-bottom{
width: 600px;
float: left;
padding: 2px 20px 50px 40px;
}

.portfolio-subtitle{
padding: 15px 16px 10px 0px;
}

.proj-title{
font-family: Arial, Tahoma, Georgia, Lucida;
font-size: 14px;
font-weight: bold;
color: #98c340;
}

.proj-url{
font-family: Arial, Tahoma, Georgia, Lucida;
font-size: 12px;
color: #66cece;
}



.website-title{
padding: 3px 9px;
font-family: Cambria, Garamond, Lucida Grande, Arial;
font-size: 22px;
color: #666;
border-bottom: 1px solid #999;
}

.visit-btn{
background: url(images/button_visit_website.gif) no-repeat scroll right;
margin: 0 auto;
/*width: 300px;*/
height: 21px;
}

#small-text{
font-size: 10px;
font-family: Tahoma;
}

.green-font {
color: #339900;
}

/* ============================= request form ====================== */
.required{
font-weight: bold;
color: #cc6600;
}


/* ============================= main bottom ====================== */
#bottom{
width: 800px;
margin:0px;
clear:both;
padding: 18px 0px 0px 31px;
margin: 0px;
}

#bottom p{
clear:both;
font-family: Tahoma;
font-size: 12px;
color: #666666;
line-height: 18px;
text-align: justify;
padding: 10px 12px 0px 7px;
}


.checkmark{
background:url(images/checkmark.gif) 0 6px no-repeat; 
height:16px; 
padding:0 0 1px 16px; 
font:12px/14px Tahoma, Arial, Helvetica, sans-serif; 
font-weight:normal; 
color:#72ab13; margin-top:14px;
}

#col1{
width: 230px;
float: left;
padding: 0 10px 10px 0;
border-right: 1px solid #ccc;
height:220px;
}

#bottom img{
clear:both;
padding: 10px 12px 0px 7px;
}

#col1 ul li{
background-image: url(images/checkmark.gif);
background-repeat: no-repeat;
}
/*
#bottom li.checkmark{
background:url(images/checkmark.gif) 0 6px no-repeat; 
height:16px; 
padding:0 0 1px 16px; 
font:12px/14px Tahoma, Arial, Helvetica, sans-serif; 
font-weight:normal; 
color:#72ab13; margin-top:14px;
}
*/

#col2{
width: 230px;
float: left;
padding: 0 10px 10px;
border-right: 1px solid #ccc;
}

#col3{
width: 230px;
float: left;
padding: 0 0 10px 10px;
}

.more-btn{
background: url(images/button_more.gif) no-repeat scroll;
background-position: right;
margin: 0 auto;
width: 210px;
height: 21px;
}

.services-more-btn{
background: url(images/button_more.gif) no-repeat scroll;
background-position: right;
margin: 0 auto;
width: 610px;
height: 21px;
}

/* ============================= footer ====================== */

#footer{
width:100%; 
height:60px; 
margin:0px 0 0 5px; 
position:relative; 
padding:0px;  
background-image:url(images/footer.gif); 
background-repeat: repeat-x; 
float:right;
}

#footer-left{
width: 70%; 
float: left;
}

#footer-right{
width: 30%;
float: left;
}

#footer p{
margin:15px 0 0 40px; 
font:10px/18px Tahoma, Arial, Helvetica, sans-serif; 
font-weight:normal;
}

#footer a{
font:10px/18px Tahoma, Arial, Helvetica, sans-serif; 
font-weight:normal; 
color:#669933; 
text-decoration:none;
}

#footer a:hover{
color:#ff6666; 
text-decoration:underline;}

#footer img {
height:37px; 
width:123px; 
position:absolute; 
top:17px; 
left:510px;
}


