@charset "utf-8";
/*CSS Document*/

/*BODY*/

body {background-color:rgba(80,33,15,1.00); max-width: 1000px; margin:0 auto; font-family: 'Josefin Sans', sans-serif; }
h3 {font-size: 2em; padding: 0px 0px 5px 10px; font-family: 'Goudy Bookletter 1911', serif;}
h1 {opacity: 0;}
h2 {opacity: 0;}
p {padding: 10px;}
a {text-decoration: none; color:rgba(221,214,231,1.00);}

.page-wrapper {background:rgba(0,0,0,1.00);}
.summary {color:rgba(249,202,123,1.00); padding: 0px 0px 80px 0px; background-image:url(../media/seperator-green1.svg); background-repeat: no-repeat; background-position: bottom;}
.preamble {color:rgba(210,80,0,1.00); padding: 0px 0px 80px 0px; background-image:url(../media/seperator-yellow1.svg); background-repeat: no-repeat; background-position: bottom;}
.explanation {color:rgba(30,85,42,1.00); padding: 0px 0px 80px 0px; background-image:url(../media/seperator-ORANGE1.svg); background-repeat: no-repeat; background-position: bottom;}
.participation {color:rgba(249,202,123,1.00); padding: 0px 0px 80px 0px; background-image:url(../media/seperator-green2.svg); background-repeat: no-repeat; background-position: bottom;}
.benefits {color:rgba(210,80,0,1.00); padding: 0px 0px 80px 0px; background-image:url(../media/seperator-yellow2.svg); background-repeat: no-repeat; background-position: bottom;}
.requirements {color:rgba(30,85,42,1.00); padding: 0px 0px 80px 0px; background-image:url(../media/seperator-orange2.svg); background-repeat: no-repeat; background-position: bottom;}


/*HEADER*/
header {background-image: url(../media/header1.svg); width: 100%; height: 600px; background-repeat: no-repeat; background-color: rgba(0,0,0,1.0);}

/*FOOTER*/

footer {background-image: url(../media/footer1.svg); width: 100%; height: 800px; background-repeat: no-repeat;}

/*ASIDE*/

.sidebar {position: fixed; top: 0; right: 0;}
.sidebar h3 {font-size: 1.9em; padding: 0px 0px 10px 0px}

.design-name {display: block; font-size: 1.5em; font-weight: bold; text-transform: uppercase; color: rgba(210,80,0,1.00); padding: 10px 0 0 0;}
.designer-name {font-size: 1.5em; color: rgba(80,33,15,1.00); }

.design-selection {margin: 10px; padding: 10px; background: rgba(249,202,123,1.0); width: 200px; border-radius: 20px;}
.design-selection h3 {color: rgba(30,85,42,1.00);}
.design-selection ul {color: rgba(80,33,15,1.00); font-size: .6em; }

.design-archives {margin: 10px; padding: 10px; background: rgba(249,202,123,1.0); color: rgba(255,255,2551.0); width: 200px; border-radius: 20px;}
.design-archives a {color: rgba(210,80,0,1.00);}
.design-archives h3 {color: rgba(30,85,42,1.00);}

.zen-resources {margin: 10px; padding: 10px; background: rgba(249,202,123,1.0); color: rgba(0,0,0,1.0); width: 200px; border-radius: 20px;}
.zen-resources a {color: rgba(80,33,15,1.00);}
.zen-resources h3 {color: rgba(30,85,42,1.00);}



/*RESPONSIVE CRAP*/

/*SMARTPHONES*/
/*SAMSUNG GALAXY NOTE 4 1140x2560 / 360x640*/
/*iPHONE 5 640x1136 / 320x568*/
@media screen and (min-width: 280px) and (max-width :351px){
	img {width: 100%;}
	
	.summary {color:rgba(249,202,123,1.00); padding: 0px 0px 30px 0px; background-image:url(#); background-repeat: no-repeat; background-position: bottom;}
	.preamble {color:rgba(210,80,0,1.00); padding: 0px 0px 30px 0px; background-image:url(#); background-repeat: no-repeat; background-position: bottom;}
	.explanation {color:rgba(30,85,42,1.00); padding: 0px 0px 30px 0px; background-image:url(#); background-repeat: no-repeat; background-position: bottom;}
	.participation {color:rgba(249,202,123,1.00); padding: 0px 0px 30px 0px; background-image:url(#); background-repeat: no-repeat; background-position: bottom;}
	.benefits {color:rgba(210,80,0,1.00); padding: 0px 0px 30px 0px; background-image:url(#); background-repeat: no-repeat; background-position: bottom;}
	.requirements {color:rgba(30,85,42,1.00); padding: 0px 0px 30px 0px; background-image:url(#); background-repeat: no-repeat; background-position: bottom;}
	
	header{height: 300px; background-image: url(../media/header4.svg);}
	footer{height: 300px; background-image: url(../media/footer3.svg);}
	.sidebar{position: static;}
	}

@media screen and (min-width: 350px) and (max-width :500px){
	img {width: 100%;}
	header{height: 250px; background-image: url(../media/header4.svg);}
	footer{height: 200px; background-image: url(../media/footer3.svg);}
	.sidebar{position: static;}
	}
	

/*TABLETS*/
/*iPAD 3 1536x2048 / 768x1024*/
/*SAMSUNG GALAXY TAB 3 800x1280 / 800x1280*/
@media screen and (min-width:501px) and (max-width:675px) {
	p{width: 100%;}
	img {width: 100%;}
	header{height: 500px; background-image: url(../media/header2.svg);}
	footer{height: 650px; background-image: url(../media/footer2.svg);}
	.sidebar{position: static;}
}

@media screen and (min-width:676px) and (max-width:800px) {
	p{width: 60%;}
	img {width: 100%;}
	header{height: 600px; background-image: url(../media/header2.svg);}
	footer{height: 750px; background-image: url(../media/footer2.svg);}
	.sidebar{position: fixed; top: 0; right: 0;}
}


/*MAC LAPTOP 1366x800*/
@media screen and (min-width: 801px) and (max-width: 1100px) {
	img {width: 100%;}
	p {width: 65%}
}

@media screen and (min-width: 1101px) and (max-width: 1250px) {
	img {width: 100%;}
	p {width: 75%}
}

@media screen and (min-width: 1251px) and (max-width: 1480px) {
	img {width: 100%;}
	p{width:90%;}
}




	
