/*
Theme Name:     GOTB Child Theme
Theme URI:      https://geeksonthebeach.ca
Description:    GOTB Master
Author:         Geeks On The Beach
Author URI:     https://geeksonthebeach.ca
Template: Divi
Version:        4.0
*/
/* This file was modified 2020-05-06 by Aspen Grove Studios to customize metadata in header comment */

/* =Theme customization starts here
------------------------------------------------------- */

/**
 * 1. general styles
 *  a. Gravity contact form
 * 2. Header
 * 3. Nav Menu
 * 4. Content
 * 5. Footer
 * 6.  additional-[page name]
**/

/*** Responsive Styles Large Desktop And Above ***/
@media all and (min-width: 1405px) {
}

/*** Responsive Styles Standard Desktop Only ***/
@media all and (min-width: 1100px) and (max-width: 1405px) {
}

/*** Responsive Styles Tablet And Below ***/
@media all and (max-width: 980px) {
}

/*** Responsive Styles Tablet Only ***/
@media all and (min-width: 768px) and (max-width: 980px) {
}

/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {
}

/*** Responsive Styles Smartphone Portrait ***/
@media all and (max-width: 479px) {
}

/* ------------- 1. general styles ------------- */

/* ------------- a. Gravity contact form ------------- */

.gform_wrapper ul.gform_fields li {
    list-style: none;
}

.gform_wrapper ul.gform_fields {
    padding-left: 0 !important;
}

.gform_wrapper .hidden_label label {
    display: none;
}

.gform_wrapper input[type=text],
.gform_wrapper input[type=email],
.gform_wrapper input[type=tel],
.gform_wrapper textarea,
.gform_wrapper select {
    border-radius: 3px !important;
    background-color: transparent;
    color: #222;
    font-family: sans-serif;
    border: 0;
    padding: 15px !important;

    border-bottom: 1px solid darkgray;
}

.gform_wrapper input[type=email]:focus {
    border-bottom: 1px solid black!important;
}

.gform_wrapper input[type=text]::placeholder,
.gform_wrapper input[type=email]::placeholder,
.gform_wrapper input[type=tel]::placeholder,
.gform_wrapper textarea::placeholder,
.gform_wrapper select::placeholder {
    color: darkgray;
    font-family: sans-serif;
}

.gform_wrapper .gform_footer {
    text-align: right;
}

.gform_wrapper input[type=submit] {
    border: 0;
    background-color: rgba(32, 178, 170, 0.7);
    color: white;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 1.3em;
    padding: 20px;
    transition-duration: .3s;
    border-radius: 3px;
}

.gform_wrapper input[type=submit]:hover {
    background-color: rgba(32, 178, 170, 1);
    transition-duration: .3s;
    padding-left: 35px;
    padding-right: 35px;
}

/* grow icons effect */
.mp_m_blurb_grow:hover .et_pb_image_wrap {
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.mp_m_blurb_grow:hover .et_pb_image_wrap {
    -webkit-transform: scale(1.3) translateZ(0);
    transform: scale(1.3) translateZ(0);
}

/* ------------- 2. Header ------------- */

/* logo menu header */
@media (max-width: 980px) {
    #logo {
        max-height: 100%;
    }
}

/* secondary top menu bar */
#et-info {
    float: right;
}

/* Change hamburger icon on mobile menu */
.mobile_menu_bar:before {
    position: relative;
    top: 2px;
    color: #212121;
    left: 0;
    font-size: 36px;
    border-radius: 0;
    content: "\61";
}

#main-header .et_mobile_menu .always-visitable {
    position: relative;
}
#main-header .et_mobile_menu .always-visitable .hover-link {
    position: absolute;
    top: 0; left: 0; bottom: 0;
    right: 60px; /* right area continues to expand or collapse */}

/* ------------- 3. Nav Menu ------------- */

.nav li ul {
    visibility: hidden;
    margin-top: 1px;
}



/* #####  CALL TO ACTION BUTTON in the menu item  ##### */

/* Desktop & tablet, call to action menu */
.menu_cta {
    background-color: #fff;
    color: #212121;
    border: 1px solid #212121;
    padding: 0 !important;
    border-radius: 25px;
}

.menu_cta a {
    color: #212121 !important;
    padding: 11px 20px 13px 20px !important;
}

