/* btn */
a.btn {
    color: #fff; /* цвет текста */
    text-decoration: none; /* убирать подчёркивание у ссылок */
    user-select: none; /* убирать выделение текста */
    background: rgb(212,75,56); /* фон кнопки */
    padding: .7em 1.5em; /* отступ от текста */
    outline: none; /* убирать контур в Mozilla */
}
a.btn:hover {
    background: rgb(232,95,76);
} /* при наведении курсора мышки */
a.btn:active {
    background: rgb(152,15,0);
} /* при нажатии */

/* knopka01 */
a.knopka01 {
    display: inline-block;
    width: 100px;
    height: 50px;
    line-height: 50px;
    font-size: 20px;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 1px rgba(255,255,255,.2), 0 -1px rgba(0,0,0,.8);
    outline: none;
    border: none;
    border-radius: 100px;
    background: rgb(28,107,114) radial-gradient(150% 100% at 50% 5px, rgba(255,255,255,.2), rgba(0,0,0,0));
    box-shadow: inset rgba(0,0,0,.6) 0 -2px 5px, inset rgba(252,255,255,.7) 0 2px 5px, rgba(0,0,0,.8) 0 2px 5px -1px;
    color: rgb(0,79,86);
    user-select: none;
}
a.knopka01:hover {
    color: rgb(0,59,66);
    cursor: pointer;
}
a.knopka01:active {
    padding-bottom: 1px;
    box-shadow:
            inset rgba(0,0,0,1) 0 1px 3px,
            inset rgba(0,0,0,.6) 0 -2px 5px,
            inset rgba(252,255,255,.7) 0 2px 5px,
            0 1px rgba(255,255,255,.08);
    color: rgb(128,207,214);
}

/* boxShadow4 */
a.boxShadow4 {
    display: inline-block;
    font-size: 24px;
    font-weight: bold;
    color: rgba(255,255,255,.6);
    text-shadow: 1px 1px rgba(0,0,0,.3);
    text-decoration: none;
    padding: 20px;
    border-radius: 15px;
    background: rgb(10,120,10);
    box-shadow:
            inset 0 0 3px 1px rgba(0,0,0,.8),
            inset rgba(0,0,0,.3) -5px -5px 8px 5px,
            inset rgba(255,255,255,.5) 5px 5px 8px 5px,
            1px 1px 1px rgba(255,255,255,.1),
            -2px -2px 5px rgba(0,0,0,.5);
    transition: .2s;
}
a.boxShadow4:hover {
    color: rgba(255,255,255,.9);
    background: rgb(20,130,20);
}
a.boxShadow4:active {
    background: rgb(0,110,0);
    box-shadow:
            inset 0 0 5px 3px rgba(0,0,0,.8),
            inset rgba(0,0,0,.3) -5px -5px 8px 5px,
            inset rgba(255,255,255,.5) 5px 5px 8px 5px,
            1px 1px 1px rgba(255,255,255,.2),
            -2px -2px 5px rgba(0,0,0,.5);
}

/* button */
a.button {
    position: relative;
    display: inline-block;
    font-size: 24px;
    font-weight: bold;
    color: hsl(88, 70%, 30%);
    text-shadow: rgba(255,255,255,.5) 0 -1px 0, rgba(0,0,0,.2) 0 .18em .15em;
    text-decoration: none;
    user-select: none;
    margin: .5em;
    padding: .5em .6em .4em .6em;
    border-radius: 8px;
    border-top: 1px solid rgba(255,255,255,.1);
    border-bottom: 1px solid rgba(0,0,0,.1);
    outline: none;
    background: #a2cf70 radial-gradient(rgba(255,255,255,0), rgba(255,255,255,.5));
    box-shadow:
            inset rgba(255,255,255,.6) 0 .3em .3em,
            inset rgba(0,0,0,.2) 0 -.1em .3em,
            rgb(128,161,103) 0 7px 1px,
            rgba(0,0,0,.2) 0 .5em 5px;
    transition: background .2s ease-in-out;
}
a.button:hover {
    background-color: hsl(88, 70%, 75%);
}
a.button:active {
    top: .2em;
    color: rgba(254,255,255,.9);
    text-shadow: rgba(0,0,0,.2) 0 1px 2px;
    box-shadow:
            inset rgba(255,255,255,.6) 0 .3em .3em,
            inset rgba(0,0,0,.2) 0 -.1em .3em,
            rgba(0,0,0,.4) 0 .1em 1px,
            rgba(0,0,0,.3) 0 .2em 6px;
}
a.button:after {
    content:  "";
    position:  absolute;
    width:   90%;
    height:  60%;
    top:   0;
    left:   5%;
    border-radius:    .5em .5em 1em 1em / .5em .5em 2em 2em;
    background-image: linear-gradient(rgba(255,255,255,.55), rgba(255,255,255,.3));
}
a.button:active:after {
    opacity: .6;
}

