/* 
Name of File: cas208.css
Name of Programmer: Jane Eichenberger
Date of File: 08-12-14
*/
body  {
      width: 920px;
      margin-left: auto;
      margin-right: auto;
      background: #000;
      
}

p     {
      font-family: verdana, helvetica, sans-serif;
      font-size: 18px;
      margin-left: 5%;
      margin-right: 5%;
}

h1    {
      font-family: verdana, helvetica, sans-serif;
      text-align: center;
      font-size: 32px;

}

h2    {
      font-family: verdana, helvetica, sans-serif;
      text-align: left;
      font-size: 24px;
      color: #666666;
      border-top: 2px solid gray;
      border-bottom: 2px solid gray;
      background: silver;
}

#content    {
      background: #eaeaea;
      padding-bottom: 25px;
      padding-top: 25px;
}

figcaption  {
      font-family: verdana, helvetica, sans-serif;
      font-size: 16px;
      color: #666;
      text-align: center;
      max-height: 100px;
}

.first{
      width: 300px;
      text-align: center;
      
}
.last {
      text-align: center;
      width: 625px;
}


.floatleft  {
      float: left;
      display: inline;
      margin-top: 0px;
      width: 400px;
}

.floatright {
      margin-right: 0px;
      margin-left: 475px;
}

#rose1    {
      padding-left: 5px;
      padding-top: 10px;
      height: 400px;
      
}

#rose2 {
      padding-left: 5px;
      padding-top: 10px;
      height: 450px;
}

#rose3  {
      padding-left: 5px;
      padding-top: 10px;
      height: 400px;
 
}

.roseleft {
      float: left;
      display:inline;
      width: 255px;
      height: auto;
      min-height: 260px;
      margin-left: 2px;
      margin-top: 10px;
      margin-bottom: 20px;
    
}

.roseleft figcaption {
      color: black;
      
}

.rose1 {
      background-color: #5b622e;
      width: 240px;
      height: 186px;
      padding: 10px;
      
}

.rose2 {
      background-color: #0054a5;
      width: 240px;
      height: 255px;
      padding: 10px;
      
}

.rose3 {
      background-color: #a185bf;
      width: 240px;
      height: 161px;
      padding: 10px;
     
}

.roseleft2 {
      float: left;
      display:inline;
      width: 255px;
      height: auto;
      min-height: 260px;
      margin-left: 0;
      margin-top: 10px;
      margin-bottom: 20px;
    
}

#turtle    {
      margin-left:0;
      padding-left: 0;
      padding-top: 10px;
      height: 430px;
}

#tram {
      margin-left: 0;
      padding-left: 0;
      padding-top: 10px;
      height: 400px;
}

#volcano {
      margin-left:0;
      padding-left: 0;
      padding-top: 10px;
      height: 400px;
 
}

.rose4 {
      width: 300px;
      height: 240px;
      padding: 10px;
     
}

.roseleft2  figcaption {
      margin-left: 20px;
      width: 265px;
      text-align: center;
}

#jacob {
      height: 300px;
      width: 300px;
      padding-bottom: 10px;
      padding-left: 50px;
}

#mexico {
      height: 165px;
      width: 300px;
      padding-bottom: 10px;
      padding-left: 50px;
}


#turtle2 {
            width: 300px;
            height: 144px;
            padding-bottom: 10px;
            padding-left: 50px;
}

#flower {
      width: 300px;
      height: 239px;
      padding-bottom: 10px;
      padding-left: 50px;
}

#graffiti {
      width: 300px; 
      height: 200px;
      padding-bottom: 10px;
      padding-left: 50px;
}


#vector1, #vector2 {
      text-align: center;
}


#buttons {
      height: 750px;
}

.button {
      float: left;
      margin-top: -60px;
      margin-left: 25px;
      clear: left;
}
.btn_link {
      float: right;
      margin-left: 100px;
      display: inline;
      width: 600px;
}