﻿
.very-big-title {
    bottom: -1.3rem;
    color: var(--dark-blue);
    font-size: 6rem;
    left: 6%;
    font-weight: 800;
    line-height: 1;
    position: absolute;
    -webkit-user-select: none;
    user-select: none;
    white-space: pre;
    width: auto;
    z-index: 0;
}

.shape-background {
    background-position: top;
    background-size: cover;
    padding-top: 60pt;
    padding-bottom: 75pt;
    padding-left: 50pt;
    position: relative;
    z-index: 2;
    height: 270pt;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='1900' height='350' preserveAspectRatio='none' viewBox='0 0 1900 350'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1001%26quot%3b)' fill='none'%3e%3cpath d='M1025.24 135.02 a66.86 66.86 0 1 0 133.72 0 a66.86 66.86 0 1 0 -133.72 0z' fill='rgba(44%2c 71%2c 120%2c 0.13)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M947.78 39.18 a67.93 67.93 0 1 0 135.86 0 a67.93 67.93 0 1 0 -135.86 0z' fill='rgba(44%2c 71%2c 120%2c 0.13)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M1583.7 6.59 a76.69 76.69 0 1 0 153.38 0 a76.69 76.69 0 1 0 -153.38 0z' fill='rgba(44%2c 71%2c 120%2c 0.13)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M1530.54 202.88 a60.85 60.85 0 1 0 121.7 0 a60.85 60.85 0 1 0 -121.7 0z' fill='rgba(44%2c 71%2c 120%2c 0.13)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M1388.68 288.35 a109.93 109.93 0 1 0 219.86 0 a109.93 109.93 0 1 0 -219.86 0z' fill='rgba(44%2c 71%2c 120%2c 0.13)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M46.25 23.52 a111.26 111.26 0 1 0 222.52 0 a111.26 111.26 0 1 0 -222.52 0z' fill='rgba(44%2c 71%2c 120%2c 0.13)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M1504.69 333.9 a106.7 106.7 0 1 0 213.4 0 a106.7 106.7 0 1 0 -213.4 0z' fill='rgba(44%2c 71%2c 120%2c 0.13)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M528.73 62.52 a99.57 99.57 0 1 0 199.14 0 a99.57 99.57 0 1 0 -199.14 0z' fill='rgba(44%2c 71%2c 120%2c 0.13)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M1759.17 313.52 a93.32 93.32 0 1 0 186.64 0 a93.32 93.32 0 1 0 -186.64 0z' fill='rgba(44%2c 71%2c 120%2c 0.13)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M1120.12 22.42 a82.02 82.02 0 1 0 164.04 0 a82.02 82.02 0 1 0 -164.04 0z' fill='rgba(44%2c 71%2c 120%2c 0.13)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M-32.65 30.1 a92.7 92.7 0 1 0 185.4 0 a92.7 92.7 0 1 0 -185.4 0z' fill='rgba(44%2c 71%2c 120%2c 0.13)' class='triangle-float1'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1001'%3e%3crect width='1900' height='350' fill='white'%3e%3c/rect%3e%3c/mask%3e%3cstyle%3e %40keyframes float1 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(-10px%2c 0)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float1 %7b animation: float1 5s infinite%3b %7d %40keyframes float2 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(-5px%2c -5px)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float2 %7b animation: float2 4s infinite%3b %7d %40keyframes float3 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(0%2c -10px)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float3 %7b animation: float3 6s infinite%3b %7d %3c/style%3e%3c/defs%3e%3c/svg%3e");
}


@media (max-width:1050px) {
    .very-big-title {
        font-size: 4.5rem;
        bottom: -2rem;
    }

    .shape-background {
        height: 220pt;
    }
}

@media (max-width:650px) {
    .very-big-title {
        font-size: 2.6rem;
        bottom: -2rem;
    }

    .shape-background {
        height: 150pt;
    }
}

.dx-label span {
    font-weight: 500;
    font-size: 13pt !important;
    color: var(--dark-blue) !important;
}

.dx-texteditor-container {
    padding: 13pt 10pt 5pt 5pt;
}

.smalltext b {
    font-size: 12pt;
    font-weight: 600;
}

.smalltext span {
    color: var(--medium-grey);
    font-size: 13pt;
}



.dx-scrollable-content {
    column-count: 3;
    -moz-column-count: 3;
}

@media(max-width:1550px) {
    .dx-scrollable-content {
        column-count: 2;
        -moz-column-count: 2;
    }
}

@media(max-width:880px) {
    .dx-scrollable-content {
        column-count: 1;
        -moz-column-count: 1;
    }
}

