		
/*   Style sheet for Pollard/Auld family website.php */
/*   Created by Pam Pinnuck - 2019  */ 
/* Resets margins & padding */
nav, section, aside, footer {margin: 0; padding: 0;}
html,body{height:100%}
body{margin: 0; overflow-y: scroll; font-family: "Helvetica Neue",Arial,sans-serif; font-size:100%; font-size:1em; background-color:#A4A26E; line-height:1.3em; color:#222; }
/***** default styling for HTML5 layout tags - force a line break *****/
nav, header, aside, section, footer  {display: block;}
#wrapper {
	position: relative;
	min-height:100%; 	/* min-height force footer to bottom of page*/
	width:100%;
    max-width:1024px !important;
	margin: 0 auto;
	background-image: url(../images/bg6.jpg);
	background-color: #f0eeda;
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,6);
    -moz-box-shadow: 0 0 10px rgba(0,0,0,6);
    box-shadow: 0 0 10px rgba(0,0,0,6);
 	}
/***  The following is used to position the header image ***/
#topImage{ clear:both; width: 100%; max-width:1018px; height: auto; background-size: 100% auto !important;float: left; position: center center;  border-radius:0; border: 2px solid #fff; padding:0; margin-bottom:20px;
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,6); 
	-moz-box-shadow: 0 0 10px rgba(0,0,0,6);  
	box-shadow: 0 0 10px rgba(0,0,0,6);
}
		/***  The following formats  ***/

