/*
English:

CSS framework framework.averin.pro 
Version: 5.0.1
Prefix: ""
Author: Artemiy Averin (ya@averin.pro)
Company: Design studio Artemy Averin (https://averin.pro/) 

Docs & Examples: https://framework.averin.pro/ 

Русский: 

CSS фреймворк framework.averin.pro
Версия: 5.0.1
Префикс: ""
Студия Артемия Аверина (ya@averin.pro)
 
Документая и примеры: httpы://framework.averin.pro/
*/

/*** Start button component ***/
.button, [type="submit"] { -webkit-appearance: button; }
.button, .button:active, .button:focus { -webkit-appearance: none; -moz-appearance: none; appearance: none; display: inline-flex; align-items: center; justify-content: center; vertical-align: middle; font-family: inherit; font-size: 0.9375em; font-weight: 500; text-decoration: none; text-transform: none; color: #FFFFFF; background: #4da1ff; border-radius: 0.1875rem; border: 0 solid transparent; padding: 0.7em 1.35em; box-shadow: none; cursor: pointer; line-height: 1.2;  -webkit-box-shadow: 0px 15px 30px rgba(77, 161, 255, 0.32); box-shadow: 0px 15px 30px rgba(77, 161, 255, 0.32);  }
.button:hover { -moz-transition: all linear 0.2s; transition: all linear 0.2s; outline: none; text-decoration: none; color: #FFFFFF; background-color: #80bcff; }
.button.red { color: rgba(255, 255, 255, 0.95); background: #ff6f69; border-color: #ff6f69; -webkit-box-shadow: 0px 15px 30px rgba(255, 0, 0, 0.32); box-shadow: 0px 15px 30px rgba(255, 0, 0, 0.32); }
.button.red:hover { color: rgba(255, 255, 255, 0.95); background-color: #ff8080; border-color: #ff8080; }
.button.yellow { color: #000000; background: #f5fe4d; border-color: #f5fe4d; -webkit-box-shadow: 0px 15px 30px rgba(245, 254, 77, 0.32); box-shadow: 0px 15px 30px rgba(245, 254, 77, 0.32); }
.button.yellow:hover { color: rgba(0, 0, 0, 0.95); background-color: #aff29a; border-color: #aff29a; }
.button.green { color: rgba(0, 0, 0, 0.95); background: #3eed06; border-color: #3eed06; -webkit-box-shadow: 0px 15px 30px rgba(62, 237, 6, 0.32); box-shadow: 0px 15px 30px rgba(62, 237, 6, 0.32); }
.button.green:hover { color: rgba(0, 0, 0, 0.95); background-color: #aff29a; border-color: #aff29a; }
.button.blue { color: rgba(255, 255, 255, 0.95); background: #06c1ec; border-color: #06c1ec; -webkit-box-shadow: 0px 15px 30px rgba(6, 193, 236, 0.32); box-shadow: 0px 15px 30px rgba(6, 193, 236, 0.32); }
.button.blue:hover { color: rgba(255, 255, 255, 0.95); background-color: #94deef; border-color: #94deef; }
.button.gray { color: rgba(255, 255, 255, 0.95); background: gray; border-color: gray; -webkit-box-shadow: 0px 15px 30px rgba(128, 128, 128, 0.32); box-shadow: 0px 15px 30px rgba(128, 128, 128, 0.32); } 
.button.gray:hover { color: rgba(255, 255, 255, 0.95); background-color:rgba(17, 17, 17, 0.6); border-color:rgba(17, 17, 17, 0.6); }
.button.dark { color: rgba(255, 255, 255, 0.95); background: #000000; border-color: #000000; -webkit-box-shadow: 0px 15px 30px rgba(0, 0, 0, 0.32); box-shadow: 0px 15px 30px rgba(0, 0, 0, 0.32); }
.button.dark:hover { color: rgba(255, 255, 255, 0.95); background-color: #666666; border-color: #666666; } 
.button:disabled, .button.disabled, .button:disabled:hover, .button.disabled:hover { cursor: default; font-style: normal; color: #FFFFFF; background-color: rgba(17, 17, 17, 0.5); opacity: .55; -webkit-box-shadow: 0px 15px 30px rgba(17, 17, 17, 0.32); box-shadow: 0px 15px 30px rgba(17, 17, 17, 0.32); }
.button:active, .button.active, .button:active:hover, .button.active:hover { cursor: default; font-style: normal; color: #FFFFFF; background-color: rgba(17, 17, 17, 0.5); opacity: .85; -webkit-box-shadow: 0px 15px 30px rgba(17, 17, 17, 0.32); box-shadow: 0px 15px 30px rgba(17, 17, 17, 0.32); }
.button.big { font-size: 1.2em; line-height: 1.2; }
.button.small { font-size: 0.8em; }

@media (max-width: 1000px) {
	.button { margin: 10px; }
}
/*** End button component ***/