.element {
    background: linear-gradient(-45deg, rgba(0, 0, 0, 0.22), rgba(255, 255, 255, 0.25));
    box-shadow: 12px 12px 16px 0 rgba(0, 0, 0, 0.5), -8px -8px 12px 0 rgba(255, 255, 255, 0.5);
    border-radius: 15px;
    border-style: none;
}

.element-low {
    background: linear-gradient(-45deg, rgba(0, 0, 0, 0.22), rgba(255, 255, 255, 0.25));
    box-shadow: 12px 12px 16px 0 rgba(0, 0, 0, 0.3), -8px -8px 12px 0 rgba(255, 255, 255, 0.35);
    border-radius: 5px;
    border-style: none;
}

.element-text-black {
    filter: drop-shadow(-1mm 0mm 0.6mm rgb(0, 0, 0));
}

.element-text-white {
    filter: drop-shadow(-1mm 0mm 0.6mm rgb(255, 255, 255));
}

.element-flat-gray {
    background: #4b4b4b;
}

.element-flat-steel {
    background: #8e9eab;
}

.element-flat-white {
    background-image: linear-gradient(white, white);
}

.element-flat-blue {
    background: #5D9B9D;
}

.element-flat-king {
    background: #f5af19;
}

.element-flat-queen {
    background: #55E6C1;
}

.element-flat-cyan {
    background: #41c7af;
}

.element-flat-violet {
    background: #a18594;
}

.element-flat-yellow {
    background: #fdfd96;
}

.element-flat-green {
    background: #3bb43b;
}

.element-flat-red {
    background: #f12711;
}

.element-flat-orange {
    background: #ffb347;
}

.element-flat-rose {
    background: #df4c73;
}

.element-flat-transparent {
    background: transparent;
}

