/**
Theme Name: Diony
Theme URI: https://diony.co.uk
Author: Diony
Author URI: https://diony.co.uk
Version: 1.1.5
Tested up to: 8.3.9
Requires PHP: 8.3.9
Text Domain: diony
*/

.container.full {
    max-width: 100%;
}

.content-block p {
    margin-bottom: 1rem;
}

.h-half-screen {
    height: 50vh;
}

#tiktok {
    width: 25px;
    height: 25px;
}

.wpcf7-form-wrapper.basic-form .wpcf7-form .wpcf7-form-control-wrap .wpcf7-file:after {
    height: 50px !important;
}

.wpcf7-select {
    padding: 10px 30px!important;
}

.grecaptcha-badge {
    display: none !important;
}

#mainHeader input[type=checkbox]:checked ~ label .bottom {
    transform: translateY(-16px) rotate(-45deg);
}

body {
    min-height: 100vh;
    /* mobile viewport bug fix */
    min-height: -webkit-fill-available;
}

html {
    height: -webkit-fill-available;
}

#mainHeader section.flex.container.pt-5.justify-between {
    padding-top: 0.7rem !important;
}

#hidden_button {
    display: none !important;
}

#mainHeader.fixed section.flex.container.pt-5.justify-between {
    padding-top: 0.4rem !important;
}

.wpcf7 .wpcf7-response-output {
    border: none !important;
    background: #000000 !important;
    padding: 20px !important;
    color: #fff !important;
    text-align: center !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
    border-radius: 10px !important;
}

#mobileHeader {
    background: transaprent;
    padding: 20px 0 20px;
    position: fixed;
    width: 100%;
    z-index: 99999999;
    max-height: 80px;
    height: 80px;
    transition: height 300ms ease-out;
    overflow: hidden;
    top: 0;
    left: 0;
    display: none;
}

.selecty {
    position: relative;
}

.selecty:before {
    position: absolute;
    top: -30px;
    content: 'Select the role you are applying for *';
    left: 32px;
    font-weight: 700;
    color: hsla(0, 0%, 44%, .6);
}

@media all and (max-width:1024px) {

    #mobileHeader {
        display: block !important;
    }

    #mainHeader {
        display: none !important;
    }

}

#mobileHeader.active {
    background-color: #000;
    height: 100vh;
    max-height: 100vh;
    padding: 20px 0 120px;
    overflow-y: scroll;
    transition: height 300ms ease-in;
}

#mobileHeader.darkHeader {
    background-color: #000;
}

#mobileHeader .dark_logo {
    display: none;
}

#mobileHeader.light .dark_logo {
    display: block;
}

#mobileHeader.active.light .dark_logo {
    display: none;
}

#mobileHeader.darkheader.active {
    background-color: #000 !important;
}

#mobileHeader.active.light .white_logo {
    display: block;
}

#mobileHeader.light .white_logo {
    display: none;
}

#mobileHeader.light.darkHeader {
    background-color: #fff;
}

#mobileHeader.light.active.darkHeader {
    background-color: #000;
}

#mobileHeader ul {
    padding: 0;
    margin: 2.5rem 0;
}

#mobileHeader ul li {
    list-style: none;
}

#mobileHeader ul li a {
    color: #fff;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    font-size: 1.125rem;
    line-height: 1.75rem;
    transition: 300ms ease all;
}

#mobileHeader ul li:hover > a,
#mobileHeader ul li.current-menu-item > a {
    color: red;
}

#mobileHeader > .container {
    position: relative;
}

#mobileHeader .menuButton {
    position: absolute;
    top: -5px;
    right: 2rem;
    height: auto;
    width: auto;
    cursor: pointer;
    transition: 300ms ease all;
    z-index: 3333;
    padding: 10px;
}

#mobileHeader .mobArrow {
    height: 30px;
    margin: 0px auto;
    display: block;
    width: auto;
}

#mobileHeader .menuButton .bar {
    border-radius: 5px;
    display: block;
    height: 3px;
    margin: 5px auto;
    transition: 300ms ease all;
    width: 30px;
    background-color: #fff;
}

#mobileHeader.light .menuButton .bar {
    background-color: #000;
}

#mobileHeader.active.light .menuButton .bar {
    background-color: #fff;
}

#mobileHeader .menuButton.active {
    transform: rotate(-7deg);
}

#mobileHeader .menuButton.active .bar {
    transform: rotate(145deg);
    position: relative;
    top: 7px;
}

#mobileHeader .menuButton.active .bar.middle {
    opacity: 0;
}

#mobileHeader .menuButton.active .bar.top {
    right: 0px;
}

