/*
Theme Name: Divi Child Theme
Description: Divi Child Theme
Author:  LP Design
Author URI:  https://liampedleydesign.co.uk
Template: Divi
Version:  1.0.1
*/

 
/* Theme customizations - add your custom CSS code here so that it isn't deleted when you update your theme. Alternatively use the space within Theme Options in the Divi WordPress tab
------------------------------------------------------- */

/* Mobile Menu - stops your navigation menu going on to 2 lines by implementing the mobile menu at 1200px instead. */

@media only screen and ( max-width:1200px ) {
 
#et_mobile_nav_menu { display:block }
 
#top-menu-nav { display:none; }
 
}
 
/**change these settings if you want to style it**/
 
.mobile_menu_bar:before {
 
content: "\61";
 
font-size: 32px;
 
left: 0;
 
position: relative;
 
top: 0;
 
cursor: pointer;
 
}

/* Micro Animations - Add these to blurb modules to animate the icons. See guide for instructions on how to do this */

/* pulse icon */
 
    .mp_m_blurb_pulse:hover .et-pb-icon {
        -webkit-animation-name: gq_pulse_icon;
        animation-name: gq_pulse_icon;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;}
 
    @-webkit-keyframes gq_pulse_icon {
        25% {-webkit-transform: scale(1.3);transform: scale(1.3);}
        75% {-webkit-transform: scale(0.8);transform: scale(0.8);}}
    @keyframes gq_pulse_icon {
        25% {-webkit-transform: scale(1.3);transform: scale(1.3);}
        75% {-webkit-transform: scale(0.8);transform: scale(0.8);}}

/* grow icon */
 
    .mp_m_blurb_grow:hover .et-pb-icon {
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;}
 
    .mp_m_blurb_grow:hover .et-pb-icon {
        -webkit-transform: scale(1.3) translateZ(0);
        transform: scale(1.3) translateZ(0);}

/* push icon */
 
    .mp_m_blurb_push:hover .et-pb-icon {
            -webkit-animation-name: gq_push_icon;
            animation-name: gq_push_icon;
            -webkit-animation-duration: 0.4s;
            animation-duration: 0.4s;
            -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
            -webkit-animation-iteration-count: 1;
            animation-iteration-count: 1;}
 
    @-webkit-keyframes gq_push_icon {
        50% {-webkit-transform: scale(0.5); transform: scale(0.5);}}
    @keyframes gq_push_icon { 
        50% {-webkit-transform: scale(0.5); transform: scale(0.5);}}

/* bounce icon */
 
    .mp_m_blurb_bounce .et-pb-icon {
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;}
 
    .mp_m_blurb_bounce:hover .et-pb-icon {
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
        -webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
        transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);}

/* rotate icon */
 
    .mp_m_blurb_rotate .et-pb-icon {
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;}
 
    .mp_m_blurb_rotate:hover .et-pb-icon {
        -webkit-transform: rotate(20deg);
        transform: rotate(20deg);}

/* bob icon */
 
    .mp_m_blurb_bob:hover .et-pb-icon {
        -webkit-animation-name: gq_bob_float_icon, gq_bob_icon;
        animation-name: gq_bob_float_icon, gq_bob_icon;
        -webkit-animation-duration: .3s, 1.5s;
        animation-duration: .3s, 1.5s;
        -webkit-animation-delay: 0s, .3s;
        animation-delay: 0s, .3s;
        -webkit-animation-timing-function: ease-out, ease-in-out;
        animation-timing-function: ease-out, ease-in-out;
        -webkit-animation-iteration-count: 1, infinite;
        animation-iteration-count: 1, infinite;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-direction: normal, alternate;
        animation-direction: normal, alternate;}
 
    @-webkit-keyframes gq_bob_icon {
        0% {-webkit-transform: translateY(-6px);transform: translateY(-6px);}
        50% {-webkit-transform: translateY(-2px);transform: translateY(-2px);}
        100% {-webkit-transform: translateY(-6px);transform: translateY(-6px);}}
    @keyframes gq_bob_icon {
        0% {-webkit-transform: translateY(-6px);transform: translateY(-6px);}
        50% {-webkit-transform: translateY(-2px);transform: translateY(-2px);}
        100% {-webkit-transform: translateY(-6px);transform: translateY(-6px);}}
    @-webkit-keyframes gq_bob_float_icon {
        100% {-webkit-transform: translateY(-6px);transform: translateY(-6px);}}
    @keyframes gq_bob_float_icon {
        100% {-webkit-transform: translateY(-6px);transform: translateY(-6px);}}

