@media only screen and (min-width: 48rem) {
    .thin-only {
        display: none !important;
    }
}
@media only screen and (max-width: 48rem) {
    .wide-only {
        display: none !important;
    }
}

@media only screen and (max-width: 48rem) {
    .non-thin {
        display: none !important;
    }
}
@media only screen and (min-width: 48rem) and (max-width: 96rem) {
    .non-wide {
        display: none !important;
    }
}
@media only screen and (min-width: 96rem) {
    .non-giant {
        display: none !important;
    }
}

.never-show {
    display: none;
}

.font-large{
    font-size: 2.5rem;
}

.lift-0_5 {
    margin-top: -1.875rem;
}
.drop-0_5 {
    margin-top: 1.875rem;
}
.push-0_5 {
    margin-left: 1.875rem;
}
.pull-0_5 {
    margin-left: -1.875rem;
}

.lift-1 {
    margin-top: -3.75rem;
}
.drop-1 {
    margin-top: 3.75rem;
}
.push-1 {
    margin-left: 3.75rem;
}
.pull-1 {
    margin-left: -3.75rem;
}

.lift-1_5 {
    margin-top: -5.625rem;
}
.drop-1_5 {
    margin-top: 5.625rem;
}
.push-1_5 {
    margin-left: 5.625rem;
}
.pull-1_5 {
    margin-left: -5.625rem;
}

.lift-2 {
    margin-top: -7.5rem;
}
.drop-2 {
    margin-top: 7.5rem;
}
.push-2 {
    left: calc(50% + 7.5rem);
    /*margin-left: 7.5rem;*/
}
.pull-2 {
    margin-left: -7.5rem;
}

.lift-2_5 {
    margin-top: -9.375rem;
}
.drop-2_5 {
    margin-top: 9.375rem;
}
.push-2_5 {
    margin-left: 9.375rem;
}
.pull-2_5 {
    margin-left: -9.375rem;
}

.lift-3 {
    margin-top: -11.25rem;
}
.drop-3 {
    margin-top: 11.25rem;
}
.push-3 {
    left: calc(50% + 11.25rem);
    /*margin-left: 11.25rem;*/
}
.pull-3 {
    margin-left: -11.25rem;
}

.lift-3_5 {
    margin-top: -13.125rem;
}
.drop-3_5 {
    margin-top: 13.125rem;
}
.push-3_5 {
    left: calc(50% + 13.125rem);
    /*margin-left: 13.125rem;*/
}
.pull-3_5 {
    margin-left: -13.125rem;
}

.lift-4 {
    margin-top: -15rem;
}
.drop-4 {
    margin-top: 15rem;
}
.push-4 {
    margin-left: 15rem;
}
.pull-4 {
    margin-left: -15rem;
}

.lift-4_5 {
    margin-top: -16.875rem;
}
.drop-4_5 {
    margin-top: 16.875rem;
}
.push-4_5 {
    margin-left: 16.875rem;
}
.pull-4_5 {
    margin-left: -16.875rem;
}

.lift-5 {
    margin-top: -18.75rem;
}
.drop-5 {
    margin-top: 18.75rem;
}
.push-5 {
    margin-left: 18.75rem;
}
.pull-5 {
    margin-left: -18.75rem;
}

.lift-5_5 {
    margin-top: -20.625rem;
}
.drop-5_5 {
    margin-top: 20.625rem;
}
.push-5_5 {
    margin-left: 20.625rem;
}
.pull-5_5 {
    margin-left: -20.625rem;
}

.lift-6 {
    margin-top: -22.5rem;
}
.drop-6 {
    margin-top: 22.5rem;
}
.push-6 {
    margin-left: 22.5rem;
}
.pull-6 {
    margin-left: -22.5rem;
}

.lift-6_5 {
    margin-top: -24.375rem;
}
.drop-6_5 {
    margin-top: 24.375rem;
}
.push-6_5 {
    margin-left: 24.375rem;
}
.pull-6_5 {
    margin-left: -24.375rem;
}

.lift-7 {
    margin-top: -26.25rem;
}
.drop-7 {
    margin-top: 26.25rem;
}
.push-7 {
    margin-left: 26.25rem;
}
.pull-7 {
    margin-left: -26.25rem;
}

.lift-7_5 {
    margin-top: -28.125rem;
}
.drop-7_5 {
    margin-top: 28.125rem;
}
.push-7_5 {
    margin-left: 28.125rem;
}
.pull-7_5 {
    margin-left: -28.125rem;
}

