/*
Theme Name: Cape Blanco Heritage Society v.1
Theme URI: http://www.capeblanco.com
Description: Custom theme for Cape Blanco Heritage Society
Author: JV Media Design
Author URI: http://www.jvmediadesign.com
*/
/****************************************************************************************/
/*
Theme slightly adjusted by dm to remove wordpress.
	
float is either right or left
. is a class selector and an be used more than once
each element can have more than one class.
# is a class ID selector and can only be used once for a single element

borders, padding, margins are
4 is t, r, b, l 
3 is t, r+l, b
2 is t+b, r+l
1 is all
https://frontend30.com/css-selectors-cheatsheet/

Type Selector: a { }
ID Selector: #a { }		(* ID is not recommended as a selector)
Child Selector: a > b { }
Descendant Selector: a b { }
Combine Descendant & ID Selector: #a b { }
Class Selector: .a { }
Combine the Class Selector: b.x { }
Comma Combinator Selector: a, c { }
Universal Selector: * { }
*/

body {
	margin: 0;
	font-family: Helvetica, Arial, Verdana, sans-serif;
	color: #000000;
	font-size: 11pt;
	background: #FFFFFF url(../img/bodybg.jpg) top left repeat-x;
}

/* wrapper is the box around the top menu and donate button */
#wrapper {
	border: 0px solid #CCCCFF;
	width: 1040px;
	margin: 0 auto;
}

/* header is the box that sits just inside the wrapper */
#header {
	border: 0px solid yellow;
	width: 980px;
	height: 52px;
	margin: 0 auto;
}

#donate {
	border: 0px solid #FFCCCC;
	width: 132px;
	height: 36px;
	float: right;
}

#donate a {
	width: 132px;
	height: 36px;
	background: url(../img/btnDonate.png) top center no-repeat;
	display: block;
	text-indent: -999999px;
}

/* ====== MAIN MENU ====== */

/* this is the box that the top menu sits in and excludes the donate button */
#mainmenu {
	border: 0px solid green;
	float: left;
	margin: 15px 0 0 0;
	padding: 0;
	width: 800px;/* was 846*/
	height: 31px;
	font-size: 10pt;
	font-weight: bold;
	color: #FFFFFF;
	white-space: nowrap;
}
/*
div.mainmenu {
	float: left;
	margin: 15px 0 0 0;
	padding: 0;
	width: 846px;
	height: 31px;
	font-size: 10pt;
	font-weight: bold;
	color: #FFFFFF;
	white-space: nowrap;
}
*/
#mainmenu ul {
	list-style: none;
	white-space: nowrap;
	display: inline;
	margin: 0;
	padding: 0;/* was 0 */
}

#mainmenu ul li {
	border: 0px solid white;
	white-space: nowrap;
	display: inline;
	float: left;
	position: relative;
	list-style: none;
	background: url(../img/navlogo.png) top left no-repeat;
	padding: 0 0 0 30px;
	margin: 0;
}

#mainmenu ul li a {
	font-size: 10pt;/* was 9pt */
	font-weight: bold;
	color: #FFFFFF;
	display: block;
	line-height: 28px;
	padding: 0 4px;
	text-decoration: none;
}

#mainmenu ul li a:hover {
	background: #3a577a;
	color: #FFFFFF;
	text-decoration: none;
}

/* Drop Downs */

#mainmenu ul ul {
	display: none;
	position: absolute;
	top: 26px;
	left: 29px;
	float: left;
	width: 220px;
	z-index: 99999;
}
#mainmenu ul ul li {
	min-width: 220px;
	list-style: none;
	border-bottom: 1px solid #999999;
	display: block;
	height: 20px;
	padding: 1px;
	margin: 5px 0 0 0;
	float: left;
	white-space: normal;
	text-align: left;
}
#mainmenu ul ul ul {
	left: 100%;
	top: 0;
}
#mainmenu ul ul a {
	background: #193e67;
	line-height: 1em;
	padding: 10px;
	width: 220px;
	height: auto;
}
#mainmenu li:hover > a,
#mainmenu ul ul :hover > a {
	background: #3a577a;
	color: #FFFFFF;
}
#mainmenu ul li:hover > ul {
	display: block;
}

/* ====== SLIDER CONTAINER ====== */

/* this box surrounds the slider background */
#sliderwrap { /* sliderbg.png is 1040x377 */
	border: 0px solid #cccccc;
	width: 1040px;
	height: 347px;
	background: url(../img/slider/sliderbg.png) top center no-repeat;
	margin: auto;
	padding-top: 21px;
	position: relative;
	clear: both;
}

/* slider image container */
#sliderimgc {
	border: 0px solid red;
	max-width: 980px;
	height: 325px;
	margin: 0 auto;
	position:relative;
}

/* ship's wheel overlay onto slider*/
.sliderovrlay {
	border: 0px solid #555555;
	background: url(../img/slidersuboverlay.png) top center no-repeat;
	margin: 0 auto;
	width: 235px;
	height: 226px;
	z-index: 999 !important;
	position: absolute;
	clear: both;
}

/* all slider images are 980 × 322 */
.sliderimg {
	border: 0px solid red;
	margin:auto;
	position:relative;
}

/* 10s is 10 seconds */
img.slimgfader {
	animation: fading 10s infinite;
}

@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}