/* buzz icon */
 
    .mp_m_blurb_buzz:hover .et-pb-icon {
        -webkit-animation-name: gq_buzz_icon;
        animation-name: gq_buzz_icon;
        -webkit-animation-duration: 0.15s;
        animation-duration: 0.15s;
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;}
 
    @-webkit-keyframes gq_buzz_icon {
        50% {-webkit-transform: translateX(3px) rotate(2deg);transform: translateX(3px) rotate(2deg);}
        100% {-webkit-transform: translateX(-3px) rotate(-2deg);transform: translateX(-3px) rotate(-2deg);}}
    @keyframes gq_buzz_icon {
        50% {-webkit-transform: translateX(3px) rotate(2deg);transform: translateX(3px) rotate(2deg);}
        100% {-webkit-transform: translateX(-3px) rotate(-2deg);transform: translateX(-3px) rotate(-2deg);}}
 
/* push down icon */
 
    .mp_m_blurb_down:hover .et-pb-icon {
        -webkit-animation-name: gq_push_down_icon;
        animation-name: gq_push_down_icon;
        -webkit-animation-duration: 0.75s;
        animation-duration: 0.75s;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;}
    @-webkit-keyframes gq_push_down_icon {
        0%, 50%, 100% {-webkit-transform: translateY(0); transform: translateY(0);}
        25%, 75% {-webkit-transform: translateY(6px);transform: translateY(6px);}}
    @keyframes gq_push_down_icon {
        0%, 50%, 100% {-webkit-transform: translateY(0);transform: translateY(0);}
        25%, 75% { -webkit-transform: translateY(6px); transform: translateY(6px);}}


/* push up icon */
 
    .mp_m_blurb_up:hover .et-pb-icon {
        -webkit-animation-name: gq_push_up_icon;
        animation-name: gq_push_up_icon;
        -webkit-animation-duration: 0.75s;
        animation-duration: 0.75s;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;}
 
    @-webkit-keyframes gq_push_up_icon {
        0%, 50%, 100% {-webkit-transform: translateY(0);transform: translateY(0);}
        25%, 75% {-webkit-transform: translateY(-6px); transform: translateY(-6px);}}
    @keyframes gq_push_up_icon {
        0%, 50%,100% {-webkit-transform: translateY(0); transform: translateY(0);}
        25%, 75% {-webkit-transform: translateY(-6px);transform: translateY(-6px);}}

/* spin */
 
    .mp_m_blurb_spin .et-pb-icon {
        -webkit-transition-duration: 1s;
        transition-duration: 1s;
        -webkit-transition-property: transform;
        transition-property: transform;
        -webkit-transition-timing-function: ease-in-out;
        transition-timing-function: ease-in-out;}
 
    .mp_m_blurb_spin:hover .et-pb-icon {
            -webkit-transform: rotate(360deg);
            transform: rotate(360deg);}

/* drop */
 
    .mp_m_blurb_drop:hover .et-pb-icon {
            opacity: 0;
        -webkit-transition-duration: 0.3s;
        transition-duration: 0.3s;
        -webkit-animation-name: gq_drop_icon;
        animation-name: gq_drop_icon;
        -webkit-animation-duration: 0.5s;
        animation-duration: 0.5s;
        -webkit-animation-delay: 0.3s;
        animation-delay: 0.3s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
        animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);}
 
    @-webkit-keyframes gq_drop_icon {
        0% {opacity: 0;}
        50% {opacity: 0;-webkit-transform: translateY(-100%);transform: translateY(-100%);}
        51%, 100% {opacity: 1;}}
    @keyframes gq_drop_icon {
        0% {opacity: 0;}
        50% {opacity: 0;-webkit-transform: translateY(-100%);transform: translateY(-100%);}
        51%, 100% {opacity: 1;}}