.lift-8 {
    margin-top: -30rem;
}
.drop-8 {
    margin-top: 30rem;
}
.push-8 {
    margin-left: 30rem;
}
.pull-8 {
    margin-left: -30rem;
}

.lift-8_5 {
    margin-top: -31.875rem;
}
.drop-8_5 {
    margin-top: 31.875rem;
}
.push-8_5 {
    margin-left: 31.875rem;
}
.pull-8_5 {
    margin-left: -31.875rem;
}

.lift-9 {
    margin-top: -33.75rem;
}
.drop-9 {
    margin-top: 33.75rem;
}
.push-9 {
    margin-left: 33.75rem;
}
.pull-9 {
    margin-left: -33.75rem;
}

.lift-9_5 {
    margin-top: -35.625rem;
}
.drop-9_5 {
    margin-top: 35.625rem;
}
.push-9_5 {
    margin-left: 35.625rem;
}
.pull-9_5 {
    margin-left: -35.625rem;
}

.lift-10 {
    margin-top: -37.5rem;
}
.drop-10 {
    margin-top: 37.5rem;
}
.push-10 {
    margin-left: 37.5rem;
}
.pull-10 {
    margin-left: -37.5rem;
}

.lift-10_5 {
    margin-top: -39.375rem;
}
.drop-10_5 {
    margin-top: 39.375rem;
}
.push-10_5 {
    margin-left: 39.375rem;
}
.pull-10_5 {
    margin-left: -39.375rem;
}

.lift-11 {
    margin-top: -41.25rem;
}
.drop-11 {
    margin-top: 41.25rem;
}
.push-11 {
    margin-left: 41.25rem;
}
.pull-11 {
    margin-left: -41.25rem;
}

.lift-11_5 {
    margin-top: -43.125rem;
}
.drop-11_5 {
    margin-top: 43.125rem;
}
.push-11_5 {
    margin-left: 43.125rem;
}
.pull-11_5 {
    margin-left: -43.125rem;
}

.lift-12 {
    margin-top: -45rem;
}
.drop-12 {
    margin-top: 45rem;
}
.push-12 {
    margin-left: 45rem;
}
.pull-12 {
    margin-left: -45rem;
}

.lift-12_5 {
    margin-top: -46.875rem;
}
.drop-12_5 {
    margin-top: 46.875rem;
}
.push-12_5 {
    margin-left: 46.875rem;
}
.pull-12_5 {
    margin-left: -46.875rem;
}

.lift-13 {
    margin-top: -48.75rem;
}
.drop-13 {
    margin-top: 48.75rem;
}
.push-13 {
    margin-left: 48.75rem;
}
.pull-13 {
    margin-left: -48.75rem;
}

.lift-14 {
    margin-top: -52.5rem;
}
.drop-14 {
    margin-top: 52.5rem;
}
.push-14 {
    margin-left: 52.5rem;
}
.pull-14 {
    margin-left: -52.5rem;
}

.lift-14_5 {
    margin-top: -54.375rem;
}
.drop-14_5 {
    margin-top: 54.375rem;
}
.push-14_5 {
    margin-left: 54.375rem;
}
.pull-14_5 {
    margin-left: -54.375rem;
}

.lift-15 {
    margin-top: -56.25rem;
}
.drop-15 {
    margin-top: 56.25rem;
}
.push-15 {
    margin-left: 56.25rem;
}
.pull-15 {
    margin-left: -56.25rem;
}

.lift-16 {
    margin-top: -60rem;
}
.drop-16 {
    margin-top: 60rem;
}
.push-16 {
    margin-left: 60rem;
}
.pull-16 {
    margin-left: -60rem;
}

.lift-20 {
    margin-top: -75rem;
}
.drop-20 {
    margin-top: 75rem;
}
.push-20 {
    margin-left: 75rem;
}
.pull-20 {
    margin-left: -75rem;
}

.lift-24 {
    margin-top: -90rem;
}
.drop-24 {
    margin-top: 90rem;
}
.push-24 {
    margin-left: 90rem;
}
.pull-24 {
    margin-left: -90rem;
}

.lift-28 {
    margin-top: -105rem;
}
.drop-28 {
    margin-top: 105rem;
}
.push-28 {
    margin-left: 105rem;
}
.pull-28 {
    margin-left: -105rem;
}

.lift-29 {
    margin-top: -108.75rem;
}
.drop-29 {
    margin-top: 108.75rem;
}
.push-29 {
    margin-left: 108.75rem;
}
.pull-29 {
    margin-left: -108.75rem;
}

.lift-30 {
    margin-top: -112.5rem;
}
.drop-30 {
    margin-top: 112.5rem;
}
.push-30 {
    margin-left: 112.5rem;
}
.pull-30 {
    margin-left: -112.5rem;
}

