/*
 Theme Name:   Divi Child Plus
 Theme URI:    /divi-child-plus/
 Description:  A modified child theme of Divi
 Author:       Web Wizards
 Author URI:   https://webwizards.ca/
 Template:     Divi
 Version:      1.3.0
 Tags:         responsive-layout, accessibility-ready
 Text Domain:  divi-child-plus
*/

@import "modified.css";

:root {
    --gtb-blue: #226ce0;
    --gtb-blue-alt: #3754b8;
    --gtb-blue-deep: #0032a0;
    --gtb-blue-highlight: #1f00fb;
    --gtb-green: #6bc400;
    --gtb-green-alt: #06a700;
    --soft-grey: #e5e5e5;
}

/* =========================================== */
/* --- Universal ============================= */
/* =========================================== */

body, input, textarea, select {
    font-family: Outfit, sans-serif;
    font-weight: 400;
}

/* adjusts the icons */
.flavour-text-blurb .et_pb_main_blurb_image {
    padding-right: 7px;
    width: auto !important;
}
    .flavour-text-blurb .et-pb-icon {
        transform: rotate(180deg);
        text-align: right;
        top: 2px;
        position: relative;
    }

.flavour-text-blurb .et_pb_blurb_container {
    padding-left: 0;
}

/* - aspect ratio 1:1 */
.pure-square {
  aspect-ratio: 1 / 1;
	height: 100%;
	width: 100%;
}

@supports not (aspect-ratio: 1 / 1) {
  .pure-square::before {
    float: left;
    padding-top: 100%;
    content: "";
  }

  .pure-square::after {
    display: block;
    content: "";
    clear: both;
  }
}

/* - mobile column reorder */
@media (max-width: 980px) {
    .reorder-row,
    .reorder-section .et_pb_row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }
        .reorder-row .reorder-item {
            margin-bottom: 30px !important;
        }
            .reorder-row .reorder-item.reorder-item-last {
                margin-bottom: 0 !important
            }

    .reorder-item.first {
        -webkit-box-ordinal-group: 2;
            -ms-flex-order: 1;
                order: 1;
    }

    .reorder-item.second {
        -webkit-box-ordinal-group: 3;
            -ms-flex-order: 2;
                order: 2;
    }
}

/* - underline hover */
p a,
#footer-menu-container .et_pb_menu__menu a {
    text-decoration: none;
    background-image: linear-gradient(var(--soft-grey), var(--soft-grey)), linear-gradient(var(--gtb-blue), var(--gtb-blue));
    background-size: 100% 1px, 0 1px;
    background-position: 100% 100%, 0 100%;
    background-repeat: no-repeat;
    transition: color 0.25s ease, background-size 0.25s linear !important;
}
    #footer-menu-container .et_pb_menu__menu a {
    background-image: linear-gradient(#595959, #595959), linear-gradient(var(--gtb-blue), var(--gtb-blue));
  }
  
  p a:hover,
  #footer-menu-container .et_pb_menu__menu a:hover {
    background-size: 0 1px, 100% 1px;
    background-position: 100% 100%, 0 100%;
  }


  /* - inverse button */
.inverse-arrow-btn:after {
    transition: none !important;
}

/* --- WP Forms ============================== */
.visual-form div.wpforms-container-full {
    margin-bottom: 0 !important;
}

/* form labels */
.visual-form div.wpforms-container-full .wpforms-form .wpforms-field-label {
    font-weight: 600;
}

