@import url('theme.css');

.top-0 {
    top: 0;
}
.bottom-0 {
    bottom: 0;
}
.right-0 {
    right: 0;
}
.left-0 {
    left: 0;
}
.z-index-1 {
    z-index: 1;
}
.z-index-2 {
    z-index: 2;
}
.z-index-3 {
    z-index: 3;
}
.z-index-max {
    z-index: 99999999;
}
.scrollable {
    max-height: 90vh;
    overflow-y: auto;    
}

/* cast */
a{
    cursor: pointer;
}
.white-space-pre-wrap {
    white-space: pre-wrap !important;
}

form.faded::after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,0.5);
}

.form-group fieldset legend {
	display: none;
}
.material-icons{
    vertical-align: text-bottom;
    font-size: 1.5rem;
}
.btn .material-icons {
    vertical-align: middle;
}
.material-icons.small{
    font-size: 1.1rem;
}
.material-icons.clipboard-copy{
    cursor: pointer;
    color: var(--light-color);
}
.material-icons.clipboard-copy:hover{
    color: var(--link-color);
}
.message-text{
    margin-top: 10px;
    position: relative;
    border-radius: 1.25rem;
    display: inline-block;
    padding: .5rem 1rem;
    background: var(--message-color);
}
/* Это когда в тексте результат CKEdiror */
.message-text > p {
	margin-bottom: 0;
}

.message-text::after{
    content: '';
    position: absolute;
    top: -8px;
    left: 8px;
    width: 0;
    display: block;
    height: 0;
    border-style: solid;
    border-width: 0 12px 12px 12px;
    border-color: transparent transparent var(--message-color) transparent;
}
.message-block.align-items-end .message-text::after{
    left: unset;
    right: 8px;
}
/* --yellow - bootstrap's var */
.message-text.bg-warning::after{
    border-color: transparent transparent var(--yellow) transparent !important;;
}
.message-text.bg-primary {
    color: #ffffff;
}
/* --yellow - bootstrap's var */
.message-text.bg-primary::after{
    border-color: transparent transparent var(--primary-color) transparent !important;;
}
.message-avatar{
 width: 50px;
 height: 50px;
 background: gray;
 border-radius: 100%;
}
.message-avatar img{
    object-fit: cover;
    width: 100%;
    height: 100%;
    border-radius: inherit;
}

/* https://snipp.ru/html-css/rating-css */

.rating-area {
	overflow: hidden;
	margin: 0 auto;
    display: inline-block;
}
.rating-area:not(:checked) > input {
	display: none;
}
.rating-area:not(:checked) > label {
	float: right;
	width: 42px;
	padding: 0;
	cursor: pointer;
	font-size: 32px;
	line-height: 32px;
	color: lightgrey;
	text-shadow: 1px 1px #bbb;
}
.rating-area:not(:checked) > label:before {
	content: '★';
}
.rating-area > input:checked ~ label {
	color: gold;
	text-shadow: 1px 1px #c60;
}
.rating-area:not(:checked) > label:hover,
.rating-area:not(:checked) > label:hover ~ label {
	color: gold;
}
.rating-area > input:checked + label:hover,
.rating-area > input:checked + label:hover ~ label,
.rating-area > input:checked ~ label:hover,
.rating-area > input:checked ~ label:hover ~ label,
.rating-area > label:hover ~ input:checked ~ label {
	color: gold;
	text-shadow: 1px 1px goldenrod;
}
.rate-area > label:active {
	position: relative;
}
.rating-result {
	margin: 0 auto;
}
.rating-result span {
	padding: 0;
	font-size: 32px;
	margin: 0 3px;
	line-height: 1;
	color: lightgrey;
	text-shadow: 1px 1px #bbb;
}
.rating-result > span:before {
	content: '★';
}
.rating-result > span.active {
	color: gold;
	text-shadow: 1px 1px #c60;
}
.rating-mini {
	display: block;
	font-size: 0;
}
.rating-mini span {
	padding: 0;
	font-size: 20px;
	line-height: 1;
	color: lightgrey;
}
.rating-mini > span:before {
	content: '★';
}
.rating-mini > span.active {
	color: gold;
}

/* RIGHT CONTENT */
.rc-small{
	z-index: 10;
    position: fixed;
    bottom: 0;
    right: 1rem;
    bottom: 0;
    width: 0;
    height: 0;
    margin-bottom: 10%;
    background-color: #ffffff;
    overflow: auto;
    border-radius: 2rem;
    transition: all 0.15s linear 0s;
}
.rc-small.opened  {
    padding: 2rem 1.5rem;
    width: 420px;
    height: 70%;
}
.rc-small.opened.maximized {
    width: 920px;

}

/* 2022 NY MTHFCKR! */
.demo-navbar-user {
    position: relative;
}
.demo-navbar-user.happy-new-year::after {
    content: '';
    position: absolute;
    top: 0;
    right: 13px;
    background-image: url(/assets/img/santa-hat.png);
    width: 40px;
    height: 40px;
    display: block;
    background-size: contain;
    background-repeat: no-repeat;
}
.snowflake {
color: #fff;
font-size: 1em;
font-family: Arial;
text-shadow: 0 0 1px #000;
}

@-webkit-keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@-webkit-keyframes snowflakes-shake{0%{-webkit-transform:translateX(0px);transform:translateX(0px)}50%{-webkit-transform:translateX(80px);transform:translateX(80px)}100%{-webkit-transform:translateX(0px);transform:translateX(0px)}}@keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@keyframes snowflakes-shake{0%{transform:translateX(0px)}50%{transform:translateX(80px)}100%{transform:translateX(0px)}}.snowflake{position:fixed;top:-10%;z-index:9999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;-webkit-animation-name:snowflakes-fall,snowflakes-shake;-webkit-animation-duration:10s,3s;-webkit-animation-timing-function:linear,ease-in-out;-webkit-animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-name:snowflakes-fall,snowflakes-shake;animation-duration:10s,3s;animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite;animation-play-state:running,running}.snowflake:nth-of-type(0){left:1%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.snowflake:nth-of-type(1){left:10%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.snowflake:nth-of-type(2){left:20%;-webkit-animation-delay:6s,.5s;animation-delay:6s,.5s}.snowflake:nth-of-type(3){left:30%;-webkit-animation-delay:4s,2s;animation-delay:4s,2s}.snowflake:nth-of-type(4){left:40%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.snowflake:nth-of-type(5){left:50%;-webkit-animation-delay:8s,3s;animation-delay:8s,3s}.snowflake:nth-of-type(6){left:60%;-webkit-animation-delay:6s,2s;animation-delay:6s,2s}.snowflake:nth-of-type(7){left:70%;-webkit-animation-delay:2.5s,1s;animation-delay:2.5s,1s}.snowflake:nth-of-type(8){left:80%;-webkit-animation-delay:1s,0s;animation-delay:1s,0s}.snowflake:nth-of-type(9){left:90%;-webkit-animation-delay:3s,1.5s;animation-delay:3s,1.5s}


#garland {
position: absolute;
top: 59px;
left: 0;
background-image: url('http://imapo.ru/img/christmas.png');
height: 36px;
width: 100%;
overflow: hidden;
z-index: 99
}

#nums_1 {
padding: 100px
}

.garland_1 {
background-position: 0 0
}

.garland_2 {
background-position: 0 -36px
}

.garland_3 {
background-position: 0 -72px
}

.garland_4 {
background-position: 0 -108px
}