﻿
/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

/* ------------------------------------------------------------------------- */
/* MAIN*/

/*:root {
    --main-bg-color: #222;
}*/

@keyframes MOVE-BG {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(-187%);
    }
}

@keyframes SLIDE-BG {
    from {
        background-position-y: 0;
    }

    to {
        background-position-y: 92.884575em;
    }
}

@keyframes slide {
    0% {
        transform: translate(0);
    }

    100% {
        transform: translate(-3333px); /* The image width */
    }
}


html {
    background-color: #222;
    position: relative;
    min-height: 100%;
}

body {
    font-size: 62.5%;
    background-color: transparent;
    font-family: Calibri,Candara,Segoe,Segoe UI,Helvetica,Arial,sans-serif;
    color: #efefef;
    /*padding-bottom: 10em;*/
    /*background-color: #222;*/
    /*    animation: SLIDE-BG 42s ease-in-out infinite;*/
    /*    background-size: cover;
    animation-name: SLIDE-BG;
    animation-duration: 100s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;*/
    /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1353' height='162.4' viewBox='0 0 1000 120'%3E%3Cg fill='none' stroke='%23333333' stroke-width='18.8' stroke-opacity='0.63'%3E%3Cpath d='M-500 75c0 0 125-30 250-30S0 75 0 75s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 45c0 0 125-30 250-30S0 45 0 45s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 105c0 0 125-30 250-30S0 105 0 105s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 15c0 0 125-30 250-30S0 15 0 15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500-15c0 0 125-30 250-30S0-15 0-15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 135c0 0 125-30 250-30S0 135 0 135s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3C/g%3E%3C/svg%3E");*/
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'toonishregular';
    transform: scale(1, .88);
    line-height: 1.1em;
}

h1 {
    font-size: 2.6em;
}

h2 {
    font-size: 2.2em;
}

h3 {
    font-size: 2.0em;
}

h4 {
    font-size: 1.8em;
}

h5 {
    font-size: 1.6em;
}

h6 {
    font-size: 1.5em;
}

ul {
    padding-left: 1rem;
    text-align: left;
    list-style: none;
}

li {
    /*    padding-left: 1rem;*/
    text-align: left;
    list-style: circle;
}


    li::before {
        content: " ";
    }

p {
    font-size: 1.2em;
    line-height: 1.1em;
}

