/***
 * @file base.css
 * @author katarina micanovic <katarina@ideegeo.com>
 *
 * includes all the other stylesheets
 * handles the typography and various stuff
***/
@import url("defaults.css");  /* the default html elements */
@import url("grid.css");  /* the layout grid */
@import url("menu.css");  /* the main menu */
@import url("formfu.css");  /* the forms */
@import url("table.css");  /* table styles */
@import url("dashboard.css");  /* dashboard */

/** header **/
#header .logo {padding-top: 14px;}
#header h1.slogan {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #000;
	background-color: transparent;
	font-size: 1.286em;
	padding: 55px 0 0 0;
	margin: 0;
}

/** shoppingcart **/
#cart {z-index: 1; position: absolute; top: 0; right: 0;}
#cart a {font-weight: bold;}
#cart p {padding-top: 5px;	margin: 0;}

/** startpage **/
.startpage {
	display: block;
	width: 100%;
	text-align: center;
	position: relative;
}
.startpage .logo {margin-top: 40px;}
.startpage h1 {font-size: 1.428em; margin: 0.5em 0 0.2em 0;}

/** startpage search **/
.startpage .homesearch {margin-top: 16px; margin-bottom: 40px;}
.startpage .homesearch input {font-size: 1em; text-align: left;}
.startpage .homesearch input.textfield {color: #000; background-color: transparent;	width: 453px; font-size: 1.2em;}
.startpage .homesearch span {
	position: absolute;
	left: 703px;
	top: 115px;
	text-align: left;
	font-size: 0.85em;
}
.startpage .box,.startpage .boxright {
	float: left;
	width: 303px;
	margin-right: 9px;
	margin-top: 25px;
	margin-bottom: 25px;
	text-align: left;
	color: #333;
}
.startpage .boxright {margin-right: 0;}

/** content search **/
#content .search {margin-bottom: 10px; margin-top: 10px;}
#content .search input.textfield {width: 200px;}
#content .search input.textfield-lrg {width: 250px; font-size:1.2em;}
#content .search span {
	position: absolute;
	left: 285px;
	top: 3px;
	text-align: left;
	font-size: 0.8em;
}
#content .search input {font-size: 1em;	text-align: left;}

/* mobileme, apps */
.mobileme {text-align: center;	width: 100%; margin: 0 auto;}
.apps {text-align: left; width: 100%; margin: 0 auto;}
.mobileme .box, .apps .box { float: left; width: 49%;}
.mobileme h2 {text-align: center;}
.iphoneapp h2 {text-align: left;}
.iphoneapp .box, .domains .box {float: left; width: 45%; text-align: left; padding-right: 40px;}


/** features **/
.features .box {float: left; width: 45%; text-align: left; padding-right: 20px;}

.features .box {float: left; width: 45%; text-align: left; padding-right: 40px;}

.services .boxleft {float: left; width: 40%; text-align: left;}
.services .boxright {float: right; width: 55%; text-align: left; padding-left: 20px;}

.services .featured, domains .featured {
	float: left;
	width: 270px;
	padding-right: 30px;
	padding-top: 25px;
	margin-bottom: 25px;
	text-align: left;
	color: #333;
}

.services .smallfeatured  {
	float: left;
	width: 150px;
	padding-right: 15px;
	margin-bottom: 25px;
	text-align: left;
	color: #333;
}

.services .appsdir {
	float: left;
	width: 220px;
	margin-left: 9px;
	margin-right: 9px;
	margin-top: 25px;
	margin-bottom: 25px;
	text-align: left;
	color: #333;
}

.img-left-apps {float: left; margin-right: 10px; margin-bottom: 20px; text-align:center;}

/** developer **/

.developer .boxleft {float: left; width: 65%; text-align: left;}
.developer .boxright {float: right; width: 30%; text-align: left; padding-left: 20px;}

/** support **/
.support .boxleft {
	float: left;
	margin: 20px 10px 20px 0;
	width: 55%;
	padding: 20px;
	background-color: #F9F9F9;
}
.support .boxright {
	float: right;
	margin: 20px 0;
	width: 35%;
	padding: 0 20px;
	background-color: #F9F9F9;
}
.support .label {width: 100%;}
.support .label label {width: 150px;}
.support .labeltop {width: 45%;}
.support textarea.support {width: 65%;}
.support .submit {margin: 0 0 0 150px;}
*:first-child+html .support .submit {margin: 0 0 0 75px;}
* html .support .boxleft .submit {margin: 0 0 0 75px;}

/** forms **/

button.cta, .button.cta {
	background: #222 url(/images/alert-overlay.png) repeat-x;
	display: inline-block;
	padding: 5px 10px 6px;
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	line-height: 1.2;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
	border-bottom: 1px solid rgba(0,0,0,0.25);
	position: relative;
	cursor: pointer;
}

