@import url(http://fonts.googleapis.com/css?family=Open+Sans:300,400,700,800);
@import url(http://fonts.googleapis.com/css?family=Playfair+Display:400,700italic);

* {padding: 0; margin: 0; font-family: 'Open Sans', sans-serif;}

header h1 {width: 130px; height: 130px; margin: 0 auto; background: url(../img/r.png); text-indent: -9999px; display: block;}

section.aboutme {width: 700px; padding: 35px 0px; margin: 0 auto; float: none; clear: both; font-size: 12px; line-height: 18px;}
	section.aboutme .txtLeft {width: 326px; float: left;}
	section.aboutme .txtRight {width: 320px; float: right;}
	section.aboutme .txtRight a {color: #000; background: #feb87a; display: block; padding: 0 3px; float: left; text-decoration: none;}
	section.aboutme .txtRight a.email {color: #000; background: none; text-decoration: underline;}
	section.aboutme .txtRight span {display: block; float: left; margin: 0 6px;}
	
	.divLine {height: 1px; width: 100%; border-top: 1px solid #d8d8d8;}
	
	#videoReel {width: 916px; height: 515px;}
	#videoPost {width: 500px; height: 500px; margin: 0 auto; display: block;}
	#videoGame {width: 360px; height:500px; margin: 0 auto; display: block;}
	
section.works {height: auto; margin: 0 auto; float: none; display: block; clear: both; position: relative;}
	article.work {width: 920px; margin: 0 auto; padding: 80px 0;}
	article.work h1 {font-weight: 800; text-align: center; font-size: 50px;}
	article.work h2 {font-weight: 800; text-align: center; font-family: 'Playfair Display', serif; font-weight: 700; font-style: italic; font-size: 35px; margin-bottom: 45px;}
	article.work img.t1280 {width: 916px;}
	article.work img.t640 {width: 457px;}
	
	.textWork2c {width: 630px; margin: 0 auto 70px auto; font-size: 12px; line-height: 18px;}
		.textWork2c .txtWorkLeft {width: 260px; float: left;}
		.textWork2c .txtWorkRight {width: 260px; float: right;}
		
@media screen and (max-width: 1400px) {
	header {width: 100%; height: 179px; padding-top: 50px; background: url(../img/header02.png)center center #000;}
}

@media screen and (min-width: 1401px) {

	header h1 {width: 181px; height: 180px; margin: 0 auto; background: url(../img/r1280.png); text-indent: -9999px; display: block;}

	header {width: 100%; height: 245px; padding-top: 75px; background: url(../img/header01.png);}
	section.aboutme {width: 900px; padding: 55px 0px; font-size: 14px; line-height: 20px;}
	section.aboutme .txtLeft {width: 455px;}
	section.aboutme .txtRight {width: 445px;}
	section.aboutme .txtRight a {padding: 0 4px;}
	section.aboutme .txtRight span {margin: 0 7px;}
	
	article.work {width: 1280px; padding: 120px 0;}
	article.work h1 {font-size: 70px;}
	article.work h2 {font-size: 50x; margin-bottom: 60px;}
	
	#videoReel {width: 1280px; height: 720px;}
	#videoPost {width: 700px; height: 700px; margin: 0 auto; display: block;}
	#videoGame {width: 504px; height: 700px; margin: 0 auto; display: block;}
	
	article.work img.t1280 {width: 1280px;}
	article.work img.t640 {width: 637px;}
	
	.textWork2c {width: 660px; margin: 0 auto 100px auto; font-size: 14px; line-height: 20px;}
		.textWork2c .txtWorkLeft {width: 290px; float: left;}
		.textWork2c .txtWorkRight {width: 305px; float: right;}
}