/* form fields */
.visual-form div.wpforms-container-full .wpforms-form input[type=date], .visual-form div.wpforms-container-full .wpforms-form input[type=datetime], .visual-form div.wpforms-container-full .wpforms-form input[type=datetime-local], .visual-form div.wpforms-container-full .wpforms-form input[type=email], .visual-form div.wpforms-container-full .wpforms-form input[type=month], .visual-form div.wpforms-container-full .wpforms-form input[type=number], .visual-form div.wpforms-container-full .wpforms-form input[type=password] .visual-form div.wpforms-container-full .wpforms-form input[type=range], .visual-form div.wpforms-container-full .wpforms-form input[type=search], .visual-form div.wpforms-container-full .wpforms-form input[type=tel], .visual-form div.wpforms-container-full .wpforms-form input[type=text], .visual-form div.wpforms-container-full .wpforms-form input[type=time], .visual-form div.wpforms-container-full .wpforms-form input[type=url], .visual-form div.wpforms-container-full .wpforms-form input[type=week], .visual-form div.wpforms-container-full .wpforms-form select, .visual-form div.wpforms-container-full .wpforms-form textarea {
    border: 2px solid #eee;
    border-radius: 0;
    font-size: 18px;
    height: 45px;
}

.visual-form div.wpforms-container-full .wpforms-form input:focus, .visual-form div.wpforms-container-full .wpforms-form textarea:focus, .visual-form div.wpforms-container-full .wpforms-form select:focus, .visual-form div.wpforms-container-full .wpforms-form .is-focused .choices__inner, .visual-form div.wpforms-container-full .wpforms-form .is-open .choices__inner, div.wpforms-container-full .wpforms-form .is-open .choices__list--dropdown {
    border: 2px solid var(--gtb-blue-deep);
}

.visual-form div.wpforms-container-full .wpforms-form textarea {
    width: 100% !important;
}

/* submit button */
.visual-form div.wpforms-container-full .wpforms-form input[type=submit], .visual-form div.wpforms-container-full .wpforms-form button[type=submit], .visual-form div.wpforms-container-full .wpforms-form .wpforms-page-button {
    background-color: var(--gtb-blue);
    border: 2px solid var(--gtb-blue);
    border-radius: 0px;
    color: #fff;
    line-height: 1.7em;
    font-size: 18px;
    padding: 0.3em 1.5em;
    transition: all 300ms ease 0ms;
}
    .visual-form div.wpforms-container-full .wpforms-form input[type=submit]:hover, .visual-form div.wpforms-container-full .wpforms-form button[type=submit]:hover, .visual-form div.wpforms-container-full .wpforms-form .wpforms-page-button:hover,
    .visual-form div.wpforms-container-full .wpforms-form input[type=submit]:focus, .visual-form div.wpforms-container-full .wpforms-form button[type=submit]:focus, .visual-form div.wpforms-container-full .wpforms-form .wpforms-page-button:focus {
        background-color: #fff;
        border: 2px solid var(--gtb-blue);
        color: #222;
    }

@media (max-width: 600px) {
    .visual-form .mobile-full-width {
        margin: 0 !important;
        width: 100% !important;
    }

    .visual-form .mobile-full-width-name .wpforms-one-half {
        margin: 0 0 15px 0 !important;
        width: 100% !important;
    }
        .visual-form .mobile-full-width-name .wpforms-one-half:last-of-type {
            margin: 0 !important;
        }
}
    
/* =========================================== */
/* --- Header ================================ */
/* =========================================== */

/* - linkedIn menu item */
.et-db #et-boc #divi-child-plus-header li.menu-linkedin a {
    background: none;
    display: flex;
    align-items: center;
}
    .et-db #et-boc #divi-child-plus-header li.menu-linkedin a:before {
        content: '\f08c';
        color: var(--gtb-blue);
        font-family: FontAwesome !important;
        font-size: 28px;
        padding-right: 7px;
    }

/* - button menu item */
.et-db #et-boc #divi-child-plus-header li.menu-btn {
    align-items: center
}
    .et-db #et-boc #divi-child-plus-header li.menu-btn a {
        background: var(--gtb-blue);
        border: 2px solid var(--gtb-blue);
        color: #fff !important;
        transition: all 300ms ease 0ms;
    }
        .et-db #et-boc #divi-child-plus-header li.menu-btn a:hover,
        .et-db #et-boc #divi-child-plus-header li.menu-btn a:focus {
            color: #222 !important;
            background: #fff;
        }

