/*      Touch Support - O3 Survey      */ 
@charset "UTF-8";
@font-face {
    font-family: 'Futura';
    font-weight: 700;
    font-style: normal;
    src: url(/fonts/FuturaStd-Heavy.woff2) format("woff2");
}

:root {
    --container-size: 1140px;
	--font-primary: 'Mulish', sans-serif;
	--font-alternative: 'Futura', sans-serif;
    --font-color: inherit;

    --link-color: #a21e22;
    --link-color2: #b7192e;

    --background-body: rgb(217, 253, 253);
    --background-modal: #e0e5ec;

    --box-shadow-none: none;
    --box-shadow:
        -7px -7px 10px 0px #fff9,
        -4px -4px 5px 0px #fff9,
        7px 7px 20px 0px #0002,
        4px 4px 5px 0px #0001,
        inset 0px 0px 0px 0px #fff9,
        inset 0px 0px 0px 0px #0001, 
        inset 0px 0px 0px 0px #fff9, 
        inset 0px 0px 0px 0px #0001;
    --box-shadow2:
        0px 0px 0px 0px #fff9,
        0px 0px 0px 0px #fff9,
        0px 0px 0px 0px #0001,
        0px 0px 0px 0px #0001,
        inset -7px -7px 20px 0px #fff9,
        inset -4px -4px 5px 0px #fff9,
        inset 7px 7px 20px 0px #0003,
        inset 4px 4px 5px 0px #0001;
    --box-shadow3:
        -7px -7px 20px 0 #b51c22,
        -4px -4px 5px 0 #af3d42,
        7px 7px 20px 0 #0002, 
        4px 4px 5px 0 #0001, 
        inset 0 0 0 0 #af3d42,
        inset 0 0 0 0 #0001,
        inset 0 0 0 0 #af3d42,
        inset 0 0 0 0 #0001;
    --box-shadow4:
        0 0 0 0 #b51c22,
        0 0 0 0 #af3d42,
        0 0 0 0 #0001,
        0 0 0 0 #0001,
        inset -7px -7px 20px 0 #b51c22,
        inset -4px -4px 5px 0 #af3d42,
        inset 7px 7px 20px 0 #0003,
        inset 4px 4px 5px 0 #0001;

        --text-decoration-none: none;
        --text-decoration: underline;

    --select-arrow: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%235D5D5D%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),linear-gradient(to bottom, transparent 0%, transparent 100%);
    --select-arrow2: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%235D5D5D%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),linear-gradient(to bottom, transparent 0%, transparent 100%);
    --select-arrow3: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%235D5D5D%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),linear-gradient(to bottom, transparent 0%, transparent 100%);

    --form-color-invalid: #ff0e0e;
    --form-color-valid: #03a903;
    
/*      General Colors      */

    --colorA: #5d5d5d;
    --colorB: #f3f3f3;
    --colorC: #a21e22;
    --colorD: #d4d8df;
    --colorE: #e5e5e5;
    --colorF: #adadad;
    --colorG: #333;
    --colorH: #2196f3;
    --colorI: #888;
    --colorJ: #ccd1d8;
    --colorK: #bdb9b9;
    --colorL: #eee;
    --colorM: #adb3ad;
    --colorN: #f7f7f7;
    --colorO: #b7192e;
    --colorP: #00ad5f;
    --colorR: #5d5f5d;
}