.dx-list-item {
    border-top: none !important;
    break-inside: avoid;
}

    .dx-list-item.dx-state-hover, .dx-list-item.dx-state-focused, .dx-list-item.dx-state-active {
        background-color: transparent !important;
    }

    .dx-list-item:last-of-type {
        border: none;
    }

.dx-list-next-button {
    margin-top: 25pt;
}



.dx-button-normal {
    user-select: none;
    -moz-user-select: none;
    background: white) none repeat scroll 0 0 !important;
    border: 3px solid var(--medium-blue) !important;
    color: var(--medium-blue) !important;
    justify-content: center;
    align-items: center;
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: 0;
    line-height: 1.2em;
    margin-bottom: 0;
    padding: 10px 60px !important;
    text-transform: uppercase;
    touch-action: manipulation;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    white-space: break-spaces;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

    .dx-button-normal::before {
        content: '';
        position: absolute;
        bottom: 0%;
        left: 0px;
        width: 100%;
        height: 100%;
        background: var(--dark-blue) !important;
        display: block;
        -webkit-transform-origin: right top;
        -ms-transform-origin: right top;
        transform-origin: right top;
        -webkit-transform: scale(0, 1);
        -ms-transform: scale(0, 1);
        transform: scale(0, 1);
        -webkit-transition: transform 0.4s cubic-bezier(1, 0, 0, 1);
        transition: transform 0.4s cubic-bezier(1, 0, 0, 1);
        z-index: -1;
    }

    .dx-button-normal:hover::before {
        -webkit-transform-origin: left top;
        -ms-transform-origin: left top;
        transform-origin: left top;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        transform: scale(1, 1);
    }

    .dx-button-normal:hover {
        color: white !important;
    }