.page-container {
    /*font-size: 1.2em;*/
    /*line-height: 1.8em;*/
    font-size: 2.0em;
    line-height: 1.1em;
    /*transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    perspective: 1000;
    -webkit-transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
    -webkit-perspective: 1000;*/
    /*transition: transform 250ms ease-in-out;*/
    /*-webkit-text-stroke: .5px;*/
    /*-o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;*/
    /* animation: SLIDE-BG 42s ease-in-out infinite; */
    /*transition: all .5s ease-in-out;*/
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1353' height='162.4' viewBox='-420 0 1000 120'%3E%3Cg fill='none' stroke='%23333333' stroke-width='18.8' stroke-opacity='0.63'%3E%3Cpath d='M-500 75c0 0 125-30 250-30S0 75 0 75s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 45c0 0 125-30 250-30S0 45 0 45s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 105c0 0 125-30 250-30S0 105 0 105s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 15c0 0 125-30 250-30S0 15 0 15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500-15c0 0 125-30 250-30S0-15 0-15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 135c0 0 125-30 250-30S0 135 0 135s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3C/g%3E%3C/svg%3E");
    /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1353' height='600' viewBox='0 0 1000 120'%3E%3Cg fill='none' stroke='%23333333' stroke-width='5000.8' stroke-opacity='0.63'%3E%3Cpath d='M-500 75c0 0 125-30 250-30S0 75 0 75s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 45c0 0 125-30 250-30S0 45 0 45s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 105c0 0 125-30 250-30S0 105 0 105s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 15c0 0 125-30 250-30S0 15 0 15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500-15c0 0 125-30 250-30S0-15 0-15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 135c0 0 125-30 250-30S0 135 0 135s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3C/g%3E%3C/svg%3E");*/
    /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1353' height='100' viewBox='0 0 1000 120'%3E%3Cg fill='none' stroke='%23333333' stroke-width='20' stroke-opacity='0.63'%3E%3Cpath d='M-500 75c0 0 125-30 250-30S0 75 0 75s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 45c0 0 125-30 250-30S0 45 0 45s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 105c0 0 125-30 250-30S0 105 0 105s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 15c0 0 125-30 250-30S0 15 0 15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500-15c0 0 125-30 250-30S0-15 0-15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 135c0 0 125-30 250-30S0 135 0 135s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3C/g%3E%3C/svg%3E");*/
    /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 100 60'%3E%3Cg %3E%3Crect fill='%2346dfff' width='11' height='11'/%3E%3Crect fill='%2346defe' x='10' width='11' height='11'/%3E%3Crect fill='%2345ddfd' y='10' width='11' height='11'/%3E%3Crect fill='%2345dcfb' x='20' width='11' height='11'/%3E%3Crect fill='%2345dbfa' x='10' y='10' width='11' height='11'/%3E%3Crect fill='%2344daf9' y='20' width='11' height='11'/%3E%3Crect fill='%2344d9f8' x='30' width='11' height='11'/%3E%3Crect fill='%2344d8f6' x='20' y='10' width='11' height='11'/%3E%3Crect fill='%2343d7f5' x='10' y='20' width='11' height='11'/%3E%3Crect fill='%2343d5f4' y='30' width='11' height='11'/%3E%3Crect fill='%2343d4f3' x='40' width='11' height='11'/%3E%3Crect fill='%2342d3f2' x='30' y='10' width='11' height='11'/%3E%3Crect fill='%2342d2f0' x='20' y='20' width='11' height='11'/%3E%3Crect fill='%2342d1ef' x='10' y='30' width='11' height='11'/%3E%3Crect fill='%2341d0ee' y='40' width='11' height='11'/%3E%3Crect fill='%2341cfed' x='50' width='11' height='11'/%3E%3Crect fill='%2341ceec' x='40' y='10' width='11' height='11'/%3E%3Crect fill='%2340cdea' x='30' y='20' width='11' height='11'/%3E%3Crect fill='%2340cce9' x='20' y='30' width='11' height='11'/%3E%3Crect fill='%2340cbe8' x='10' y='40' width='11' height='11'/%3E%3Crect fill='%233fcae7' y='50' width='11' height='11'/%3E%3Crect fill='%233fc9e6' x='60' width='11' height='11'/%3E%3Crect fill='%233fc8e4' x='50' y='10' width='11' height='11'/%3E%3Crect fill='%233ec7e3' x='40' y='20' width='11' height='11'/%3E%3Crect fill='%233ec6e2' x='30' y='30' width='11' height='11'/%3E%3Crect fill='%233ec5e1' x='20' y='40' width='11' height='11'/%3E%3Crect fill='%233ec4e0' x='10' y='50' width='11' height='11'/%3E%3Crect fill='%233dc3de' x='70' width='11' height='11'/%3E%3Crect fill='%233dc2dd' x='60' y='10' width='11' height='11'/%3E%3Crect fill='%233dc1dc' x='50' y='20' width='11' height='11'/%3E%3Crect fill='%233cc0db' x='40' y='30' width='11' height='11'/%3E%3Crect fill='%233cbfda' x='30' y='40' width='11' height='11'/%3E%3Crect fill='%233cbdd8' x='20' y='50' width='11' height='11'/%3E%3Crect fill='%233bbcd7' x='80' width='11' height='11'/%3E%3Crect fill='%233bbbd6' x='70' y='10' width='11' height='11'/%3E%3Crect fill='%233bbad5' x='60' y='20' width='11' height='11'/%3E%3Crect fill='%233ab9d4' x='50' y='30' width='11' height='11'/%3E%3Crect fill='%233ab8d3' x='40' y='40' width='11' height='11'/%3E%3Crect fill='%233ab7d1' x='30' y='50' width='11' height='11'/%3E%3Crect fill='%2339b6d0' x='90' width='11' height='11'/%3E%3Crect fill='%2339b5cf' x='80' y='10' width='11' height='11'/%3E%3Crect fill='%2339b4ce' x='70' y='20' width='11' height='11'/%3E%3Crect fill='%2338b3cd' x='60' y='30' width='11' height='11'/%3E%3Crect fill='%2338b2cc' x='50' y='40' width='11' height='11'/%3E%3Crect fill='%2338b1ca' x='40' y='50' width='11' height='11'/%3E%3Crect fill='%2337b0c9' x='90' y='10' width='11' height='11'/%3E%3Crect fill='%2337afc8' x='80' y='20' width='11' height='11'/%3E%3Crect fill='%2337aec7' x='70' y='30' width='11' height='11'/%3E%3Crect fill='%2336adc6' x='60' y='40' width='11' height='11'/%3E%3Crect fill='%2336acc5' x='50' y='50' width='11' height='11'/%3E%3Crect fill='%2336abc3' x='90' y='20' width='11' height='11'/%3E%3Crect fill='%2336aac2' x='80' y='30' width='11' height='11'/%3E%3Crect fill='%2335a9c1' x='70' y='40' width='11' height='11'/%3E%3Crect fill='%2335a8c0' x='60' y='50' width='11' height='11'/%3E%3Crect fill='%2335a7bf' x='90' y='30' width='11' height='11'/%3E%3Crect fill='%2334a6be' x='80' y='40' width='11' height='11'/%3E%3Crect fill='%2334a5bc' x='70' y='50' width='11' height='11'/%3E%3Crect fill='%2334a4bb' x='90' y='40' width='11' height='11'/%3E%3Crect fill='%2333a3ba' x='80' y='50' width='11' height='11'/%3E%3Crect fill='%2333a2b9' x='90' y='50' width='11' height='11'/%3E%3C/g%3E%3C/svg%3E");*/
    background-attachment: fixed;
    background-size: cover;
}

