/*

	Hostium
	Created: 07/2013
	Version: 1.0
	By: myTheme at ThemeForest.net
	http://themeforest.net/user/myTheme

	01.....LAYOUT
	02.....HEADER
	03.....CONTENT
	04.....HOMEPAGE
	05.....FORMS
	06.....MISC
	07.....MEDIA QUERIES



/*-----------------------------------------------------------------------------------*/
/*	LAYOUT
/*-----------------------------------------------------------------------------------*/

html {font-size:81.3%;background-position:50% 0;padding-bottom:40px;}
body {font-size:1em;line-height:1.5;color:#333;}
* {margin:0;padding:0;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
:focus {outline:0;}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
.wrapper:after, heade:after, .bottom:after, #login:after, #hosting:after, #search:after, .header-inner:after, .domain:after, form:after {content:".";display:block;height:0;clear:both;visibility:hidden;}

.wrapper {padding:15px 15px 0 15px;background:#fff;}
.home .wrapper {padding-top:5px;}
header {padding:0 15px;}
aside {margin:0 -15px -15px -15px;padding:15px;background:#EDEEEF;}
.bottom {clear:both;padding:0 15px 15px 15px;background:#edeeef;}
footer {clear:both;padding:20px 15px 0 15px;font-size:0.75em;}


/*-----------------------------------------------------------------------------------*/
/*	HEADER
/*-----------------------------------------------------------------------------------*/

/* logo */
#logo img {margin-top:10px;}

/* navigation */
#nav {margin:0;clear:both;}
#nav ul {margin:0;padding:0;width:100%;display:block;list-style:none;}
#nav li {width:100%;display:block;}
#nav a {width:100%;display:block;color:#fff;padding:5px 0;text-transform:uppercase;border-top:1px solid #333;}
.js #nav {clip:rect(0 0 0 0);max-height:0;position:absolute;display:block;overflow:hidden;zoom:1;}
#nav.opened {max-height:9999px;}
#nav-toggle {display:block;clear:both;background:#262B2F url(../img/sprite.png) 100% 100% no-repeat;color:#eee;text-align:center;margin:0 -15px 15px -15px;margin:10px 0 15px 0;height:40px;line-height:40px;border-radius:4px;}

/* button in header */
header .button {float:right;margin:15px 0 0 0;}


/*-----------------------------------------------------------------------------------*/
/*	CONTENT
/*-----------------------------------------------------------------------------------*/

/* typography */
h1, h2, h3, button, .button, #nav a {font-weight:700;}
h1 {font-size:2em;line-height:1;margin-bottom:0.5em;border-bottom:1px solid #ddd;padding-bottom:0.5em;clear:both;}
h2 {font-size:1.5em;line-height:1.2;margin:1em 0 0.5em;}
h3 {font-size:1.25em;line-height:1.2;margin:1.5em 0 0.5em;text-transform:uppercase;}

/* default margins */
p, ul, ol, table, form, pre, blockquote {margin-bottom:1.5em;}

/* links */
a {text-decoration:none;font-weight:bold;}
a:hover {color:#222;}

/* lists */
ul {list-style:square;}
ul, ol {margin-left:1.5em;}

/* tables */
table {border-spacing:0;border-collapse:separate;width:100%;border:1px solid #ddd;border-bottom-width:2px;table-layout:fixed;}
table thead {background:rgba(0,0,0,0.05);padding:4px 10px;}
table td, table th {padding:4px 10px;text-align:left;}
tbody tr {background:rgba(255,255,255,0.3);}
tbody tr:nth-child(2n) {background:rgba(0,0,0,0.02);}

/* code */
pre {background:#f2f2f2;padding:10px;}
code {white-space:pre-wrap;}

/* quotes */
blockquote p {background:#F4F5F5;padding:5px;margin:-5px -5px 0 -5px;box-shadow:0 1px 1px rgba(0,0,0,0.1);border-radius:4px;}
blockquote p:after {content:'\201D';}
blockquote img {vertical-align:middle;margin-left:10px;}
blockquote cite {font-style:normal;color:#999;font-size:0.875em;clear:both;display:block;background:url(../img/blockquote.png) 5px 0 no-repeat;padding-top:10px;}

/* horizontal ruler */
hr {border:0;background:#ddd;height:1px;}

/* images */
img {border:none;max-width:100%;}
.alignleft {float:left;margin:5px 10px 5px 0;}
.alignright {float:right;margin:5px 0 5px 10px;}

/* alerts  */
.alert {padding:10px;border-width:1px;border-style:solid;}
.alert a {text-decoration:underline;}
.alert.gray {background-color:#F7F7F9;border-color:#E1E1E8;color:#555;}
.alert.green {background-color:#DFF0D8;border-color:#D6E9C6;color:#468847;}
.alert.yellow {background-color:#FCF8E3;border-color:#FBEED5;color:#C09853;}
.alert.red {background-color:#F2DEDE;border-color:#EED3D7;color:#B94A48;}
.alert.blue {background-color:#D9EDF7;border-color:#BCE8F1;color:#3A87AD;}
.alert.gray a {color:#555;}
.alert.green a {color:#468847;}
.alert.yellow a {color:#C09853;}
.alert.red a {color:#B94A48;}
.alert.blue a {color:#3A87AD;}

/* buttons */
.button {background:#ccc;padding:0.5em 0.5em;color:#fff;font-weight:bold;margin:0 0.5em 0.5em 0;display:inline-block;line-height:1;text-transform:uppercase;}
.button:hover {color:#fff;}
.button span {color:#fff;color:rgba(0,0,0,0.7);border-left:1px solid #444;border-left:1px solid rgba(0,0,0,0.2);padding-left:5px;}
.button.gray {background-color:#999;}
.button.gray:hover {background-color:#888;}
.button.green {background-color:#89B64C;}
.button.green:hover {background-color:#79A63C;}
.button.orange {background-color:#f89418;}
.button.orange:hover {background-color:#d87408;}
.button.red {background-color:#bd362f;}
.button.red:hover {background-color:#9d160f;}
.button.black {background-color:#333;}
.button.black:hover {background-color:#111;}
.button.blue {background-color:#0099EE;}
.button.blue:hover {background-color:#0B78C9;}
.button.pink {background-color:#E53B8A;}
.button.pink:hover {background-color:#C51B6A;}
.button.purple {background-color:#8475A8;}
.button.purple:hover {background-color:#645588;}
.button.white {background-color:#ddd;color:#222;}
.button.white:hover {background-color:#ccc;}

/* support list */
.support {list-style:none;background-color:#DDDEDF;border:1px solid #CDCECF;border-width:1px 1px 2px 1px;border-radius:4px;margin-left:0;}
.support li:first-child {border-top:0;}
.support li {border-top:1px solid #CDCECF;line-height:40px;padding:0 2px 0 10px;}
.support li a {display:block;margin:0 -2px 0 -10px;padding:0 10px;color:#333;font-weight:normal;}
.support li a:hover {background-color:#CDCECF;}
.support li img {vertical-align:middle;margin-right:3px;}
.support li span {border-radius:2px;display:inline-block;line-height:1em;background:#89B64C;color:#fff;text-transform:uppercase;font-size:0.625em;padding:2px 3px;margin-left:4px;}

/* hosting */
#hosting {color:#eee;padding:15px;}
#hosting h2 {text-align:center;margin-top:0;background:url(../img/hosting-h2.png) 0 50% repeat-x;}
#hosting h2 span {padding:0 10px;}
#hosting img.hosting-icon {margin:0 auto 5px auto;display:block;}
#hosting p {text-align:center;}
#hosting p small {color:#666;font-size:0.875em;}
#hosting .button {margin-bottom:2em;}

/* hosting features */
.hosting-features {list-style:none;}
.hosting-features li {border-top:1px dashed #3E4246;color:#ddd;font-size:0.875em;padding:3px 2px;}
.hosting-features li:first-child {border-top:0;}
.hosting-features li:nth-child(2n-1) {background:rgba(255,255,255,0.007);}
.hosting-features li img {margin-right:3px;vertical-align:middle;}
.hosting-features li a {font-weight:normal;color:#ddd;text-decoration:underline;}
.hosting-features.icons-ul .icon-li {line-height:1 !important;}

/* footer */
footer p {color:#757779;}
footer a {color:#656769;font-weight:normal;}
footer a:hover {color:#C5C7C9;}
.footer-links {list-style:none;text-align:center;margin-left:0;}
.footer-links li {display:inline;margin:0 5px;}
.logo-footer {display:none;}

/* social links */
.social {clear:both;list-style:none;padding-top:20px;border-top:1px dashed #444;border-top:1px dashed rgba(255,255,255,0.1);margin-left:0;text-align:center;}
.social li {display:inline;}
.social a {display:inline-block;margin:0 5px;}
.social [class^="icon-"] {color:#555759;}
.social .icon-facebook-sign:hover {color:#3B5998;}
.social .icon-flickr:hover {color:#D70068;}
.social .icon-twitter-sign:hover {color:#00C0F7;}
.social .icon-rss-sign:hover {color:#E7772F;}
.social .icon-tumblr-sign:hover {color:#2E4B67;}
.social .icon-youtube-sign:hover {color:#CC181E;}
.social .icon-google-plus-sign:hover {color:#E34B39;}

.bottom h3 {font-size:1.25em;text-transform:uppercase;letter-spacing:1px;}
.bottom a {color:#333;}

/* tabs  */
.tabs-hide {display:none;}
.tabs-container {float:left;clear:both;}

/* tabs navigation */
.tabs-nav {margin:-5px -10px 0 -10px;width:100%;}
.tabs-nav li {display:inline-block;margin-right:4px;position:relative;}
.tabs-nav li a {display:inline-block;padding:0.25em 0.5em;font-weight:bold;text-decoration:none;color:#666;background:#f6f6f6;border:1px solid #eee;border-radius:0 0 4px 4px;}
.tabs-nav li a:hover {background:#eee;}
.tabs-nav li.ui-tabs-active a {background:#eee;color:#333;position:relative;border:1px solid #e6e6e6;}
.tabs-nav li.ui-tabs-active a:after {content:"";width:12px;height:10px;background:url(../img/sprite.png) 100% -104px no-repeat;position:absolute;left:50%;bottom:-10px;margin-left:-6px;}

/* faq toggles */
.faq-question li {border-top:1px solid #eee;padding:2px 0;}
.faq-question li:first-child {border-top:0;}
.faq-toggle {margin-bottom:0;}
.faq-toggle a {font-weight:normal;display:block;}
a.faq-toggle-active {}
.hidden {display:none;}

/* blog */
.blog-entry {position:relative;margin-bottom:3em;}
.blog-entry h1, .blog-entry h2 {padding-right:34px;}
.blog-meta {font-size:0.875em;color:#999;border-bottom:1px dotted #eee;padding-bottom:3px;}
.blog-entry .blog-meta {margin-top:-0.75em;}
#comments {margin-bottom:3em;}
#comments .blog-meta {margin-bottom:0.5em;}
.blog-meta-comments {position:absolute;right:0;top:7px;width:27px;height:26px;padding-bottom:8px;background:url(../img/sprite.png) 0 -100px no-repeat;text-align:center;line-height:18px;color:#666;}
.blog-pages {clear:both;margin-left:0;}
.blog-pages li {display:inline-block;margin-right:4px;list-style:none;color:#999;}
.blog-pages a {background:#EDEEEF;color:#999;text-decoration:none;padding:2px 6px;font-weight:normal;border-radius:4px;}
.blog-pages a:hover {background:#DDDEDF;}


/*-----------------------------------------------------------------------------------*/
/*	HOMEPAGE
/*-----------------------------------------------------------------------------------*/

#intro {clear:both;position:relative;overflow:hidden;width:100%;margin:0;height:200px;}
#intro img {display:block;height:auto;float:left;width:100%;border:0;margin-bottom:0;position:relative;left:-50%;top:0;width:auto;max-width:none;}

/* intro content */
.intro-content {position:absolute;left:15px;bottom:-20px;color:#fff;height:100%;padding-right:15px;}
.intro-content h2 {text-transform:none;display:block;}


/*-----------------------------------------------------------------------------------*/
/*	FORMS
/*-----------------------------------------------------------------------------------*/

input[type="text"], input[type="password"], textarea, select {background:#eee;border:0;color:#666;padding:8px;margin-bottom:20px;width:100%;font-family:inherit;font-size:100%;}
label {display:block;line-height:30px;}
label span {color:#999;}
textarea {overflow:auto;}

/* errors */
em.error {height:0;display:none;text-indent:-9999px;float:right;}
input.error, textarea.error {background:#FFEDED;}

/* button */
button {clear:both;color:#333;background:#ddd;padding:0.5em 1.5em;line-height:1;border-width:1px;border-style:solid;border-color:#fff #eee #fff;border:0;cursor:pointer;width:auto;overflow:visible;font-weight:bold;display:inline-block;text-transform:uppercase;letter-spacing:1px;}

/* login page */
#login {padding:15px 15px 0 15px;}
#login h1 {color:#fff;border:0;}
#form-login label {color:#fff;}
#form-login label a {color:#bbb;margin-left:5px;font-weight:normal;font-size:0.75em;}
#form-login input {padding-left:32px;background-image:url(../img/sprite.png);background-repeat:no-repeat;}
#form-login input.input-username {background-position:2px -5px;}
#form-login input.input-password {background-position:2px -45px;}

/* search domain */
.domain {text-align:center;margin:0 -15px;background:#DDDEDF;padding:10px 15px;}
#form-search {margin-bottom:0;}
#form-search input, #form-search select {color:#666;background:#ccc;padding:7px;width:50%;margin-bottom:0;float:left;border:0;}
#form-search select {width:31%;margin-left:2%;}
#form-search button {padding:0;border:0;width:15%;float:right;clear:none;padding:8px 0;color:#fff;}
#form-search ::-webkit-input-placeholder {color:#666;opacity:1;}
#form-search ::-moz-placeholder {color:#666;opacity:1;}


/*-----------------------------------------------------------------------------------*/
/*	MISC
/*-----------------------------------------------------------------------------------*/

/* border-radius */
input, textarea, select, #form-search button, .alert, table, pre {border-radius:4px;}
button, .button {border-radius:100px;}

/* box-shadows */
input, textarea, select {-webkit-box-shadow:1px 1px 1px rgba(0,0,0,0.1) inset;-moz-box-shadow:1px 1px 1px rgba(0,0,0,0.1) inset;box-shadow:1px 1px 1px rgba(0,0,0,0.1) inset;}
#form-login input:focus {-webkit-box-shadow:0 0 8px rgba(255,255,255,0.6);-moz-box-shadow:0 0 8px rgba(255,255,255,0.6);box-shadow:0 0 8px rgba(255,255,255,0.6);}

/* transitions */
a, input, textarea, button, .social i {-webkit-transition:all .2s linear;-moz-transition:all .2s linear;-o-transition:all .2s linear;transition:all .2s linear;}


/*-----------------------------------------------------------------------------------*/
/*	MEDIA QUERIES
/*-----------------------------------------------------------------------------------*/

@media screen and (min-width:440px) {

	/* login page */
	#login {background:url(../img/login.png) 50% 0 no-repeat;padding:30px 50px 0 100px;width:400px;margin:0 auto;}
	
	/* buttons */
	.button {padding:0.5em 1.5em;letter-spacing:1px;}
	
	/* domain search */
	#form-search input {width:61%;}
	#form-search select {width:20%;}
	
	/* typography */
	h1 {font-size:3em;}
	h2 {font-size:1.8em;}
	h3 {font-size:1.5em;}
	
	/* tabs navigation */
	.tabs-nav {margin:-9px 0 10px 0;}
	.tabs-nav li {margin-right:12px;}
	.tabs-nav li:before, .tabs-nav li:after {content:"";width:4px;height:4px;background:url(../img/sprite.png) -362px -104px no-repeat;position:absolute;top:0;}
	.tabs-nav li:before {left:-4px;}
	.tabs-nav li:after {background-position:-366px -104px;right:-4px;}
	.tabs-nav li a {padding:0.5em 1em;}

}

@media screen and (min-width:640px) {

	/* layout */
	.wrapper {margin-top:40px;padding:30px 15px 20px 15px;border-bottom:10px solid #DDDEDF;background:#fff url(../img/wrapper.png) 63.461% 0 repeat-y;}
	.home .wrapper {padding-top:10px;margin-top:0;}
	.main {float:left;width:60.416%;}
	aside {float:right;width:31.25%;margin:0;padding:0;}

	header {position:relative;z-index:9999;width:100%;margin-bottom:-40px;}
	.header-inner {padding:60px 0 30px 0;position:relative;text-align:center;}
	header #logo img {margin:0 0 30px 0;}
	#logo:hover {opacity:0.7;}
	header .button {position:absolute;right:0;top:20px;}

	#hosting {margin:0 auto;padding:40px 15px;background-image:url(../img/hosting.png);background-position:100% 100%;background-repeat:no-repeat;}
	.bottom {clear:both;padding:0 15px 10px 15px;background:#EDEEEF;border-bottom:10px solid #DDDEDF;}
	footer {clear:both;padding:40px 15px 0 15px;font-size:0.875em;}

	/* domain search */
	.domain {margin:0 -15px;padding:15px;}
	.domain #form-search {width:80%;margin:0 auto;}

	/* intro */
	#intro {height:400px;z-index:0;position:relative;}
	#intro img {height:auto;position:static;left:0;width:auto;max-width:none;}
	.intro-content {left:0;bottom:-80px;width:100%;text-align:center;padding-right:0;}
	.intro-content h2, .intro-content p {background:#202529;display:inline-block;}
	.intro-content h2 {font-size:3em;padding:5px 20px;}
	.intro-content p {font-size:1.125em;line-height:1.7;padding:5px 10px;}

	/* navigation */
	.js #nav {position:relative;background:transparent;margin:0 auto;text-align:center;width:100%;z-index:9999;}
	.js #nav.closed {max-height:none;}
	#nav-toggle {display:none;}
	#nav ul {margin:0 auto;text-align:center;width:auto;}
	#nav li {display:inline-block;width:auto;margin:0 5px;}
	#nav a {display:inline-block;padding:0 10px;line-height:30px;background:#262B2F;color:#fff;border-radius:4px;}
	#nav a:hover, #nav .nav-current {color:#fff;background:#363B3F;}
	
	/* tabs navigation */
	.tabs-nav {margin-top:-14px;}

	/* columns */
	.one-half, .one-third, .two-thirds, .one-fourth {float:left;display:inline;width:48%;margin-right:4%;}
	.one-third {width:30.666666%;}
	.two-thirds {width:65.333333%;}
	.one-fourth {width:22%;}
	.last {margin-right:0;}
	.clear {clear:both;}

}

@media screen and (min-width:1020px) {

	/* layout */
	.wrapper, footer, .header-inner, #hosting, #intro, .bottom {width:960px;margin-left:auto;margin-right:auto;}
	.wrapper {border-radius:10px 10px 0 0;}
	
	.wrapper, #hosting, .bottom, footer, .domain {padding-left:40px;padding-right:40px;}
	.bottom {border-radius:0 0 10px 10px;}
	
	/* typography */
	.home .tabs h3 {background:url(../img/h2.png) 0 100% repeat-x;padding-bottom:10px;}
	
	/* domain search */
	.domain {margin:0 -40px;}
	.domain #form-search {width:50%;}
	
	/* footer */
	.footer-links {float:right;list-style:none;}
	.footer-links li {display:inline;margin:0 0 0 20px;text-transform:uppercase;}
	.logo-footer {display:inline-block;float:left;opacity:0.5;}
	.logo-footer:hover {opacity:1;}
	
	/* social links */
	.social {text-align:right;}
	.social a {margin:0 0 0 20px;}

}

@media screen and (min-width:1100px) {

	/* layout */
	.wrapper, footer, .header-inner, #hosting, #intro, .bottom {width:1040px;}

}