@media (min-width: 981px) {
    /* - linkedIn menu item */
    /* hides the text on desktop */
    .et-db #et-boc #divi-child-plus-header li.menu-linkedin a {
        font-size: 0;
    }
        .et-db #et-boc #divi-child-plus-header li.menu-linkedin a:before {
            padding-right: 0;
        }

    /* - button menu item */
    /* .et-db #et-boc #divi-child-plus-header li.menu-btn {} */
        .et-db #et-boc #divi-child-plus-header li.menu-btn a {
            line-height: 1.7em;
            padding: 0.3em 1em !important;
        }

    /* adds menu underline */
    .et-db #et-boc #divi-child-plus-header li.menu-underline a {
        text-decoration: none;
        background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), linear-gradient(var(--gtb-blue), var(--gtb-blue));
        background-size: 100% 2px, 0 2px;
        background-position: 100% 70%, 0 70%;
        background-repeat: no-repeat;
        transition: color 0.25s ease, background-size 0.25s linear !important;
    }

    /* hover + active underline */
    .et-db #et-boc #divi-child-plus-header li.menu-underline a:hover,
    .et-db #et-boc #divi-child-plus-header li.menu-underline.current-menu-item a {
        background-size: 0 2px, 100% 2px;
        background-position: 100% 70%, 0 70%;
    }
        .et-db #et-boc #divi-child-plus-header li.menu-underline.current-menu-item a {
            color: var(--gtb-blue-highlight) !important;
            background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), linear-gradient(var(--gtb-blue-highlight), var(--gtb-blue-highlight));
        }
}

@media (max-width: 980px) {
    .et_pb_menu .et_mobile_menu {
        top: calc(100% + 15px);
    }

    /* - linkedIn menu item */
    .et-db #et-boc #divi-child-plus-header li.menu-linkedin a {
        /* justify-content: center; */
    }

    /* - button menu item */
    .et-db #et-boc #divi-child-plus-header li.menu-btn a {
        background: var(--gtb-green-alt);
        border: none;
        color: #fff !important;
        text-align: center;
    }
        .et-db #et-boc #divi-child-plus-header li.menu-btn a:hover,
        .et-db #et-boc #divi-child-plus-header li.menu-btn a:focus {
            color: #fff !important;
            background: var(--gtb-green-alt);
        }
}

/* =========================================== */
/* --- Body ================================== */
/* =========================================== */

@media (min-width: 1600px) {
    .featured-large-heading h1 {
        font-size: 80px !important;
    }
}

@media (min-width: 981px) {
    .et_section_specialty > .et_pb_row {
        width: 90%;
    }
}

/* ========================================= */ 
/* --- Project Listing ===================== */ 
/* ========================================= */ 

/* add to the row of the module */
/* #projects-listing-section {} */
    /* --- list of project items */
    #projects-listing-section .et_pb_portfolio_items,
    #projects-listing-section .et_pb_portfolio_grid_items,
	#projects-listing-section .et_pb_ajax_pagination_container {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