#mobileHeader .menuButton.active .bar.bottom {
    transform: rotate(50deg);
    position: relative;
    top: -8px;
}

#mobileHeader ul.quick {
    padding: 0;
    margin: 2.5rem 0 0;
}

#mobileHeader ul.quick li {
    list-style: none;
    height: 200px;
    position: relative;
    transition: 300ms ease all;
}

#mobileHeader ul.quick li:hover {
    height: 200px;
    opacity: 0.7;
}

#mobileHeader ul.quick li a {
    color: #fff;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    font-size: 1.125rem;
    line-height: 1.75rem;
    position: absolute;
    top: 0;
    left: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 100%;
    width: 100%;
    transition: 300ms ease all;
}

#mobileHeader ul.quick li a:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: red;
    opacity: 0.67;
}

#mobileHeader ul.quick li:nth-of-type(even) a:after {
    background-color: #000;
    opacity: 0.67;
}

#mobileHeader ul.quick li a span {
    position: absolute;
    z-index: 2;
    bottom: 0px;
}

#mobileHeader a.white_logo,
#mobileHeader #mobileHeader.active a.dark_logo {
    width: 140px !important;
    display: inline-block;
}

.single-post article#post_detail a {
    word-break: break-all;
}

footer.light {
    border-top: 1px solid #ff0000;
}

footer > div > .container .flex .mb-4 {
    width: 12%;
}

.single-vacancies footer {
    border-top: 1px solid #ff0000;
}

@media screen and (max-width:1080px) {

    footer > div > .container .flex .mb-4 {
        width: 13%;
    }
}

@media screen and (max-width:810px) {}

@media screen and (max-width:600px) {
    footer > div > .container .flex .mb-4 {
        width: 25%;
    }
}

/* Client Amend */

.clients .flex:last-child > img {
	width: 95%;
}

/* Instagram */

#sb_instagram #sbi_images {
    padding: 0!important;
}

/* Results Override */

.bg-secondary.radial-statistics .circular-chart.in-view .circle {
    stroke: #ffffff;
}

.bg-secondary.radial-statistics .circular-chart.in-view .fill-current {
    fill: #FFFFFF!important;
}

/* Dots */

@media screen and (max-width:600px) {

    #page-blocks .bg-dots {
        display: none;
    }

}

/* Footer Amends */

.single-case-studies footer,
.blog footer,
.single-post footer {
    border-top: 1px solid red;
}

/* Inner Pages */

.bg-black-overlay {
    background: transparent linear-gradient(90deg, #161616F8 20%, #1C1C1CB2 80%, #2C2C2C80 90%, #63636334 100%) 0% 0% no-repeat padding-box;
    opacity: 1;
}

/* Sub Menu */

#menu-main-nav-left-1 li.menu-item-has-children .sub-menu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.25s ease;
}
#menu-main-nav-left-1 li.menu-item-has-children:hover .sub-menu {
    max-height: 60px;
    transition: max-height 0.25s ease-in;
}
#menu-main-nav-left-1 li.menu-item-has-children .sub-menu li a {
  font-size: 1.25rem;
  border-bottom: 0.0625rem solid rgba(255, 255, 255, 0.25)!important;
}
#menu-main-nav-left-1 li.menu-item-has-children .sub-menu li img {
  width: 100%;
  height: auto;
}
#menu-main-nav-left-1 li.menu-item-has-children:hover a.border-b.border-white {
  border-bottom-color: #FE2C29;
}
#menu-main-nav-left li.menu-item-has-children .sub-menu {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  display: none;
}

/* Contact Form Amend */

.h-148px {
    height: 148px;
}

/* Case Study Amends */

.single-case-studies .bg-dots {
    position: absolute;
    right: 0;
    left: 0;
    bottom: 160px;
}

.tagline {
    position: absolute;
    background-color: #ff0000;
    color: #FFFFFF;
    padding: 15px 20px 17px 20px;
    bottom: 60px;
    left: 0;
    font-size: 17px;
    font-weight: 600;
    max-width: 50%;
}

@media screen and (max-width:600px) {
    .tagline {
        font-size: 14px;
    }
}

.post-type-archive-case-studies .tagline {
    line-height: 20px;
    max-width: 75%;
    bottom: 200px;
}

/*# sourceMappingURL=style.css.map */

.footer__bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0 0;
    gap: 30px;
}

@media screen and (max-width:600px) {
    .footer__bottom {
        flex-direction: column;
        align-items: center;
    }
}

.footer__bottom__copyright {
    font-size: 12px;
}

.footer__bottom__copyright > *:nth-last-child(1) {
    margin-bottom: 0;
}
