/*
   New Perspectives on HTML and CSS
   Tutorial 6
   Case Problem 4

   oform style sheet

   Filename:         oform.css
   Supporting files: 

*/

/* Default styles */
header{ margin: 0px  5px; margin-left: 255px; width: 100%;  display: block; background-color:white; }
header nav ul li {
 font-size: 17px; 
  display: inline;
   float: left; 
   width: 12%;
   margin: 0px 2px;
   text-align: center;
   padding:0px;
   
   
}
prompt {border:1 solid transparent; background-color:#99ccff;width:70;font-family:arial;font-size:12; color:black;} 


section{margin-top:20px; }



header nav ul{margin-left:0px; margin-right:0px; margin-top:0px; display:inline;}

body {background-color: white;
   font-size: 18px; 
   font-family: Verdana, Geneva, sans-serif;
   margin: 0px auto;
    background-image: url("brownpaw.jpg");
   background-repeat: repeat-y;
}
  

header nav ul li a {
   display: block;
   border: 1px solid black;
   /* width:100%; */
   background-color: rgb(162, 112, 41);
   color: white;
}

header nav ul li a:hover { text-decoration: none;
   color: black;
}
nav {width: 80%;}


#logo{ padding: 0px 5px 5px 5px;
   
    width: 800px; 
    height: 180px;
}
        
 .first  {   outline:2px solid black; font-size:0.8em; width: 45%;  float:left; background-color:white;  padding: 10px 10px 10px 10px; 
 margin:15px 75px 5px 255px; 
 }

	 
 .three{outline:2px solid black; font-size:0.8em; width: 45%; float:right;  padding: 10px 10px 10px 10px;  margin:15px 75px 0px 255px; 
 float:left;}

.vertNav{ float: right; width: 280px;  border-left: 1px solid  #a27029;
   height: 350px; margin-left:80px;    display: block;     margin-top: 100px;   margin-right: 15px;}
   
.vertNav nav ul li a:hover { 
color: black;}
.vertNav nav ul li a{color:#a27029 ;}
 .vertNav nav ul li{ padding: 10px; width:190px;text-decoration: none; list-style:none;  }
 .four{ font-size:.8em;  position:absolute;  right:10px; top: 250px ; align: right;  }
 .five { -moz-border-radius: 15px; border: 3px solid white;  width:240px; height:290px; position:absolute; right: 240px; top:222px;
 border-radius: 15px;}	
 
 div #star{-moz-border-radius: 15px; border: 3px solid white; border-radius: 15px;  width:240px; height:270px;
 }	

 .six { float:right;  margin-top:15px; background-color:#ffffff; width: 40%; height: 100%; margin-right:10px; }

footer { display:block;
   clear: both;
   padding-top: 20px;
}

footer address {
  
   font-size: 16px;
   font-style: normal; 
   font-variant: small-caps; 
   text-align: center;
}
 
   #frame {
width: 34%;
margin-top: 25px;
background-color: rgb(212, 212, 212);
-moz-border-radius: 15px;
 border-radius: 15px;
position:absolute;
	  top:260px; right: 20px;
	 height: 135px; width:170px; }	
.five	#star{width:200px; height: 230px;  border-image:url("Bone.jpg") 40 round;  border-width: 30px;
	o-border-image:url("Bone.jpg") 40 round;   -moz-border-image:url("Bone.jpg") 40 round; -webkit-border-image: url("Bone.jpg") 40 round;}	 
 
    section {width:350px; height:250px;  border: 5px solid powderblue; box-shadow: inset powderblue 5px 5px 25px;
-moz-border-radius: 15px;
 border-radius: 15px;}
  
/*  CSS for Volunteer Link ***********************************************************************/
.VolunteerContent {
    background-color: #ddb177;
    -webkit-transition: background-color 1000ms linear;
    -moz-transition: background-color 1000ms linear;
    -o-transition: background-color 1000ms linear;
    -ms-transition: background-color 1000ms linear;
    transition: background-color 1000ms linear;
}
input { width: 90px;
	padding: 5px;
background-color:#dc8939}

body.pawBorder{width : auto; float: left; height:auto;  background-image: url("brownpaw.jpg");background-repeat: repeat-y; background-color: #ddb177;}
.VolunteerContent{ float: right; margin-left: 0px; padding-left: 10px; padding-right: 15px; width: 70%; height:100% margin-right:10px;  }
.VolunteerContent  ul  {list-style-type:square ;}
.VolunteerContent input{ margin-left: 45%;  margin-top: 20px;}