.element-flat-gradient-blue {
    background-image: linear-gradient(120deg, #70e1f5 0%, #ffd194 100%);
}

.element-flat-gradient-aralo {
    background-image: linear-gradient(90deg, #ff5e00, #ff3000);
}

.element-flat-gradient-aralo-mailbox {
    background-image: linear-gradient(90deg, #ff5e00, #ffc21b);
}

.element-flat-gradient-sky {
    background-image: linear-gradient(120deg, #E0EAFC 0%, #CFDEF3 100%);
}

.element-flat-gradient-blue-180 {
    background-image: linear-gradient(180deg, #70e1f5 0%, #ffd194 100%);
}

.element-flat-gradient-red {
    background-image: linear-gradient(120deg, #ee4431 0%, #e75c98 100%);
}

.element-flat-gradient-red-180 {
    background-image: linear-gradient(180deg, #ee4431 0%, #e75c98 100%);
}

.element-flat-gradient-yellow {
    background-image: linear-gradient(120deg, #ecf840 0%, #ffae00 100%);
}

.element-flat-gradient-yellow-180 {
    background-image: linear-gradient(180deg, #ecf840 0%, #ffae00 100%);
}

.element-flat-gradient-gray {
    background-image: linear-gradient(120deg, #283048 0%, #859398 100%);
}

.element-flat-gradient-green {
    background-image: linear-gradient(120deg, #414d0b 0%, #727a17 100%);
}

.element-flat-gradient-dracaris {
    background-image: linear-gradient(120deg, #FC354C 0%, #0ABFBC 100%);
}

.element-flat-gradient-sirius {
    background-image: linear-gradient(120deg, #EFEFBB 0%, #D4D3DD 100%);
}

.element-flat-gradient-moor {
    background-image: linear-gradient(120deg, #616161 0%, #9bc5c3 100%);
}

.element-flat-gradient-cyan {
    background-image: linear-gradient(120deg, #64e38e 0%, #41c7af 100%);
}

.element-flat-gradient-strain {
    background-image: linear-gradient(120deg, #870000 0%, #190A05 100%);
}

.element-flat-gradient-ash {
    background-image: linear-gradient(120deg, #606c88 0%, #3f4c6b 100%);
}

.element-flat-gradient-forget {
    background-image: linear-gradient(120deg, #FF4E50 0%, #F9D423 100%);
}

.element-flat-gradient-teal {
    background-image: linear-gradient(120deg, #AAFFA9 0%, #11FFBD 100%);
}

.element-flat-gradient-crystal {
    background-image: linear-gradient(120deg, #159957 0%, #155799 100%);
}

.element-flat-gradient-moonlit {
    background-image: linear-gradient(to left, #2C5364, #203A43, #0F2027);
}

.element-flat-gradient-deepspace {
    background-image: linear-gradient(to bottom, #434343, #203A43, #000000);
}

.element-flat-gradient-deepspace120 {
    background-image: linear-gradient(to right, #434343, #203A43, #000000);
}

.element-flat-gradient-deepspace240 {
    background-image: linear-gradient(to left, #434343, #203A43, #000000);
}

.element-flat-gradient-petrol {
    background-image: linear-gradient(to bottom, #BBD2C5, #8c9da7, #536976);
}

.element-flat-gradient-quepal {
    background-image: linear-gradient(240deg, #11998e, #38ef7d);
}

.element-flat-gradient-sin {
    background-image: linear-gradient(120deg, #ED213A, #93291E);
}

.element-flat-gradient-loveliberty {
    background-image: linear-gradient(120deg, #6f0000, #93291E);
}

.element-flat-gradient-blueberry {
    background-image: linear-gradient(120deg, #00B4DB, #0083B0);
}

.element-flat-gradient-dull {
    background-image: linear-gradient(120deg, #C9D6FF, #E2E2E2);
}

.element-flat-gradient-orca {
    background-image: linear-gradient(120deg, #44A08D, #0d5a5c);
}

.element-flat-gradient-midnight {
    background-image: linear-gradient(120deg, #232526, #414345);
}

.element-flat-gradient-deepsea {
    background-image: linear-gradient(240deg, #2C3E50, #4CA1AF);
}

.element-flat-gradient-royal {
    background-image: linear-gradient(120deg, #141E30, #243B55);
}

.element-flat-gradient-lush {
    background-image: linear-gradient(120deg, #56ab2f, #a8e063);
}

.element-blurred {
    filter: blur(1px) opacity(85%);
    border-radius: 5px;
}

.element-convex {
    border-radius: 6px;
    background: linear-gradient(145deg, #ffffff13, #e6e6e61e);
    box-shadow: 5px 5px 12px #666666, -5px -5px 12px #ffffff;
}

.element-convex-dark {
    border-radius: 6px;
    background: linear-gradient(145deg, #ffffff13, #e6e6e61e);
    box-shadow: 5px 5px 12px #666666, -5px -5px 12px #666666;
}

.element-concave {
    border-radius: 6px;
    /*background: linear-gradient(145deg, #ffffff31, #e6e6e638);*/
    box-shadow: inset 2px 2px 12px #666666, inset -2px -2px 12px #ffffff;
}

.element-TopLeft {
    box-shadow: 12px 12px 16px 0 rgba(0, 0, 0, 0.5), -8px -8px 12px 0 rgba(255, 255, 255, 0.6);
}

.element-TopRight {
    box-shadow: -8px 8px 12px 0 rgba(0, 0, 0, 0.6), 12px -12px 16px rgba(255, 255, 255, 0.5);
}

.element-BottomRight {
    box-shadow: -8px -8px 12px 0 rgba(0, 0, 0, 0.6), 12px 12px 16px rgba(255, 255, 255, 0.5);
}

.element-BottomLeft {
    box-shadow: 8px -8px 12px 0 rgba(0, 0, 0, 0.6), -12px 12px 16px rgba(255, 255, 255, 0.5);
}

.element-DropShadow {
    box-shadow: 12px 12px 16px 0 rgba(0, 0, 0, 0.5), -8px -8px 12px 0 rgba(255, 255, 255, 0.6);
    border-radius: 5px;
}

.element-InsetShadow {
    box-shadow: inset 6px 6px 17px #00000083, inset -6px -6px 17px #ffffff7e;
    border-radius: 5px;
}

.element-insetShadow-dark {
    box-shadow: inset 6px 6px 17px #00000083, inset -6px -6px 17px #00000083;
    border-radius: 5px;
}