/*
 Theme Name:     Santa Cruz Neighbors
 Theme URI:      http://www.santacruzneighbors.com
 Description:    Custom theme for Santa Cruz Neighbors by PPD Multimedia
 Author:         Donald Trump
 Author URI:     http://www.ppdmultimedia.com
 Template:       Divi
 Version:        1.1
*/
 
@import url("../Divi/style.css");
 
/* =Theme customization starts here
------------------------------------------------------- */

/*
Custom Styles
*/
h3 { padding-top: 10px; }

/* Header */
#top { width: 100%; height: 445px; margin-right: auto; margin-left: auto; clear:both; padding: 20px 20px 15px 20px; background: url("images/lighthousesunset2.jpg") no-repeat left top; background-size: 100% auto; }
#top #logo { height: 105px; width:586px; float:left; }
#top #upcomingevents { height: 421px; width:380px; float:right; background: url("images/upcomingevents.png") no-repeat; }
#top #upcomingevents #upcomingeventstext { height: 250px; width:270px; position:absolute; margin: 125px 0 0 48px; font-size: 12px; line-height: 15px; overflow: auto; direction: rtl; text-align: left; }
#top #upcomingevents #upcomingeventstext .ue-widget { direction: ltr; }
#top #donate { width: 220px; float:right; padding: 0px 5px 0 20px; font-size:16px; font-weight: bold; color: #0066b3; }
#top #donate a img { vertical-align: middle; padding: 0 5px 0 0; }
#top #donate a img:hover { opacity: .65; }
#main-header { border-bottom: solid 12px #2d6cad; }
.et_search_outer { margin-top: -20px !important; }
.logo_container { display: none; }

/* Menu */
.et_menu_container {  }
#et-top-navigation { padding-top: 17px; }
#et-top-navigation a { color: #000 !important; font-size: 16px !important; font-weight: normal !important; }
#et-top-navigation ul { }
#et-top-navigation ul li { padding: 0 10px 0 10px !important; }
#et-top-navigation ul li ul { width: 340px !important; background-color: #2699fb; }
#et-top-navigation ul li ul a { color: #fff !important; }
#et-top-navigation ul li ul li { }
#et-top-navigation ul li ul.sub-menu li a { line-height: 18px !important; width: 300px !important; }

/* Footer */
#main-footer #footer-widgets .footer-widget .fwidget { width: 100% !important; }


/* Media Queries */

/* Setting the breakpoint of the mobile menu */
@media only screen and ( max-width: 1050px ) {
    
}

@media all and ( min-width: 1301px ) and ( max-width: 1500px) {

}

@media all and ( min-width: 1001px ) and ( max-width: 1300px) {
    #et-top-navigation ul li { padding: 0 12px 0 12px !important; }
    #et-top-navigation ul li a { font-size:17px !important; }
    #top { width: 100%; height: 445px; margin-right: auto; margin-left: auto; clear:both; padding: 20px 20px 15px 20px; background: url("images/lighthousesunset2.jpg") no-repeat left top; background-size: 1500px 484px; }
    #top #logo { height: 72px; width:400px; float:left; }
    #main-footer #footer-widgets .footer-widget .fwidget { width: 100% !important; }
}

@media all and ( min-width: 768px ) and ( max-width: 1000px ) {
    .et_menu_container { padding-top: 0px !important; margin-top: -40px; }
    #et-top-navigation ul { padding-top: 0px !important; }
    #et-top-navigation ul li { padding: 0 0 0 12px !important; }
    #et-top-navigation ul li a { font-size:17px !important; }
    #top { width: 100%; height: 480px; margin-right: auto; margin-left: auto; clear:both; padding: 20px 20px 15px 20px; background: url("images/lighthousesunset2.jpg") no-repeat left top; background-size: 1500px 484px; }
    #top #upcomingevents {  }
    #top #logo { height: 72px; width:400px; float:left; }
    #et-top-navigation ul li ul { width: 100%; background-color: #fff !important; }
    #et-top-navigation ul li ul a { color: #000 !important; padding-left:40px; }
    #main-footer { width: 100% !important; }
    #main-footer #footer-widgets .footer-widget .fwidget { width: 100% !important; text-align: center; margin-left: 190px; }
    #main-footer #footer-widgets { width: 100% !important; text-align: center; }
}

@media all and ( min-width: 480px ) and ( max-width: 767px ) {
    .et_menu_container { padding-top: 0px !important; margin-top: -40px; }
    #et-top-navigation ul { padding-top: 0px !important; }
    #et-top-navigation ul li { padding: 0 0 0 12px !important; }
    #et-top-navigation ul li a { font-size:17px !important; }
    #top { width: 100%; height: 570px; margin-right: auto; margin-left: auto; clear:both; padding: 20px 20px 15px 20px; background: url("images/lighthousesunset2.jpg") no-repeat left top; background-size: 1500px 570px; }
    #top #donate { width: 100%; clear:both; text-align:center; margin-top: 30px; }
    #top #upcomingevents { float:none; clear:both; }
    #top #logo { height: 72px; width:400px; float:left; }
    #et-top-navigation ul li ul { width: 100%; background-color: #fff !important; }
    #et-top-navigation ul li ul a { color: #000 !important; padding-left:20px; }
    #main-footer { width: 100% !important; }
    #main-footer #footer-widgets .footer-widget .fwidget { width: 100% !important; }
    #main-footer #footer-widgets { width: 100% !important; }
}

@media all and ( max-width: 479px ) {
    .et_menu_container { padding-top: 0px !important; margin-top: -40px; }
    #et-top-navigation ul { padding-top: 0px !important; }
    #et-top-navigation ul li { padding: 0 0 0 12px !important; }
    #et-top-navigation ul li a { font-size:17px !important; }
    #top { width: 100%; height: 570px; margin-right: auto; margin-left: auto; clear:both; padding: 20px 20px 15px 20px; background: url("images/lighthousesunset2.jpg") no-repeat left top; background-size: 1000px 570px; }
    #top #upcomingevents { float:none; clear:both; margin-left: -30px; }
    #top #logo { height: 54px; width:300px; float:left; }
    #top #donate { width: 100%; clear:both; text-align:center; margin-top:30px; }
    #top #donate img { width: auto; height: 35px; }
    #et-top-navigation ul li ul { width: 200px !important; background-color: #fff !important; }
    #et-top-navigation ul li ul a { color: #000 !important; padding-left:5px; }
    #main-footer { width: 100% !important; }
    #main-footer #footer-widgets .footer-widget .fwidget { width: 100% !important; }
    #main-footer #footer-widgets { width: 100% !important; }
}