*:not(p):not(ul):not(ol):not(label) {
    margin: 0;
    padding: 0;
    border: 0 none;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

html, body {width: 100%; height: 100%;}
body {
    background-color: var(--background-body);
	margin: 0 auto;
	padding: 0;
	position: relative;
	background-position: center top;
	background-attachment: fixed;
	background-size: cover;
    font-family: var(--font-primary);
    font-size: 16px;
    color: var(--colorR);
    font-weight: 300;
    letter-spacing: .025em;
    line-height: 1.33;
}
h1,h2,h3,h4,h5,h6{ 
    font-family: var(--font-alternative);
}
h1{ font-size:32px; }
h2{ font-size:26px; }
h3{ font-size:18px; }
h4{ font-size:16px; }
h5{ font-size:14px; }
h6{ font-size:12px; }

strong { font-weight: 700; }
small{ font-size:10px; }

a {
    color: var(--link-color);
    outline: none;
    text-decoration: var(--text-decoration-none);
}
    a:focus,
    a:hover {
        color: var(--link-color2);
        text-decoration: var(--text-decoration);
    }
    a:visited {
        color: var(--colorC);
    }
#wrap {
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: space-between;
    align-items: center;
    flex-direction: column;
    background: transparent;
    border: 0;
    position: relative;
    text-align: left;
    animation: scale .7s ease-in-out;
}
    #header {
        width: 100%;
        padding-left: 2rem;
        padding-right: 2rem;
    }
        #header .logo {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='500' height='500' viewBox='0 0 254.84 62.89'%3E %3Cdefs/%3E %3Cpath d='M57.38 18.22c-4.83-1.71-9.83-3.32-13.9-6.64a2.31 2.31 0 00-2.34-.67l-2.37 1.37a.66.66 0 00-.51-.25l-5.71.51c-3 .26-5.27 0-5.28-.62s1.77-1.45 4.16-2.06 4.49-1.17 4.49-1.17a2.12 2.12 0 00.6-2c-.13-1-.65-1.64-1.14-1.43-1.74.77-2.59 1.16-4.24 1.88-2.29 1-4 1.14-4.09.53s1.03-1.78 2.5-2.66 2.72-1.72 2.72-1.72a2.28 2.28 0 00.46-2.15c-.19-.9-.69-1.35-1.08-1-3.92 3.38-7.79 6.84-12.7 8.72-1 .34-1.75 1-1.75 1.69v2.75a.63.63 0 00-.47.31c-1 2.2-1.5 3.24-2.44 5.24-1.29 2.77-2.67 4.54-3.18 4.27s-.37-2.26.3-4.64 1.24-4.47 1.24-4.47c0-.5-.59-1.16-1.43-1.52s-1.75-.26-1.8.27c-.21 1.89-.3 2.82-.5 4.62-.28 2.48-1 4.07-1.59 3.8s-1-1.83-1-3.56-.14-3.21-.14-3.21c0-.52-.75-1.19-1.63-1.47s-1.51-.09-1.41.42c1 5.09 2 10.17 1.19 15.36a2.34 2.34 0 00.6 2.36l2.38 1.38a.64.64 0 000 .56c1.4 2 2.06 2.92 3.32 4.73 1.75 2.51 2.6 4.58 2.1 4.89s-2.14-.81-3.86-2.58-3.26-3.3-3.26-3.3a2.1 2.1 0 00-2 .48c-.81.61-1.1 1.38-.67 1.7l3.75 2.73c2 1.48 3 2.94 2.5 3.28s-2.08 0-3.59-.88-2.86-1.49-2.86-1.49a2.29 2.29 0 00-2.09.67c-.68.62-.83 1.27-.33 1.44 4.88 1.71 9.81 3.33 13.89 6.65a2.34 2.34 0 002.33.67l2.37-1.37a.65.65 0 00.51.25l5.76-.51c3-.26 5.26 0 5.28.62s-1.78 1.41-4.17 2.01-4.49 1.17-4.49 1.17a2.1 2.1 0 00-.6 2c.13 1 .65 1.64 1.13 1.43l4.21-1.87c2.29-1 4-1.14 4.09-.53s-1.04 1.8-2.52 2.68-2.72 1.73-2.72 1.73a2.26 2.26 0 00-.46 2.14c.19.9.68 1.35 1.07 1 3.93-3.38 7.79-6.84 12.71-8.71 1-.34 1.75-1 1.75-1.7v-2.74a.6.6 0 00.47-.31c1-2.2 1.5-3.24 2.44-5.24 1.29-2.76 2.67-4.54 3.18-4.26s.37 2.26-.3 4.63-1.23 4.47-1.23 4.47c0 .5.58 1.16 1.43 1.52s1.75.26 1.8-.26c.21-1.9.3-2.82.5-4.62.28-2.48 1-4.07 1.59-3.81s1 1.83 1 3.56.2 3.22.2 3.22c0 .51.75 1.18 1.63 1.47s1.51.08 1.41-.43c-1-5.09-2-10.17-1.2-15.36a2.32 2.32 0 00-.59-2.36l-2.38-1.37a.66.66 0 000-.57l-3.33-4.73c-1.74-2.5-2.59-4.58-2.1-4.88s2.15.8 3.87 2.57 3.26 3.3 3.26 3.3a2.08 2.08 0 002-.48c.8-.61 1.09-1.38.67-1.69-1.54-1.13-2.3-1.67-3.75-2.74-2-1.48-3-2.93-2.51-3.28s2.08 0 3.6.88 2.86 1.49 2.86 1.49a2.26 2.26 0 002.08-.67c.66-.65.81-1.27.31-1.44zm-24.83-2.83l3.58.3a13.64 13.64 0 01-.2 1.5 13.34 13.34 0 01-.47 1.91c-1.62-.42-2.49-.65-4.09-1-2.35-.59-4.11-1.45-4.09-2s2.21-.96 5.27-.71zm-15.77 4.84c.75-1.09 1.47-2.13 2.05-2.95a12.51 12.51 0 011.2.93 12.21 12.21 0 011.41 1.35c-1.17 1.19-1.8 1.84-2.94 3-1.68 1.75-3.31 2.84-3.8 2.53s.35-2.36 2.08-4.86zm-.49 20.29c-.51.27-1.89-1.49-3.19-4.24-.55-1.2-1.11-2.34-1.55-3.27a14 14 0 011.4-.58 13.39 13.39 0 011.89-.54c.44 1.61.68 2.47 1.14 4.06.69 2.34.82 4.3.31 4.57zm8.87 7l-3.61-.32a15.93 15.93 0 01.67-3.42c1.62.43 2.49.65 4.09 1 2.35.58 4.1 1.44 4.09 2s-2.21.96-5.24.71zm7.7-2.83l-.56-.17c-3.39-1.18-6.22-2.61-9.46-4.06a37.49 37.49 0 01.54-4.58c.07-.5-.41-.69-1.07-.42s-1.44.48-1.44 1v3.08c0 1-.22 2-.64 2.23s-.81.15-.87-.17-.12-.57-.13-.57c-.67-3.52-.85-6.69-1.22-10.22a40.09 40.09 0 014.24-1.83c.47-.18.4-.69-.17-1.13s-1.14-1-1.56-.77c-1.08.62-1.61.93-2.63 1.58s-1.87.81-2.26.56-.53-.63-.29-.84l.43-.39c2.72-2.35 5.37-4.09 8.24-6.17a39.15 39.15 0 013.7 2.76c.4.31.8 0 .9-.72s.3-1.49-.11-1.73c-1.08-.63-1.62-.94-2.69-1.5-.91-.47-1.63-1.2-1.61-1.67s.27-.77.58-.67l.56.18c3.39 1.18 6.22 2.6 9.46 4a37.49 37.49 0 01-.5 4.54c-.08.5.41.69 1.07.42s1.44-.48 1.44-1v-3.08c0-1 .23-2 .65-2.23s.8-.14.87.17.12.57.13.57c.67 3.53.85 6.69 1.21 10.22a37.9 37.9 0 01-4.28 1.93c-.47.18-.4.7.17 1.13s1.13 1 1.55.77c1.09-.62 1.62-.93 2.64-1.58.87-.55 1.86-.81 2.26-.56s.53.63.29.84a5.61 5.61 0 00-.43.4c-2.72 2.3-5.32 4-8.24 6.12a37.31 37.31 0 01-3.71-2.75c-.39-.32-.8 0-.89.71s-.31 1.49.11 1.73c1.08.63 1.62.94 2.69 1.5.91.47 1.63 1.2 1.61 1.68s-.28.76-.58.66zm8-2l-2.05 3a14.9 14.9 0 01-1.2-.93 13.31 13.31 0 01-1.42-1.36c1.17-1.19 1.81-1.83 3-3 1.68-1.74 3.3-2.83 3.8-2.53s-.36 2.28-2.09 4.78zm5.21-12.8a14 14 0 01-1.4.58 13.5 13.5 0 01-1.89.55c-.44-1.62-.68-2.48-1.14-4.07-.67-2.32-.8-4.27-.29-4.55s1.89 1.49 3.19 4.24c.61 1.16 1.15 2.3 1.57 3.21zM70.05 22.89v4.34h3.59v3.68h-3.59v5.83c0 1.94.5 2.82 2 2.82a6.09 6.09 0 001.5-.13v3.79a10.53 10.53 0 01-3.22.42 5.39 5.39 0 01-3.78-1.38c-.92-1-1.38-2.5-1.38-4.77v-6.58h-2.16v-3.68h2.14v-3zM92.26 35.09c0 5.89-4.18 8.59-8.49 8.59-4.7 0-8.32-3.1-8.32-8.29s3.42-8.56 8.62-8.56c4.9 0 8.19 3.39 8.19 8.26zm-11.65.17c0 2.76 1.15 4.83 3.29 4.83 2 0 3.19-1.94 3.19-4.87 0-2.37-.92-4.8-3.19-4.8s-3.29 2.47-3.29 4.84zM110.55 38.15c0 2.11.07 3.82.14 5.16h-4.35l-.27-2.3h-.1a5.73 5.73 0 01-5 2.63c-3.29 0-5.66-2-5.66-7v-9.41h5v8.65c0 2.34.76 3.75 2.54 3.75a2.66 2.66 0 002.5-1.74 2.73 2.73 0 00.19-1.09v-9.57h5zM126.6 42.89a11.64 11.64 0 01-4.48.75c-5.19 0-8.52-3.19-8.52-8.22 0-4.7 3.23-8.55 9.22-8.55a11.7 11.7 0 013.81.62l-.79 3.72a6.89 6.89 0 00-2.79-.49 4.15 4.15 0 00-4.31 4.5 4.2 4.2 0 004.4 4.51 7.07 7.07 0 002.87-.53zM129.36 20.01h5v9.21h.07a5.42 5.42 0 012-1.68 5.79 5.79 0 012.6-.62c3.19 0 5.62 2.2 5.62 7.07v9.32h-5v-8.84c0-2.11-.72-3.56-2.6-3.56a2.64 2.64 0 00-2.5 1.78 2.75 2.75 0 00-.17 1.09v9.53h-5zM148.64 40.39a8.22 8.22 0 003.85 1.12c2.07 0 3.05-1 3.05-2.37s-.82-2.11-2.92-2.9c-2.9-1-4.25-2.6-4.25-4.5 0-2.57 2.11-4.68 5.5-4.68a7.39 7.39 0 013.88 1l-.69 2.11a6.15 6.15 0 00-3.26-1c-1.71 0-2.63 1-2.63 2.17s.92 1.91 3 2.73c2.73 1 4.18 2.41 4.18 4.77 0 2.83-2.2 4.81-5.92 4.81a9 9 0 01-4.47-1.12zM175.38 38.94c0 1.68 0 3.12.13 4.37h-2.56l-.17-2.59h-.07a5.94 5.94 0 01-5.26 3c-2.5 0-5.49-1.42-5.49-7v-9.33h2.89v8.79c0 3 1 5.1 3.56 5.1a4.16 4.16 0 003.81-2.67 3.84 3.84 0 00.26-1.48v-9.74h2.9zM180.18 32.59c0-2-.06-3.68-.13-5.2h2.57l.16 2.73h.07a6.19 6.19 0 015.7-3.06c3.89 0 6.78 3.26 6.78 8.06 0 5.73-3.52 8.56-7.27 8.56a5.58 5.58 0 01-4.9-2.5h-.07v8.65h-2.86zm2.86 4.24a4.93 4.93 0 00.13 1.19 4.47 4.47 0 004.38 3.39c3.06 0 4.83-2.5 4.83-6.15 0-3.16-1.68-5.89-4.73-5.89a4.56 4.56 0 00-4.38 3.55 4.63 4.63 0 00-.2 1.15zM198.9 32.59c0-2-.07-3.68-.13-5.2h2.56l.17 2.73h.05a6.2 6.2 0 015.66-3.06c3.88 0 6.78 3.26 6.78 8.06 0 5.73-3.52 8.56-7.27 8.56a5.6 5.6 0 01-4.91-2.5h-.06v8.65h-2.86zm2.86 4.24a4.47 4.47 0 004.47 4.58c3.06 0 4.84-2.5 4.84-6.15 0-3.16-1.68-5.89-4.74-5.89a4.55 4.55 0 00-4.37 3.55 4.63 4.63 0 00-.2 1.15zM232.02 35.22c0 5.89-4.11 8.46-7.93 8.46-4.27 0-7.63-3.16-7.63-8.19 0-5.3 3.52-8.43 7.9-8.43 4.57 0 7.66 3.33 7.66 8.16zm-12.6.17c0 3.48 2 6.12 4.81 6.12s4.83-2.6 4.83-6.19c0-2.7-1.35-6.08-4.77-6.08s-4.87 3.15-4.87 6.15zM235.67 32.36c0-1.87 0-3.49-.13-5h2.53l.13 3.16h.1a4.82 4.82 0 014.44-3.49 6.27 6.27 0 01.79.07v2.73a4.86 4.86 0 00-1-.06c-2 0-3.49 1.51-3.88 3.68a8.15 8.15 0 00-.1 1.35v8.51h-2.9zM250.7 23.58v3.81h4.15v2.21h-4.15v8.58c0 2 .56 3.1 2.18 3.1a5.39 5.39 0 001.67-.2l.13 2.2a7.71 7.71 0 01-2.56.4 4.13 4.13 0 01-3.13-1.22 6.22 6.22 0 01-1.11-4.18V29.6h-2.47v-2.21h2.47v-3z' class='a'/%3E%3C/svg%3E");
            background-size: 100% auto;
            background-position: center;
            overflow: visible;
            height: 119px;
            width: 212px;
        }

        #content {
            display: flex;
            flex-direction: column;
            justify-content: center;
            position: relative;
            max-width: 36.750em;
            padding: 2rem;
            flex: 1 0 auto;
        }
            #content::before {
                -webkit-filter: blur(1.250em);
                -moz-filter: blur(1.250em);
                -o-filter: blur(1.250em);
                -ms-filter: blur(1.250em);
                filter: blur(1.250em);
            }
            #content::after {
                -webkit-filter: blur(0px);
                -moz-filter: blur(0px);
                -o-filter: blur(0px);
                -ms-filter: blur(0px);
                filter: blur(0px);
            }
            #content > h1 {
                display: inline-block;
                color: var(--link-color);
                text-align: left;
            }
                #content > h1:after {
                    content: "";
                    display: block;
                    position: relative;
                    width: 0;
                    height: .3rem;
                    border-radius: .3rem;
                    background-color: var(--colorM);
                    margin-top: .4rem;
                    margin-left: auto;
                    margin-right: auto;
                    width: 0;
                    transition: width .3s ease;
                    animation: scale .7s ease-in-out;
                }
                    #content > h1:hover:after {
                        width: 100%;
                    }
                #content h2 {
                    margin-top: 1rem;
                }

        #footer {
            display: flex;
            justify-self: flex-end;
            align-content: center;
            justify-content: space-between;
            width: 100%;
            padding: .5rem 2rem;
            background: var(--colorL);
            border-top: 1px solid var(--colorE);
            animation: scale 0.7s ease-in-out;
            font-size: .8rem;
            color: var(--colorK);
            letter-spacing: .03rem;
            margin-top: auto;
        }
            .heart {
                content: '';
                font-family: "FontAwesome";
                transition: color 0.5s ease;
                color: inherit;
            }
            .heart:after {
                content: "\f004";
                font-size: .75rem;
            }
            #footer a {
                text-decoration: none;
                color: inherit;
                transition: all .3s ease;
            }
            #footer:hover a {
                color: var(--colorA);
            }
            #footer:hover .heart,
            #footer a:hover {
                color: var(--colorC);
            }