/* horizontal wobble */ 

    .mp_m_blurb_horizontal_wobble:hover .et-pb-icon {
        -webkit-animation-name: gq_horizontal_wobble;
        animation-name: gq_horizontal_wobble;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        -webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;}
 
    @-webkit-keyframes gq_horizontal_wobble {
        16.65% {-webkit-transform: translateX(6px);transform: translateX(6px);}
        33.3% {-webkit-transform: translateX(-5px);transform: translateX(-5px);}
        49.95% {-webkit-transform: translateX(4px);transform: translateX(4px);}
        66.6% {-webkit-transform: translateX(-2px);transform: translateX(-2px);}
        83.25% {-webkit-transform: translateX(1px);transform: translateX(1px);}
        100% {-webkit-transform: translateX(0); transform: translateX(0);}}
    @keyframes gq_horizontal_wobble {
        16.65% {-webkit-transform: translateX(6px);transform: translateX(6px);}
        33.3% {-webkit-transform: translateX(-5px);transform: translateX(-5px);}
        49.95% {-webkit-transform: translateX(4px);transform: translateX(4px);}
        66.6% {-webkit-transform: translateX(-2px);transform: translateX(-2px);}
        83.25% {-webkit-transform: translateX(1px);transform: translateX(1px);}
        100% {-webkit-transform: translateX(0); transform: translateX(0);}}


/* Sticky button - makes any element sticky. You will need to play around with the width for it to display properly. */


#sticky-button {
position: fixed;
right: -50px !important; /*Positions the button to the right of the page*/
bottom: 0; /*Sets the distance of the button from the bottom of page*/
width: 200px !important; /*Sets dimensions of the button*/
height: 25px !important; /*Sets dimensions of the button*/
z-index: 99999; /*Keeps the button on top*/
}

/* Styling for the second logo - you'll want to adjust margins and padding for your second logo so it doesn't jump on scroll */



/* Dividers - Add custom dividers to your divi sections */

/* Zig zag */