.section-container {
    /*padding: 200px 30px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspect…0H-10v100h390c91.4 0 254.2-80 420-80s328.6 80 420 80h390V0z'/%3E%3C/svg%3E),url(data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspect…0h390c91.4 0 254.2-80 420-80s328.6 80 420 80h390V0z'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 180% 200px;
    background-position: top center, bottom center;*/
    /*background: linear-gradient(1deg, #87dcff, #66cdf7, #42b0dd, #2c82a6, #186484);
    background-size: 1000% 1000%;
    -webkit-animation: animFade 30s ease infinite;
    -moz-animation: animFade 30s ease infinite;
    animation: animFade 30s ease infinite;*/
    background-color: transparent;
    /*   padding: 2em;*/
}

@-webkit-keyframes animFade {
    0% {
        background-position: 51% 0%
    }

    50% {
        background-position: 50% 100%
    }

    100% {
        background-position: 51% 0%
    }
}

@-moz-keyframes animFade {
    0% {
        background-position: 51% 0%
    }

    50% {
        background-position: 50% 100%
    }

    100% {
        background-position: 51% 0%
    }
}

@keyframes animFade {
    0% {
        background-position: 51% 0%
    }

    50% {
        background-position: 50% 100%
    }

    100% {
        background-position: 51% 0%
    }
}


a {
    color: #333;
    /*background-color: #ffffec;*/
    padding: .2em;
    font-weight: bold;
    display: inline-block;
}

    a:hover {
        /*color: #333;
        background-color: #ffffec;*/
    }


img {
    object-fit: cover;
    width: 100%;
}