.btn {
    margin-left: auto;
    margin-right: auto;
    margin-top: 1.5rem;
    height: 3rem;
    width: 100%;
    border-radius: 4px;
    border: 0;
    background-color: var(--colorL);
    font-family: var(--font-primary);
    font-weight: 400;
    font-size: 1rem;
    color: var(--colorR);
    text-decoration: var(--text-decoration-none);
    box-shadow: var(--box-shadow);
    transition: all .3s ease;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    outline: none;
    user-select: none;
    cursor: pointer;
}
    .btn:hover {
        color: var(--colorG);
        background-color: var(--colorL);
        box-shadow:var(--box-shadow2);
    }
    .btn:active {
        color: var(--colorG);
        background-color: white;
    }

.notification--msg {
    padding: 1rem;
    box-shadow: var(--box-shadow);
    margin-top: 1rem;
    text-align: left;
    border-radius: .2rem;
    animation: scale .7s ease-in-out;
}
    .notification--msg p {
        margin-top: 0;
    }
    .alert {
        background-color: lightyellow;
    }
    .error {
        color: white;
        background-color: var(--colorC);
    }

.trackidtext .input-group {
    display: flex;
    flex-direction: row;
}
    #trackid {
        background-color: lightyellow;
        padding: .3rem .5rem;
        box-shadow: var(--box-shadow);
        transition: all .3s ease;
    }
    #btntrackid {
        margin-left: 10px;
        cursor: pointer;
        box-shadow: var(--box-shadow);
    }
        #btntrackid:hover {
            box-shadow: var(--box-shadow-2); 
        }

