/**
Theme Name: Astra Child
Author: Chris Stinson
Author URI: https://stinsonevolutions.ca
Description: Child theme of Astra to add some custom functionality.
Version: 0.1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/

/** Add some tweaks to general website display **/
.ast-main-header-bar-alignment{
    margin-top:8px;
}
.ast-mobile-menu-buttons{
    margin-top:4px;
}

body {
    background-color:white;
}

.right_align{
    float:right;
}

.review{
    line-height: 1.3em;
}

.review span.review_core, .review span.review_more, .review span.review_toggle{
    color: rgba(0, 0, 0, 0.9);
    font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Fira Sans", Ubuntu, Oxygen, "Oxygen Sans", Cantarell, "Droid Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Lucida Grande", Helvetica, Arial, sans-serif;
    font-size: 16px; 
    font-style: italic;
    font-weight: 400;
    text-align: left;
    white-space: pre-line;
}

.review span.review_toggle{
    color:blue;
    font-style:normal;
    cursor:pointer;
}
.review span.review_toggle:before{
    color: rgba(0, 0, 0, 0.9);
    content:' ... ';
    cursor:default;
}
.review span.review_toggle.review_more_shown:before{
    content:' ';
}

.review span.review_more:not(.review_more_shown){
    display:none;
}

.message .wpforms-container textarea.wpforms-field-medium{
    height: 187px;
}

/* Add some fun effects to our service icons */
.service_icon{
    margin-bottom:20px !important;
}
.service_icon .elementor-icon-wrapper, .service_icon svg{
    width:60px;
    height:60px;
}
.service_icon::after, .service_icon svg, .service_icon svg *{
    transition: all 400ms;
}
.service_icon::after{
    content:' ';
    position:absolute;
    top:0;
    left: 0;
    right: 0;
    width:100%;
    height:100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    border: solid 1px #339999;
    box-sizing: border-box;
    border-radius:50%;
    z-index:-1;
}
*:hover > .service_icon::after{
    border-radius:0;
    transform: rotate(45deg);
    background-color:#399999;
}
*:hover > .service_icon svg .st0, *:hover > .service_icon svg .st1, *:hover > .service_icon svg .st2, *:hover > .service_icon svg .st3, *:hover > .service_icon svg .st4, *:hover > .service_icon svg .st5, *:hover > .service_icon svg .st6, *:hover > .service_icon svg .st7, *:hover > .service_icon svg .stx0, *:hover > .service_icon svg .stx1, *:hover > .service_icon svg .stx2, *:hover > .service_icon svg .stx3, *:hover > .service_icon svg .stx4, *:hover > .service_icon svg .stx5, *:hover > .service_icon svg .stx6, *:hover > .service_icon svg .stx8{
    fill:white;
}
*:hover > .service_icon svg .stx0, *:hover > .service_icon svg .stx6{
    fill:#399999;
    stroke:white;
}
*:hover > .service_icon svg .stx8{
    stroke:white;
}
a.simpleLink, .simpleLink a{
    color:#4169e1;
}
a.simpleLink:hover, .simpleLink a:hover{
    color:#339999;
}

/* Trigger various effects on scroll, but only for mobile devices */
@media only screen and (max-width: 1024px) {
    /* Home page service icon animation */
    *:hover > .service_icon::after, .service_icon_active::after{
        border-radius:0;
        transform: rotate(45deg);
        background-color:#399999;
    }
    .service_icon_active svg .st0, .service_icon_active svg .st1, .service_icon_active svg .st2, .service_icon_active svg .st3, .service_icon_active svg .st4, .service_icon_active svg .st5, .service_icon_active svg .st6, .service_icon_active svg .st7, .service_icon_active svg .stx0, .service_icon_active svg .stx1, .service_icon_active svg .stx2, .service_icon_active svg .stx3, .service_icon_active svg .stx4, .service_icon_active svg .stx5, .service_icon_active svg .stx6, .service_icon_active svg .stx8{
        fill:white;
    }
    .service_icon_active svg .stx0, .service_icon_active svg .stx6{
        fill:#399999;
        stroke:white;
    }
    .service_icon_active svg .stx8{
        stroke:white;
    }
    /* Services page image - additional text and background overlay */
    .services_images .premium-gallery-item .pa-gallery-img.service_image_active .premium-gallery-caption{
        height:100%;
    }
    .services_images .premium-gallery-item .pa-gallery-img.service_image_active .premium-gallery-img-name{
        height: 30%;
        margin-bottom:0;
    }
    .services_images .premium-gallery-item .pa-gallery-img.service_image_active .pa-gallery-icons-wrapper{
        background-color:rgba(0, 102, 102, 0.91);
    }
}

/* Adjust the "Premium Media Grid" control to work the way we want */
.services_images .premium-gallery-item *{
    transition: all 400ms;
}
.services_images .premium-gallery-item .pa-gallery-icons-wrapper{
    background-color: rgba(0,0,0,0.3);
}
.services_images .premium-gallery-item .pa-gallery-img .premium-gallery-caption{
    display: flex;
    flex-direction: column;
    height: 200%;
    top:0;
    bottom:unset;
}
.services_images .premium-gallery-item .pa-gallery-img .premium-gallery-img-name{
    height: 25%;
    margin-bottom:50%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.services_images .premium-gallery-item .pa-gallery-img .premium-gallery-img-desc{
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.services_images .premium-gallery-item .pa-gallery-img:hover .premium-gallery-caption{
    height:100%;
}
.services_images .premium-gallery-item .pa-gallery-img:hover .premium-gallery-img-name{
    height: 30%;
    margin-bottom:0;
}

/* Apply various styling for our pricing table and associated dialogs */
#PricingTable .table_more_info_header > img, #PricingTable .table_more_info_header svg{
    float:right;
    width:25px;
    height:25px;
    cursor:pointer;
}
#PricingTable .td-content > *{
    margin-bottom:0;
}
#PricingTable td{
    padding:10px;
    width:20%;
}
#PricingTable td:first-child{
    width:40%;
}
#table_more_info_dialog_hourly, #table_more_info_dialog_project, #table_more_info_dialog_hybrid{
    display:none;
    background: white;
    margin-bottom:0;
    padding: 20px 20px 0px 20px;
    text-align: center;
}
.ui-dialog .table_more_info_dialog_hourly_close{
    position:absolute;
    bottom:20px;
    left:0;
    right:0;
    margin-left: auto;
    margin-right: auto;
    text-align:center;
    z-index:100;
}