:root {
 --color-60-lighter:#fff;
 --color-60-transp:hsl(11, 65%, 10%);
 --color-60-light:#edfdee;
 --color-60-medium-light:#31323b;
 --color-60-medium:#2b2c3b;
 --color-60-medium-dark:#1c1d26;
 --color-60-dark:#171820;
 --color-30-1:hsla(0,0%,100%,0.8);
 --color-accent-main:#ff6663;
 --color-accent-main-lighter:#ff7370;
 --color-accent-sec:#ed502e;
 --color-accent-sec-lighter:#0edfb5;
 --border-color:#eceeef;
 --color-illustration:#5626a9;
 --color-illustration-light:#6635bb;
 --initial-color-overlay:rgba(31,31,31,0.4);
 --mid-colour-overlay:rgba(31,31,31,0.6);
 --final-colour-overlay:#1f1f1f;
 --tool-color:var(--color-accent-sec);
 --tool-name-color:var(--color-60-transp);
 --toolbox-header-color:var(--color-60-transp);
}

.tool {
 background-color:var(--tool-bg-color)
}
.tool svg {
 fill:var(--tool-color)
}
.tool span {
 color:var(--tool-name-color)
}
.tool h5 {
 color:var(--toolbox-header-color)
}

svg {
 transition:transform .2s ease-in;
}
.open svg {
 transform:rotate(180deg)
}

svg,
video {
 display:block;
 vertical-align:middle;
}
.inline-block {
 display:inline-block
}
.flex {
 display:flex
}
.inline-flex {
 display:inline-flex
}
.table {
 display:table
}
.grid {
 display:grid
}
.hidden {
 display:none
}
.flex-row {
 flex-direction:row
}
.flex-col {
 flex-direction:column
}
.flex-wrap {
 flex-wrap:wrap
}
.items-center {
 align-items:center
}
.items-baseline {
 align-items:baseline
}
.justify-start {
 justify-content:flex-start
}
.justify-end {
 justify-content:flex-end;
}
.justify-center {
 justify-content:center
}
.justify-between {
 justify-content:space-between
}
.justify-around {
 justify-content:space-around
}
.font-light {
 font-weight:300
}
.font-medium {
 font-weight:500
}
.font-semibold {
 font-weight:600
}
.font-bold {
 font-weight:700
}
.font-extrabold {
 font-weight:800
}
.font-black {
 font-weight:900
}
.h-4 {
 height:1rem
}
.h-8 {
 height:2rem;
}
.h-10 {
 height:2.5rem
}
.h-12 {
 height:3rem
}
.h-14 {
 height:3.5rem
}
.h-17 {
 height:4.25rem
}
.h-28 {
 height:7rem
}

.m-2 {
 margin:.5rem
}
.m-4 {
 margin:1rem
}
.my-2 {
 margin-top:.5rem;
 margin-bottom:.5rem
}
.mx-2 {
 margin-left:.5rem;
 margin-right:.5rem
}
.mx-4 {
 margin-left:1rem;
 margin-right:1rem
}
.mx-6 {
 margin-left:1.5rem;
 margin-right:1.5rem
}
.my-8 {
 margin-top:2rem;
 margin-bottom:2rem
}
.my-12 {
 margin-top:3rem;
 margin-bottom:3rem
}
.my-16 {
 margin-top:4rem;
 margin-bottom:4rem
}
.my-20 {
 margin-top:5rem;
 margin-bottom:5rem
}

.my-auto {
 margin-top:auto;
 margin-bottom:auto
}
.mx-auto {
 margin-left:auto;
 margin-right:auto
}
.-mx-4 {
 margin-left:-1rem;
 margin-right:-1rem
}
.mt-0 {
 margin-top:0
}
.mb-0 {
 margin-bottom:0
}
.mb-1 {
 margin-bottom:.25rem
}
.mr-2 {
 margin-right:.5rem
}
.mb-2 {
 margin-bottom:.5rem
}
.ml-2 {
 margin-left:.5rem
}
.mt-3 {
 margin-top:.75rem
}
.mb-3 {
 margin-bottom:.75rem
}
.mt-4 {
 margin-top:1rem
}
.mr-4 {
 margin-right:1rem
}
.mb-4 {
 margin-bottom:1rem
}
.ml-4 {
 margin-left:1rem
}
.mt-6 {
 margin-top:1.5rem
}
.mb-6 {
 margin-bottom:1.5rem
}
.mt-10 {
 margin-top:2.5rem
}
.ml-10 {
 margin-left:2.5rem
}
.mb-12 {
 margin-bottom:3rem
}
.mt-16 {
 margin-top:4rem
}
.mb-20 {
 margin-bottom:5rem
}

.p-2 {
 padding:.5rem
}
.p-3 {
 padding:.75rem
}
.p-4 {
 padding:1rem;
}
.p-6 {
 padding:1.5rem
}
.p-8 {
 padding:2rem
}
.p-16 {
 padding:4rem
}
.py-1 {
 padding-top:.25rem;
 padding-bottom:.25rem
}
.py-2 {
 padding-top:.5rem;
 padding-bottom:.5rem
}
.py-4 {
 padding-top:1rem;
 padding-bottom:1rem
}
.px-4 {
 padding-left:1rem;
 padding-right:1rem
}
.px-6 {
 padding-left:1.5rem;
 padding-right:1.5rem
}
.py-8 {
 padding-top:2rem;

}
.px-8 {
 padding-left:2rem;
 padding-right:2rem
}
.py-12 {
 padding-top:3rem;
 padding-bottom:3rem
}
.pt-0 {
 padding-top:0
}
.pt-1 {
 padding-top:.25rem
}
.pt-2 {
 padding-top:.5rem
}
.pb-2 {
 padding-bottom:.5rem
}
.pl-2 {
 padding-left:.5rem
}
.pt-4 {
 padding-top:1rem
}
.pb-4 {
 padding-bottom:1rem
}
.pl-4 {
 padding-left:1rem
}
.pr-6 {
 padding-right:1.5rem
}
.pr-8 {
 padding-right:2rem
}
.pb-8 {
 padding-bottom:2rem
}
.pl-8 {
 padding-left:2rem
}
.pt-12 {
 padding-top:3rem
}

.svg-inline--fa.fa-w-11 {
 width:.6875em
}
.svg-inline--fa.fa-w-12 {
 width:.75em
}
.svg-inline--fa.fa-w-13 {
 width:.8125em
}
.svg-inline--fa.fa-w-14 {
 width:.875em
}
.svg-inline--fa.fa-w-15 {
 width:.9375em
}
.svg-inline--fa.fa-w-16 {
 width:1em
}
.svg-inline--fa.fa-w-17 {
 width:1.0625em
}
.svg-inline--fa.fa-w-18 {
 width:1.125em
}
.svg-inline--fa.fa-w-19 {
 width:1.1875em
}
.svg-inline--fa.fa-w-20 {
 width:1.25em
}
.svg-inline--fa.fa-pull-left {
 margin-right:.3em;
 width:auto
}
.svg-inline--fa.fa-pull-right {
 margin-left:.3em;
 width:auto
}
.svg-inline--fa.fa-border {
 height:1.5em
}
.svg-inline--fa.fa-li {
 width:2em
}
.svg-inline--fa.fa-fw {
 width:1.25em
}

.shadow-sm {
    box-shadow: 0 .125rem .25rem .321rem rgba(237, 80, 46, .095)!important;
}