.border-top {
    border-top: 1px solid #e5e5e5;
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

.border-wrap {
    border: solid .1em rgba(0, 0, 0, .1);
}

.text-align-left {
    text-align: left;
}

.text-align-right {
    text-align: right;
}

.font-size-callout-action {
    font-size: 2.4em;
}

/* ACTION */

.action-item-link {
}

    .action-item-link:hover {
    }

/* SECTION */
.section-feature {
    text-align: center;
    padding: 1em;
}

.section-feature-board {
    max-width: 42em;
    margin: 0 auto;
    padding: 1em;
}

.section-feature-logo {
    object-fit: cover;
    color: #444;
    font-size: 24em;
    background: linear-gradient(1deg, #43e5fb, #62fb43, #fbc743);
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 1000% 1000%;
    -webkit-animation: animFade 30s ease infinite;
    -moz-animation: animFade 30s ease infinite;
    animation: animFade 30s ease infinite;
/*    rotation: 350deg;*/
    width: 100%;
    /*-webkit-text-stroke: .5px;*/
/*    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;*/
}

.section-feature-blurb {
    max-width: 36em;
    margin: 0 auto;
    margin-top: 1em;
    padding: 1em;
    color: #222;
    display: table;
    /*background-color: #ffa600;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1200 800'%3E%3Cdefs%3E%3CradialGradient id='a' cx='0' cy='800' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23e4ff00'/%3E%3Cstop offset='1' stop-color='%23e4ff00' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='b' cx='1200' cy='800' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%2333ff00'/%3E%3Cstop offset='1' stop-color='%2333ff00' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='c' cx='600' cy='0' r='600' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%2300ff42'/%3E%3Cstop offset='1' stop-color='%2300ff42' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='d' cx='600' cy='800' r='600' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23ffa600'/%3E%3Cstop offset='1' stop-color='%23ffa600' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='e' cx='0' cy='0' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%236fff00'/%3E%3Cstop offset='1' stop-color='%236fff00' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='f' cx='1200' cy='0' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%2300fff2'/%3E%3Cstop offset='1' stop-color='%2300fff2' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Crect fill='url(%23a)' width='1200' height='800'/%3E%3Crect fill='url(%23b)' width='1200' height='800'/%3E%3Crect fill='url(%23c)' width='1200' height='800'/%3E%3Crect fill='url(%23d)' width='1200' height='800'/%3E%3Crect fill='url(%23e)' width='1200' height='800'/%3E%3Crect fill='url(%23f)' width='1200' height='800'/%3E%3C/svg%3E");
    background-attachment: fixed;
    background-size: cover;*/
    /*opacity: 0.8;*/
    /*background: linear-gradient(1deg, #87dcff, #66cdf7, #42b0dd);*/
    background: linear-gradient(1deg, #43e5fb, #62fb43, #fbc743);
    background-size: 1000% 1000%;
    -webkit-animation: animFade 30s ease infinite;
    -moz-animation: animFade 30s ease infinite;
    animation: animFade 30s ease infinite;
    border-radius: .2em 1em 2em 3em;
    /*    rotation: 350deg;*/
}


.section-item {
    text-align: center;
    /*padding: 2em;*/
}

.section-item-logo {
    object-fit: cover;
    font-size: 12em;
    color: #444;
    background: linear-gradient(1deg, #43e5fb, #62fb43, #fbc743);
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 1000% 1000%;
    -webkit-animation: animFade 40s ease infinite;
    -moz-animation: animFade 40s ease infinite;
    animation: animFade 40s ease infinite;
    /*    rotation: 350deg;*/
    width: 100%;
    /*-webkit-text-stroke: .5px;*/
    /*    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;*/
}

.section-item-board {
    max-width: 36em;
    margin: 0 auto;
    padding-top: 1em;
    /*padding: 2em;*/
}

    .section-item-board a {
        background-color: transparent;
    }

.section-item-blurb {
    max-width: 36em;
    margin: 0 auto;
    margin-top: 1em;
    margin-bottom: 1em;
    padding: 1em;
    color: #222;
    display: table;
    /*background-color: #ffa600;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1200 800'%3E%3Cdefs%3E%3CradialGradient id='a' cx='0' cy='800' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23e4ff00'/%3E%3Cstop offset='1' stop-color='%23e4ff00' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='b' cx='1200' cy='800' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%2333ff00'/%3E%3Cstop offset='1' stop-color='%2333ff00' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='c' cx='600' cy='0' r='600' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%2300ff42'/%3E%3Cstop offset='1' stop-color='%2300ff42' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='d' cx='600' cy='800' r='600' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23ffa600'/%3E%3Cstop offset='1' stop-color='%23ffa600' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='e' cx='0' cy='0' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%236fff00'/%3E%3Cstop offset='1' stop-color='%236fff00' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='f' cx='1200' cy='0' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%2300fff2'/%3E%3Cstop offset='1' stop-color='%2300fff2' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Crect fill='url(%23a)' width='1200' height='800'/%3E%3Crect fill='url(%23b)' width='1200' height='800'/%3E%3Crect fill='url(%23c)' width='1200' height='800'/%3E%3Crect fill='url(%23d)' width='1200' height='800'/%3E%3Crect fill='url(%23e)' width='1200' height='800'/%3E%3Crect fill='url(%23f)' width='1200' height='800'/%3E%3C/svg%3E");
    background-attachment: fixed;
    background-size: cover;*/
    background: linear-gradient(1deg, #43e5fb, #62fb43, #fbc743);
    background-size: 1000% 1000%;
    -webkit-animation: animFade 40s ease infinite;
    -moz-animation: animFade 40s ease infinite;
    animation: animFade 40s ease infinite;
    border-radius: .2em 1em 2em 3em;
    /*    rotation: 350deg;*/
    min-height: 10em;
}

.section-item-area {
    /* max-width: 36em;*/
    margin: 0 auto;
    /*    margin-top: 1em;*/
    padding: 2em;
    color: #222;
    display: table;
    /*background-color: #ffa600;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1200 800'%3E%3Cdefs%3E%3CradialGradient id='a' cx='0' cy='800' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23e4ff00'/%3E%3Cstop offset='1' stop-color='%23e4ff00' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='b' cx='1200' cy='800' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%2333ff00'/%3E%3Cstop offset='1' stop-color='%2333ff00' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='c' cx='600' cy='0' r='600' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%2300ff42'/%3E%3Cstop offset='1' stop-color='%2300ff42' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='d' cx='600' cy='800' r='600' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23ffa600'/%3E%3Cstop offset='1' stop-color='%23ffa600' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='e' cx='0' cy='0' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%236fff00'/%3E%3Cstop offset='1' stop-color='%236fff00' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='f' cx='1200' cy='0' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%2300fff2'/%3E%3Cstop offset='1' stop-color='%2300fff2' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Crect fill='url(%23a)' width='1200' height='800'/%3E%3Crect fill='url(%23b)' width='1200' height='800'/%3E%3Crect fill='url(%23c)' width='1200' height='800'/%3E%3Crect fill='url(%23d)' width='1200' height='800'/%3E%3Crect fill='url(%23e)' width='1200' height='800'/%3E%3Crect fill='url(%23f)' width='1200' height='800'/%3E%3C/svg%3E");
    background-attachment: fixed;
    background-size: cover;*/
    background: linear-gradient(1deg, #43e5fb, #62fb43, #fbc743);
    background-size: 1000% 1000%;
    -webkit-animation: animFade 60s ease infinite;
    -moz-animation: animFade 60s ease infinite;
    animation: animFade 40s 60s infinite;
    border-radius: .1em .5em 1em 2em;
    /*    rotation: 350deg;*/
}



.section-action {
    font-size: 2.4em;
    font-family: 'toonishregular';
    background: url('/a/drawk/img/drawk-logo-512.png') no-repeat;
    background: linear-gradient(1deg, #43e5fb, #62fb43, #fbc743);
    background-size: 1000% 1000%;
    -webkit-animation: animFade 50s ease infinite;
    -moz-animation: animFade 50s ease infinite;
    animation: animFade 50s ease infinite;
    border-radius: .02em .1em .2em .3em;
/*    rotation: 350deg;*/
    padding: .5em;
    padding-left: 1em;
    padding-right: 1em;
    margin: .5em;
    display: inline-block;
    text-decoration: none;
}

    .section-action:hover {
        -webkit-animation: animFade 5s ease infinite;
        -moz-animation: animFade 5s ease infinite;
        animation: animFade 5s ease infinite;
        rotation: 10deg;
    }

.section-icon-logo {
    object-fit: cover;
    font-size: 6.4em;
    color: #444;
    background: linear-gradient(1deg, #43e5fb, #62fb43, #fbc743);
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 1000% 1000%;
    -webkit-animation: animFade 20s ease infinite;
    -moz-animation: animFade 20s ease infinite;
    animation: animFade 20s ease infinite;
/*    rotation: 350deg;*/
    width: 100%;
    /*-webkit-text-stroke: .5px;*/
/*    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;*/
}

    .section-icon-logo:hover {
        /*background: none;
        color: #444;
        background: linear-gradient(1deg, #43e5fb, #62fb43, #fbc743);
        background-size: 1000% 1000%;
        -webkit-animation: animFade 20s ease infinite;
        -moz-animation: animFade 20s ease infinite;
        animation: animFade 20s ease infinite;
        rotation: 350deg;
        width: 100%;*/
    }

.section-area-left {
    text-align: left;
}

.section-area-right {
    text-align: right;
}

.footer {
    padding: 2em;
    /*position: absolute;*/
    bottom: 0;
    width: 100%;
    background-color: #222;
    color: #ffffec;
    /*white-space: nowrap;*/
    /*line-height: 6em;*/ /* Vertically center the text there */
    text-align: center;
    opacity: 0.9;
}

    .footer a {
        margin: .5em;
    }

a.style-dark {
    color: #ffffec;
    background-color: transparent;
    /*    padding: .5em;*/
    font-weight: bold;
    display: inline-block;
}

    a.style-dark:hover {
        color: #333;
        background-color: #ffffec;
    }


.align-left {
    text-align: left;
}

.section-feature-bar {
}

ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

    ul li {
        list-style: none;
        padding-left: 1.9rem;
        text-indent: -1.9rem;
    }

        ul li::before, .list-item-emoji-star::before {
            object-fit: cover;
            color: #444;
            background: linear-gradient(1deg, #fbc743, #e5e5e5, #fbc743);
            background-clip: text;
            text-fill-color: transparent;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-size: 1000% 1000%;
            -webkit-animation: animFade 40s ease infinite;
            -moz-animation: animFade 40s ease infinite;
            animation: animFade 40s ease infinite;
/*            rotation: 350deg;*/
            width: 100%;
            /*-webkit-text-stroke: .5px;*/
/*            -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
            -webkit-transform: translate3d(0, 0, 0);
            -moz-transform: translate3d(0, 0, 0);
            -ms-transform: translate3d(0, 0, 0);
            -webkit-transition: all 1s ease-in-out;
            -moz-transition: all 1s ease-in-out;
            -o-transition: all 1s ease-in-out;
            -ms-transition: all 1s ease-in-out;
            transition: all 1s ease-in-out;*/
            content: "⭐ ";
        }

.list-item-emoji-star::before {
    content: "⭐ ";
}





.background-3 {
    --s: 111px; /* control the size */
    --c1: #212121;
    --c2: #1a1a1a;
    --_s: calc(2*var(--s)) calc(2*var(--s));
    --_g: var(--_s) conic-gradient(at 40% 40%,#0000 75%,var(--c1) 0);
    --_p: var(--_s) conic-gradient(at 20% 20%,#0000 75%,var(--c2) 0);
    background: calc( .9*var(--s)) calc( .9*var(--s))/var(--_p), calc(-.1*var(--s)) calc(-.1*var(--s))/var(--_p), calc( .7*var(--s)) calc( .7*var(--s))/var(--_g), calc(-.3*var(--s)) calc(-.3*var(--s))/var(--_g), conic-gradient(from 90deg at 20% 20%,var(--c2) 25%,var(--c1) 0) 0 0/var(--s) var(--s);
    animation: m 33s infinite;
}

@keyframes m {
    0% {
        background-position: calc( .9*var(--s)) calc( .9*var(--s)), calc(-.1*var(--s)) calc(-.1*var(--s)), calc( .7*var(--s)) calc( .7*var(--s)), calc(-.3*var(--s)) calc(-.3*var(--s)),0 0
    }

    25% {
        background-position: calc(1.9*var(--s)) calc( .9*var(--s)), calc(-1.1*var(--s)) calc(-.1*var(--s)), calc(1.7*var(--s)) calc( .7*var(--s)), calc(-1.3*var(--s)) calc(-.3*var(--s)),0 0
    }

    50% {
        background-position: calc(1.9*var(--s)) calc(-.1*var(--s)), calc(-1.1*var(--s)) calc( .9*var(--s)), calc(1.7*var(--s)) calc(-.3*var(--s)), calc(-1.3*var(--s)) calc( .7*var(--s)),0 0
    }

    75% {
        background-position: calc(2.9*var(--s)) calc(-.1*var(--s)), calc(-2.1*var(--s)) calc( .9*var(--s)), calc(2.7*var(--s)) calc(-.3*var(--s)), calc(-2.3*var(--s)) calc( .7*var(--s)),0 0
    }

    100% {
        background-position: calc(2.9*var(--s)) calc(-1.1*var(--s)), calc(-2.1*var(--s)) calc(1.9*var(--s)), calc(2.7*var(--s)) calc(-1.3*var(--s)), calc(-2.3*var(--s)) calc(1.7*var(--s)),0 0
    }
}



@media (min-width: 720px) {
    .page-container {
        font-size: 1.5em;
    }
}

@media (min-width: 960px) {
    .page-container {
        font-size: 1.7em;
    }
}

@media (max-width: 720px) {

    .page-container {
        font-size: 1.5em;
    }

    .section-feature-logo {
        font-size: 20em;
    }

    /*    .section-item-logo {
        font-size: 10em;
    }*/

    /*    .section-icon-logo {
        font-size: 4.8em;
    }*/
/*
    ul {
        margin: 2em;
        font-size: 1.4em;
        line-height: 1.1em;
    }

    li {
        margin: .3em
    }
*/
    p {
        font-size: 1.4em;
        line-height: 1.1em;
    }

    .section-area-left {
        text-align: center;
    }

    .section-area-right {
        text-align: center;
    }
}


@media (max-width: 500px) {

    .page-container {
        font-size: 1.3em;
    }

    .section-feature-logo {
        font-size: 18em;
    }
}

@media (max-width: 400px) {

    /*    .page-container {
        font-size: 1.1em;
    }*/

    /*    .section-feature-logo {
        font-size: 11em;
    }*/
}


@media (max-width: 300px) {
    /*
    .page-container {
        font-size: 1.0em;
    }*/
}