.debug--info {
    border: 1px solid var(--colorL);
    padding: 0 1rem;
    background-color: rgba(0,0,0,.05);
    font-size: 14px;
    word-break: break-all;
}

.cp--txtField {
    border-bottom: 2px solid var(--colorF);
    position: relative;
    margin: 30px 0;
}
    .cp--txtField input {
        font-size: 15px;
        color: var(--colorG);
        border: none;
        width: 100%;
        outline: none;
        background: none;
        padding: 0 5px;
        height: 40px;
        transition: color .3s ease;
    }
    
    .cp--txtField textarea {
        font-size: 15px;
        color: var(--colorG);
        border: none;
        width: 100%;
        outline: none;
        background: none;
        padding: 0 5px;
        height: 40px;
        transition: color .3s ease;
        resize: vertical;
    }

    .cp--txtField span:before {
        content: attr(data-placeholder);
        position: absolute;
        top: 50%;
        left: 5px;
        color: var(--colorF);
        transform: translateY(-50%);
        z-index: -1;
        transition: .5s;
    }
    .cp--txtField span:after {
        content: '';
        position: absolute;
        left: 0;
        bottom: -2px;
        width: 0%;
        height: 2px;
        background: linear-gradient(120deg, var(--colorO),var(--colorC));
        transition: .5s;
    }

    


