﻿/*
      New Perspectives on HTML, CSS, and JavaScript
      Tutorial 14

      
      Author: Amber Ridgeway
      Date: 03.21.16 

      Filename:style.css
      Supporting files:   index.html, index.css, style.css picture.html, picture.css, video.html, video.css, 
      calender.html, calender.css, testimonies.html, testimonies.css, form.html, form.css,background.jpg, Background-Images-WSP061.jpg,
       download.jpg, images.jpg, IMG_0130.JPG, IMG_0639.JPG, IMG_0673.JPG */

/*Header*/
body { 
background-image: url("background.jpg");
color:white;
background-size: 100%;
}

.grass{
margin-top:0px;

float:inherit;
}

.grass1 {
margin-top:10px;
width: 100%;

}

.grass2 {
text-align:center;
font-size:3em;
margin-top:-90px;
margin-left:100px;
margin-right:100px;
float:inherit;
}



/*style for list*/


nav.horizontal {
   margin-top: 100px;
   list-style-type: none;
   color:gray;
   text-shadow:black 1px 1px 0px,
		red 5px 5px 10px;

  
  }

nav.horizontal ul {
   height: 20px;
   }

nav.horizontal ul li {
   padding: 0px;
   float: left; 
   width: 12.5%; 
   line-height: 20px;
   height: 50px; 
   font-size: 30px; 

   list-style-type: none;
}

nav.horizontal ul li a {
   display: block; 
   text-align: center;
   width: 100%; 
   font-size: 30px; 
   color: white;
   margin-left: 200px;
}

     
   
  /* Vertical navigation list */

nav.vertical {
   width: 500px;
   float: left;
   color:gray;
   font-family: 'Times New Roman', 'Times', serif;
   text-shadow:black 1px 1px 0px,
		red 5px 5px 10px;
 	margin-left:5;
   padding:-40px;
   margin-top:100px;
      }



nav.vertical h1 {
   display:block;
   float:right;
	margin-top:300px;
   font-size: 30px;
  
   font-weight: normal;
   letter-spacing: 5px;
   
}

nav.vertical h2 {

   -o-transform: rotate(-90deg) translate(-100px, -70px);
   -moz-transform: rotate(-90deg) translate(-100px, -70px);
   -webkit-transform: rotate(-90deg) translate(-100px, -70px);
   -ms-transform: rotate(-90deg) translate(-100px, -70px);
   transform: rotate(-90deg) translate(-100px, -70px);
   font-family: Verdana, Geneva, sans-serif;
   font-size: 40px;
   font-variant: small-caps;
   text-align: right;
   letter-spacing: 2px;
   font-weight: bold;
   
   margin-left: 420px;
   margin-top: 200px;
  list-style-type: none;
}

nav.vertical li {
   
	font-size: 16px;
   margin-left: -100px;
   margin-right: -250px;
 
   letter-spacing: 0px;
   list-style-type: none;
}

nav.vertical li.newgroup {
	
   margin-top: -150px;
   margin-right:150px;
   padding-top: 20px;
   text-decoration: none;
}

nav.vertical li a {
	clear:both;
   float:left;
  
   list-style-type: none;
   color: white;
   
   
}

nav.vertical li a:hover {
   text-decoration: none;
}


 section#main {
   
	font-family: Verdana, Geneva, sans-serif;
	margin: 0px auto;
	min-height: 100%;
	position: relative;
		 
}



footer{
background-image:url('Background-Images-WSP061.jpg');
width:100%;

clear:both;
float:right;
margin-top:200px;
	
text-align: center;
margin-left:auto;
margin-right: auto;


}

footer p{
	text-align:center;
	margin-left:400px;
	word-spacing:10px;
}