/* this is the text that sits near the bottom */
.slidertext{
	position:absolute;
	left:50%;
	bottom:16px;
	transform:translate(-50%,0%);
	-ms-transform:translate(-50%,0%);
	color:white;
	font-size:22px!important
}

/* ====== SUBPAGE BANNER ====== */

.framesub {
	border: 0px solid #555555;
	background: url(../img/slidersuboverlay.png) top center no-repeat;
	margin: 0 auto;
	width: 230px;
	height: 212px;
	z-index: 999 !important;
	position: absolute;
	clear: both;
}

#bannersub {
	border: 0px solid red;
	width: 1040px;
	height: 212px;
	background: url(../img/slidersubbg.png) top center no-repeat;
	margin: 0 auto;
	position: relative;
	clear: both;
}

#bannersub img {
	width: 980px;
	height: 167px;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
	top: 20px;
	left: 28px;
}

/* ====== MAIN CONTENT CONTAINER ====== */

/* this holds two columns */
#maincontainer {
	border: 0px solid red;
	width: 980px;
	margin: 0 auto;
	padding: 0;
}

/* this is the column on the left */
#mainc {
	border: 0px solid green;
	width: 650px;
	float: left;
	padding: 0;
	margin: 0;
}

/* generic styling for all content */
#mainc .content {
	border: 0px solid blue;
	display: block;
	margin: 0;
	width: 650px;
	clear: both;
}

/* this is used in the content block */
.center {
	border: 0px solid #683b19;
	margin: 0 auto;
	text-align:center;
}

/* this is the column on the right */
#sidebar {
	border: 0px solid red;
	width: 300px;/* was 287px */
	float: right;
	padding: 0;
	margin: 0;
	text-align: center;
	color: #683b19;
}

.vidlinks {
	border: 0px solid red;
	text-align: center;
	float: right;
}

/* pads the page so the footer stays down */
.vert_spacer {
	border: 0px solid red;
	background: url(../img/vert_spacer.png) center center no-repeat;
	height: 278px;
	float: right;
	clear: both;
}

.spacer {
	height: 16px;
}

/* ====== FOOTER ====== */

#footer {
	width: 100%;
	height: 188px;
	margin: 0 auto;
	padding: 0;
	clear: both;
	background-color: #376599;
}

#footer .container {
	width: 980px;
	height: 138px;
	margin: 0 auto;
	padding: 25px 0 25px 0;
	text-align: center;
	background: url(../img/footerlogo.jpg) center center no-repeat;
}

#footer ul {
	list-style: none;
	display: inline;
	white-space: nowrap;
	color: #ffffff;
	margin: 0 auto 20px auto;
	padding: 0;
	text-align: center;
}

#footer ul li {
	list-style: none;
	white-space: nowrap;
	display: inline;
	padding: 0 3px;
	font-size: 11pt;
}

#footer ul li a:before {
	content: "|";
	padding: 0 6px 0 0;
}

#footer ul li#menu-item-58 a:before {
	content: "";
}

#footer ul li a:hover:before {
	color: #ffffff;
}

#footer p {
	color: #ffffff;
	font-size: 12pt;
	font-weight: bold;
	padding: 2px 0;
	margin: 0 0 20px 0;
}

#footer a:link, #footer a:active, #footer a:visited, #footer ul li a:link, #footer ul li a:active, #footer ul li a:visited {
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
}

#footer a:hover, #footer ul li a:hover {
	color: #7497be;
}

.copyr {
	font-size: 9pt;
	font-weight: normal;
	color: #d0d9e5;
	text-align: center;
	width: 980px;
	height: 78px;
	margin: 0 auto;
	float: left;
}

.copyr a:link, .copyr a:active, .copyr a:visited {
	color: #d0d9e5 !important;
	font-weight: normal !important;
	text-decoration: none;
}

.copyr a:hover {
	color: #ffffff;
	padding: 0 0 20px 0;
}

.adright {
	float: right;
	width: 138px;
	height: 78px;
	position: relative;
	top: 15px;
}

/* ------- TEXT -------- */

h1 {
	font-size: 20pt;
	color: #683c19;
}

h2 {
	font-size: 16pt;
	color: #683c19;
}

h3 {
	font-size: 14pt;
	color: #683c19;
}

h4 {
	font-size: 12pt;
	color: #683c19;
}

h4 a:link, h4 a:active, h4 a:visited {
	color: #683c19;
	text-decoration: none;
}

h4 a:hover {
	color: #376599;
	text-decoration: none;
}

p {
	font-size: 12pt;
}

hr, .divider {
	background: url(../img/divider.jpg) bottom left no-repeat;
	height: 31px;
	width: 650px;
	margin: 0 auto;
	border: none;
	clear: both;
	display: block;
}

/* ====== PAYPAL ====== */

.accept_pp_button_form input{
    width: auto !important;
}

.accept_pp_button_form input[type="image"]{
    cursor: pointer;
}

.accept_pp_button_form_classic input[type="image"]{
    cursor: pointer;
}

.pp_pay_now_form {
	border: 0px solid red;
	width: 270px;
	margin-left: 50px;
	text-align: center
}

.app_dropdown{
	border: 3px solid #683c19;
	height: 40px;
	font-size: 16px;
}

.app_payment_button{
    margin: 10px 0px;
}