/*
 Theme Name:  Kolaine Beauty Lounge
 Theme URI:    https://www.csmwebdesign.com
 Description:  Kolaine Beauty Lounge
 Author:       CSM Web Design
 Author URI:   https://www.csmwebdesign.com
 Template:     Divi
 Version:      1.0.0
*/



/*****Add any custom CSS below this line*****/

/*<link rel="stylesheet" href="https://use.typekit.net/ouu5xlz.css">*/

#kolaine-slider-module .et_pb_slide:nth-of-type(1) .et_pb_slide_image { top: 20%; right: 0%; }

/*------------------------------------------------*/
/*---------[ GQ CUSTOM IMAGE OVERLAYS ]-----------*/
/*------------------------------------------------*/
    /* FADE IN TEXT */
        .gq_overlay_text .custom_overlay {
            position: relative;}
        .gq_overlay_text .image {
            display: block;
            width: 100%;
            height: auto;}
        .gq_overlay_text .overlay {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            height: 100%;
            width: 100%;
            opacity: 0;
            transition: .5s ease;
            background-color: #3e8adb70;
            overflow: hidden;}
        .gq_overlay_text .custom_overlay:hover .overlay {
            opacity: 1;}
        .gq_overlay_text .text {
            color: #fff;
            font-size: 22px;
            line-height: 22px;
            text-align: center;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            width: 100%;}

            /*------------------------------------------------*/
/*---------[ GQ CUSTOM IMAGE OVERLAYS ]-----------*/
/*------------------------------------------------*/
 
     /* FADE IN TEXT */
        .gq_overlay_text .custom_overlay {
            position: relative;}
        .gq_overlay_text .image {
            display: block;
            width: 100%;
            height: auto;}
        .gq_overlay_text .overlay {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            height: 100%;
            width: 100%;
            opacity: 0;
            transition: .5s ease;
            background-color: #3e8adb70;}
        .gq_overlay_text .custom_overlay:hover .overlay {
            opacity: 1;}
        .gq_overlay_text .text {
            color: #fff;
            font-size: 22px;
            line-height: 22px;
            text-align: center;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            width: 100%;}
             
    /* FADE IN BUTTON */
        .gq_overlay_button .custom_overlay {
            position: relative;}
        .gq_overlay_button .image {
            display: block;
            width: 100%;
            height: auto;}
        .gq_overlay_button .overlay {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            height: 100%;
            width: 100%;
            opacity: 0;
            transition: .5s ease;
            background-color: rgba(2, 2, 2, 0.7);}
        .gq_overlay_button .custom_overlay:hover .overlay {
            opacity: 1;}
        .gq_overlay_button .text {
            color: #fff;
            background: #3e8adb;
            padding: 10px 5px;
            font-size: 15px;
            line-height: 16px;
            text-align: center;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);}
 
     /* SLIDE IN TOP */
        .gq_overlay_slide_top .custom_overlay {
            position: relative;}
        .gq_overlay_slide_top .image {
            display: block;
            width: 100%;
            height: auto;}
        .gq_overlay_slide_top .overlay {
            position: absolute;
            bottom: 100%;
            left: 0;
            right: 0;
            background-color: #008CBA;
            overflow: hidden;
            width: 100%;
            height:0;
            transition: .5s ease;}
        .gq_overlay_slide_top .custom_overlay:hover .overlay {
            bottom: 0;
            height: 100%;}
        .gq_overlay_slide_top .text {
            color: #fff;
            font-size: 22px;
            line-height: 22px;
            text-align: center;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);}
 
     /* SLIDE IN BOTTOM */
        .gq_overlay_slide_bottom .custom_overlay {
            position: relative;}
        .gq_overlay_slide_bottom .image {
            display: block;
            width: 100%;
            height: auto;}
        .gq_overlay_slide_bottom .overlay {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            background-color: #008CBA;
            overflow: hidden;
            width: 100%;
            height: 0;
            transition: .5s ease;}
        .gq_overlay_slide_bottom .custom_overlay:hover .overlay {
            height: 100%;}
        .gq_overlay_slide_bottom .text {
            color: #fff;
            font-size: 22px;
            line-height: 22px;
            text-align: center;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);}
 
     /* SLIDE IN RIGHT */
        .gq_overlay_slide_right .custom_overlay {
            position: relative;}
        .gq_overlay_slide_right .image {
            display: block;
            width: 100%;
            height: auto;}
        .gq_overlay_slide_right .overlay {
            position: absolute;
            bottom: 0;
            left: 100%;
            right: 0;
            background-color: #008CBA;
            overflow: hidden;
            width: 0;
            height: 100%;
            transition: .5s ease;}
        .gq_overlay_slide_right .custom_overlay:hover .overlay {
            width: 100%;
            left: 0;}
        .gq_overlay_slide_right .text {
            white-space: nowrap; 
            color: white;
            font-size: 20px;
            position: absolute;
            overflow: hidden;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);}
 
    /* SLIDE IN LEFT */
        .gq_overlay_slide_left .custom_overlay {
            position: relative;}
        .gq_overlay_slide_left .image {
            display: block;
            width: 100%;
            height: auto;}
        .gq_overlay_slide_left .overlay {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            background-color: #008CBA;
            overflow: hidden;
            width: 0;
            height: 100%;
            transition: .5s ease;}
        .gq_overlay_slide_left .custom_overlay:hover .overlay {
            width: 100%;}
        .gq_overlay_slide_left .text {
            white-space: nowrap; 
            color: white;
            font-size: 20px;
            position: absolute;
            overflow: hidden;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);}