.text-shadow-gray {
    text-shadow: 1px 1px gray;
}

.text-gd-rain {
    background: -webkit-linear-gradient(#eee, #333);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-gd-metal {
    background: -webkit-linear-gradient(#ffeeee, #ddefbb);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-gd-skyline {
    background: -webkit-linear-gradient(#2B32B2, #1488CC);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-gd-joomla {
    background: -webkit-linear-gradient(#2a5298, #1e3c72);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-gd-sun-cloud {
    background: -webkit-linear-gradient(#fe8c00, #f83600);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-gd-fm {
    background: -webkit-linear-gradient(#0072ff, #00c6ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.bg-gd-joomla {
    background: #1e3c72;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #2a5298, #1e3c72);
    /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #2a5298, #1e3c72);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.bg-gd-sun-cloud {
    background: #fe8c00;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #f83600, #fe8c00);
    /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #f83600, #fe8c00);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.bg-gd-fm {
    background: #00c6ff;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #0072ff, #00c6ff);
    /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #0072ff, #00c6ff);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.bg-gd-skyline {
    background: #1488CC;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #2B32B2, #1488CC);
    /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #2B32B2, #1488CC);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.bg-gd-azure {
    background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%);
}

.bg-gd-azure-smile {
    background-image: radial-gradient(circle 248px at center, #16d9e3 0%, #30c7ec 47%, #46aef7 100%);
}

.bg-gd-cristal-river {
    background-image: linear-gradient(-225deg, #22E1FF 0%, #1D8FE1 48%, #625EB1 100%);
}

.bg-gd-bluelagoo {
    background: #0052D4;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to bottom, #6FB1FC, #4364F7, #0052D4);
    /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to bottom, #6FB1FC, #4364F7, #0052D4);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.bg-gd-martini {
    background: #FDFC47;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #24FE41, #FDFC47);
    /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #24FE41, #FDFC47);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.bg-gd-behongo {
    background-image: linear-gradient(to right bottom, #05370e, #1d5215, #386e19, #578b1a, #7ba817);
}

.box-sh-sm {
    -webkit-box-shadow: -2px 7px 18px -6px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: -2px 7px 18px -6px rgba(0, 0, 0, 0.75);
    box-shadow: -2px 7px 18px -6px rgba(0, 0, 0, 0.75);
}

.br-5 {
    border-radius: 5px;
}

.br-10 {
    border-radius: 10px;
}

.btn-gd-lake {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 12px 24px;
    border: 1px solid #45a127;
    border-radius: 8px;
    background: #0c5700;
    background: -webkit-gradient(linear, left top, left bottom, from(#0c5700), to(#269945));
    background: -moz-linear-gradient(top, #0c5700, #269945);
    background: linear-gradient(to bottom, #0c5700, #269945);
    font: normal normal bold 20px arial;
    color: #ffffff;
    text-decoration: none;
}

.btn-gd-lake:hover,
.btn-gd-lake:focus {
    border: 1px solid #5ad133;
    background: #0e6800;
    background: -webkit-gradient(linear, left top, left bottom, from(#0e6800), to(#2eb853));
    background: -moz-linear-gradient(top, #0e6800, #2eb853);
    background: linear-gradient(to bottom, #0e6800, #2eb853);
    color: #ffffff;
    text-decoration: none;
}

.btn-gd-lake:active {
    background: #073400;
    background: -webkit-gradient(linear, left top, left bottom, from(#073400), to(#269945));
    background: -moz-linear-gradient(top, #073400, #269945);
    background: linear-gradient(to bottom, #073400, #269945);
}

.pt-60 {
    padding-top: 60px;
}

.btn-gd-primary {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 12px 24px;
    border: 1px solid #18609f;
    border-radius: 9px;
    background: #279cff;
    background: -webkit-gradient(linear, left top, left bottom, from(#279cff), to(#00294d));
    background: -moz-linear-gradient(top, #279cff, #00294d);
    background: linear-gradient(to bottom, #279cff, #00294d);
    text-shadow: #0f3c64 1px 1px 7px;
    font: normal normal bold 20px arial;
    color: #ffffff;
    text-decoration: none;
}

.btn-gd-primary:hover,
.btn-gd-primary:focus {
    border: 1px solid #1e78c7;
    background: #2fbbff;
    background: -webkit-gradient(linear, left top, left bottom, from(#2fbbff), to(#00315c));
    background: -moz-linear-gradient(top, #2fbbff, #00315c);
    background: linear-gradient(to bottom, #2fbbff, #00315c);
    color: #ffffff;
    text-decoration: none;
}

.btn-gd-primary:active {
    background: #18609f;
    background: -webkit-gradient(linear, left top, left bottom, from(#18609f), to(#00294d));
    background: -moz-linear-gradient(top, #18609f, #00294d);
    background: linear-gradient(to bottom, #18609f, #00294d);
}

.btn-gd-danger {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 12px 24px;
    border: 1px solid #706a6a;
    border-radius: 9px;
    background: #ff3030;
    background: -webkit-gradient(linear, left top, left bottom, from(#ff3030), to(#450000));
    background: -moz-linear-gradient(top, #ff3030, #450000);
    background: linear-gradient(to bottom, #ff3030, #450000);
    text-shadow: #000000 1px 1px 7px;
    font: normal normal bold 20px arial;
    color: #ffffff;
    text-decoration: none;
}

.btn-gd-danger:hover,
.btn-gd-danger:focus {
    border: 1px solid #928a8a;
    background: #ff3a3a;
    background: -webkit-gradient(linear, left top, left bottom, from(#ff3a3a), to(#530000));
    background: -moz-linear-gradient(top, #ff3a3a, #530000);
    background: linear-gradient(to bottom, #ff3a3a, #530000);
    color: #ffffff;
    text-decoration: none;
}

.btn-gd-danger:active {
    background: #a91a1a;
    background: -webkit-gradient(linear, left top, left bottom, from(#a91a1a), to(#450000));
    background: -moz-linear-gradient(top, #a91a1a, #450000);
    background: linear-gradient(to bottom, #a91a1a, #450000);
}

.btn-gd-success {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 12px 24px;
    border: 1px solid #459f18;
    border-radius: 9px;
    background: #70ff27;
    background: -webkit-gradient(linear, left top, left bottom, from(#70ff27), to(#287800));
    background: -moz-linear-gradient(top, #70ff27, #287800);
    background: linear-gradient(to bottom, #70ff27, #287800);
    text-shadow: #2b640f 1px 1px 7px;
    font: normal normal bold 20px arial;
    color: #ffffff;
    text-decoration: none;
}

.btn-gd-success:hover,
.btn-gd-success:focus {
    border: 1px solid #56c71e;
    background: #86ff2f;
    background: -webkit-gradient(linear, left top, left bottom, from(#86ff2f), to(#309000));
    background: -moz-linear-gradient(top, #86ff2f, #309000);
    background: linear-gradient(to bottom, #86ff2f, #309000);
    color: #ffffff;
    text-decoration: none;
}

.btn-gd-success:active {
    background: #459f18;
    background: -webkit-gradient(linear, left top, left bottom, from(#459f18), to(#287800));
    background: -moz-linear-gradient(top, #459f18, #287800);
    background: linear-gradient(to bottom, #459f18, #287800);
}

.btn-gd-warning {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 12px 24px;
    border: 1px solid #8b8215;
    border-radius: 9px;
    background: #f5e100;
    background: -webkit-gradient(linear, left top, left bottom, from(#f5e100), to(#777a12));
    background: -moz-linear-gradient(top, #f5e100, #777a12);
    background: linear-gradient(to bottom, #f5e100, #777a12);
    text-shadow: #645d0f 1px 1px 7px;
    font: normal normal bold 20px arial;
    color: #ffffff;
    text-decoration: none;
}

.btn-gd-warning:hover,
.btn-gd-warning:focus {
    border: 1px solid #c7b91e;
    background: #ffff00;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffff00), to(#8f9216));
    background: -moz-linear-gradient(top, #ffff00, #8f9216);
    background: linear-gradient(to bottom, #ffff00, #8f9216);
    color: #ffffff;
    text-decoration: none;
}

.btn-gd-warning:active {
    background: #938700;
    background: -webkit-gradient(linear, left top, left bottom, from(#938700), to(#777a12));
    background: -moz-linear-gradient(top, #938700, #777a12);
    background: linear-gradient(to bottom, #938700, #777a12);
}

.bg-gd-dusk {
    background: #EC34D8;
    background: linear-gradient(135deg, #EC34D8 0, #1152F7 100%)!important
}


/*.bg-gd-button {
    border-radius: 5px;
    background: #1152F7;
    background: linear-gradient(35deg, darkmagenta 0, #FFFFFF 100%)!important
}*/


/*.bg-gd-button:hover {
    border-radius: 5px;
    background: #FFFFFF;
    background: linear-gradient(35deg, darkred 0, #1152F7 100%)!important;
    cursor: pointer;
}*/

.cKKey {
    /* background styles */
    position: relative;
    display: inline-block;
    padding: 15px 25px;
    background-color: blue;
    /*for compatibility with older browsers*/
    background-image: linear-gradient(blue, lightblue);
    /* text styles */
    text-decoration: none;
    color: #fff;
    font-size: 25px;
    font-family: sans-serif;
    font-weight: 100;
}

.cKKey:after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: calc(100% - 4px);
    height: 50%;
    background: linear-gradient(rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.2));
}

.cKKey:hover {
    border-radius: 3px;
    box-shadow: 0px 1px 4px -2px #333;
    text-shadow: 0px -1px #333;
    background: linear-gradient(#073, #0fa);
}


/* loading transparent */

#cover-spin {
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.7);
    z-index: 999999999999;
    display: none;
}

@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

#cover-spin::after {
    content: '';
    display: block;
    position: absolute;
    left: 48%;
    top: 40%;
    width: 40px;
    height: 40px;
    border-style: solid;
    border-color: black;
    border-top-color: transparent;
    border-width: 4px;
    border-radius: 50%;
    -webkit-animation: spin .8s linear infinite;
    animation: spin .8s linear infinite;
}

#sidebar::-webkit-scrollbar {
    width: 5px;
}

#sidebar::-webkit-scrollbar-track {
    background-color: white;
}

#sidebar::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 10px rgba(15, 15, 218, 0.8);
    border-radius: 10px
}

#sidebar::-webkit-scrollbar-corner {
    width: 5px;
}