/* --------------------------------- */
html, body { background: #191b1f; font-size: 15px; color: #fff; width: 100%; height: 100%; }
dl, li, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, body, html, blockquote, input, textarea, select, button, a { margin: 0; padding: 0; outline: none; font-family: 'IBM Plex Sans', sans-serif; }
img { border: 0; vertical-align: top; } a { color: #fff; text-decoration: none; transition: all .2s; } a:hover { text-decoration: none; } .reset { margin: 0; padding: 0; list-style: none; }

/* --------------------------------- */
.button { display: inline-block; cursor: pointer; border: none; outline: none; transition: all .2s; box-sizing: border-box; font-weight: 500; border-radius: 10px; }
.button img { vertical-align: middle; position: relative; top: -1px; margin-right: 10px; }
.button.buttonControl { background: #1b1d21; color: #fff; }
.button.buttonControl:hover { background: #131518; }
.button.buttonControl img { vertical-align: middle; position: relative; top: -1px; margin-right: 0; }
.button.buttonIcon { background: #1b1d21; border: 1px solid #36383c; border-radius: 10px; float: left; width: 34px; height: 34px; text-align: center; }
.button.buttonIcon img { margin-right: 0; top: 4px; }
.button.buttonSmall { height: 34px; line-height: 34px; padding: 0 15px; font-size: 15px; }
.button.buttonMiddle { height: 44px; line-height: 44px; padding: 0 20px; font-size: 15px; }
.button.buttonLarge { height: 54px; line-height: 54px; padding: 0 25px; font-size: 16px; }
.button.buttonBlock { width: 100%; text-align: center; box-sizing: border-box; }
.button.buttonBlue { background: #266df0; color: #fff; }
.button.buttonBlue:hover { background: #2867db; }
.button.buttonGreen { background: #45ac53; color: #fff; }
.button.buttonGreen:hover { background: #3ca44a; }
.button.buttonGrey { background: #232529; color: #fff; }
.button.buttonGrey:hover { background: #1f2125; }
.button.buttonRed { background: #df4b4b; color: #fff; }
.button.buttonRed:hover { background: #da4242; }
.button.buttonPurple { background: #a27afa; color: #fff; }
.button.buttonPurple:hover { background: #9970f3; }
.button.buttonBlack { background: rgba(0,0,0,0.3); color: #fff; }
.button.buttonBlack:hover { background: rgba(0,0,0,0.6); }
.button.buttonOrange { background: #ff9338; color: #fff; }
.button.buttonOrange:hover { background: rgba(0,0,0,0.6); }
.button.buttonBlack2 { background: rgba(0,0,0,0.3); color: #fff; border: 1px solid #36383c; line-height: 42px; }
.button.buttonBlack2:hover { background: rgba(0,0,0,0.6); }

/* --------------------------------- */
.buttonsInput { width: 100%; height: 44px; background: #1b1d21; border: 1px solid #36383c; line-height: 44px; padding: 0 15px; box-sizing: border-box; border-radius: 10px; color: #fff; font-size: 15px; }
.buttonsInput.middle { width: 200px; }

/* --------------------------------- */
.containerNotify { position: fixed; bottom: 30px; left: 30px; height: 60px; line-height: 60px; font-weight: 500; font-size: 15px; z-index: 999; visibility: hidden; opacity: 0; }
.containerNotify .containerNotify--content { padding: 0 20px; border-radius: 10px; transition: all .3s; box-shadow: 0 20px 50px rgba(0,0,0,0.2); }
.containerNotify .containerNotify--content.success { background: rgba(10,187,135,1); color: #fff; }
.containerNotify .containerNotify--content.warning { background: #d54949; color: #fff; }
.containerNotify.success { visibility: visible; opacity: 1; }
.containerNotify.warning { visibility: visible; opacity: 1; }