.smallgreen.cta{background-color: #090; font-size:0.825em;}
.smallred.cta{background-color: #f00; font-size:0.825em;}

.largegreen.cta{background-color: #090; font-size:1em;}
.largered.cta{background-color: #f00; font-size:1em;}

.largergreen.cta{background-color: #090; font-size:1.5em;}

input.btn {
	margin-top: 5px;
	padding: 2px 20px;
	font-size: 1em;
	font-weight: normal;
}
.searchresults {font-size: 1.286em;}
.searchresults input.cartbtn {
	font-size: 0.734em;
	font-weight: normal;
	color: #666;
	background-color: transparent;
	border: 0;
	text-decoration: underline;
	display: block;
}
.searchresults input.checkoutbtn {
	font-weight: bold;
	margin-top: 5px;
	padding: 2px 20px;
	font-size: 0.9em;
	background-color:#090;
	color:#fff;
}
.textfield {
	border-color: #7C7C7C #C3C3C3 #DDDDDD;
	border-style: solid;
	border-width: 1px;
}
.textfield:focus {
	border-color: #333 #666 #666 #333;
	outline: 1px solid #666;
}
.textfield-lrg {
	border-color: #7C7C7C #C3C3C3 #DDDDDD;
	border-style: solid;
	border-width: 1px;
}
.textfield-lrg:focus {
	border-color: #333 #666 #666 #333;
	outline: 1px solid #666;
}
.textfield .subsearch {width: 192px;}

/** footer **/
#footer p {margin-top: 15px 0; text-align: center;}
#footer ul.navfooter,#footer ul.right {
	float: left;
	padding: 0;
	margin-left: 0;
	text-align: left;
	list-style: none;
}
#footer ul.navfooter li {padding: 0; margin: 0;}
#footer ul.navfooter li.head {margin-bottom: 10px; color:#333333;}
#footer ul.right {margin-right: 0;}
#footer .box1,#footer .box2,#footer .box3 {	margin-right: 120px;}
#footer a {
	color: #666666;
	background-color: transparent;
	text-decoration: none;
	font-weight: normal;
}

/** ie 6 **/
* html input.btn, * html .submit input,
* html .startpage .homesearch input.btn,
* html .search input.btn, * html input.checkoutbtn {
    padding: 0 20px;
    border: 1px solid;
    border-top-color: #999;
	border-left-color: #999;
	border-right-color: #777;
	border-bottom-color: #777;
}
* html .startpage .homesearch input.btn {width: 235px;}
* html .search input.btn {width: 160px;}
* html .startpage .homesearch input.transferbtn,
* html .search input.transferbtn {width: 150px;}

/* ie 7 */
*:first-child+html input.btn, *:first-child+html .submit input,
*:first-child+html .startpage .homesearch input.btn,
*:first-child+html .search input.btn, *:first-child+html input.checkoutbtn {
	padding: 0 20px;
    border: 1px solid;
    border-top-color: #999;
	border-left-color: #999;
	border-right-color: #777;
	border-bottom-color: #777;
}
*:first-child+html .homesearch input.btn {width: 235px;}
*:first-child+html .search input.btn {width: 160px;}
*:first-child+html .homesearch input.transferbtn,
*:first-child+html .search input.transferbtn {width: 150px;}

/** various **/
.readmore {float: right;margin-right: 20px;}
.actionbox {text-align: left;padding: 20px;background-color: #F3F3F3;border: #E6E6E6 1px solid;}
.actionbtn {font-weight: bold; margin-top: 5px;	padding: 2px 20px; font-size: 0.9em; background-color:#090;	color:#fff;}
.cancelbtn {font-size: 0.75em; font-weight: normal; color: #666; background-color: transparent; border: 0;	text-decoration: underline;}
a.decornone {text-decoration: none;}
a.decornone-black {text-decoration: none; color: #000;}
a.action {background-color:#090;text-decoration: none;color: #fff; padding: 5px 5px 5px 5px;}
a.green {color:#060;font-weight:bold;text-decoration: underline;}
a.green:hover {color:#060;font-weight:bold;text-decoration: none;}
.red {color: #900;}
.success {color: #060; font-weight: bold; background-color: transparent;}
.success-light {color: #060; font-weight: normal; background-color: transparent;}
.status-msg {display: block; width: 100%; color: #060; font-weight: bold; background-color: #CFC;}
.error {color: #f00;  font-weight: bold; background-color: transparent;}
.error-msg {display: block; width: 100%; color: #f00; font-weight: bold; background-color: #FFE8E8;}
.dopadding {padding: 30px 20px;}
.toppadding {padding-top: 10px;}
.bottompadding {padding-bottom: 10px;}
.small {font-size: 0.75em;} /* 16x0.75=12px */
.medium {font-size: 1.0em;}
.big {font-size: 1.428em;line-height: 1.428em; color: #333;}
.bigsans {font-size: 1.428em;line-height: 1.428em;}
.pagination {text-align: center; padding-top: 30px; padding-bottom: 40px; font-size: 1.428em; }
.subpage {font-size: 2.5em;font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}
.center {text-align: center;}
.left {float: left;}
.right {float: right;}
.img-left {float: left;	margin-right: 20px;}
.img-left-apps {float: left; margin-top: 20px; margin-right: 40px; text-align:center;}
.img-right {float: right; margin-left: 20px;}
.clear {clear: both;}
.none {display: none;}
.baseline {vertical-align: baseline;}
.middle {vertical-align: middle;}
.sub {vertical-align: super;}
.strike {text-decoration: line-through; color: #666;}
.labeltop {display: block;}
.textlight {color: #333;}
.textlighter {color:#666;}
.texttop {vertical-align: text-top;}
.textbottom {vertical-align: text-bottom;}
.textleft {text-align: left;}
.top {vertical-align: top;}
.bottom {vertical-align: bottom;}
.bold {font-weight: bold;}
.up {padding-left: 20px; background: transparent url("/global/images/up.gif") no-repeat 0 50%;}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
* html .clearfix {height: 1%;}
.clearfix {display: block;}