/*         -webkit-box-pack: center; */
/*             -ms-flex-pack: center; */
/*                 justify-content: center; */

        width: auto;
    }

        /* --- single project item */
        #projects-listing-section .et_pb_portfolio_item {
			/* box-shadow: 0px 5px 10px -5px rgb(0 0 0 / 25%); */
            position: relative;
            width: calc(33.3333%);
            /* width: calc(50%); */
        }

            /* single project item - active items */
            #projects-listing-section .et_pb_portfolio_item.active {
                /* changes the active item animation */
                -webkit-animation: fadeTop 1s cubic-bezier(.77,0,.175,1) 1;
                animation: fadeTop 1s cubic-bezier(.77,0,.175,1) 1;
            }

            /* single project item - image */
            #projects-listing-section .et_pb_portfolio_item .et_portfolio_image img {
                width: 100%;
            }
            /* single project item - title */
            #projects-listing-section .et_pb_portfolio_item .et_pb_module_header {
                position: absolute;
                top: 0;

                padding: 0;
                margin: 0;
                height: 100%;
                width: 100%;
            }
                /* forces title to cover the entire project item */
                #projects-listing-section .et_pb_portfolio_item .et_pb_module_header a {
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                        -ms-flex-align: center;
                            align-items: center;
                    -webkit-box-pack: center;
                        -ms-flex-pack: center;
                            justify-content: center;

                    background: rgba(0, 50, 160, 0.9);
                    color: #fff;
                    -webkit-transition: 0.3s ease;
                    -o-transition: 0.3s ease;
                    transition: 0.3s ease;
                    opacity: 0;

                    padding: 15px;
                    height: 100%;
                    width: 100%;
                }
                    /* adds hover/focus effect */
                    #projects-listing-section .et_pb_portfolio_item .et_pb_module_header a:hover,
                    #projects-listing-section .et_pb_portfolio_item .et_pb_module_header a:focus {
                        opacity: 1;
                    }

            /* responsive layout of project listing */
            @media (max-width: 980px) {
                #projects-listing-section .et_pb_portfolio_item {
                    width: 50%;
                }

                /* show title on mobile layout */

                #projects-listing-section .et_pb_portfolio_item {
                    display: grid !important;
                    grid-template-rows: max-content;
                }
            }

            /* single column on mobile */
            @media (max-width: 600px) {
				#projects-listing-section .et_pb_portfolio_item .et_pb_module_header {
					position: relative;
				}
					#projects-listing-section .et_pb_portfolio_item .et_pb_module_header a {
						background: var(--gtb-blue);
						background: #222;
						opacity: 1;
						align-items: center;
					}
				
                /* removes offest margins */
                #projects-listing-section .et_pb_portfolio_items,
                #projects-listing-section .et_pb_portfolio_grid_items {
                    margin-left: 0 !important;
                    margin-right: 0 !important;
                }

                #projects-listing-section .et_pb_portfolio_items {
                    margin: 0 !important;
                }

                #projects-listing-section .et_pb_portfolio_item {
                    width: 100%;
                    margin: 0 0 30px 0;
                }
                    #projects-listing-section .et_pb_portfolio_item:last-of-type {
                        margin: 0;
                    }
            }

/* ========================================= */ 
/* --- Project Item ======================== */ 
/* ========================================= */ 
.project-icon-blurb .et_pb_main_blurb_image {
    line-height: 32px;
}
    .project-icon-blurb .et_pb_main_blurb_image .et_pb_image_wrap {
        text-align: center;
    }

.project-icon-blurb .et_pb_blurb_container {
    display: block;
    padding-left: 5px;
}
    .project-icon-blurb .et_pb_blurb_container .et_pb_module_header {
        padding: 0 !important;
    }

/* =========================================== */
/* --- Footer ================================ */
/* =========================================== */

#footer-menu-container .et_pb_menu__menu>nav>ul>li {
    margin-top: 12px !important;
}

/* forces the menu not collapse on mobile */
@media (max-width: 980px) {
    #footer-menu-container .et_pb_menu__menu {
        display: block !important;
    }

    #footer-menu-container .et_mobile_nav_menu {
        display: none !important;
    }
}

/* --- Movies */
@keyframes infiniteScroll {
	from {
		transform: translateX(0)
	}

	to {
		transform: translateX(-50%)
	}
}

.horizontal-scrolling-items {
	display: flex;
	width: calc(1227.75px * 4);
	animation-name: infiniteScroll;
	animation-duration: 20s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
	color: #fff;
	font-family: Outfit, sans-serif;
	font-size: 128px;
	font-weight: 700;
	text-transform: uppercase
}

.horizontal-scrolling-items__item {
	white-space: nowrap;
	line-height: 1em;
	padding-right: 20px;
}