.cp--txtField.cp--invalid span:before {
    color: var(--form-color-invalid);
}
.cp--txtField.cp--invalid span:after {
    background:linear-gradient(120deg,var(--form-color-invalid),var(--form-color-invalid));
    width: 100%;
}
.cp--txtField.cp--invalid input {
    color: var(--form-color-invalid);
}

.cp--txtField input:not(:placeholder-shown) + span:before,
.cp--txtField textarea:not(:placeholder-shown) + span:before,
.cp--txtField.cp--valid span:before {
    color: var(--form-color-valid);
    top: -10px;
}
.cp--txtField.cp--valid span:after {
    background:linear-gradient(120deg,var(--form-color-valid),var(--form-color-valid));
    width: 100%;
}


fieldset.cp--invalid legend {
    color: var(--form-color-invalid);
}
    legend {
        padding: 1rem 0 !important;
    }

input:focus + span:before, textarea:focus + span:before {
    top: -10px;
}
/*
input:focus + span:after, textarea:focus + span:after {
    width: 100%;
}
*/
.cp--txtField input:disabled + span:before {
    top: -10px;
}

:disabled,
.cp--disabled {
    opacity: .3;
    pointer-events: none;
}

@keyframes scale {
	0% {
	  transform: scale(0.9);
	  opacity: 0;
	  }
	50% {
	  transform: scale(1.01);
	  opacity: 0.5;
	  }
	100% {
	  transform: scale(1);
	  opacity: 1;
	}
  }

  @media only screen and (max-width: 400px) {
    #header,
    #content,
    #footer {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    #header .logo {
        height: 70px;
        width: 125px;
    }
    #footer {
        flex-direction: column-reverse;
    }
  }

