@charset "UTF-8";

/*
A submission for Shane Howell's CSS ZENgineer Project
	My Design is titled: Morning Flight
	My Name is: Cat Mitchell

*/
/*	This CSS file accompanies my CSS ZENgineer Project */


/*	/////  CSS CITATIONS */
/* 	This CSS file is released under the Creative Commons License - 
		- http://creativecommons.org/licenses/by-nc-sa/4.0/  */ 
/* 	License Allows: adaptations and commercial use, but requires share-and-share alike and attribution to me  */


/* 	/////  IMAGE CITATIONS */
/* 	Images are all cited below and not included in the CC4.0 above, which is limited to the CSS only*/

/*All graphics in this design were edited and composed by me in Photoshop. Pixabay provided me with the original air ballon file. */

/*	All  images are cited below and released under Creative Commons License cc0 and courtesy of Pixabay
		- https://creativecommons.org/publicdomain/zero/1.0/  
				-https://pixabay.com/vectors/air-aircraft-balloon-basket-hot-2028111/
*/

@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900');
@import url('https://fonts.googleapis.com/css2?family=Bad+Script&display=swap');

body {
	background-color:rgba(21,33,60,1.00);
	background:
		linear-gradient(rgba(21,33,60,1.00),
		rgba(39,56,93,1.00),
		rgba(255,200,99,1.00))
		;
	font-family: sans-serif;
	margin-top: 200px;
	padding: 0;
	
}

a:link, a:visited{
	color: #f7fad9;
	text-shadow: 2px 3px 3px #382519;
	text-decoration: none !important;
	
}

a:hover, a:active {
	color: #F2994B;
	text-decoration: none;
	text-shadow:1px 1px 6px rgba(255,255,255,1.00);
}

h1{
  font-family: 'Bad Script', cursive;
  text-shadow: 1px 1px 2px rgba(255,255,255,0.70);
  font-size: 30px;
	background: url(MultiBalloon.png);
  background-repeat: no-repeat;
  background-size: 260px;
  width: 350px;
  height: 295px;
	position: absolute;
	top: 1%;
	left: 2%;
	padding: 80px 0 0 33px;
}

h2{
	font-family: 'Bad Script', cursive;
	text-shadow: 2px 3px 4px #382519;
}

h3{font-family: 'Bad Script', cursive;
text-shadow: 1px 1px 2px rgba(255,255,255,0.70);
}



.page-wrapper {
	width: 600px;
	margin: 40px auto 100px;
	padding: 10px;
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	background:rgba(255,200,99,.80);
	border: thin solid rgba(255,200,99,.70);
	border-radius: 10px;
	postion: relative;
	z-index:20;
}

 ul {
  list-style-type: none;
 }

.sidebar{
	font-family: 'Bad Script', cursive;
	font-size: large;
}

.design-selection{
  width: 342px;
  height: 420px;
  padding: 30px 0 0 0;
  line-height: 18px;
  font-size: 14px;
	text-align: center;
  text-overflow:inherit ;
  background-image: url("balloonPeach.png") ;
  background-repeat: no-repeat;
  background-size: 340px;
  position: absolute;
  top: 40%;
  left: 75%;
}

.design-selection li a{color: #f7fad9;
  text-decoration: none;  
	
}
.design-selection h3{
  color: #382519;
  padding-left: 45px;
  text-transform: uppercase;
  font-size: 17px;
}

.design-archives {
  background: url(MultiBalloon.png);
  background-repeat: no-repeat;
  background-size: 180px;
  width: 350px;
  height: 190px;
  font-size: 13px;
  font-weight:400;
  padding: 0 0 50px 18px;
  position: absolute;
  top: 230%;
  left: 80%;
}

.design-archives h3 {
  margin: 35px 0 0 35px;
  text-transform: uppercase;
	font-size: 17px;
}
	
.zen-resources{
  background-image: url("balloon-brown.png");
  background-size: 240px;
  width: 330px;
  height: 400px;
  font-size: 14px;
  padding: 0 0 0 20px;
  background-repeat: no-repeat;
  position: absolute;
  top: 150%;
  left: 10%;
  color: #382519;
}

.zen-resources h3 {
  padding-left: 60px;
  text-transform: uppercase;
}

.zen-resources a{
	color: #f7fad9;
	text-decoration: none;
	font-family: 'Bad Script', cursive;
	font-size: 15px;
}



h2::after{
	content:'A Morning Flight';
	display:block;
}

.preamble h3::before, .preamble h3::after {
    display: block;
}

.preamble h3::before {
    content: 'Why Keep Walkinging on ';
}
.preamble h3::after {
    content: 'When You Could Fly? ';
}

.explanation h3::before, .explanation h3::after {
    display: block;
}

.explanation h3::before {
    content: 'Finding a large balloon tethered to the ground, you may ask, ';
}


.participation h3::before {
    content: 'All I ask, is your ';
}

.participation h3::after{
	content: ', and you shall see.';
}

.benefits h3::before{
	content:'There are many ';
}

.benefits h3::after{
	content: ', such as a stunning view that will take you to new heights.';
}

.requirements h3::before{
	content:'There are no ';
}

.requirements h3::after{
	content:', simply step in the basket and off we go!';
}


footer {
	font-family: 'Bad Script', cursive;
	font-size:22px;
	position:relative;
	background-color: rgba(255,200,99,.50);
	padding: 20px 70px;
	margin-bottom:-50px;
	margin-left:5px;
	border-radius: 15px;
	text-transform: uppercase;
	text-align: center;
	word-spacing:30px;
}

footer a:link, a:visited{
	color: #382519;
	text-decoration: none;
	}
footer a:hover, a:active{
	color: #F2994B;
	text-decoration: none;
	text-shadow:1px 1px 6px rgba(255,255,255,1.00);
	}

.supporting {
	padding: 5px 30px 90px;
	margin-top: -14px;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
}


.extra1{
	content: url("Balloons.png");
	width: 100%;
	background-size: 100%;
}