.zigzag::before {
    display:block;
	position:absolute;
	content:'';
	left: 0;
	width: 100%;
	height: 50px;
	background-size: 100px 100%;
	top: 0;
	background-image: -webkit-gradient(linear, 0 0, 10% 100%, color-stop(0.5, #1e73be), color-stop(0.5, #81d742));
    background-image: linear-gradient(15deg, #1e73be 50%, #81d742 50%); }

/* Half circle */

.halfcircle::before {
    
display:block;
 position:absolute;
 content:'';
 left: 50%;
 z-index: 10;
 width: 100px;
 height: 100px;
 border-radius: 50%;
 background: #dd3333;
 -webkit-transform: translateX(-50%);
 transform: translateX(-50%);
 top: -50px;
}

/* Upwards arrow */

.upwardsarrow::before {
    
display: block;
position: absolute;
content: '';
width: 100px;
height: 100px;
bottom: -50px;
left: 50%;
margin-left: -50px;
background-color: #dddddd; /** Change This Value ***/
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
z-index: 1;
}

/* Diagonal divider */

#et-main-area { overflow: hidden;} /* Hides all the items that float over the right margin */
  
    .diagonal-shadow::before,
    .diagonal-shadow::after {
        position: absolute;
        content: '';
        pointer-events: none;}
  
    .diagonal-shadow {
        z-index: 1;
        padding-top: 6em;
        background: #2072a7;}
  
    .diagonal-shadow::before,
        .diagonal-shadow::after {
        top: 0;
        left: -25%;
        z-index: -1;
        width: 150%;
        height: 75%;
        background: inherit;
        -webkit-transform: rotate(-2deg);
        transform: rotate(-2deg);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;}
  
    .diagonal-shadow::before {
        height: 50%;
        background: #535353;
        -webkit-transform: rotate(-3deg);
        transform: rotate(-3deg);
        -webkit-transform-origin: 3% 0;
        transform-origin: 3% 0;}

/* Add menu icons */

@media (min-width: 981px) {
 
 .menu-icons a { padding-left: 25px; 
} 
 .menu-icons a:before { font-family: 'ETmodules'; position: absolute; } }
 
 #main-header .menu-icons a:before { top: 0; left: 0; } 
 .sub-menu .menu-icons a:before { margin-top: 6px; left: 0; display: none;} 
 #top-header .menu-icons a:before { left: 0px; top: 0px; }
 
/* MENU ICONS */

 /*** INFO ***/ .menu-icon-1 a:before { content: "\e060"; }
 /*** CHAT ***/ .menu-icon-2 a:before { content: "\77"; }
 /*** CLOSED PADLOCK ***/ .menu-icon-3 a:before { content: "\7e"; }
 /*** CART ***/ .menu-icon-4 a:before { content: "\e015"; }
 /*** PEOPLE ***/ .menu-icon-5 a:before { content: "\e08b"; }
 /*** LANDSCAPE IMAGE ICON ***/ .menu-icon-6 a:before { content: "\e005"; }
 /*** LIGHTBULB ***/ .menu-icon-7 a:before { content: "\e007"; }
 /*** TEL ***/ .menu-icon-8 a:before { content: "\e090"; }
 /*** ENVELOPE ***/ .menu-icon-9 a:before { content: "\e010"; }
 /*** CREDIT CARD ***/ .menu-icon-10 a:before { content: "\e09e"; }
 /*** SHOPPING CART ***/ .menu-icon-11 a:before { content: "\e015"; }
 /*** LOCATION PIN ***/ .menu-icon-12 a:before { content: "\e01d"; }
 /*** CALENDAR ***/ .menu-icon-13 a:before { content: "\e023"; }
 /*** CONTACTS BOOK ***/ .menu-icon-14 a:before { content: "\e026"; }
 /*** HEART ***/ .menu-icon-15 a:before { content: "\e030"; }
 /*** COGS ***/ .menu-icon-16 a:before { content: "\e038"; }
 /*** WALLET ***/ .menu-icon-17 a:before { content: "\e100"; }
 /*** BRIEFCASE ***/ .menu-icon-18 a:before { content: "\e0fe"; }
 /*** STAR ***/ .menu-icon-19 a:before { content: "\e031"; }
 /*** HOME ***/ .menu-icon-20 a:before { content: "\e009"; }
 /*** LINK CHAIN ***/ .menu-icon-21 a:before { content: "\e02c"; }
 /*** LIKE THUMBS UP ***/ .menu-icon-22 a:before { content: "\e106"; }
 /*** HOURGLASS ***/ .menu-icon-23 a:before { content: "\e0e1"; }
 /*** PIE CHART ***/ .menu-icon-24 a:before { content: "\e029"; }
 /*** FACEBOOK ***/ .menu-icon-25 a:before { content: "\e0aa"; }
/*** TWITTER ***/ .menu-icon-26 a:before { content: "\e0ab"; }

/* Styling the call to action in top bar */

#top-header .container {
    padding-top: 1.3em;
    font-weight: 600;
    padding-bottom: 0.75em;
}
 
#et-info {
    width: 33.3%;
    float: right;
    text-align: right;
}
 
.cta {
width: 33.3%;
text-align:center;
float: right;
margin-top: -3px;
}
 
.cta a {
background: #fff;
    color: #eb593c !important;
    padding: 5px 10px;
    display: inline-block;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-weight: 700 !important;
    transition: all 0.5s;
}
 
.cta a:hover {
background: #555;
color: #fff !important;
}
 
#et-secondary-menu {
width: 33.3%;
float: left;
text-align: left;
}
 
@media (max-width: 980px){
#et-info {
    width: 50%;
    float: right;
    text-align: right;
}
 
.cta {
width: 50%;
text-align:center;
float: left;
margin-top: -3px;
}
 
#et-info {
padding-top:0px;
padding-bottom: 0.75em;
}
}
 
@media (max-width: 740px){
.cta {display:none;}
#et-info {width: 100%;}
}

/* Columns CSS */

.ten-columns .et_pb_module {width: 10%; float: left;}
.nine-columns .et_pb_module {width: 11.11%; float: left;}
.eight-columns .et_pb_module {width: 12.5%; float: left;}
.seven-columns .et_pb_module {width: 14.28%; float: left;}
.six-columns .et_pb_module {width: 16.66%; float: left;}
.five-columns .et_pb_module {width: 20%; float: left;}