/*      Custom      */

.cp--hidden {
	display:none;
}

/* STUFF */

.cp--radio {
	display:inline-block;
	position: relative;
	font-size: 16px;
    line-height: 1.5;
	z-index: 0;
}
.cp--radio > input {
	appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    z-index: -1;
    position: absolute;
    left: -5px;
    top: -3px;
    display: block;
    margin: 0;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    background-color: rgba(0, 0, 0, 0.6);
    outline: none;
    opacity: 0;
    transform: scale(1);
    pointer-events: none;
    transition: opacity 0.3s, transform 0.2s;
}

.cp--radio > span {
	display: inline-block;
    width: 100%;
    cursor: pointer;
}
    .cp--radio > span:before {
        content: "";
        display: inline-block;
        box-sizing: border-box;
        margin: 2px 10px 2px 0;
        border: solid 2px; /* Safari */
        border-color: rgba(0, 0, 0, 0.6);
        border-radius: 50%;
        width: 20px;
        height: 20px;
        vertical-align: top;
        transition: border-color 0.2s;
    }
    .cp--radio > span:after {
        content: "";
        display: block;
        position: absolute;
        top: 2px;
        left: 0;
        border-radius: 50%;
        width: 10px;
        height: 10px;
        background-color: var(--form-color-valid);
        transform: translate(5px, 5px) scale(0);
        transition: transform 0.2s;
    }
    .cp--radio > input:checked + span:before {
        border-color: var(--form-color-valid);
    }

    .cp--radio > input:checked + span:after {
        transform: translate(5px, 5px) scale(1);
    }

