@charset "utf-8";

/* Learn with Portals CSS */

body{
	margin: 0px;
	padding: 0px;
	color: #8d898a;
	font-size: 19px;
	font-family: ariel, sans-serif;
}

a{
	color: #63808b;
	font-weight: bold;
	text-decoration: none;
	outline: none;
}

p{
	margin: 20px 0 20px 0;
	line-height:137%
}

a img{
	border: none;
}

a:hover{
	color: #ffffff;
}

h3{
	font-size: 36px;
	color: #63808b;
	font-weight: normal;
	margin: 36px 0 3px -1px;
}

#bg{
	background-color: #ffffff;
	background: url(http://media.steampowered.com/apps/portal2/learn/lwp_bg_v3.jpg) center top no-repeat;
}

#container {
	width: 1126px;
	height: 1751px;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
	position: relative;
	background: url(http://media.steampowered.com/apps/portal2/learn/lwp_bg_v3.jpg) center top no-repeat;
}

#content{
	position: absolute;
	top: 598px;
	left: 156px;
	padding: 0;
	width: 804px;
}

#content p{
	width: 756px;
}

#content .p3{
	width: 745px;
}

#content .p1{
	width: 730px;
}

/* Video */

#class_video_container{
	height: 320px;
	margin: 30px 0 0 145px;
}

#class_video{
	border: 2px solid #ffffff;
	height: 265px;
	width: 472px;
}

#video_caption{
	margin: 7px 0 0 2px;
	font-size: 15px;
}

.accent_color{
	color: #63808b;
}

/* Download Portal Buttons */

#portal_button{
	position: absolute;
	top: -10px;
	right: 0px;
}

#portal_button img{
	margin-left: 5px;
}

#portal_button_container_div{
	display: inline-block;
}

#content #download_portal{
	margin-top: 22px;
	font-size: 21px;
	letter-spacing: normal;
	position: relative;
	width: 808px;
}

#top_portal_button_container{
	position: absolute;
	top: 0px;
	left: 821px;
}

#top_portal_button{
	height:117px;
	width:133px;
}

/* Footer */

#footer{
	margin: 50px 0 0 0;
}

#footer #logo_container img{
	margin-right: 32px;
}

#footer_copy{
	font-size: 10px;
	color: #696564;
	margin: 15px 0 0 0;
	line-height: 115%;
	width: 641px;
}
/* Selection */

#content p::selection, h3::selection, div::selection, a::selection{
	background: #faba3f;
}

#content p::-moz-selection, h3::-moz-selection, div::-moz-selection, a::-moz-selection{
	background: #faba3f;
}

#content p::-webkit-selection, h3::-webkit-selection, div::-webkit-selection, a::-webkit-selection{
	background: #faba3f;
}

/* iPad [portrait + landscape] */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
	body #bg{
		background-color: #ffffff;
		background: url(http://media.steampowered.com/apps/portal2/learn/ilwp_bg_v3.jpg) center top no-repeat;
	}
	body #content{
		position: absolute;
		top: 598px;
		left: 120px;
		padding: 0;
		width: 804px;
	}
	body #top_portal_button_container{
		position: absolute;
		top: 0px;
		left: 750px;
	}
	
	body #container {
		background: none;
	}
}

/* iPhone [portrait + landscape] */
@media only screen and (max-device-width: 480px) {
	body #bg{
		background-color: #ffffff;
		background-image: url(http://media.steampowered.com/apps/portal2/learn/ilwp_bg_v3.jpg);
		background-repeat: no-repeat;
		background-position: center top;
		overflow: auto;
	}
	body #content{
		position: absolute;
		top: 598px;
		left: 120px;
		padding: 0;
		width: 804px;
	}	
	#top_portal_button_container{
		position: absolute;
		top: 0px;
		left: 750px;
	}
	
	body #container {
		background: none;
	}
}