.lift-31 {
    margin-top: -116.25rem;
}
.drop-31 {
    margin-top: 116.25rem;
}
.push-31 {
    margin-left: 116.25rem;
}
.pull-31 {
    margin-left: -116.25rem;
}

.lift-40 {
    margin-top: -150rem;
}
.drop-40 {
    margin-top: 150rem;
}
.push-40 {
    margin-left: 150rem;
}
.pull-40 {
    margin-left: -150rem;
}

.lift-47_5 {
    margin-top: -178.125rem;
}
.drop-47_5 {
    margin-top: 178.125rem;
}
.push-47_5 {
    margin-left: 178.125rem;
}
.pull-47_5 {
    margin-left: -178.125rem;
}

/* Buttons and Such */
.color-pink {
    background-color: #eb4474 !important;
    border-bottom-color: #a53453;
}

.color-blue {
    background-color: #6a77f2 !important;
}

.color-green {
    background-color: #33b98a !important;
    border-bottom-color: #3d8d71;
}

.color-pink, .color-green {
    border-bottom-style: solid;
    border-bottom-width: 0.0625rem;
}
 
.outline-blue {
    border: solid 0.25rem #6a77f2 !important;
}
.outline-purple {
    border: solid 0.25rem #4444be !important;
}
.outline-pink {
    border: solid 0.25rem #e74a76 !important;
}

@media only screen and (max-width: 48rem) {
    .outline-blue,
    .outline-purple,
    .outline-pink {
        border-width: 0.1875rem !important;
    }
}


/* Animated States */
.color-pink,
.color-blue,
.color-green  {
    color: #ffffff;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
}

.color-pink:hover:not(:disabled) {
    color: white !important;
    background-color: #ff5284 !important;
}
.color-blue:hover:not(:disabled) {
    color: white !important;
    background-color: #7e84ff !important;
}
.color-green:hover:not(:disabled) {
    color: white !important;
    background-color: #36c995 !important;
}
.rounded-button.color-pink:hover:not(:disabled),
.rounded-button.color-blue:hover:not(:disabled),
.rounded-button.color-green:hover:not(:disabled) {
    -webkit-transform: translateY(-0.1875rem);
    transform: translateY(-0.1875rem);
    box-shadow: 0 0.5rem 0.75rem 0 rgba(12, 12, 14, 0.08);
}
.color-blue:active:not(:disabled) {
    background-color: #5d6cd6 !important;
}
.color-pink:active:not(:disabled) {
    background-color: #d24069 !important;
}
.color-green:active:not(:disabled) {
    background-color: #33b98a !important;
}
.color-pink:active:not(:disabled),
.color-blue:active:not(:disabled),
.color-green:active:not(:disabled) {
    -webkit-transition-property: none;
    transition-property: none;
    -webkit-transform: scale(0.96) !important;
    transform: scale(0.96) !important;
    color: #d8d8d8 !important;
}
.rounded-button.color-pink:active:not(:disabled),
.rounded-button.color-blue:active:not(:disabled),
.rounded-button.color-green:hover:not(:disabled) {
    box-shadow: none;
}

.outline-blue,
.outline-purple,
.outline-pink {
    position: relative;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    -webkit-transition-duration: 0.08s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
}
.outline-blue:hover:not(:disabled) {
    background: #6a77f2 !important;
}
.outline-purple:hover:not(:disabled) {
    background: #4444be !important;
}
.outline-pink:hover:not(:disabled) {
    background: #e74a76 !important;
}
.outline-blue:hover:not(:disabled),
.outline-purple:hover:not(:disabled),
.outline-pink:hover:not(:disabled) {
    color: white !important;
}
.outline-blue:active:not(:disabled),
.outline-purple:active:not(:disabled),
.outline-pink:active:not(:disabled) {
    -webkit-transition-property: none;
    transition-property: none;
    color: #d8d8d8 !important;
    -webkit-transform: scale(0.96);
    transform: scale(0.96);
}
.outline-blue:active:not(:disabled) {
    background: #5d6cd6 !important;
    border-color: #5d6cd6 !important;
}
.outline-purple:active:not(:disabled) {
    background: #4142a7 !important;
    border-color: #4142a7 !important;
}
.outline-pink:active:not(:disabled) {
    background: #d24069 !important;
    border-color: #d24069 !important;
}


.fill-purple {
    background-color: #4444be;
}

.fill-blue {
    background-color: #6a77f2;
}

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

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

.text-underline {
    text-decoration: underline;
}