/* Hover, Focus */
.cp--radio:hover > input {
    opacity: 0.04;
}

.cp--radio > input:focus {
    opacity: 0.12;
}

.cp--radio:hover > input:focus {
    opacity: 0.16;
}

/* Active */
.cp--radio > input:active {
    opacity: 1;
    transform: scale(0);
    transition: transform 0s, opacity 0s;
}

.cp--radio > input:active + span:before {
    border-color: var(--form-color-valid);
}

/* Disabled */
.cp--radio > input:disabled {
    opacity: 0;
}

.cp--radio > input:disabled + span {
    color: rgba( 0, 0, 0, 0.38);
    cursor: initial;
}

.cp--radio > input:disabled + span:before {
    border-color: currentColor;
}

.cp--radio > input:disabled + span:after {
    background-color: currentColor;
}

/* END STUFF */

textarea {
    display: block;
    width: 100%;
    max-width: 100%;
    font-family: var(--font-primary);
    padding: .5rem;
    background-color: transparent;
    resize: vertical;
}

#wrap label {
    display: flex;
    position: relative;
    margin-bottom: .25rem;
}
    #wrap label > input:checked + i {
        background-color: var(--colorC);
        border-color: var(--colorC);
    }
    #wrap label > input:checked ~ span {
        color: var(--form-color-valid);
    }
    #wrap label > i {
        display: inline-block;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        margin-right: .5rem;
        vertical-align: middle;
        border: 3px solid var(--colorF);
        box-shadow: inset 0 0 0 3px var(--background-body);
        transition: 0.25s;
    }
    #wrap label > span {
        display: inline-block;
    }
        #wrap label:hover > input + i {
            border-color: var(--colorA);
        }
        #wrap label:hover > span {
            color: var(--colorG);
        }

