@charset "utf-8";

body, html { color: #F1F1F1; }

/*******************
* Video Background *
*******************/

.vid {
	min-width: 100%;
	min-height: 100%;
	top: 0;
	left: 0;
	position: fixed;
	overflow: hidden;
	z-index: 1;
}

/*********************
* Dark Page Elements *
*********************/
hr { background: #F1F1F1; }

#contentbg {
	margin: 0 auto;
	position: relative;
	min-height: 100%;
	padding: 0 50px 20px;
	background: #303030;
	background: rgba(0,0,0,0.8);
	z-index: 2;
}

.ie8 #contentbg { background: url(../img/bg/oldie-BG.png) repeat; width: 980px; }

/********
* Title *
********/

#title { padding: 12px 0 25px; }

.domain-name:before { content: '\002F\002F\00a0'; color: #318dde; }

#subheading { padding: 0 0 20px 55px; }

#top-spacer {
	height: 70px;
	width: 100%;
}

#top-spacer-flag {
	height: 50px;
	width: 100%;
}


/*********
* Footer *
*********/
#footer { margin-top: 50px; clear: both; text-align: center; }

#footer-msg { font-size: 16pt; margin: 25px 0; }

#phone-call { font-weight: bold; font-size: 16pt; margin: 25px 0; }

#featured-on p {
	display: inline-block;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 11pt;
	margin: 9px 0;
}

.featured-on { margin: 25px 0; }
.featured-on,
.featured-on img { height: 40px; vertical-align: top; }

.dns-featured {
	display: inline-block;
	text-align: center;
	margin-right: 15px;
}
.dns-featured img {
	height: 25px;
	vertical-align: middle;
	margin-right: 6px;
}

.boiler { font-size: 10pt; }


/*************
* Components *
**************/

.alert {
	padding: 8px 35px 8px 14px;
	margin-bottom: 20px;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
	background-color: #fcf8e3;
	border: 1px solid #fbeed5;
	border-radius: 4px;
}

#chinese-bullet-points {
	color: white;
	font-weight: 500;
	font-size: 16px;
}

#chinese-bullet-points li {
	padding:10px 0px;
}


@media handheld, only screen and (max-device-width : 800px) {

	body, html {
	    height: auto; width: auto;
	    max-width: 600px;
	    top: auto; left: auto; right: auto; bottom: auto;
	}

	.member-push,
	.header-push,
	.member-container > div,
	.header-fixed-container,
	.header .nav-container,
	.header {
	    max-width: 600px;
    	min-width: 0;
    	width: 600px;
    	margin: 0;
    	top: 0; left: 0;
	}
	.header-fixed-container { position: fixed; }

	.nav-button {
		display: block;
		position: absolute;
		top: 4px; left: 50px;
		width: 12px;
	}
	.nav-button:after {
		content: '\e53d';
		font-family: "Flaticons Stroke";
		position: absolute;
		left: 12px
	}

	.header .logo { left: 30%; }
	.header .logo:after {
		content: "DomainNameSales.com";
		color: #404040;
		vertical-align: top;
		padding: 0 15px;
	}

	.header .link-container {
		position: fixed;
		width: 200px; height: 100%;
		top: 41px; left: -200px;
		background: #f1f1f1;
	    -webkit-box-shadow: 0 0 0 #888,
	    					1px 1px 0 #888,
	    					2px 2px 0 #888;
	    box-shadow: 0 0 0 #888,
	    			1px 1px 0 #888,
	    			2px 2px 0 #888;
	}
	.header .link-container.right { left: 0; }

	.nav-link {
		display: block;
	    padding: 10px 0;
	    width: 200px;
		text-align: center;
	    box-shadow: inset 0px -1px 0 0px #ccc,
	    			inset 0px 1px 0 0px #fff;
	}

	#contentbg {
		max-width: 500px;
		min-height: 0;
		padding: 0 50px 20px;
		overflow: hidden;
		cursor: pointer;
	}

	#phone-call { font-size: 13pt; }

}

@media handheld, only screen and (max-device-width : 480px) {
	body, html { max-width: 100%; }

	.member-push,
	.header-push,
	.member-container > div,
	.header-fixed-container,
	.header .nav-container,
	.header {
        max-width: 100%;
        width: 100%;
	}

	.nav-button { left: 25px; }
	.header .logo { left: 25%; }

	#contentbg {
        max-width: 100%;
        padding: 0 3px 0;
	}
}