section{  width:70%;  margin: 0 25px 0 50px; padding: 0; height: auto;  text-align:justify;}
#content{ margin:0 50px; padding: 0; height:auto; text-align:justify;}
aside{clear:both; float:right; margin: -7px 50px 0 25px; width:100%; max-width:180px; border:none; padding:0; text-align:center;}
aside.column2{ clear:both; float: right; width:100%; max-width:180px; margin-top:-5px; margin-bottom: 30px; padding:5px; border-radius:12px; box-shadow:3px 3px 5px rgba(50, 50, 50, .5); border-top: 2px solid #db8936;}
/*Top base  navigation layout................................................. */
/* dropdowns  */
/*----- Toggle Button -----*/
.toggle-nav {display:none; float:right;}

/*----- Menu -----*/

.menu {width:100%;max-width:1024;padding:0;margin:0 auto;z-index: 99;position:relative;background-color:#0E0C0A;border-top: 5px solid #db8936;}
.menu ul {list-style-type: none; /* Removes the default styling (bullets) for the list */ display:inline-block; position:relative;margin:0 0 0 50px; padding:0;}
.menu li {margin:0;float:left;list-style:none; color: #CCC;font-size:1.1em; font-weight: bold; font-variant: small-caps}
.menu li:last-child {margin-right:0px;}

.menu a {text-shadow:0px 1px 0px rgba(0,0,0,0.5);color:#777; transition:color linear 0.15s;}
.menu a:hover, .menu.current-item a {text-decoration:none;}
.menu li ul{clear:both;position: absolute; display: none; width: 150px; background: #ffb;}
.menu a:link, .menu a:visited {text-decoration: none;  /* Removes the default hyperlink styling. */display: block;color: #948d81; padding: 10px 15px;}
.menu li:hover > ul, li.over ul {display: block; padding: 0; margin:0; font-size:0.80em; font-weight: bold;}
.menu ul li a:hover{color: #fff;}
/* dropdown items  */	
.menu ul:after {content: ""; clear:both; display:block;}
.menu ul li {float: left; width: auto;  /* Each menu item is 150px wide */text-align: center;  /* All text is placed in the center of the box */padding: 0;margin: 0;}
.menu ul ul li {float:none; position:relative;}
.menu ul ul li a {background:#333;color: #CCC; border: 1px solid #ffb;
	/* adds a top gradient border on dropdown navigation */
	background:-o-linear-gradient( #ffb 0%, #333 7%);	/* For Opera 11.1 to 12.0 */		
	background: -moz-linear-gradient( #ffb 0%, #333 10%);/* For Firefox 3.6 to 15 */
	background: -webkit-linear-gradient( #ffb 0%,#333 10%);/* For Safari 5.1 to 6.0 */
	background: linear-gradient( #ffb 0%, #333 7%);/* Standard syntax (must be last) */
	}	
.menu ul ul li a:hover {background: #222; border: 1px solid #ffb;}
.menu ul ul ul {position: relative; left: 300%; top:0;}
}
}

/*----- Responsive -----*/
@media screen and (max-width: 1150px) {.wrap {width:90%;}}
@media screen and (max-width: 860px) {
.menu {position:relative; display:inline-block}
.menu ul.active {display:none; color: #CCC; border: 1px solid #ffb;}
/*responsive top nav container*/
.menu ul {display:block;width:150px;  position:absolute;margin-top:50px; padding: 0;background:#333;color: #CCC; border: 1px solid #ffb;}
/*responsive dropdown menu nav*/
.menu ul:after {display:block; position:relative;top:0%;content:''; }
.menu li {margin:5px 0px 5px 0px;float:none;display:block;}
.menu li a {display:block;}
.toggle-nav {float:left; margin:0; padding:0;display:block;box-shadow:0px 1px 1px rgba(0,0,0,0.15);border-radius:3px;background-color:#0E0C0A;text-shadow:0px 1px 0px rgba(0,0,0,0.5);color:#fff;font-size:25px;transition:color linear 0.15s;}
.toggle-nav:hover, .toggle-nav.active {text-decoration:none;color:#66a992;}
}/* Top level navigation ends.......................................................  */
/* Content links..............................................................................*/
a:link, a:visited {color:#d8760f;text-decoration:none;padding:0;margin:0;} 
a:hover {color:#455502;background-color: transparent;}
a:active { outline: none;}
/* content images begins..............................................................................*/
p.container{ margin:0 10px 30px 10px;font-size:0.75em; text-align:justify; font-style:oblique; color:#455502;}
.text{ margin-top:15px;font-size: 110%; font-family:"Book Antiqua"; color:#455502; text-align:center; }
.responsive { width: 100%; max-width: 650px; height: auto; border:2px solid #222; padding:2px;  background:#fff; border-radius:12px; box-shadow:3px 3px 5px rgba(50, 50, 50, .5); }
.rightImg {max-width: 100%; height: auto; position: center center; margin:0; border:2px solid #222; padding:2px;  background:#fff; border-radius:12px; box-shadow:3px 3px 5px rgba(50, 50, 50, .5);  cursor: pointer; transition: 0.3s;}
.leftImg {max-width: 100%; height: auto; float:left;display:inline;  margin-right: 30px; margin-bottom:30px; border:2px solid #222; padding:2px;  background:#fff; border-radius:12px; box-shadow:3px 3px 5px rgba(50, 50, 50, .5); margin-bottom: 5px;}
.pimage {max-width: 100%; height: auto; margin:5px 5px 5px 0;float:left; border:2px solid #222; padding:2px;  background:#fff; border-radius:12px; box-shadow:3px 3px 5px rgba(50, 50, 50, .5);}
.pimage:hover {opacity: 0.7;}
.paragraphImg{max-width: 100%; height: auto; float:left; display:block; margin-bottom: 10px;border:2px solid #222; padding:2px;  background:#fff; border-radius:12px; box-shadow:3px 3px 5px rgba(50, 50, 50, .5); margin: 10 30 10 0px;}
.rightImg:hover {box-shadow: 0 0 2px 1px   rgba(36, 40, 40, 0.5);}
cite {margin-top:20px;text-align:justify;font-family:'Cherry Swash'; font-size:1em; font-weight:500; color:#455502; } 
img.pdf{margin-right:7px; border: none; margin-top: 5px; background-color: transparent;}
		/* Omits default underline ----------------------------------------------------------------------------------*/	
abbr { border-bottom: none;	cursor:help;}
ol li{line-height: 1.4em;font-size:100%;}	   
/* header font styles..............................................................................*/
h1{clear: both; padding-top:20px; font-size:170%; line-height:2em; padding-left:60px; text-align:left; font-variant:small-caps; font-family:"Book Antiqua"; }
h2{margin-top:25px; font-family:"Book Antiqua";font-size:130%;color:#573c20;}
h3{font-size:90%;font-variant:small-caps; font-family:"Book Antiqua"; color:#573c20;}
h4{font-size: 110%; font-family:"Book Antiqua"; color:#455502; text-align:left;margin-bottom:-12px; }
h5{font-size:21px; font-variant:small-caps; font-family:"Book Antiqua"; color:#FFF; text-align:left; margin:0 0 28px;}
/* section ids within the Content area..............................................................................*/
#subject{border-bottom:1px dotted #573c20; height:250px; margin-bottom:10px;}
blockquote { display: block;margin: 15px 40px;color:#455502;font-size: 83%;}
.quote{margin: 0 30px; font-style: oblique; font-size: 95%; color:#455502; padding:10px;}
hr { color: #fff; background: #fff; width: 75%; height: 3px; margin: 20px auto;}
 hr.style_two { position: center center; width: 80%;  padding: 0 20px; border: none; border-top: solid #A4A26E; color: #A4A26E; text-align: center; } 
hr.style_two:after {content: "⚜"; display: inline-block; position: relative; top: -0.5em; font-size: 2em; background-image: url(../images/bg6.jpg); }
#siteList{list-style-type: none;}
/* table format begins..............................................................................*/
table {border-collapse: collapse; border-bottom: 3px solid #db8936;box-shadow:3px 8px 5px rgba(50, 50, 50, .5); margin: 0; padding: 0; table-layout: fixed; width: 100%; height:auto; border-spacing: 0; }


table th, table td{ padding: .625em; }
th{ text-align:left; font-size:1.1em; color:#FFF; font-variant:small-caps; padding:2px; background:#db8936; text-align:top; }
table td{font-size: .85em;color:#2a3036; vertical-align:top; padding: 10px 20px; }
table a:link, a:visited {text-decoration:none; display:block; color:#db8936;background-color:transparent;}
table a:hover {color:white; cursor: pointer; }
tr:hover td  { background:#717172; color:#fff; }
tr:nth-child(odd){ background-color:#ddd7d7; }
tr:nth-child(even){ background-color: #efebeb;}

/* table format ends..............................................................................*/
/* table format for media screens begins..............................................................................*/
@media screen and (max-width: 600px) {
table{border-top:5px solid #db8936;}
th{display:none; }
table thead { border: none; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}
table tr {border-bottom: 3px solid #ddd; display: block;}
table td {border-bottom: 1px solid #ddd; display: block; vertical-align:top;text-align:right;}
table a:link, a:visited {text-decoration:none;}
table td::before {content: attr(data-label);float: left; font-variant:small-caps; font-weight:bold;}
table td:last-child { border-bottom: 0;}
.responsive{width:100%; height:auto;}
blockquote{margin: 10px 0;}
}/* table format for media screens ends..............................................................................*/
/* four column format begins..............................................................................*/
#columns{
	clear:both; max-width: 1024px; width: 100%; height: auto; background-size: 100% auto !important; overflow:hidden; padding:0; margin:0;
	}
.block{display:block;float:left;position: relative;min-height:300px;padding:37px 21px 33px;width: 100%; max-width:214px;color:#fff;}
.block:first-child{background: 0 100%  #5D6974;}
.block:first-child .button strong:hover{color:#5D6974;}
.block:first-child+.block{background: 0 100% #db8936;}
.block:first-child+.block .button strong:hover{color:#fff;}
.block:first-child+.block+.block{background: 0 100% #A2A33D;}
.block:first-child+.block+.block .button strong:hover{color:#A2A33D;}
.block:first-child+.block+.block+.block{background: 0 100% #A4A26E;}
.block:first-child+.block+.block+.block .button strong:hover{color:#32373c;}
.block.p3{margin-bottom:30px !important}
.block a{color: #ffb;}

.block a:link, a:visited {text-decoration:none;padding:0;margin:0;} 
.block a:hover {color: #32373c;background-color: transparent;}
/* four column format ends..............................................................................*/





/* footer format begins..............................................................................*/
footer {                                       
	clear: both;  
	width: 100%;
	max-width:1024px;
	margin: 0 auto;
	background-color:  #0E0C0A;
	border-top: 5px solid #db8936;
    height: 60px;
   }
footer p {text-align:center;  font-size:80%; color:#573c20; }
#container {float: right; margin-right: 2em; 	/* 32px; */}
 