.fa-plus,
.fa-minus,
#wrap label:hover,
.button-label {
    cursor: pointer;
}

#success-container {
    opacity: 1;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    background-color: #a21e22;
    animation: scale .3s ease-in-out;
    color: white;
    flex-direction: column;
    transition: opacity .3s ease-in-out;
    z-index: 999;
}
    #success-container h1 {
        padding-left: 1rem;
        padding-right: 1rem;
    }
        #success-container h1:after {
            content: "";
            display: block;
            position: relative;
            width: 0;
            height: .3rem;
            border-radius: .3rem;
            background-color: #e8131a;
            margin-top: .4rem;
            margin-left: auto;
            margin-right: auto;
            width: 0;
            transition: width .3s ease;
            animation: scale .7s ease-in-out;
        }
        #success-container:hover h1:after {
            width: 100%;
        }
    #success-container .button-label {
        padding: 1rem 1.5rem;
        padding-left: 6rem;
        padding-right: 6rem;
        margin-top: 3rem;
        border-radius: .2rem;
        background-color: #a21e22;
        color: white;
        box-shadow: var(--box-shadow3);
        transition: box-shadow .4s cubic-bezier(.79,.21,.06,.81), background-color .3s ease, color .3s ease;
        -webkit-tap-highlight-color: transparent;
        outline: 0;
        user-select: none;
        animation: scale .7s ease-in-out;
    }
        #success-container .button-label:hover {
            background-color: #a21f24;
            color: #ff9292;
            box-shadow: var(--box-shadow4);
        }
        #success-container .button-label:active {
            background-color: #b12228;
            color: white;
        }
.secondary--textarea {
    background-color: var(--colorL);
    box-shadow: var(--box-shadow2);
    resize: vertical;
    min-height: 4rem;
    padding: .8rem;
    margin-top: .5rem;
    border-radius: 4px;
    outline: none;
    border: none;
    font-size: 1rem;
    transition: all .3s ease;
}
    .secondary--textarea:focus {
        background-color: white;
    }
    .secondary--textarea:invalid {
        outline: 2px solid var(--form-color-invalid);
    }

.container--has-button {
    display: flex;
    align-items: flex-start;
    margin-bottom: 20px;
}

.cp--drop-down {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    justify-content: space-between;
}
    select:hover {
        box-shadow: var(--button-box-shadow-hover);
        color: var(--button-color-hover);
        transition: all .3s ease;
    }
    select:active {
        background-color: var(--button-background-active);
    }
        .cp--drop-down svg,
        .cp--button svg {
            width: auto;
            height: 50%;
        }

    .selectize-control .selectize-input {
        width: 100%;
        font-size: 16px;
        color: inherit !important;
        font-weight: 700;
        line-height: 1.3;
        padding: 1rem 1.4rem 1rem 1.4rem;
        box-sizing: border-box;
        margin: 0;
        appearance: none;
        background-color: var(--colorL);
        background-repeat: no-repeat, repeat;
        background-position: right .7em top 50%, 0 0;
        background-size: .65em auto, 100%;
        box-shadow: var(--box-shadow);
        border: 0;
        outline: none;
    }
    select ::-ms-expand {
        display: none;
    }
    select:hover {
        border-color: #888;
    }
    select:focus {
        outline: none;
    }
    select option {
        font-weight: normal;
    }
    .selectize-control .selectize-input.full {
        background-color: var(--colorL);
    }
    .selectize-control .selectize-input.input-active,
    .selectize-control .selectize-input.focus {
        background-color: white;
        box-shadow: var(--box-shadow2);
        border: 0;
    }

.employee_container {
    width: 100%;
}
.button_container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    width: 2.5rem;
    height: 52px;
}

.button_container .fa:before {
    text-shadow: var(--box-shadow);
}