/* CSS Document */

body{
margin: 0;
padding: 0;
background: #afafaf url(bg.jpg);
font-family: tahoma, arial, helvetica, sans-serif;
font-size: 16px;
color: #333333;
}

#gradient{
margin: 0;
padding: 0;
width: 100%;
height: 800px;
background: url(bg-grad.jpg) repeat-x;
position: absolute;
top: 0;
left: 0;
}

.wrapper{
width: 820px;
height: 100px;
margin: 0 auto;
}

.main{
float: left;
width: 820px;
height: auto;
border-top: 2px solid #333333;
border-bottom: 2px solid #333333;
padding: 0 0 5px 0;
margin: 85px 0 5px 0;
}

.content{
float: left;
width: 820px;
height: auto;
padding: 5px 0;
border-top: 1px solid #333333;
border-bottom: 1px solid #333333;
margin: 5px 0 0 0;
}

#logo{
width: 140px;
height: auto;
margin: 10px;
float: left;
}

#logo h1{
margin: 19px 0 16px 0;
padding: 0;
background: url(wojpoj-logo.jpg) no-repeat;
height: 65px;
width: 140px;
text-indent: -99999px;
float: left;
}

#logo h4{
margin: 0;
padding: 0;
background: url(website-pricing.gif) no-repeat;
height: 197px;
width: 140px;
text-indent: -99999px;
float: left;
}

#logo ul{
margin: 21px 0 20px 0;
padding: 0;
background: url(other-pricing.gif) no-repeat;
height: 272px;
width: 140px;
text-indent: -99999px;
float: left;
list-style: none;
}

#intro{
width: 300px;
height: auto;
margin: 10px 0 10px 10px;
float: left;
}

#intro h2{
margin: 34px 0 0 0;
padding: 0;
background: url(fully-managed-websites.gif) no-repeat;
height: 35px;
width: 300px;
text-indent: -99999px;
float: left;
}

#intro p{
color: #000000;
margin: 20px 0;
text-align: justify;
float: left;
}

#intro #features{
float: left;
}

#intro #features p{
color: #222222;
font-size: 14px;
text-align: justify;
margin: -2px 0 10px 30px;
padding: 0;
}

#intro #features h3{
text-indent: -99999px;
height: 30px;
width: 300px;
float: left;
margin: 0;
padding: 0;
}

#intro #features #domainnames{
background: url(services.gif) 0px 0px no-repeat;
}

#intro #features #designdevelopment{
background: url(services.gif) 0px -30px no-repeat;
}

#intro #features #hosting{
background: url(services.gif) 0px -60px no-repeat;
}

#intro #features #contentupdates{
background: url(services.gif) 0px -90px no-repeat;
}

#intro #features #backups{
background: url(services.gif) 0px -120px no-repeat;
}


#contact{
width: 300px;
height: auto;
margin: 10px 0 10px 10px;
float: right;
padding: 40px 10px 0 20px;
border-left: 2px dotted #555555;
}

#contact h2{
width: 0;
height: 0;
text-indent: -99999px;
margin: 0;
padding: 0;
}

#contact #contactus{
margin: 19px 0 0 0;
padding: 0;
background: url(contact-us.gif) no-repeat;
height: 110px;
width: 300px;
text-indent: -99999px;
float: left;
}

.contactform{
float: right;
margin: 20px 0;
}

.contactform .formtext{
width: 294px;
height: 22px;
float: left;
border: 0;
background-color: #707070;
font-size: 16px;
padding: 3px 3px 2px 3px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;	
}

.contactform .fullname{
background: url(bg-grad.jpg) -500px -200px;
}

.contactform .email{
background: url(bg-grad.jpg) -500px -256px;
}

.contactform .phone{
background: url(bg-grad.jpg) -500px -312px;
}

.contactform .currentwebsite{
background: url(bg-grad.jpg) -500px -368px;
}

.contactform .comment{
background: url(bg-grad.jpg) -500px -424px;
}

.contactform .formtextarea{
width: 294px;
height: 100px;
float: right; 
border: 0;
background-color: #707070;
font-size: 14px;
padding: 3px 3px 2px 3px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;	
}

.contactform .formsubmit{
margin: 10px 0 0 0;
float: right;
height: 35px;
width: 115px;
}

.contactform label{
margin: 7px 0 3px 0;
width: 300px;
height: 20px;
float: left;
color: #FFFFFF;
font-size: 18px;
}

.content .item{
width: 800px;
height: auto;
float: left;
border-top: 2px dotted #666666;
margin: 0;
padding: 50px 10px;
}


.content .title{
padding: 5px 10px 10px 10px;
float: left;
}

.content .title h2{
text-indent: -99999px;
height: 40px;
width: 800px;
float: left;
margin: 15px 0;
padding: 0;
}

.content .title #ovenfresh{
background: url(oven-fresh.gif) no-repeat;
}

.content .title #halfbaked{
background: url(half-baked.gif) no-repeat;
}

.content .image img{
width: 420px;
height: 310px;
float: left;
padding: 20px;
background-color: #FFFFFF;
border: 1px solid #8A8A8A;
margin: 0;
-moz-border-radius: 2px;
-khtml-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;		
}

.content .description{
width: 300px;
height: 300px;
float: right;
}

.content .description h3{
margin: 0 0 10px 0;
font-size: 24px;
padding: 0;
color: #333333;
width: 300px;
float: left;
}

.content .description p{
font-size: 18px;
font-weight: normal;
color: #555555;
}

.content .description a{
width: 114px;
height: 21px;
padding: 10px;
float: left;
display: block;
background: url(bg-grad.jpg) 0 -500px;
-moz-border-radius: 2px;
-khtml-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;	
}

.content .description a:hover, .content .description a:focus{
background: url(bg-grad.jpg) 0 -400px;
}

.content .description img{
border: 0;
}

#footer{
float: left;
width: 780px;
height: auto;
padding: 10px;
margin: 50px 10px;
background: url(bg-16tint.jpg);
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;	
}

#footer #convinced{
text-indent: -99999px;
height: 40px;
width: 780px;
float: left;
margin: 15px 0 0 0 ;
padding: 0;
background: url(convinced.gif) no-repeat;
}

#footer .info{
width: 440px;
float: left;
}

#footer .info span{
font-size: 10px;
}

#footer .contactform{
width: 300px;
float: right;
}

#footer .contactform .fullname{
background: url(bg.jpg);
}

#footer .contactform .email{
background: url(bg.jpg) 0 30px;
}

#footer .contactform .phone{
background: url(bg.jpg) 0 150px;
}

#footer .contactform .currentwebsite{
background: url(bg.jpg) 100px 0;
}

#footer .contactform .comment{
background: url(bg.jpg) 0 100px;
}

#footer .contactform{
padding: 0;
margin: 0 0 10px 0;
}

#copyright{
margin: 0 0 85px 0;
font-size: 12px;
}

.thanks{
width: 520px;
height: 300px;
float: left;
background: url(thanks.gif) center center no-repeat;
}

.thanks h2{
text-indent: -99999px;
}