﻿@import url("reset.css");
/*
	Title:      Screen styles
	Author:     Poort80 - Frontend
	Copyright:  2009, Poort80  All rights resevered
*/

/* common 
============================================================= */
body {
	margin:0px;
	padding:0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	line-height:20px;
	background-color:#222;
	color:#333;
}
img, img {
	border:none;
}
h1 span.txtimg, h2 span.txtimg, h3 span.txtimg, h4 span.txtimg, h5 span.txtimg, h6 span.txtimg, a span.txtimg {
	display:none;
}
h1, h2, h3, h4, h5, h6 {
	margin:0px 0px 5px 0px;
	padding:0px;
}
h1, .h1 {
	font-size:23px;
}
h2, h2 {
	font-size:21px;
}
h3, h3 {
	font-size:16px;
	color: #00AFE8;
	font-weight: bold;
	margin-bottom: 0;
	padding-bottom: 0;
}
h4, h4 {
	font-size:17px;
}
h5, h5 {
	font-size:15px;
}
h6, h6 {
	font-size:13px;
}
p {
	margin:0px 0px 10px 0px;
	padding:0px;
}
td {
	vertical-align: top;
}
strong {
	font-weight:bold;
}
a {
	text-decoration:underline;
	color:#00afe8;
}
a:hover {
	text-decoration:none;
}
a:active {
	outline:none;
}
#container a[target="_blank"] {
	background:url(../gfx/icons/external.gif) no-repeat right center;
	padding-right:12px;
}
ul, ol {
	margin:0px 0px 10px 30px;
	padding:0px;
}
ul li {
	list-style-image:url(../gfx/li-star.png);
	line-height:20px;
}
.box p a {
	padding-left: 20px;
	text-decoration: none;
	background: url("../gfx/li-star.png") no-repeat left 2px;
}
ol li {
	list-style:decimal;
	line-height:20px;
}
/* common trigger classes
============================================================= */
.hide {
	display:none;
}
hr {
	margin:10px 0px 10px 0px;
	padding:0px;
	height:0px;
	overflow:hidden;
	border:0px;
	border-top:1px solid #999;
	border-bottom:1px solid #fff;
	clear:both;
}
.float_right {
	float:right;
}
.float_none {
	float:none;
}
.float_left {
	float:left;
}
.clear_left {
	clear:left;
}
.clear_both {
	clear:both;
}
.clear_right {
	clear:right;
}
.mb {
	margin-bottom:20px;
}
.mt {
	margin-top:20px;
}
.width100 {
	width:100px;
}
.width150 {
	width:150px;
}
.width200 {
	width:200px;
}
.width250 {
	width:250px;
}
.width300 {
	width:300px;
}
.width350 {
	width:350px;
}
.width400 {
	width:400px;
}
/* buttons
============================================================= */
span.button_submit {
	margin:10px 0px 0px 0px;
	padding:0px 0px 0px 14px;
	display:inline-block;
	height:26px;
	background:url(../gfx/bg-btn-l.png) no-repeat left top;
	position:relative;
}
span.button_submit span {
	margin:0px;
	padding:6px 14px 0px 0px;
	float:left;
	display:block;
	height:21px;
	width:auto;
	background:url(../gfx/bg-btn-r.png) no-repeat right top;
}
span.button_submit span input.submit {
	margin:0px;
	padding:0px;
	width:100%;
	height:100%;
	border:none;
	background:none;
	position:absolute;
	top:0px;
	left:0px;
	cursor:pointer;
}
a.button {
	margin:0px;
	padding:0px 0px 0px 14px;
	display:inline-block;
	height:26px;
	background:url(../gfx/bg-btn-l.png) no-repeat left top;
}
a.button span {
	margin:0px;
	padding:6px 14px 0px 0px;
	float:left;
	display:block;
	height:20px;
	width:auto;
	background:url(../gfx/bg-btn-r.png) no-repeat right top;
	cursor:pointer;
}
a.button:hover, span.button_submit:hover {
	background:url(../gfx/bg-btn-l-on.png) no-repeat left top;
}
a.button:hover span, span.button_submit:hover span {
	background:url(../gfx/bg-btn-r-on.png) no-repeat right top;
}
/* bigger buttons */
span.button_big_submit {
	margin:10px 0px 0px 0px;
	padding:0px 0px 0px 14px;
	display:inline-block;
	height:37px;
	background:url(../gfx/bg-btn-big-l.png) no-repeat left top;
	position:relative;
}
span.button_big_submit span {
	margin:0px;
	padding:10px 14px 0px 0px;
	float:left;
	display:block;
	height:27px;
	width:auto;
	background:url(../gfx/bg-btn-big-r.png) no-repeat right top;
	cursor:pointer;
}
span.button_big_submit span input.submit {
	margin:0px;
	padding:0px;
	width:100%;
	height:100%;
	border:none;
	position:absolute;
	top:0px;
	left:0px;
	cursor:pointer;
	background:url(../gfx/spacer.gif) repeat;
}
a.button_big {
	margin:0px;
	padding:0px 0px 0px 14px;
	display:inline-block;
	height:37px;
	background:url(../gfx/bg-btn-big-l.png) no-repeat left top;
}
a.button_big span {
	margin:0px;
	padding:10px 14px 0px 0px;
	float:left;
	display:block;
	height:27px;
	width:auto;
	background:url(../gfx/bg-btn-big-r.png) no-repeat right top;
	cursor:pointer;
}
a.button_big:hover, span.button_big_submit:hover {
	background:url(../gfx/bg-btn-big-l-on.png) no-repeat left top;
}
a.button_big:hover span, span.button_big_submit:hover span {
	background:url(../gfx/bg-btn-big-r-on.png) no-repeat right top;
}
/* default_form
============================================================= */
.default_form p {
	margin:0px;
	padding:10px;
	border-bottom:1px solid #aaa;
}
.default_form .required {
	margin:0px 0px 0px 10px;
	padding:4px 8px;
	height:20px;
	display:inline-block;
	color:#ff4800;
	background-color:#fffeca;
	position:relative;
	top:1px;
	border:1px solid #fffeca;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	font-size:10px;
	font-weight:bold;
}
.default_form .hide {
	display:none;
}
.default_form p label {
	margin:3px 0px 0px 0px;
	padding-right:10px;
	display:inline-block;
	text-align:right;
	font-weight:bold;
	vertical-align:top;
}
.default_form p input {
	margin:0px;
	padding:4px;
	height:18px;
	border:1px solid #ccc;
	font-size:12px;
}
.default_form p input:focus, .default_form p textarea:focus {
	background:#f0f0f0;
}
.default_form p textarea {
	padding:4px;
	height:150px;
	border:1px solid #ccc;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
}
.default_form input.submit {
	margin:10px 0px 0px 0px;
	width:150px;
	height:30px;
}
.default_form p #ImageCaptcha{
	margin:-6px 0px;
	padding:0px;
	height:30px;
	width:97px;
}
/* .content_header .col1
============================================================= */
.content_header .col1 .nav_supp {
	margin:4px 15px 0px 0px;
	padding:0px;
	float:right;
}
.content_header .col1 .nav_supp li {
	float:left;
	width:40px;
	height:15px;
	line-height:15px;
	text-align:center;
	list-style-image:none;
}
.content_header .col1 .nav_supp li a {
	text-decoration:none;
}
.content_header .col1 .nav_supp li.dash {
	width:10px;
	color:#999;
}
.content_header .col1 .search_form {
	float:right;
	width:210px;
	position:relative;
}
.content_header .col1 .search_form span {
	padding-left:11px;
	background:url(../gfx/bg-left-input.png) no-repeat left center;
	display:block;
}
.content_header .col1 .search_form input.text {
	padding:0px 30px 0px 0px;
	height:23px;
	line-height:23px;
	width:168px;
	border:none;
	background:url(../gfx/bg-right-input.png) no-repeat right center #fff;
	cursor:text;
	font-size:11px;
	color:#666;
}
.content_header .col1 .search_form input.submit {
	margin:0px;
	padding:0px;
	width:18px;
	height:18px;
	background:url(../gfx/icons/magnifier_18.png) no-repeat;
	border:none;
	position:absolute;
	right:8px;
	top:2px;
}
/* .content_header .col2
============================================================= */
.content_header .col2 .logo {
	margin-top:16px;
	width:242px;
	height:64px;
	display:block;
	background:url(../gfx/poort80-hosting-logo.png) no-repeat top left;
	float:left;
}
.content_header .col2 .logo a {
	width:242px;
	height:64px;
	display:block;
}
.content_header .col2 .nav_main {
	margin:2px 0px 0px 0px;
	padding:0px;
	float:right;
}
.content_header .col2 .nav_main li {
	float:left;
	padding:0px 20px;
	height:90px;
	background-color:#fff;
	border-left:1px dotted #fff;
	border-right:1px dotted #fff;
	list-style-image:none;
}
.content_header .col2 .nav_main li.active {
	background-color:#eee;
	border-left:1px solid #E1E1E1;
	border-right:1px solid #E1E1E1;
}
.content_header .col2 .nav_main li a {
	margin-top:36px;
	display:block;
	text-decoration:none;
}
/* container > content_main
============================================================================= */
.content_main img.icon {
	margin-top:-12px;
	float:left;
	position:relative;
}
.content_main h3 {
	margin:0px;
	padding:0px;
	clear:both;
	zoom:1;
}
/* box */
.content_main .box.medium {
	margin:20px 37px 20px 0px;
	width:220px;
	float:left;
}
.content_main .box.medium.last {
	margin-right:0px;
}
.content_main .box.medium .head {
	padding:5px 0px 0px 10px;
	height:25px;
	width:210px;
	background:url(../gfx/box_medium_head.png) no-repeat;
}
.content_main .box.medium .content {
	padding:10px;
	width:198px;
	border-width:0px 1px 0px 1px;
	border-style:solid;
	border-color:#aaa;
	background-color:#f0f0f0;
	overflow:hidden;
}
.content_main .box.medium .foot {
	height:10px;
	width:220px;
	background:url(../gfx/box_medium_foot.png) no-repeat;
}
/* container > content_main > services > col
============================================================================= */
.content_main .services .col {
	margin:0px 10px 0px 0px;
	padding:0px 20px 0px 0px;
	width:300px;
	float:left;
}
.content_main .services .col.last {
	margin:0px;
}
.content_main .services .col h2 {
	margin:0px;
}
/* container > content_main > servicebox > col
============================================================================= */
.content_main .servicebox {
	padding:10px 0px;
	overflow:hidden;
}
.content_main .servicebox .col1 {
	margin:0px 10px 10px 0px;
	padding:0px;
	width:200px;
	float:left;
}
.content_main .servicebox .col2 {
	margin:0px 0px 10px 0px;
	padding:0px;
	width:770px;
	float:left;
}
.content_main .servicebox .col2 h2 {
	font-size:17px;
}
/* container > content_main > col1
============================================================================= */
.content_main .col1 ul {
	margin-left:20px;
}
.content_main .col1 .nav_side {
	margin:0px;
	padding:0px;
	width:205px;
}
.content_main .col1 .nav_side li a {
	padding:10px 0px 10px 0px;
	height:20px;
	display:block;
}
.content_main .col1 .nav_side li:first-child a {
	background:url(../gfx/slice-nav-side.png) no-repeat top center;
}
.content_main .col1 .nav_side li {
	padding-left:10px;
	width:195px;
	background:url(../gfx/slice-nav-side.png) no-repeat bottom center;
	zoom:1;
	display:block;
	position:relative;
	float:left;
	list-style-image:none;
}
/* box */
.content_main .col1 .box.small {
	margin:20px 0px;
	width:205px;
	float:left;
}
.content_main .col1 .box.small .head {
	padding:5px 0px 0px 10px;
	height:25px;
	width:195px;
	background:url(../gfx/box_small_head.png) no-repeat;
}
.content_main .col1 .box.small .content {
	padding:10px;
	width:183px;
	border-width:0px 1px 0px 1px;
	border-style:solid;
	border-color:#aaa;
	background-color:#f0f0f0;
	overflow:hidden;
}
.content_main .col1 .box.small .foot {
	height:10px;
	width:205px;
	background:url(../gfx/box_small_foot.png) no-repeat;
}
/* container > content_main > col3
============================================================================= */
.content_main .col3 ul {
	margin-left:20px;
}
/* container > content_main > col4
============================================================================= */
.content_main .col4 dt {
	margin-top:-1px;
	cursor:pointer;
	border-top:1px solid #777;
	border-bottom:1px solid #777;
	padding:10px 0px 10px 35px;
	background:url(../gfx/arrow_down.gif) 10px 15px no-repeat;
	font-weight:bold;
}
.content_main .col4 dt:hover, .content_main .col4 dt.active {
	background:url(../gfx/arrow_down_active.gif) 10px 15px no-repeat;
	color:#666;
}
.content_main .col4 dd {
	padding:10px 0px 10px 35px;
}
/* container > content_main > col5
============================================================================= */
.content_main .col5 .search_results h3 {
	margin:0px;
	font-size:12px;
	font-weight:normal;
}
.content_main .col5 .search_results h3 a {
	color:#333;
	text-decoration:none;
}
.content_main .col5 .search_results h3 a:hover {
	text-decoration:underline;
}
.content_main .col5 .search_results p {
	margin:0px;
	color:#777;
}
.content_main .col5 .search_results p a {
	font-weight:bold;
}
.paging {
	margin:0px auto;
	width:300px;
	position:relative;
}
.paging a.prev.disable {
	color:#777;
	text-decoration:none !important;
	background:url(../gfx/icons/arrow_prev.gif) left center no-repeat;
}
.paging a.next.disable {
	color:#777;
	text-decoration:none !important;
	background:url(../gfx/icons/arrow_next.gif) right center no-repeat;
}
.paging a.prev {
	position:absolute;
	left:0px;
	top:0px;
	padding-left:10px;
	background:url(../gfx/icons/arrow_prev_active.gif) left center no-repeat;
	text-decoration:none;
}
.paging a.next {
	position:absolute;
	right:0px;
	top:0px;
	padding-right:10px;
	background:url(../gfx/icons/arrow_next_active.gif) right center no-repeat;
	text-decoration:none;
}
.paging a.prev:hover, .paging a.next:hover {
	text-decoration:underline;
}
.paging p {
	margin:0px;
	padding:0px;
	text-align:center;
}
.paging p a {
	text-decoration:none;
	border:1px solid #777;
	color:#00afe8;
	padding:4px;
	font-weight:bold;
}
.paging p a:hover {
	text-decoration:underline;
}
.paging p a.active {
	border:none;
	color:#333;
}
/* footer > content_footer
============================================================================= */
#footer .content_footer p {
	color:#bbb;
}
.content_footer ul {
	margin:0px;
	padding:0px;
}
.content_footer ul li {
	margin:0px;
	padding:0px 0px 0px 15px;
	background:url(../gfx/li-arrow.png) no-repeat left center;
	list-style-image:none;
	color:#ccc;
}
.content_footer ul li a {
	color:#ccc;
	text-decoration:none;
}
.content_footer ul li a:hover {
	text-decoration:underline;
}
/* siteinfo > 
============================================================================= */
#siteinfo span {
	color:#888;
}
#siteinfo .col2 {
	margin-top:5px;
}
#siteinfo a.partner {
	margin-right:30px;
}
