/*
Theme Name:  Frances Arbor HOA
Theme URI:   http://divithemes.reviews
Version:     1.1
Description: Divi child theme.
Author:      Steve Saladino
Template:    Divi
*/

@import url("../Divi/style.css");

body {background-color:#fdfaee;}

p {font-family: 'Instrument Serif', sans serif; font-size:22px; font-weight:400; color:#261505; line-height:165%; padding:10px 0 25px 0 !important;}

a, a:link, a:visited {color:#53743d; font-weight:bold; text-decoration:none;}
a:hover {color:#3a4b2f; font-weight:bold; text-decoration:underline;}


/* RESPONSIVE CLASSES */
.onlydesktop {display:block !important;}
.onlymobile {display:none !important;}

.noshow {display:none !important;}

.center {text-align:center !important;}
.left {text-align:left !important;}

img#logo {display:none;} /* Hides default header logo */
h1.main_title {display:none;} /* Removes the default page title */

/* MAIN THEME CONTAINERS */
div#page-container {background-color:transparent !important;}
header#main-header {background-color:rgba(157,132,48,0.85); width:100%;  padding:0 !important; margin:0 !important;}

div#et-main-area {border:0px dashed red !important; background-color:transparent !important; margin:0 !important; padding:0 !important;}
div#main-content {border:0px dashed yellow !important; background-color:transparent !important; padding:0 !important;}
div.container {border:0px dashed green !important; background-color:transparent !important; max-width:100%; width:100%; padding:0 !important;}
div#content-area {border:0px dashed goldenrod !important; background-color:transparent !important; padding:0 !important; margin:0px auto !important; }
div#left-area {border:0px dotted greenyellow !important; width:60% !important; margin:0 auto !important; padding:0 0 40px 0 !important;}


/* MAIN NAVIGATION */
#et-top-navigation {padding:0 !important; margin:0 0 0 0;}
nav#top-menu-nav {padding:0 !important;}
ul#top-menu li.menu-item {font-family: 'Instrument Serif', sans serif; font-size:28px; line-height:115%; padding:20px 20px !important; margin:0 10px 0 0 !important; border:0px dotted yellow;}

ul#top-menu li.menu-item a {color:#fff; padding:0; margin:0 !important; text-align:left; text-transform:uppercase; font-weight:normal !important; }
ul#top-menu li.menu-item a:hover {color:#261505; background-color:transparent;}
ul#top-menu li.menu-item a:active {color:#261505 !important;}

/* DROP DOWN MENU */
.nav li {position: relative;}
.nav li ul { position: absolute; top: 52px; left:0; padding:0px !important; border:0px dashed red; }
.nav li ul { z-index: 9999; width:150px; background-color:rgba(30,67,129,0.9) !important; border-top: 2px solid #fff !important;}
#top-menu li li a {color:#fff; width:130px; padding:0 !important; margin:0; border:0px greenyellow dashed !important; }
.submenu-item {background-image:none !important;}

/* SUB MENU */
ul#top-menu ul.sub-menu li.menu-item {text-transform:uppercase; font-family:'Teko', sans serif; font-weight:bold; border-bottom:1px solid #bcddf3 !important; padding:0; vertical-align:middle; margin-right:0px !important;}
ul#top-menu ul.sub-menu li.menu-item:hover {}
ul#top-menu ul.sub-menu li.menu-item a {color:#fff; font-weight:bold !important; font-size:22px !important; padding:0 0 0 0 !important; background-image:none !important; border:6px dashed gold;}
ul#top-menu ul.sub-menu li.menu-item a:hover {color:#bcddf3;}
ul#top-menu ul.sub-menu li.menu-item a:active {color:#bcddf3 !important; font-weight:bold !important;}
ul#top-menu ul.sub-menu li.menu-item.submenu-item {background-image:none !important;}


/* BUTTONS */
a.button, input.button, button._submit, div.contactform .submit input {display:inline-block; padding:20px; background-color:#49a3da; text-transform:uppercase; border:1px solid #49a3da; border-radius:20px; margin:30px 0; text-align:center; color:#fff; font-weight:bold; font-size:36px; font-family:'Teko', sans-serif; line-height:100%; height:auto !important;}
a.button:hover,  input.button:hover. button._submit:hover, div.contactform .submit input:hover {background-color:#034183; color:#fff !important;}

/* HEADER STYLES */
h1, h2, h3, h4, h5, h6,
h1:link, h2:link, h3:link, h4:link, h5:link, h6:link,
h1:visited, h2:visited, h3:visited, h4:visited, h5:visited, h6:visited,
h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover {font-family: 'Instrument Serif', serif; font-style:italic; color:#947711; padding:0 !important; margin:10px !important; line-height:100%;}
h1 {font-size:48px; padding:0 0 30px 0 !important;}
h2 {font-size:40px;}
h3 {font-size:36px;}
h4 {font-size:30px;}
h5 {font-size:26px;}
h6 {font-size:22px;}

/* BANNER IMAGE & LOGO */
div.bannerimg {margin-top:-85px; border-bottom:7px outset; display:none !important;}
div.bannerimg img {
	width:100%;
	border:0px dotted red;
	background-image:url('https://www.francesarborhoa.com/wp-content/uploads/backgrounds/rotate.php');
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	
}
div.bannerlogo {width:100%; text-align:center; margin-top:-200px; padding-bottom:30px; position:relative; z-index:100;}
div.bannerlogo img {width:55%;}

/* DATE & TIME */
div.datetime {font-family: 'Instrument Serif', sans serif; font-size:20px; font-weight:400; color:#261505; line-height:130%; padding:15px 0 !important; border-top:1px dotted #927e36; border-bottom:1px dotted #927e36;}

/* NEWS ITEM */
div.newsitem {padding:15px; border-top:1px dotted #927e36; border-bottom:1px dotted #927e36;}
div.newsitem h4 {padding:0 !important; margin:0 !important;}

   
/* HOA DOCUMENTS */
a.hoadocs {
	display:inline-block !important; 
	border:1px dotted #927e36; 
	width:15%; 
	padding:105px 1% 10px 1%; 
	margin:10px 2% 10px 0 !important; 
	text-align:center; 
	font-family: 'Instrument Serif', sans serif; 
	font-size:22px; 
	line-height:100%; 
	color:#261505;
	background-image:url('https://www.francesarborhoa.com/wp-content/uploads/FAHOA-docsicon.png');
	background-position: center 10px;
	background-repeat:no-repeat;
	background-size:auto 53%;
}

/* HOA MINUTES */
a.hoamins {
	display:inline-block !important; 
	border:1px dotted #927e36; 
	width:15%; 
	padding:95px 0 10px 0; 
	margin:0 !important; 
	text-align:center; 
	font-family: 'Instrument Serif', sans serif; 
	font-size:20px; 
	line-height:120%; 
	color:#261505;
	background-image:url('https://www.francesarborhoa.com/wp-content/uploads/FAHOA-minsicon.png');
	background-repeat:no-repeat;
	background-position: center 10px;
	background-size:30% auto;
}


/* HOA TREASURER */
a.hoatreas {
	display:inline-block !important; 
	border:1px dotted #927e36; 
	width:15%; 
	padding:95px 0 10px 0; 
	margin:0 !important; 
	text-align:center; 
	font-family: 'Instrument Serif', sans serif; 
	font-size:20px; 
	line-height:120%; 
	color:#261505;
	background-image:url('https://www.francesarborhoa.com/wp-content/uploads/FAHOA-treasicon.png');
	background-repeat:no-repeat;
	background-position: center 10px;
	background-size:30% auto;
}

a.hoadocs:hover, a.hoamins:hover, a.hoatreas:hover  {background-color:#e8debb;}

/* FAQ */
p.question {padding:10px 0 0 0 !important; font-family: 'Instrument Serif', serif; font-style:italic; color:#947711; margin:15px 0; line-height:100%; font-size:28px;}
p.answer {font-size:24px; padding:0 !important; line-height:120%;}
p.reference {font-size:14px; padding:10px 0 25px 0 !important; line-height:100%; border-bottom:1px dotted #947711;}


    
/* FOOTER */
footer#main-footer {margin-top:0px !important; width:100%; padding:0 !important; margin:0 !important; text-align:center; background-color:transparent !important; color:#fff;}
div#footer-bottom {padding:0 !important; background-color:rgba(10,32,1,0.8) !important;}
p#footer-info {color:#fff; width:80%; text-align:center; padding:20px 10% !important; font-size:18px; line-height:110%;}



/* comments fix */
#comment-wrap {
	max-width: 1080px;
	margin: 0 auto;
	padding: 30px 0 0 0;
}

/*-------------------[1080px]------------------*/
@media only screen and ( max-width: 1080px ) {
	#comment-wrap {
		max-width: 934px;
	}
}

/*-------------------[1024px]------------------*/
@media only screen and ( max-width: 1024px ) {
	#comment-wrap {
		max-width: 934px;
	}
}

/*-------------------[980px]------------------*/
@media only screen and (max-width: 980px) {
	#comment-wrap {
		max-width: 690px;
	}

/* RESPONSIVE CLASSES MOBILE */
.onlydesktop {display:none !important;}
.onlymobile {display:block !important;}

/* LEFT AREA MOBILE */
div#left-area {width:80% !important; margin:0 auto !important; padding:0 0 40px 0 !important;}

	
/* SECTIONS MOBILE */
div.mainlogo {border:4px dotted red; width:55%; padding-top:30px 0 0 0; margin:auto;}
div.section {width:80%; padding:40px 10%;}
	
/* BANNER IMAGE & LOGO MOBILE */
div.bannerimg {margin-top:0 !important;}
div.bannerimg img {background-image:url('https://www.francesarborhoa.com/wp-content/uploads/backgrounds/rotate.php');}
div.bannerlogo {width:100%; text-align:center; margin-top:-40px;}
div.bannerlogo img {width:95%;}

	
/* HEADER STYLES MOBILE */
h1 {font-size:42px;}
	
/* HOA DOCUMENTS MOBILE */
a.hoadocs {
	display:block !important; 
	width:82%; 
	padding:20px 2% 20px 15%; 
	margin:15px 0 !important; 
	text-align:center; 
	font-size:30px; 
	background-position: 10px center;
	background-size:auto 80%;
}
	
/* HOA MINUTES MOBILE */
a.hoamins {
	display:block !important; 
	width:82%; 
	padding:20px 2% 20px 15%; 
	font-size:20px; 
	line-height:120%; 
	background-image:url('https://www.francesarborhoa.com/wp-content/uploads/FAHOA-minsicon.png');
	background-repeat:no-repeat;
	background-position: 10px center;
	background-size:auto 80%;
}


/* HOA TREASURER MOBILE */
a.hoatreas {
	display:block !important; 
	border:1px dotted #927e36; 
	width:82%; 
	padding:20px 2% 20px 15%;
	font-size:20px; 
	line-height:120%; 
	background-position: 10px center;
	background-size:auto 80%;
}
	
	
	
	
}

/*-------------------[600px]------------------*/
@media only screen and (max-width: 600px) {
	#comment-wrap {
		max-width: 400px;
	}
}

/*-------------------[479px]------------------*/
@media only screen and ( max-width: 479px ) {
	#comment-wrap {
		max-width: 450px;
	}
}


/*-------------------[320px]------------------*/
@media only screen and ( max-width: 320px ) {
	#comment-wrap {
		max-width: 274px;
	}
}