/*
Theme Name: We Design We Code
Theme URI: https://wedesignwecode.com
Author: We Design We Code
Author URI: https://wedesignwecode.com
Description: A minimal theme developed by We Design We Code. for kompas.dk
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wdwc
*/

.card-body {
    transition: all 0.3s ease-in-out;
}

body .services .services-cards .card-body .card-long {
    opacity: 0;
    transition: all 0.3s ease-in-out, left 0.3s ease 0s, opacity 0.3s ease 0.5s;
    will-change: margin-top, opacity;
}

.services .services-cards .card-body .card-long .area {
    opacity: 0;
    transition: all 0.3s ease-in-out;
    will-change: opacity, top;
    margin-top: 10px;
}

.card-long.convert {
    opacity: 1 !important;
}

.card-1 .convert {
   left:0 !important;
}

.card-1  .convert {
   margin-top:0 !important;
}

.services .services-cards .card-body .card-long .close-card {
    width: 53px !important;
    height: 53px !important;
}

header .menu .current_page_item a {
    color:rgb(141, 75, 246);
}

.card-1 .icon {
    background-color: #f6d0d1;
}

.card-2 .icon {
    background-color: #bd95f2;
}

.card-3 .icon {
    background-color: #e7dcca;
}

.card-4 .icon {
    background-color: #f2e3b1;
}

.card-5 .icon {
    background-color: #f0b86f;
}

.card-6 .icon {
    /*background-color: #e38bbb;*/
    background-color: #e38bbbbd;
}

.card-7 .icon {
    background-color: #ce797a;
}

.card-8 .icon {
    background-color: #6fbff0;
}

.card-9 .icon {
    background-color: #7ee7c0;
}

.services .services-cards .card-body .card.card-7:hover .animation img:nth-child(2) {
    left: 53% !important;
}

.services .services-cards .card-body .card.card-7:hover .animation img:nth-child(5) {
    left: 53% !important;
}

.hero.hero-work {
    min-height: 50rem;
}

.team-content .team-list .team-body .team-item .body .top .social a:hover svg path {
    fill:#6600EC;
}

body .team-content .team-list .team-body .team-item .image {
    height: 22.3rem;
}

.team-content .team-list .team-body.active .card-long {
    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.10), 0px 2px 12px 0px rgba(0, 0, 0, 0.15), 0px 0px 1px 0px rgba(0, 0, 0, 0.20);
}

.people-touch .touch-grid .text p b {
    font-weight: 500 !important;
}

.contact-life {
    background-size: cover;
}

.carbon .carbon-grid.mobile {
    display: none;
}
.work-touch{
    /* overflow: hidden; */
} 
.work-touch video{
    filter: blur(3px);
    height: 51rem !important;
    width: 110% !important;
    left: -5% !important;
    top: -1rem !important;
}

footer .grid.mobile {
    display: none;
}

footer .grid.pc {
    display: grid;
}

body .contact-life .contact-life-content .contact-life-grid.pc {
    display: flex;
}

body .contact-life .contact-life-content .contact-life-grid.mobile {
    display: none;
}