/* Mobile call to action menu */
@media (max-width: 980px) {
    .menu_cta {
        margin: 20px 40px 20px;
    }

    .menu_cta a {
        text-align: center;
    }
}

/* ##### SEARCH BAR in menu, add code to a menu item in the backend first ##### */

input.text, input.title, input[type=email], input[type=password], input[type=tel], input[type=text], select, textarea {
    padding: 2px;
    border: 2px solid #f4f4f4;
    color: #212121;
    border-radius: 25px 0px 0px 25px;
    padding: 7px 20px 9px;
    background-color: #F4F4F4;
    font-size: 14px;
}

#searchsubmit {
    cursor: pointer;
    padding: 8px 25px 11px;
    margin-left: -4px;
    border-radius: 0px 25px 25px 0px;
    font-size: 15px;
    border: none;
    background: #090909;
    color: #ffffff;
    font-weight: 600;
}

/* ##### DROPDOWN MENU WIDTH ##### */

.nav li ul {
    width: 240px !important; /* Width of the dropdown menu */
}

.nav li li ul {
    left: 240px !important; /* Use the same size as above */
}

#top-menu li li a {
    width: 200px; /* Make this 40 less then the width of the dropdown menu */
}


/* remove the hover grey when current on dropdown-menu */
.nav ul li a:hover {
    opacity: 1;
    background-color: rgba(0, 0, 0, 0);
}

/* fix arrow align with menu title  */
#et-secondary-nav .menu-item-has-children > a:first-child:after, #top-menu .menu-item-has-children > a:first-child:after {
    top: 1px;
}



/* *************Mobile menu ************ */

.et_mobile_menu {
    border-top: 1px solid #ededed!important}

.mobile_nav.opened .mobile_menu_bar:before {
    content: '\4d';
    z-index: 9999;
    color: #212121;
}

/*  Making the Menu Fixed on Mobile 
@media (max-width: 980px) {
    .et_non_fixed_nav.et_transparent_nav #main-header, .et_non_fixed_nav.et_transparent_nav #top-header, .et_fixed_nav #main-header, .et_fixed_nav #top-header {
        position: fixed;
    }
}*/

/* CSS fix to DIVI mobile menu not fitting on screen and not scrollable */
.et_mobile_menu {
overflow: scroll !important;
max-height: 84vh; /*edit this to match your view height*/
box-shadow: 0px 0px 30px rgba(0,0,0,0.3) 
}



/* Increase width of drop-down menus */
@media screen and (min-width: 981px) {
.sub-menu {
	min-width: 320px;
}
#top-menu li li a {
    width: 280px;
	/* Extra - Reduce padding on list items */
	padding: 4px 12px;
	}
}

/* ------------- 4. Content ------------- */

/* ------------- 5. Footer ------------- */

/* Geeks on the Beach Footer Logo */

div p.credits {
    float: left;
    background: url(/wp-content/uploads/gotb-bw.png) 50% 50% no-repeat transparent;
    width: 89px;
    height: 60px;
    overflow: hidden;
    opacity: .6;
    -moz-transition: opacity 0.5s ease-in-out;
    -webkit-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}

div p.credits:hover {
    -moz-transition: opacity 0.5s ease-in-out;
    -webkit-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
    opacity: 1;
}

div p.credits a.gotb-link {
    display: block;
    background: url(/wp-content/uploads/gotb-color.png) 50% 50% no-repeat transparent;
    width: 89px;
    height: 60px;
    text-indent: -999em;
    opacity: 0;
    -moz-transition: opacity 0.5s ease-in-out;
    -webkit-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}

div p.credits a:hover.gotb-link {
    opacity: 1;
    moz-transition: opacity 0.5s ease-in-out;
    -webkit-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}

.gotbcopyright {
    position: absolute;
    right: 60px;
    padding-top: 20px;
    bottom: 15px;
}

@media screen and ( max-width: 980px ) {
    #footer-info {
        position: relative;
        height: 115px;
        text-align: center;
    }

    #footer-info p.credits {
        position: absolute;
        width: 89px;
        height: 60px;
        left: 50%;
        margin-left: -44.5px;

    }

    #footer-info div.gotbcopyright {
    	position: absolute;
    	/*width: 400px;*/
    top: 50px;
    left: 34%;
    right: 0;
	margin-left: -64%;
    }

	#footer-info div.gotbcopyright p {
    		margin-left: 22%;
	}


}

/* ------------- 6. additional-[page name] ------------- */