.lines {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 5;
}

    .lines span {
        width: 4px;
        height: 138%;
        display: block;
        /*	background-color: #999;*/
        background: var(--dark-blue);
        background: -moz-linear-gradient(180deg, var(--dark-blue) 50%, var(--iqcblue) 50%, var(--iqcblue) 100%);
        background: -webkit-linear-gradient(180deg, var(--dark-blue) 50%, var(--iqcblue) 50%, var(--iqcblue) 100%);
        background: linear-gradient(180deg, var(--dark-blue) 50%, var(--iqcblue) 50%, var(--iqcblue) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3452ff",endColorstr="#d3a583",GradientType=1);
        transform: rotate(30deg);
        z-index: 13;
        position: absolute;
        top: -18%;
        left: 40%;
    }

        .lines span:nth-child(2) {
            left: 52%;
            top: -21%;
        }

        .lines span:nth-child(3) {
            left: 64%;
            top: -24%;
        }

.form-label {
    font-size: 13pt;
    font-weight: 600;
    color: var(--iqcblue);
}



.profile-card * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.profile-card {
    padding: unset;
    position: relative;
    overflow: hidden;
    max-width: 465px;
    width: 100%;
    height: 210pt;
    background: #ffffff;
    box-shadow: 0 1px 6px rgb(61 65 84 / 15%);
    border-radius: 10px;
    cursor: pointer;
    margin-bottom: 60pt;
    transition: all 0.35s ease-in-out;
}

    .profile-card > .profile-image {
        border: 4px solid #ffffff;
        -webkit-transition: all 0.35s ease-in-out;
        transition: all 0.35s ease-in-out;
        -webkit-transform: scale(1.6);
        transform: scale(1.6);
        position: absolute;
        float: right;
        float: right;
        right: -7%;
        top: 14%;
        z-index: 1;
        object-fit: cover;
        width: 200px;
        height: 200px;
        border-radius: 50%;
    }

    .profile-card .profile-description {
        padding: 20px 0px 0px 25px;
        position: absolute;
        left: 0;
        width: 55%;
    }

        .profile-card .profile-description h2 {
            color: var(--dark-blue);
            margin: 0;
            text-align: left;
            padding-bottom: 10px;
            width: 100%;
            font-size: 1.3em;
            font-weight: 300;
            text-transform: capitalize;
            border-bottom: 2px solid rgb(94 106 114 / 12%);
        }

            .profile-card .profile-description h2 span {
                font-weight: 700;
            }

    .profile-card .profile-position {
        width: 100%;
        text-align: left;
        padding: 15px 30px;
        font-size: 0.9em;
        opacity: 1;
        font-weight: 500;
        font-size: 11pt;
        color: #ffffff;
        background: var(--dark-blue);
        position: absolute;
        bottom: 0;
    }

    .profile-card:hover > .profile-image,
    .profile-card.hover > .profile-image {
        /* right: -12%;*/
        -webkit-transition: all 0.35s ease-in-out;
        transition: all 0.35s ease-in-out;
        -webkit-transform: scale(1.7);
        transform: scale(1.7);
    }

    .profile-card:hover {
        transition: all 0.35s ease-in-out;
        box-shadow: 0 20px 40px rgb(61 65 84 / 15%);
    }

    .profile-card .profile-badge img {
        max-width: 55px;
    }

    .profile-card .profile-badge p {
        margin-left: 5pt;
        font-size: 15pt;
        font-weight: 500;
        color: var(--medium-grey);
    }

    .profile-card .profile-badge {
        display: inline-block;
        margin: 2pt;
        margin-top: 19px;
    }

    .profile-card .profile-details {
        width: 50%;
        position: relative;
        top: 33%;
        left: 4%;
        white-space: normal !important;
    }

@media(max-width:1770px) {
    .profile-card {
        height: 190pt;
        width: 390px;
    }

        .profile-card > .profile-image {
            height: 180px;
            width: 180px;
        }

        .profile-card .profile-badge img {
            max-width: 45px;
        }
}

@media(max-width:1530px) {

    .profile-card .profile-description h2 {
        font-size: 1rem;
    }

    .profile-card {
        width: 330px;
        height: 165pt;
    }

        .profile-card .profile-badge img {
            max-width: 40px;
        }

        .profile-card > .profile-image {
            height: 145px;
            width: 145px;
            top: 17%;
            right: -10%;
        }
}

@media(max-width:1200px) {

    .profile-card {
        width: 435px;
        height: 210pt;
    }

        .profile-card .profile-description h2 {
            font-size: 1.3rem;
        }

        .profile-card > .profile-image {
            top: 14%;
            width: 200px;
            height: 200px;
        }

        .profile-card .profile-badge img {
            max-width: 55px;
        }
}

@media(max-width:500px) {
    .profile-card .profile-description h2 {
        font-size: 1rem;
    }

    .profile-card {
        width: 330px;
        height: 165pt;
    }

        .profile-card .profile-badge img {
            max-width: 40px;
        }

        .profile-card > .profile-image {
            height: 145px;
            width: 145px;
            top: 17%;
            right: -10%;
        }
}

.profile-card2 {
    padding: unset;
    position: relative;
    overflow: hidden;
    max-width: 865px;
    width: 100%;
    min-height: 160pt;
    height: auto !important;
    background: #ffffff;
    box-shadow: 0 1px 6px rgb(61 65 84 / 15%);
    border-radius: 10px;
    cursor: pointer;
    margin-bottom: 60pt;
    transition: all 0.35s ease-in-out;
}

    .profile-card2 .profile-details {
        width: 50%;
        position: absolute;
        top: 0;
        left: 34%;
        white-space: normal !important;
    }

    .profile-card2 .profile-snippetWhere {
        position: sticky;
        width: 77%;
        color: dodgerblue;
        padding-left: 25px;
        margin-left: 70px;
    }
    .profile-card2 .profile-snippetText {
        position: sticky;
        width: 77%;
        padding-left: 25px;
        margin-left: 70px;
        margin-bottom: 30px;
        min-height: 60px;
    }
    .profile-card2 .profile-description {
        padding: 20px 0px 0px 25px;
        position: inherit;
        left: 0;
        width: 55%;
        top: 0;
        margin-bottom: 16px;
    }
    .profile-card2 .profile-badgemini {
        display: block;
        width: 73px;
        position: absolute;
        left: 10px;
        border-radius: 50px;
        height: 73px;
    }


.box-snippet {
    box-shadow: rgba(27, 31, 35, 0.04) 0px 1px 0px, rgba(255, 255, 255, 0.25) 0px 1px 0px inset;
}

.wordMatch {
    color:yellow;
    font-weight:700;
    background-color:yellow;
    letter-spacing: 0;
    padding: .25em 0 .325em;
    margin: 0 auto;
    text-shadow: 0 0 80px rgba(255,255,255,.5);
    /* Clip Background Image */

    background: url(/assets/images/background/animated-text-fill.png) repeat-y;
    -webkit-background-clip: text;
    background-clip: text;
    /* Animate Background Image */

    -webkit-text-fill-color: transparent;
    -webkit-animation: aitf 80s linear infinite;

    /* Activate hardware acceleration for smoother animations */

    -webkit-transform: translate3d(0,0,0);
    -webkit-backface-visibility: hidden;
}


/* Animate Background Image */

@-webkit-keyframes aitf {
    0% {
        background-position: 0% 50%;
    }

    100% {
        background-position: 100% 50%;
    }
}

img.badge-real-size {
    max-width: 350px;
}
#breakingbad {
   position:absolute;
   top:500px;
   left:10%;
}
