/*
      The Mayflower Style Sheet

      Author: Scott Stiever
      Date:   11/30/2017 
      Filename:  layout-the-mayflower.css

*/

/* Layout styles for desktop screen display */



/* Body styles */

body {
   background-color: rgb(187, 180, 128);
   margin: 0px auto;
   width: 1020px;
   border: 2px solid rgb(18, 15, 12);
   border-radius: 15px;
   margin-top: 36px;
   margin-bottom: 36px;
}



/* Header styles */
   
header {
   background: rgb(221, 217, 191);
   border-bottom: 1px solid rgb(18, 15, 12);
   height: 160px;
   width: 100%;
	 border-radius: 15px 15px 0px 0px;
}

.bgimg {
   position: relative;
   z-index: 1; /* <-- Added */
   right: 0px;
   margin: 0px;
   padding: opx;
   float: right;
}

.clickable {
   position: absolute; /* <-- Added */
   z-index: 2; /* <-- Added */
   height: 160px;
   width: 1020px;
   margin: 0px;
   padding: opx;
	 border-radius: 15px 15px 0px 0px;
}

/* Main section styles */

section#main {
   background: rgb(221, 217, 191);
   position: relative;
   top: 0px;
   left: 0px;
   width: 100%;
	 border-radius: 0px 0px 15px 15px;
	 height: auto;
}

section#main h1 {
   font-size: 42px;
	 font-family: 'times_new_romanbold', serif;
   text-align: center;
   padding-top: 10px;
   width: 100%;
	 font-weight: normal;
	 color: #2E1005;
   line-height: 51px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}


/* Main section article styles */

section#main article {
   width: 980px;
   height: auto;
   position: static;
   padding-top: 9px;
   padding-bottom: 25px;
   padding-left: 20px;
   padding-right: 20px;
}

.intro {
   font-size: 18px;
   font-family: 'times_new_romanregular', serif; 
	 font-weight: normal;
   color: #2E1005; 
   line-height: 18px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.intro2 {
   font-size: 18px;
	 font-family: 'times_new_romanbold', serif;
	 font-weight: normal;
   color: #2E1005; 
   line-height: 18px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.bradford {
   font-size: 16px;
   font-family: 'times_new_romanregular', serif; 
	 font-weight: normal;
   color: #2E1005; 
   line-height: 16px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.compact {
   font-size: 42px;
	 font-family: 'times_new_romanbold', serif;
   width: 100%;
	 font-weight: normal;
	 color: #2E1005;
   line-height: 51px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.compact2 {
   padding-top: 6px;
   padding: 0px;
}


/* Figure and photo styles */

figure {
   position: absolute;
   width: 300px;
   height: 225px;
   padding-top: 17px;
   padding-left: 15px;
}

figure img {
   display: block;
   width: 90%;
   margin: 0px auto;
}

figure figcaption {
   font-size: 12px;
	 font-family: 'verdanabold-italic', Geneva, sans-serif;
   line-height: 12px;
   text-align: center;
   padding: 5px 0px;
}


/* Page footer styles */

footer {
   margin-top: auto;
	 font-family: 'verdanaregular', Geneva, sans-serif;
   font-size: 10px;
   border-top: 1px solid rgb(18, 15, 22);
   padding-bottom: 20px;
   padding-top: 10px;
   word-spacing: 5px;
   padding-right: 5px;
}

footer span {
   float: right;
   margin-right: 10px;
}

.center{	
	text-align: center;
	margin:auto; 
	padding:0;
}

.left{
	float: left;
	margin-left: 10px;
}

.right{
	float: right;
	margin-right: 10px;
}

a.footer:link {color: rgb(113, 0, 17); 
                text-decoration: none; 
}
a.footer:visited {color: rgb(113, 0, 17); 
}
a.footer:hover {color: rgb(113, 0, 17); 
                 text-decoration: underline; 
}
a.footer:active {color: rgb(113, 0, 17); 
} 


/* Main section navigation list styles */

.navbar{
   height: 20px;
   background-color: rgb(134, 162, 100);
	 width: 100%;
	 font-family: 'verdanaregular', Geneva, sans-serif;
}

.navbar ul.hori{
   list-style-type: none;
   width: auto;
   height: 20px;
   border-top: 1px solid rgb(18, 15, 12);
   border-bottom: 2px solid rgb(18, 15, 12);
}

.navbar ul.hori > li{
   display: block;
	 float: left;
   height: 20px;
   width: 20%;  
   background-color: rgb(0, 111, 11);
}

.navbar ul.hori li a{
   display: block;
   color:white;
   text-align: center;
   line-height: 20px;
   font-size: 12px;
   border-left: 1px solid rgb(18, 15, 12);
   border-right: 1px solid rgb(18, 15, 12);

}

.navbar ul.hori < li a{
	 float: left;
   height: 20px;
   line-height: 20px;
   color: white;
   text-align: center;
}

.navbar ul.hori li > a:hover{
   background-color: rgb(0, 79, 7);
}

.navbar ul.hori li.drop_holder{
   position: relative;
}

.navbar ul.hori li ul.dropdown{
   list-style-type: none;
	 clear: both;
   background-color: rgb(95, 46, 5);
   border-top: 1px solid rgb(18, 15, 12);
   border-bottom: 1px solid rgb(18, 15, 12);
   border-left: 1px solid rgb(18, 15, 12);
   border-right: 1px solid rgb(18, 15, 12);
   display: none;
   position: relative; /* <-- Added */
   z-index: 1; /* <-- Added */
}

.navbar ul.hori li ul.dropdown li{
   border-bottom: 1px solid rgb(18, 15, 12);
   border-top: 1px solid rgb(18, 15, 12);
}

.navbar ul.hori li.drop_holder:hover ul.dropdown{
   display: block;
}

.navbar ul.hori li ul.dropdown li{
   height: 20px;
}

.navbar ul.hori li ul.dropdown li.celeb{
   height: 40px;
}

.navbar ul.hori li.drop_holder ul.dropdown > li a:hover{
   background-color: rgb(60, 27, 4);
}