@media (max-width: 1024px) {

    .carbon .carbon-grid.pc {
        display: inline-block;
    }
    .carbon-grid.mobile{
        text-align: center;
    }
    .carbon-grid.mobile .title.text-left{
        padding-bottom: 14px;
    }
    .services .services-cards .card-body .card.card-2 .animation img:nth-child(1){
        transform: translate(-37%, -60%) rotate(90deg) !important;
    }
    .contact-page .contact-body{
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }
    .hero-contact .contact-title{
        padding-bottom: 1.5rem !important;
    }
    .carbon-grid.mobile .text{
        text-align: left;
    }
    .people-title .title{
        gap: 0rem;
    }
    header {
        position: absolute !important;
    }

    .touch .touch-grid .text i {
        font-size: 1.5rem !important;
    }

    .touch .touch-grid .text .sticky_cta a{
        font-size:1.25rem !important;
    }

    .touch .touch-grid .text .title {
        margin-bottom: 2rem !important;
    }

    .help .accordion {
        border-radius: 1.2rem !important;
    }

    .help .accordion-header {
        padding: 1.8rem !important;
    } 
    
    .help .accordion-header span {
        max-width: 80%;
    }

    .help .accordion-header .accordion-arrow svg {
        width: 1.3rem !important;
        height: 0.8rem !important;
    }

    .main-form {
        padding-top: 1rem !important;
    }

    .help .accordion-content .accordion-body {
        padding: 0 2rem 2rem 2rem !important;
    }

    .people-title .title {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    .carbon .carbon-grid.mobile {
        display: inline-block;
    }

    .carbon .carbon-grid.pc {
        display: none
    }

    .services .services-cards .card-body .card.card-5 .animation img:nth-child(2) {
        top: 10px;
    }

    .card-body.card-8 .images {
        top:30px;
    }

    .services .services-cards .card-body .card.card-4 .animation {
        transform: scale(0.7);
    }

    .work-touch .touch-flex {
        gap:2rem;
    }

    .people-title .title span {
        max-width: 70%;
    }

    .team-content .team-list .team-body .card-long {
        padding: 2rem !important;
    }

    .life .life-grid .life-content .text-content .title {
        line-height: 100% !important;
    }

    .life .life-grid .left-title span {
        font-size:1.5rem !important;
    }

    .life .life-grid .left-title a {
        font-size:1.5rem !important;
        padding-bottom: 0.5rem;
    }

    .services .services-cards .card-body .card.card-2:hover .animation img:nth-child(1) {
        transform: translate(-37%, -60%) rotate(90deg) !important;
    }

    footer {
        padding: 3rem 0 6rem 0 !important;
    }

    footer .footer-left .text p {
        text-align: left !important;
        margin-bottom: 1.5rem !important;
    }

    footer .footer-left .meet .title {
        display: none;
    }

    footer .footer-right .top {
        display: flex;
        justify-content: space-between;
        font-size: 0.87rem !important;
        text-align: left;
        margin-bottom: 1.5rem;
    }

    footer .footer-right .top a {
        font-size: 0.87rem !important;
    }

    footer .grid.pc {
        display: none;
    }

    footer .grid.mobile {
        display: grid;
    }

    footer .social {
       display: flex;
    }

    footer .links {
       display: flex;
    }

    footer .social a {
        font-size:0.87rem;
    }

    .meet_area {
        font-size: 0.87rem !important;
        display: flex;
        justify-content: space-between;
    }

    .meet_area .links1 {
        display: flex;
        flex-direction: column;
        text-align: left;
        gap: 0.5rem;
    }

    .meet_area .links2 {
        display: flex;
        flex-direction: column;
        text-align: left;
        gap: 0.5rem;
    }
     
    footer .footer-center {
        flex-direction: column !important;
        align-items: center !important;
        font-size: 0.87rem !important;
        gap: 1.5rem !important;
    }

    .hero .hero-text {
        font-size: 4rem !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .hero .hero-text span {
        font-size: 5rem !important;
    }

    .hero .b-logo {
        bottom: 3rem !important;
    }

    .contact-title .title span {
        font-size: 3.75rem !important;
    }

    .contact-title .title {
        font-size: 3.125rem !important;
    }

    .contact-page .contact-body .contact-item .title {
        font-size: 1.06rem !important;
    }

    .contact-page .contact-body .contact-item a {
        font-size: 1.06rem !important;
    }

    .contact-life-content {
        display: flex !important;
        flex-direction: column;
    }

    body .contact-life .contact-life-content .contact-life-title .title {
        font-size: 2.27181rem;
        font-style: italic;
        font-weight: 400;
        line-height: 120%;
        letter-spacing: -0.02269rem;
    }

    body .contact-life .contact-life-content .contact-life-title p { 
        font-size: 1.375rem;
        font-style: normal;
        font-weight: 300;
        line-height: 140%;
    }

    body .contact-life .contact-life-content .contact-life-title {
        position: relative;
        top: 0;
    }

    body .contact-life .contact-life-content .contact-life-grid.pc {
        display: none !important;
    }

    body .contact-life .contact-life-content .contact-life-grid.mobile {
        display: flex !important;
    }

    body .contact-life .contact-life-content .contact-life-grid.mobile {
        width: 100% !important;
        margin: 0 !important;
        gap: 0 !important;
    }
    .contact-life-grid.mobile .swiper-slide {
        /* width: 100% !important; */
    }
    .contact-life-grid.mobile .swiper-slide img {
        max-width: 100%;
        height: 30rem;
        object-fit: cover;
    }

    .help .title {
        font-size: 1.7rem !important;
    }

    .wpml-ls-statics-shortcode_actions {
    top: 0;
    right: 5% !important;
    padding: 0;
    }

}

.wpml-ls-statics-shortcode_actions {
    position: absolute;
    right: 10%;
}
.wpml-ls-statics-shortcode_actions ul {}

.wpml-ls-statics-shortcode_actions ul li:first-child a:after {
    display:none;
}

.wpml-ls-statics-shortcode_actions ul li a:after{
    content:'';
    position: absolute;
    text-align: center;
    left: 0;
    background: #fff;
    height: 55%;
    width: 1px;
    top: 4px;
}
.wpml-ls-statics-shortcode_actions ul li a{
    color: rgba(255, 255, 255, 0.50);
    letter-spacing: -0.01375rem;
    position: relative;
    text-transform: uppercase;
    font-size:  0.6875rem;
}

.wpml-ls-current-language {}
.wpml-ls-current-language a {
    color: #fff !important;
}


        header.active .wpml-ls-current-language a{
            color: #000 !important;
        }
        header.active .wpml-ls-statics-shortcode_actions ul li a{
            color: rgba(0, 0, 0, 0.50);
        }
        header.active .wpml-ls-statics-shortcode_actions ul li a:after{
            background: #000;
        }
header .container {
    position: relative;
}

.otgs-development-site-front-end {
    display: none !important;
}