/* button1 */
a.button1 {
    position: relative;
    color: white;
    font-weight: bold;
    text-decoration: none;
    text-shadow: -1px -1px #000;
    user-select: none;
    padding: .8em 2em;
    outline: none;
    background-color: #000;
    background-image: linear-gradient(45deg, rgba(255,255,255,.0) 30%, rgba(255,255,255,.8), rgba(255,255,255,.0) 70%), radial-gradient(190% 100% at 50% 0%, rgba(255,255,255,.7) 0%, rgba(255,255,255,.5) 50%, rgba(0,0,0,0) 50%);
    background-repeat: no-repeat;
    background-size: 200% 100%, auto;
    background-position: 200% 0, 0 0;
    box-shadow: rgba(0,0,0,.3) 0 2px 5px;
}
a.button1:active {
    top: 1px;
    box-shadow: none;
}
a.button1:hover {
    transition: .5s linear;
    background-position: -200% 0, 0 0;
}

/* button2 */
a.button2, a.button2:before {
    display: inline-block;
    font-size: 20px;
    color: #fff;
    text-decoration: none;
    padding: 8px 15px;
    border-radius: 100px;
    border: solid rgb(4,88,192);
    border-width: 3px 10px;
    outline: none;
    opacity: 1;
    transition: .6s, opacity 0s 9999999s, visibility 0s 9999999s;
}
a.button2 {
    position: relative;
    padding: calc(8px + 3px - 1px) calc(15px + 10px - 1px);
    border: 1px solid rgba(62,153,239,.5);
    background: linear-gradient(to left, rgb(62,153,239) 1%, #fff 3%, rgb(44,135,232) 8%, rgba(255,255,255,.3) 50%, rgb(44,135,232) 92%, #fff 97%, rgb(62,153,239) 99%) no-repeat;
}
a.button2:before {
    content:  "УЗНАТЬ ПОДРОБНОСТИ";
    position:  absolute;
    bottom: -7px;
    left: -1px;
    width: calc(100% - (15px + 10px - 1px)*2);
    background: #fff linear-gradient(rgb(58,160,253), rgb(4,88,192) 60%, rgb(49,112,201));
    box-shadow: 0 10px 18px rgba(0,0,0,.5);
}
a.button2:hover {
    -webkit-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}
a.button2:hover:before {
    border-color: #0766d8;
    background: #fff linear-gradient(#3fadff, #0766d8 60%, #3279dd);
}
a.button2:focus,
a.button2:active {
    -webkit-transform: scale(2, 2);
    transform: scale(2, 2);
    opacity: 0;
    visibility: hidden;
    transition: .4s;
}

/* button4 */
a.button4 {
    position: relative;
    display: inline-block;
    font-family: Arial,Helvetica,FreeSans,"Liberation Sans","Nimbus Sans L",sans-serif;
    font-size: 1.5em;
    font-weight: 700;
    color: rgb(245,245,245);
    text-shadow: 0 -1px rgba(0,0,0,.1);
    text-decoration: none;
    user-select: none;
    padding: .3em 1em;
    outline: none;
    border: none;
    border-radius: 3px;
    background: #0c9c0d linear-gradient(#82d18d, #0c9c0d);
    box-shadow: inset #72de26 0 -1px 1px, inset 0 1px 1px #98ff98, #3caa3c 0 0 0 1px, rgba(0,0,0,.3) 0 2px 5px;
    -webkit-animation: pulsate 1.2s linear infinite;
    animation: pulsate 1.2s linear infinite;
}
a.button4:hover {
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
    cursor: pointer;
}

a.button4:active {
    top: 1px;
    color: #fff;
    text-shadow: 0 -1px rgba(0,0,0,.3), 0 0 5px #ffd, 0 0 8px #fff;
    box-shadow: 0 -1px 3px rgba(0,0,0,.3), 0 1px 1px #fff, inset 0 1px 2px rgba(0,0,0,.8), inset 0 -1px 0 rgba(0,0,0,.05);
}
@-webkit-keyframes pulsate {
    50% {color: #fff; text-shadow: 0 -1px rgba(0,0,0,.3), 0 0 5px #ffd, 0 0 8px #fff;}
}
@keyframes pulsate {
    50% {color: #fff; text-shadow: 0 -1px rgba(0,0,0,.3), 0 0 5px #ffd, 0 0 8px #fff;}
}

/* button5 */
a.button5 {
    display: inline-block;
    color: #000;
    font-size: 12px;
    text-decoration: none;
    user-select: none;
    padding: 0 5px;
    outline: none;
    border-radius: 2px;
}
a.button5:before {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;  /* для больших картинок 0 */
    padding-right: 5px;
}
a.button5[data-twitter]:before {content: url(http://favicon.yandex.net/favicon/twitter.com);}
a.button5[data-vk]:before {content: url(http://favicon.yandex.net/favicon/vk.com);}
a.button5[data-facebook]:before {content: url(http://favicon.yandex.net/favicon/facebook.com);}
a.button5:hover {
    background: linear-gradient(#ececeb, #eaeaea);
    box-shadow:
            inset rgba(0,0,0,.5) 0 -1px 1px,
            inset rgba(0,0,0,.2) 0 1px,
            inset #fff 0 2px,
            rgba(0,0,0,.2) 0 1px 1px;
}
a.button5:active {
    background: linear-gradient(rgba(0,0,0,.2), rgba(0,0,0,.1));
    box-shadow:
            inset rgba(0,0,0,.8) 0 1px 2px,
            inset rgba(0,0,0,.05) 0 -1px 0,
            #fff 0 1px 1px;
}

/* button6 */
a.button6 {
    position: relative;
    font-weight: bold;
    color: white;
    text-decoration: none;
    text-shadow: 0 -1px 1px #cc5500;
    user-select: none;
    padding: .8em 2em;
    outline: none;
    border-radius: 1px;
    background: linear-gradient(to left, rgba(0,0,0,.3), rgba(0,0,0,.0) 50%, rgba(0,0,0,.3)), linear-gradient(#d77d31, #fe8417, #d77d31);
    background-size: 100% 100%, auto;
    background-position: 50% 50%;
    box-shadow: inset #ebab00 0 -1px 1px, inset 0 1px 1px #ffbf00, #cc7722 0 0 0 1px, #000 0 10px 15px -10px;
    transition: 0.2s;
}
a.button6:hover {
    background-size: 140% 100%, auto;
}
a.button6:active {
    top: 1px;
    color: #ffdead;
    box-shadow: inset #ebab00 0 -1px 1px, inset 0 1px 1px #ffbf00, #cc7722 0 0 0 1px, 0 10px 10px -9px #000;
}

/* button7 */
a.button7 {
    font-weight: 700;
    color: white;
    text-decoration: none;
    padding: .8em 1em calc(.8em + 3px);
    border-radius: 3px;
    background: rgb(64,199,129);
    box-shadow: 0 -3px rgb(53,167,110) inset;
    transition: 0.2s;
}
a.button7:hover { background: rgb(53, 167, 110); }
a.button7:active {
    background: rgb(33,147,90);
    box-shadow: 0 3px rgb(33,147,90) inset;
}

/* button8 */
a.button8 {
    display: inline-block;
    color: white;
    font-weight: 700;
    text-decoration: none;
    user-select: none;
    padding: .5em 2em;
    outline: none;
    border: 2px solid;
    border-radius: 1px;
    transition: 0.2s;
}
a.button8:hover { background: rgba(255,255,255,.2); }
a.button8:active { background: white; }

/* button9 */
a.button9 {
    position: relative;
    display: inline-block;
    color: #777674;
    font-weight: bold;
    text-decoration: none;
    text-shadow: rgba(255,255,255,.5) 1px 1px, rgba(100,100,100,.3) 3px 7px 3px;
    user-select: none;
    padding: 1em 2em;
    outline: none;
    border-radius: 3px / 100%;
    background-image:
            linear-gradient(45deg, rgba(255,255,255,.0) 30%, rgba(255,255,255,.8), rgba(255,255,255,.0) 70%),
            linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0) 20%, rgba(255,255,255,0) 90%, rgba(255,255,255,.3)),
            linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
            linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
            linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5)),
            linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5));
    background-repeat: no-repeat;
    background-size: 200% 100%, auto, 100% 2px, 100% 2px, 100% 1px, 100% 1px;
    background-position: 200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
    box-shadow: rgba(0,0,0,.5) 3px 10px 10px -10px;
}
a.button9:hover {
    transition: .5s linear;
    background-position: -200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
}
a.button9:active {
    top: 1px;
}

/* button10 */
a.button10 {
    display: inline-block;
    color: black;
    font-size: 125%;
    font-weight: 700;
    text-decoration: none;
    user-select: none;
    padding: .25em .5em;
    outline: none;
    border: 1px solid rgb(250,172,17);
    border-radius: 7px;
    background: rgb(255,212,3) linear-gradient(rgb(255,212,3), rgb(248,157,23));
    box-shadow: inset 0 -2px 1px rgba(0,0,0,0), inset 0 1px 2px rgba(0,0,0,0), inset 0 0 0 60px rgba(255,255,0,0);
    transition: box-shadow .2s, border-color .2s;
}
a.button10:hover {
    box-shadow: inset 0 -1px 1px rgba(0,0,0,0), inset 0 1px 2px rgba(0,0,0,0), inset 0 0 0 60px rgba(255,255,0,.5);
}
a.button10:active {
    padding: calc(.25em + 1px) .5em calc(.25em - 1px);
    border-color: rgba(177,159,0,1);
    box-shadow: inset 0 -1px 1px rgba(0,0,0,.1), inset 0 1px 2px rgba(0,0,0,.3), inset 0 0 0 60px rgba(255,255,0,.45);
}

/* button11 */
a.button11 {
    position: relative;
    z-index: 1;
    color: black;
    font-size: 135%;
    font-weight: 700;
    text-decoration: none;
    padding: .25em .5em;
}
a.button11:after {
    content: "Купить";  /* здесь 6 букв */
    position: absolute;
    z-index: -1;
    top: -2px;
    bottom: -2px;
    left: -2px;
    width: calc(100% + 6*(1em*90/135) - 2px*2*2);  /* где 6*(1em*90/135), где 6 - это 6 букв, 90 - это font-size after, а 135 - это font-size родителя */
    text-align: right;
    color: #fff;
    font-size: 90%;
    padding: .25em .5em;
    border-radius: 5px;
    border: 2px solid #c61e40;
    -webkit-transform: skewX(-10deg);
    transform: skewX(-10deg);
    background: linear-gradient(#d4536d, #c61e40) no-repeat 100% 0;
    background-size: calc(6*(1em*90/135) + .5em) 100%;
    box-shadow: inset calc(-6*(1em*90/135) - .5em) 0 rgba(255,255,255,0);
    transition: .3s;
}
a.button11:hover:after {
    box-shadow: inset calc(-6*(1em*90/135) - .5em) 0 rgba(255,255,255,.2);
}
a.button11:active:after {
    background-image: linear-gradient(#c61e40, #d4536d);
}

/* button12 */
a.button12 {
    position: relative;
    display: inline-block;
    font-size: 100%;
    font-weight: 700;
    color: #fff;
    text-shadow: #053852 -1px 1px, #053852 1px 1px, #053852 1px -1px, #053852 -1px -1px;
    text-decoration: none;
    user-select: none;
    padding: .3em .7em;
    outline: none;
    border-radius: 7px;
    background: #053852 repeating-linear-gradient(135deg, #053852, #053852 10px, #1679ad 10px, #1679ad 20px, #053852 20px);
    box-shadow:
            inset -2px -2px rgba(0,0,0,.3),
            inset 2px 2px rgba(255,255,255,.3);
    transition: background-position 999999s, color 999999s, text-shadow 999999s;
}
a.button12:hover, a.button12:focus {
    text-shadow: #0175b1 -1px 1px, #0175b1 1px 1px, #0175b1 1px -1px, #0175b1 -1px -1px;
    background: #0175b1 repeating-linear-gradient(135deg, #0175b1, #0175b1 10px, #8fd2f5 10px, #8fd2f5 20px, #0175b1 20px) no-repeat;
    background-size: 1000% 100%;
}
a.button12:hover {
    background-position: 0 0;
}
a.button12:focus {
    color: rgba(255,255,255,0);
    text-shadow: rgba(1,117,177,0) -1px 1px, rgba(1,117,177,0) 1px 1px, rgba(1,117,177,0) 1px -1px, rgba(1,117,177,0) -1px -1px;
    background-position: 900% 0;
    transition: background-position linear 600s, color .5s, text-shadow .5s;
}
a.button12:after {
    content: "загрузка\2026";
    position: absolute;
    top: 0;
    left: 0;
    padding: .3em .7em;
    color: rgba(0,0,0,0);
    text-shadow: none;
    transition: 999999s;
}
a.button12:focus:after {
    color: #fff;
    text-shadow: #0175b1 -1px 1px, #0175b1 1px 1px, #0175b1 1px -1px, #0175b1 -1px -1px;
    transition: .5s;
}

/* button13 */
a.button13 {
    display: inline-block;
    width: 15em;
    font-size: 80%;
    color: rgba(255,255,255,.9);
    text-shadow: #2e7ebd 0 1px 2px;
    text-decoration: none;
    text-align: center;
    line-height: 1.1;
    white-space: pre-line;
    padding: .7em 0;
    border: 1px solid;
    border-color: #60a3d8 #2970a9 #2970a9 #60a3d8;
    border-radius: 6px;
    outline: none;
    background: #60a3d8 linear-gradient(#89bbe2, #60a3d8 50%, #378bce);
    box-shadow: inset rgba(255,255,255,.5) 1px 1px;
}
a.button13:first-line{
    font-size: 170%;
    font-weight: 700;
}
a.button13:hover {
    color: rgb(255,255,255);
    background-image: linear-gradient(#9dc7e7, #74afdd 50%, #378bce);
}
a.button13:active {
    color: rgb(255,255,255);
    border-color: #2970a9;
    background-image: linear-gradient(#5796c8, #6aa2ce);
    box-shadow: none;
}

/* button14 */
a.button14 {
    display: inline-block;
    text-shadow: 1px 1px #fff;
    text-decoration: none;
    padding: .3em 1em;
    border: 1px solid #aaa;
    border-radius: 100px;
    outline: none;
    background: #d6dbbf no-repeat;
    background-image:
            linear-gradient(to left, #aaa, #aaa),
            linear-gradient(to left, #feffe8, #feffe8),
            linear-gradient(#feffe8, #d6dbbf);
    background-position: calc(100% - 2.7em) 0, calc(100% - 2.7em + 1px) 0, 0 0;
    background-size: 1px 100%, 1px 100%, auto auto;
    overflow: hidden;
}
a.button14:after {
    content: "\bb";
    position: relative;
    bottom: 0;
    display: inline-block;
    margin-left: 1.4em;
    vertical-align: middle;
    font-family: "Times","Times New Roman","serif","sans-serif","EmojiSymbols";
    font-weight: 700;
    font-size: 140%;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}
a.button14:hover {
    background-color: #fdfd9f;
    background-image:
            linear-gradient(to left, #aaa, #aaa),
            linear-gradient(to left, #feffe8, #feffe8),
            linear-gradient(#fffce7, #fdfd9f);
}
a.button14:active:after {
    bottom: -1.2em;
    transition: .3s;
}

/* button15 */
a.button15 {
    display: inline-block;
    font-family: arial,sans-serif;
    font-size: 11px;
    font-weight: bold;
    color: rgb(68,68,68);
    text-decoration: none;
    user-select: none;
    padding: .2em 1.2em;
    outline: none;
    border: 1px solid rgba(0,0,0,.1);
    border-radius: 2px;
    background: rgb(245,245,245) linear-gradient(#f4f4f4, #f1f1f1);
    transition: all .218s ease 0s;
}
a.button15:hover {
    color: rgb(24,24,24);
    border: 1px solid rgb(198,198,198);
    background: #f7f7f7 linear-gradient(#f7f7f7, #f1f1f1);
    box-shadow: 0 1px 2px rgba(0,0,0,.1);
}
a.button15:active {
    color: rgb(51,51,51);
    border: 1px solid rgb(204,204,204);
    background: rgb(238,238,238) linear-gradient(rgb(238,238,238), rgb(224,224,224));
    box-shadow: 0 1px 2px rgba(0,0,0,.1) inset;
}

/* button16 */
a.button16 {
    display: inline-block;
    text-decoration: none;
    padding: 1em;
    outline: none;
    border-radius: 1px;
}
a.button16:hover {
    background-image:
            radial-gradient(1px 45% at 0% 50%, rgba(0,0,0,.6), transparent),
            radial-gradient(1px 45% at 100% 50%, rgba(0,0,0,.6), transparent);
}
a.button16:active {
    background-image:
            radial-gradient(45% 45% at 50% 100%, rgba(255,255,255,.9), rgba(255,255,255,0)),
            linear-gradient(rgba(255,255,255,.4), rgba(255,255,255,.3));
    box-shadow:
            inset rgba(162,95,42,.4) 0 0 0 1px,
            inset rgba(255,255,255,.9) 0 0 1px 3px;
}

/* button17 */
a.button17 {
    display: inline-block;
    font-family: arial,sans-serif;
    font-size: 11px;
    color: rgb(205,216,228);
    text-shadow: 0 -1px rgb(46,53,58);
    text-decoration: none;
    user-select: none;
    line-height: 2em;
    padding: 1px 1.2em;
    outline: none;
    border: 1px solid rgba(33,43,52,1);
    border-radius: 3px;
    background: rgb(81,92,102) linear-gradient(rgb(81,92,102), rgb(69,78,87));
    box-shadow:
            inset 0 1px rgba(101,114,126,1),
            inset 0 0 1px rgba(140,150,170,.8),
            0 1px rgb(83,94,104),
            0 0 1px rgb(86,96,106);
}
a.button17:active {
    box-shadow:
            inset 0 1px 3px rgba(0,10,20,.5),
            0 1px rgb(83,94,104),
            0 0 1px rgb(86,96,106);
}
a.button17:focus:not(:active) {
    border: 1px solid rgb(22,32,43);
    border-bottom: 1px solid rgb(25,34,45);
    background: rgb(53,61,71);
    box-shadow:
            inset 0 1px 3px rgba(0,10,20,.5),
            0 1px rgb(83,94,104),
            0 0 1px rgb(86,96,106);
    pointer-events: none;
}

/* button18 */
a.button18 {
    display: inline-block;
    font-size: 12px;
    color: rgb(205,216,228);
    text-decoration: none;
    padding: .2em .8em;
    outline: none;
    border-right: 1px solid rgba(13,20,27,.5);
    border-top: 1px solid rgba(270,278,287,.01);
    background-color: rgb(64,73,82);
    background-image:
            radial-gradient(1px 60% at 0% 50%, rgba(255,255,255,.3), transparent),
            radial-gradient(1px 60% at 100% 50%, rgba(255,255,255,.3), transparent),
            linear-gradient(rgb(64,73,82), rgb(72,81,90));
}
a.button18:hover {
    background-image:
            radial-gradient(1px 60% at 0% 50%, rgba(255,255,255,.3), transparent),
            radial-gradient(1px 60% at 100% 50%, rgba(255,255,255,.3), transparent),
            linear-gradient(rgb(51,60,67), rgb(58,65,72));
}
a.button18:focus {
    color: rgb(245,247,250);
    border-top: 1px solid rgb(67,111,136);
    background-image:
            linear-gradient(rgb(46,95,122), rgb(36,68,92));
}
a.button18:focus:hover {
    border-top: 1px solid rgb(49,87,107);
    background-image:
            linear-gradient(rgb(33,77,98), rgb(29,57,77));
}

/* button19 */
a.button19 {
    display: inline-block;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
    text-shadow: 0 -1px rgba(0,0,0,.5);
    user-select: none;
    padding: .7em 1.5em;
    border: 1px solid rgb(80,32,0);
    border-radius: 5px;
    outline: none;
    background: rgb(147,80,36) linear-gradient(rgb(106,58,26), rgb(147,80,36) 80%);
    box-shadow:
            0 6px rgb(86,38,6),
            0 3px 15px rgba(0,0,0,.4),
            inset 0 1px rgba(255,255,255,.3),
            inset 0 0 3px rgba(255,255,255,.5);
    transition: .2s;
}
.button19:hover {
    background: rgb(167,91,41) linear-gradient(rgb(126,69,31), rgb(167,91,41) 80%);
}
.button19:active {
    background: rgb(120,63,25) linear-gradient(rgb(120,63,25) 20%, rgb(167,91,41));
    box-shadow:
            0 2px rgb(86,38,6),
            0 1px 6px rgba(0,0,0,.4),
            inset 0 1px rgba(255,255,255,.3),
            inset 0 0 3px rgba(255,255,255,.5);
    -webkit-transform: translate(0, 4px);
    transform: translate(0, 4px);
}

/* button20 */
a.button20 {
    position: relative;
    display: inline-block;
    font-weight: bold;
    color: #000;
    text-decoration: none;
    text-shadow: -2px 2px rgba(255,255,255,.3);
    line-height: 1.1;
    padding: .5em 3em .5em .6em;
    background: linear-gradient(#ecc92b, #fce25b);
    box-shadow:
            0 0 0 1px #fce25b inset,
            -1px 0px rgb(220,195,35), -1px 1px rgb(192,167,7),
            -2px 1px rgb(219,194,34), -2px 2px rgb(191,166,6),
            -3px 2px rgb(218,193,33), -3px 3px rgb(190,165,5),
            -4px 3px rgb(217,192,32), -4px 4px rgb(189,164,4),
            -5px 4px rgb(216,191,31), -5px 5px rgb(188,163,3),
            -6px 5px rgb(215,190,30), -6px 6px rgb(187,162,2),
            -7px 6px rgb(214,189,29), -7px 7px rgb(186,161,1),
            -8px 7px rgb(213,188,28), -8px 8px rgb(185,160,0),
            -7px 9px 1px rgba(0,0,0,.4),
            -5px 11px 1px rgba(0,0,0,.2),
            -1px 13px 4px rgba(0,0,0,.2),
            4px 16px 7px rgba(0,0,0,.3);
    transition: .4s;
}
a.button20:active {
    box-shadow: none;
    -webkit-transform: translate(-7px, 8px);
    transform: translate(-7px, 8px);
}
a.button20:after {
    content: "";
    position: absolute;
    top: calc(50% - .6em/2);
    right: .6em;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    border: .37em solid;
    border-top: none;
    border-left: none;
    width: .6em;
    height: .6em;
    box-shadow: inset -2px 2px rgba(255,255,255,.3);
}

/* button21 */
a.button21 {
    display: inline-block;
    width: 5em;
    height: 2em;
    line-height: 2em;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    user-select: none;
    color: rgb(0,0,0);
    outline: none;
    border: 1px solid rgba(0,0,0,.4);
    border-top-color: rgba(0,0,0,.3);
    border-radius: 2px;
    background: linear-gradient(rgb(255,255,255), rgb(240,240,240));
    box-shadow:
            0 0 3px rgba(0,0,0,0) inset,
            0 1px 1px 1px rgba(255,255,255,.2),
            0 -1px 1px 1px rgba(0,0,0,0);
    transition: .2s ease-in-out;
}
a.button21:hover:not(:active) {
    box-shadow:
            0 0 3px rgba(0,0,0,0) inset,
            0 1px 1px 1px rgba(0,255,255,.5),
            0 -1px 1px 1px rgba(0,255,255,.5);
}
a.button21:active {
    background: linear-gradient(rgb(250,250,250), rgb(235,235,235));
    box-shadow:
            0 0 3px rgba(0,0,0,.5) inset,
            0 1px 1px 1px rgba(255,255,255,.4),
            0 -1px 1px 1px rgba(0,0,0,.1);
}

/* button22 */
a.button22 {
    position: relative;
    display: inline-block;
    width: 6em;
    height: 2.5em;
    line-height: 2.4em;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    user-select: none;
    color: #000;
    outline: none;
    border: 1px solid rgba(110,121,128,.8);
    border-top-color: rgba(0,0,0,.3);
    border-radius: 5px;
    background: rgb(206, 220, 231) linear-gradient(rgb(206,220,231), rgb(89,106,114));
    box-shadow:
            0 -1px rgba(10,21,28,.9) inset,
            0 1px rgba(255,255,255,.5) inset;
}
a.button22:hover {
    background: linear-gradient(#d2dfea, #71828c);
}
a.button22:active {
    line-height: 2.6em;
    background: linear-gradient(#bac6cf, #c5d3de 20%, #71828c);
    box-shadow: 0 -1px rgba(255,255,255,.4) inset;
}
a.button22:before {
    content: "";
    position: absolute;
    top: -10px; right: -10px; bottom: -10px; left: -10px;
    z-index: -1;
    border-radius: 8px;
    background: linear-gradient(rgba(200,200,200,.5), rgba(240,240,240,.5));
}

/* button23 */
a.button23 {
    display: inline-block;
    color: rgba(255,255,255,1.8);
    text-decoration: none;
    text-shadow: 0 0 1px rgb(3,43,58);
    padding: .8em 1.2em;
    background: #0E8BB8 linear-gradient(#0A5E7D, #0E8BB8);
    box-shadow:
            0 15px 12px -12px rgb(0,0,0),
            0 -2px 0 -1px rgb(20,110,140),
            0 -4px 0 -2px rgb(18,108,138),
            0 -6px 0 -3px rgb(16,106,136),
            0 -8px 0 -4px rgb(14,104,134),
            0 -10px 0 -5px rgb(12,102,132),
            0 -12px 0 -6px rgb(10,100,130);
}
a.button23:active {
    margin: 0 calc(2px + 6px) 2px 0;
    padding: calc(.8em - 2px) calc(1.2em - 6px - 2px);
    border-left: 2px solid rgb(150,150,150);
    border-right: 2px solid rgb(150,150,150);
    border-bottom: 2px solid rgb(230,230,230);
    background: rgb(44,160,202) linear-gradient(rgb(62,184,229), rgb(44,160,202));
    box-shadow: none;
    -webkit-transform: translate(6px, -6px);
    transform: translate(6px, -6px);
}

/* button24 */
a.button24 {
    display: inline-block;
    color: white;
    text-decoration: none;
    padding: .5em 2em;
    outline: none;
    border-width: 2px 0;
    border-style: solid none;
    border-color: #FDBE33 #000 #D77206;
    border-radius: 6px;
    background: linear-gradient(#F3AE0F, #E38916) #E38916;
    transition: 0.2s;
}
a.button24:hover { background: linear-gradient(#f5ae00, #f59500) #f5ae00; }
a.button24:active { background: linear-gradient(#f59500, #f5ae00) #f59500; }

/* button25 */
a.button25 {
    position: relative;
    display: inline-block;
    width: 10em;
    height: 2.5em;
    line-height: 2.5em;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 -1px 1px #777;
    color: #fff;
    outline: none;
    border: 2px solid #F64C2B;
    border-radius: 5px;
    box-shadow: 0 0 0 60px rgba(0,0,0,0) inset, .1em .1em .2em #800;
    background: linear-gradient(#FB9575, #F45A38 48%, #EA1502 52%, #F02F17);
}
a.button25:active {
    top: .1em;
    left: .1em;
    box-shadow: 0 0 0 60px rgba(0,0,0,.05) inset;
}

/* button26 */
a.button26 {
    position: relative;
    display: inline-block;
    border-radius: 100px;
    outline: none;
    box-shadow: 0 0 2px 2px rgba(0,0,0,.3) inset, 0 1px 1px rgba(255,255,255,.2);
    background: #8a7b78 linear-gradient(#8a7b78, #cdcdcd);
}
a.button26 span {
    position: relative;
    display: block;
    width: 50px;
    height: 100px;
    border: solid transparent;
    border-width: 0 0 0 50px;
    border-radius: 100px;
    outline: none;
    overflow: hidden;
}
a.button26 span:before {
    content: "";
    position: absolute;
    left: -50px;
    height: 100px;
    border-right: 50px solid transparent;
    border-left: 50px solid #bfddf5;
    border-radius: 100px;
}
a.button26:after {
    content: "\260e";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 80px;
    height: 80px;
    line-height: 80px;
    font-size: 300%;
    font-weight: 700;
    text-align: center;
    text-shadow: #2e7ebd 0 1px 2px;
    color: #fff;
    margin: auto;
    border-radius: 100px;
    background: #75a7cd linear-gradient(#75a7cd, #5084a8);
    box-shadow: 0 2px 2px rgba(255,255,255,.5) inset, 0 -2px 2px rgba(0,0,0,.3) inset, 0 0 2px 2px rgba(0,0,0,.3);
}
a.button26:focus span {
    -webkit-animation: background1 10s linear forwards;
    animation: background1 10s linear forwards;
}
a.button26:focus span:before {
    -webkit-animation: rotate1 10s linear forwards;
    animation: rotate1 10s linear forwards;
}
a.button26:focus:after {
    background: #5390b8 linear-gradient(#5390b8, #6ba9d4);
}
@-webkit-keyframes background1 {
    49.999% {border-width: 0 0 0 50px; border-color: transparent;}
    50%, 100% {border-width: 0 50px 0 0; border-color: #bfddf5;}
}
@-webkit-keyframes rotate1 {
    49.999% {left: -50px;}
    50% {left: 0px;}
    100% {-webkit-transform: rotate(360deg); left: 0px;}
}
@keyframes background1 {
    49.999% {border-width: 0 0 0 50px; border-color: transparent;}
    50%, 100% {border-width: 0 50px 0 0; border-color: #bfddf5;}
}
@keyframes rotate1 {
    49.999% {left: -50px;}
    50% {left: 0px;}
    100% {transform: rotate(360deg); left: 0px;}
}

/* button27 */
a.button27 {
    position: relative;
    display: inline-block;
    width: 2em;
    height: 2em;
    line-height: 2em;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    color: #000;
    outline: none;
    border-radius: 5px;
    box-shadow: 0 0 0 1px #ddd inset, 0 1px 1px #fff;
}
a.button27:hover {
    background: #dcdcdc linear-gradient(#fff, #dcdcdc);
    box-shadow: 0 0 0 1px #aaa inset, 0 1px 1px #aaa;
}
a.button27:active {
    background: none;
    box-shadow: 0 0 0 1px #bbb inset, 0 1px 3px rgba(0,0,0,.5) inset, 0 1px 2px #fff;
}

/* button28 */
a.button28 {
    position: relative;
    display: inline-block;
    font-size: 90%;
    font-weight: 700;
    color: rgb(209,209,217);
    text-decoration: none;
    text-shadow: 0 -1px 2px rgba(0,0,0,.2);
    padding: .5em 1em;
    outline: none;
    border-radius: 3px;
    background: linear-gradient(rgb(110,112,120), rgb(81,81,86)) rgb(110,112,120);
    box-shadow:
            0 1px rgba(255,255,255,.2) inset,
            0 3px 5px rgba(0,1,6,.5),
            0 0 1px 1px rgba(0,1,6,.2);
    transition: .2s ease-in-out;
}
a.button28:hover:not(:active) {
    background: linear-gradient(rgb(126,126,134), rgb(70,71,76)) rgb(126,126,134);
}
a.button28:active {
    top: 1px;
    background: linear-gradient(rgb(76,77,82), rgb(56,57,62)) rgb(76,77,82);
    box-shadow:
            0 0 1px rgba(0,0,0,.5) inset,
            0 2px 3px rgba(0,0,0,.5) inset,
            0 1px 1px rgba(255,255,255,.1);
}

/* button29 */
a.button29 {
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    vertical-align: middle;
    text-decoration: none;
    border: .5em solid rgba(0,0,0,0);
    border-radius: 100%;
    background: rgb(245,245,245) linear-gradient(rgb(245,245,245), rgb(188,192,193)) 50% 50% / calc(1.5em + .5em*2) calc(1.5em + .5em*2);
    box-shadow:
            inset 0 -3px 10px rgba(255,255,255,1),
            inset 0 3px 10px rgba(0,0,0,.4),
            0 2px 4px rgba(0,0,0,.9);
}

/* button30 */
a.button30 {
    position: relative;
    z-index: 1;
    display: inline-block;
    width: 1.3em;
    height: 1.3em;
    line-height: 1.3em;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    text-shadow: 1px 1px rgba(255,255,255,.3);
    font-size: 300%;
    font-weight: 900;
    color: #000;
    border-radius: 100%;
    background: rgb(144,142,105) linear-gradient(rgb(185,181,151), rgb(144,142,105));
    box-shadow:
            inset 0 -2px 1px rgba(0,0,0,.5),
            inset 0 2px 1px rgba(255,255,255,.9),
            0 4px 4px rgba(0,0,0,.9);
}
a.button30:after {
    content: "";
    position: absolute;
    z-index: -1;
    top: 12%;
    left: 12%;
    right: 12%;
    bottom: 12%;
    border-radius: 100%;
    background: rgb(242,203,20) linear-gradient(rgb(242,203,20), rgb(255,182,7));
    box-shadow:
            inset 0 2px 1px rgba(0,0,0,.5),
            inset 0 -2px 1px rgba(255,255,255,.3);
}

/* button31 */
a.button31 {
    position: relative;
    z-index: 1;
    display: inline-block;
    width: 3em;
    height: 3em;
    border-radius: 100%;
    outline: none;
    background: #ddd;
    box-shadow: 0 1px rgba(0,0,0,.1) inset, 0 1px #fff;
}
a.button31:after, a.button31:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 7.5%;
    left: -15%;
    right: 0;
    bottom: 0;
    width: 30%;
    height: 10%;
    margin: auto;
    background: #999;
    box-shadow: 0 1px rgba(0,0,0,.1) inset, 0 1px #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
a.button31:before {
    left: 15%;
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);
}
a.button31:hover, a.button31:focus {
    background: #e35d31;
    box-shadow: none;
}
a.button31:hover:after, a.button31:hover:before {
    background: #fff;
    box-shadow: none;
}
a.button31:focus {
    background-image:
            linear-gradient(120deg, transparent 45%, #e35d31 45%, #e35d31 55%, transparent 55%),
            radial-gradient(transparent 20%, #fff 20%, #fff 30%, transparent 30%);
    -webkit-animation: rotate31 1s linear infinite forwards;
    animation: rotate31 1s linear infinite forwards;
}
a.button31:focus:after, a.button31:focus:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: calc(-30% - 4px/2);
    left: 4px;
    width: 0;
    height: 0;
    border-top: 4px solid transparent;
    border-left: 8px solid #fff;
    border-bottom: 4px solid transparent;
    background: transparent;
    box-shadow: none;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}
a.button31:focus:before {
    top: calc(30% + 4px/2);
    left: -4px;
    border-left: none;
    border-right: 8px solid #fff;
}
@-webkit-keyframes rotate31 {
    100% {-webkit-transform: rotate(360deg);}
}
@keyframes rotate31 {
    100% {transform: rotate(360deg);}
}