body {
    margin: 0;
    font-family: 'Montserrat Alternates', sans-serif;
	font-size: 14px;
}
section{
	box-sizing: border-box;
	width: 100%;
}
*{
    transition: all;
    transition-duration: 0.6s;
    transition-timing-function: ease-in-out;
    scrollbar-color: #916278 #faa7825c;
    scrollbar-width: thin;
}
a {
    text-decoration: none;
    color: #916278;
}
.bkg-fix {
    background:  url(/static/home/img/overlay.png), url(/static/home/img/bg.jpg);
    background-repeat: repeat, no-repeat;
    background-size: auto, 100% 100%;
    background-attachment: fixed;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
}
header {
    height: 60px;
    width: 100%;
    position: sticky;
    top: -1px;
    left: 0;
    margin: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    z-index: 1000;
    margin-top: 1px;
    margin-bottom: 20px;
}
header.isSticky{
    background: #e0a794 url(/static/home/img/overlay.png);
}
nav.home-nav {
    width: 100%;
    display: flex;
    max-width: 1200px;
    height: 60px;
    box-sizing: border-box;
}
ul.home-ul-nav {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch;
}
li.home-li-nav {
    height: 60px;
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    align-items: stretch;
    text-transform: uppercase;
    font-size: 0.8em;
    color: #ffffff;
    letter-spacing: 1px;
    font-weight: 600;
    cursor: pointer;
    box-sizing: border-box;
	position: relative;
    overflow: hidden;
}
li.home-li-nav.active {
    border-bottom: 2px solid;
    /* background: linear-gradient(0deg, #ffffff26, transparent); */
	transition: all .6s ease-in-out;
}
li.home-li-nav.active:not(:first-child)::after {
    content: '';
    display: block;
    position: absolute;
    left: calc(50% - 10px);
    bottom: -10px;
    z-index: 2000;
    width: 20px;
    height: 20px;
    background-color: #fff;
    transform: rotate(45deg);
}
center {
    max-width: 100%;
    display: block;
    overflow: hidden;
    padding: 20px 0px;
}
li.home-li-nav:hover:not(.active){
	border-bottom: 1px solid;
    /* background: linear-gradient(0deg, #ffffff26, transparent); */
}
a.home-btn-profile {
    width: 20%;
    border-bottom: 5px solid;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-end;
    justify-content: center;
    text-decoration: none;
    color: #fff;
    position: relative;
    height: 60px;
    border-bottom-right-radius: 15px;
    padding-right: 3px;
}
.home-btn-profile:hover {
    background: linear-gradient(0deg, #ffffff26, transparent);
}
.home-btn-profile i {
    background-color: #8b008b;
    font-size: 14px;
    padding: 12px;
    color: #fff;
    border-radius: 50em;
}
small.home-usr {
    text-align: right;
    border-top: 1px solid #fff;
    border-top-left-radius: 50em;
    background: -webkit-linear-gradient(#8b008b, #ff8528);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-top: 3px;
    font-weight: 600;
    font-size: 0.6em;
    text-transform: uppercase;
    padding: 2px;
    height: 14px;
    width: 100%;
    display: block;
    box-sizing: border-box;
}
section#intro {
    display: flex;
    position: relative;
    height: auto;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-bottom: 4px double #ffffff54;
    margin-bottom: 10px;
    padding-bottom: 10px;
}
img.logo {
    width: 120px;
	opacity:0;transform: translateY(-200px);
}
.home-logo {
    text-align: center;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}
span.intro-img-h1 {
    width: 260px;
    display: flex;
    height: 180px;
    position: relative;
    justify-content: center;
    align-items: center;
    border-bottom: 4px double #ffffff4f;
}
h1.intro-name {
    position: absolute;
    font-size: 90px;
    color: #ffffff24;
    font-weight: 900;
	opacity:0;transform: translateY(200px) translateX(0px);
}
h1.intro-logo {
    text-transform: uppercase;
    font-weight: 300;
}
section.divers {
    height: 150px;
    position: relative;
    display: block;
}
section.divers.full{
	height: auto;
}
.div-left {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.div-right {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.div-left-down {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.div-right-down {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.div-full{
	width: 100%;
	height: 100%;
	background-color: #fff;
	position: relative;
}
h1.home-info-h1 {
    margin: 0;
    padding: 8px 0;
    text-align: center;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 2em;
    color: #e0a794;
    padding-bottom: 30px;
	opacity: 0; transform: rotateY(90deg) skewY(180deg);
}
p.info-block-message {
    margin: 0;
    padding: 8px;
    box-sizing: border-box;
}
content.home-info-content {
    margin: 0;
    margin-bottom: 20px;
    box-sizing: border-box;
    display: inline-block;
    width: 100%;
    max-width: 1200px;
    background-color: #fff;
    overflow: hidden;
    position: relative;
}
.home-info-content.vid.from-list {
    height: max-content;
    width: 100%;
    overflow: hidden;
}
p.info-block-message {
    background-color: #fba883;
    box-sizing: border-box;
    padding: 20px;
    /* transform: rotate(6deg); */
    color: #fff;
    text-align: center;
    font-size: 0.9em;
    font-weight: 300;
    width: 100%;
    max-width: 1200px;
	letter-spacing:1px;
	opacity: 0; transform: rotateX(90deg);
}
textPath {
    letter-spacing: 1px;
}
.arc-heading__heading{
	font-size: 2em;
}
.arc-heading__subheading{
	font-size: 0.6em;
	text-align: center;
	text-shadow: 0 0 4px #fff;
}
.home-from-block{
    width: 250px;
    min-height: 370px;
    background-color: #fff;
    box-sizing: border-box;
    padding: 8px;
    border: 1px solid #efeffe;
    margin: 15px 30px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    user-select: none;
    transition: all 0.8s;
}
.home-from-kist-body{
    font-size: 0.8em;
    text-align: justify;
    display: flex;
    height: 202px;
    align-items: stretch;
    flex-direction: column;
    justify-content: center;
    flex-wrap: wrap;
    align-content: center;
    background-color: #e0a79429;
    margin: -8px -8px;
    margin-top: 8px;
    box-sizing: border-box;
    padding: 8px;
}
p.home-from-list-head{
	background-color: #e0a794;
	margin: -8px;
	margin-bottom: 8px;
	text-align: center;
	text-transform: uppercase;
	font-size: 0.8em;
	color: #fff;
	padding: 8px 0;
	transition: all .4s ease-in;
}

#lic-list-vid,
.home-from-list{
	display: flex;
	position: relative;
	flex-wrap: nowrap;
	flex-direction: row;
	align-items: flex-start;
	justify-content: space-between;
	width: fit-content;
	transition: all .4s ease-in;
}
#left_scroll_lic,
#left_scroll_vid,
#left_scroll{
	cursor: pointer;
	position: absolute;
	left: 0;
	top: calc(50% - 30px);
	width: 35px;
	height: 60px;
	display: flex;
	z-index:100;
	background-color: #e0a79491;
	color:#fff;
	font-size: 2em;
	border-top-right-radius: 50em;
	border-bottom-right-radius: 50em;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
	padding-right: 6px;
}
#right_scroll_lic,
#right_scroll_vid,
#right_scroll{
	cursor: pointer;
	position: absolute;
	right: 0;
	top: calc(50% - 30px);
	width: 35px;
	height: 60px;
	display: flex;
	z-index:100;
	background-color: #e0a79491;
	color:#fff;
	font-size: 2em;
	border-top-left-radius: 50em;
	border-bottom-left-radius: 50em;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
	padding-left: 6px;
}
.home-from-block:hover {
    transform: scale(1.2) !important;
    border: none;
    top: -16px;
    position: relative;
}
.home-from-block:hover .home-from-list-head{
	background-color: #a36e7e;
}
.center {
    text-align: center;
}
.hidden{
	display: none !important;
}
.ui-loader {
    display: none;
}
.info-block h4 {
    text-align: center;
    display: block;
    background-color: #e0a794;
    box-sizing: border-box;
    padding: 8px 0px;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 0.9em;
    color: #fff;
    margin: -8px;
    margin-bottom: 8px;
}
.info-block p {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-size: 0.8em;
    text-align: justify;
    color: #333;
}
.info-block {
    width: 100%;
    max-width: 320px;
    height: 420px;
    box-sizing: border-box;
    padding: 8px;
    margin: 10px;
    border: 1px solid #efefef;
    background: #fff url(/static/home/img/overlay.png);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
	opacity: 0;
}
.info-btn {
    display: block;
    border: none;
    text-transform: uppercase;
    color: #fff;
    background-color: #916278;
    padding: 8px;
    margin-top: 8px;
    cursor: pointer;
}
.info-blocks {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    flex-direction: row;
    align-content: center;
    justify-content: center;
    align-items: center;
}
.show-zoom {
    max-width: 50%;
    margin: 10px 25%;
    cursor: pointer;
    width: 150px;
    height: 150px;
    display: block;
    position: relative;
    background: url(/static/img/logo.png) no-repeat;
    background-size: 100% 100%;
}
.show-zoom:hover .zoomer {
    display: flex;
}
.zoomer {
    position: absolute;
    font-size: 24px;
    color: #fff;
    display: none;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    justify-content: center;
    align-items: center;
    background-color: #04040469;
    border-radius: 15px;
}
.close-shower, .close-preview, .close-presentation {
    position: absolute;
    right: 4px;
    top: 4px;
    font-size: 2em;
    background-color: #fff;
    cursor: pointer;
    z-index: 1000;
    border-radius: 50em;
    width: 1.5em;
    color: red;
    text-align: left;
}
#shower {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background-color: #000000a1;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}
.logo-preview-zoom {
    position: relative;
    display: block;
    max-height: calc(100% - 100px);
    max-width: calc(100% - 100px);
    height: auto;
    width: auto;
}
#show_preview {
    position: fixed;
    z-index: 10000;
    width: 100%;
    height: 100%;
    background-color: #fff;
    display: block;
    box-sizing: border-box;
    top: 0;
    left: 0;
}
#iframe_preview {
    display: block;
    width: 100%;
    height: 100%;
    border: none;
}
#show-full-info {
    font-size: 0.8em;
    width: auto;
    box-sizing: border-box;
    padding: 8px;
    display: inline-block;
    background-color: #e0a794;
    color: #fff;
    cursor: pointer;
    position: relative;
    z-index: 1;
    border: none;
}
.full-info-block {
    width: 100%;
    box-sizing: border-box;
    padding: 8px;
    border: 1px solid #e0a794;
    background: #fff url(/static/home/img/overlay.png);
    position: relative;
    margin-top: -8px;
    z-index: 0;
    font-size: 0.8em;
    text-align: justify;
	transition: all .6s ease-in-out;
}
.shadow{
    box-shadow: 0px 4px 4px #3333335c;
}
.info-h3 {
    margin: 0;
    padding: 20px;
    font-size: 1.1em;
    text-align: center;
    color: #916278;
    margin-bottom: 60px;
    max-width: 1200px;
}
#lic-list {
    display: flex;
    position: relative;
    flex-wrap: nowrap;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: fit-content;
    transition: all .4s ease-in;
    min-height: 440px;
}
.items-lic {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    min-height: 270px;
    box-sizing: border-box;
    padding: 8px;
    margin: 30px;
    width: 250px;
    max-width: 250px;
    transition: all 0.6s ease;
    border: 1px solid #efefef;
    background: #fff url(/static/home/img/overlay.png);
    user-select: none;
    position: relative;
}
.items-lic:hover{
    transform: scale(1.02) !important;
    box-shadow: 0 0 8px #3333334d;
}
.item-lic-head {
    display: flex;
    margin: 0;
    padding: 8px;
    box-sizing: border-box;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    font-size: 0.8em;
    position: absolute;
    top: 0;
    cursor: pointer;
    left: 0;
    right: 0;
    height: 100%;
    flex-wrap: wrap;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    align-items: center;
    background-image: url(data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22100%22%20height%3D%22100%22%20viewBox%3D%220%200%20100%20100%22%20preserveAspectRatio%3D%22none%22%3E%3Cstyle%3Eline%20%7B%20stroke-width%3A%200.25px%3B%20stroke%3A%20%23ffffff26%3B%20%7D%3C%2Fstyle%3E%3Cline%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%22100%22%20y2%3D%22100%22%2F%3E%3Cline%20x1%3D%22100%22%20y1%3D%220%22%20x2%3D%220%22%20y2%3D%22100%22%2F%3E%3C%2Fsvg%3E);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%, auto;
    background-color: #e0a794;
    transition: all 0.4s cubic-bezier(0.76, -0.03, 0.58, 1);
}
.items-lic:hover .item-lic-head{
    margin: -8px;
    height: 46px;
	position: relative;
    display: block;
	background: #916278;
    transition: all 0.4s cubic-bezier(0.76, -0.03, 0.58, 1);
}
.price-lic p {
    margin: 0px;
    text-align: left;
    font-size: 0.8em;
}
.item-lic-head b {
    font-weight: 500;
    display: block;
    width: 100%;
    height: fit-content;
}
.fiolet{
	color: #916278;
}
.nopad{
	margin: 0;
}
footer {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
	text-align: center;
}
.home-footer {
    display: inline-flex;
    width: 100%;
    max-width: 1200px;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: space-between;
}
.support-block {
    width: 100%;
    max-width: 350px;
    margin: 20px;
    color: #fff;
    background-color: #ffffff1c;
    border: 1px solid #ffffff26;
    box-sizing: border-box;
    padding: 8px;
}
.footer-copyright {
    font-size: 0.7em;
    color: #fff;
    text-align: left;
    width: 100%;
    max-width: 350px;
    margin: 20px;
    background-color: #ffffff1c;
    border: 1px solid #ffffff26;
    box-sizing: border-box;
    padding: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}
.footer-copyright span {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.footer-copyright span iframe{
    width: 150px !important;
}
.home-footer-logo {
    display: inline-block;
    width: 24px;
    margin-right: 12px;
}
.href-bot.small {
    width: 100%;
    min-width: 250px;
}
.href-bot {
    display: flex;
    font-weight: 500;
    background-color: #54a9eb;
    padding: 7px;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    width: 100%;
    box-sizing: border-box;
    justify-content: center;
    align-items: center;
}
.tg-icon {
    background: url(data:image/svg+xml,%3Csvg%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22m1.95617055%2011.392196c5.77764656-2.42328736%209.63031585-4.02086673%2011.55800785-4.79273807%205.5039525-2.20384954%206.6476266-2.5866818%207.3930574-2.59932314.1639507-.00278035.5305319.0363352.7679878.22182361.2005031.15662277.2556695.36819788.2820684.51669348.026399.1484956.0592719.48677234.0331404.75109194-.2982611%203.0169019-1.5888322%2010.33812718-2.2454015%2013.71710898-.2778191%201.4297738-.8288514%201.7357846-1.3584441%201.7826999-1.1509274.1019576-2.0208916-.5588425-3.1356211-1.2622918-1.7443316-1.1007592-2.3854935-1.3972358-4.0786694-2.4713734-1.95675765-1.2413519-.8891962-1.8911034.2259543-3.0061212.2918402-.2918054%205.3989024-4.83750096%205.497052-5.24030969.0122753-.05037796-.1557336-.55407742-.2716182-.65323489-.1158847-.09915747-.2869204-.06524947-.4103446-.03828214-.17495.03822537-2.9615423%201.81132342-8.35977698%205.31929412-.79096496.5228681-1.50739646.7776269-2.1492945.7642766-.70764107-.0147176-2.06885864-.3851791-3.08078398-.7018404-1.24116762-.388398-1.69932554-.5713149-1.61342745-1.2309348.04474105-.3435709.36011227-.7024173.94611366-1.0765391z%22%20fill%3D%22%23fff%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E) no-repeat;
    width: 16px;
    display: block;
    height: 16px;
    background-size: contain;
    margin-right: 4px;
}
.home-footer-name {
    font-size: 34px;
}
.home-back-form {
    display: flex;
    text-align: left;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}
form#form-back {
    width: 100%;
    box-sizing: border-box;
}
#form-back label {
    text-transform: uppercase;
    font-size: 0.7em;
    letter-spacing: 1px;
    margin: 12px 0;
    display: block;
    color: #ffffffa3;
}
i.required-inp {
    color: #cb0c0c;
    font-size: 16px;
    display: inline-block;
    position: relative;
    top: 5px;
}
#form-back textarea,
#form-back input {
    width: 100%;
    box-sizing: border-box;
    padding: 8px;
    font-size: 1em;
    color: #fff;
    border: none;
    background-color: transparent;
    border-bottom: 1px solid #ffffff7a;
    letter-spacing: 1px;
}
input:focus, textarea:focus {
    -moz-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    appearance: none;
    box-shadow: inset 0px -5px 8px -6px #0000006b;
    outline: 0;
}
button.btn-home-send {
    border: none;
    text-transform: uppercase;
    color: #fff;
    font-size: 0.8em;
    padding: 12px;
    margin-top: 8px;
    width: 100%;
    background-color: #916278;
    cursor: pointer;
}
.good {
    background-color: #4dff0042;
    width: 100%;
    display: block;
    box-sizing: border-box;
    padding: 8px;
    color: #037d03;
}
.error {
    background-color: #ff000030;
    width: 100%;
    display: block;
    box-sizing: border-box;
    padding: 8px;
    color: #770101;
}
img.img-captcha {
    width: 100%;
    height: 90px;
}
#captcha {
    display: flex;
    width: 100%;
    height: 90px;
    background: rgb(145, 98, 120);
    justify-content: center;
    cursor: pointer;
    align-items: center;
}
.lbl-captcha{
	cursor:pointer;
}
svg#mob-block {
    position: absolute;
    top: calc(0% + 160px);
    left: calc(50% - 360px);
    width: 570px;
    height: 320px;
    opacity: 0.9;
    transform: scale(2) rotate3d(1, 1, 0.5, 286deg);
    z-index: 20;
}
svg#earth-block {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0.1;
    top: 0;
    left: 0;
    z-index: 22;
    padding: 50px;
    box-sizing: border-box;
}
#svgtext {
    font-size: 2em;
    font-weight: 800;
}
#circin0{
    animation: 3s ease-in-out 1s alternate infinite circin0;
}
#circin1{
	animation: 3s ease-in-out 1s alternate infinite circin1;
}
#circin2{
	animation: 3s ease-in-out 1s alternate infinite circin2;
}
#circin3{
	animation: 3s ease-in-out 1s alternate infinite circin3;
}
#circin4{
	animation: 3s ease-in-out 1s alternate infinite circin4;
}
#circin5{
	animation: 3s ease-in-out 1s alternate infinite circin5;
}
#rectin1{
	animation: 3s ease-in-out 1s alternate infinite rectin1;
}
#rectin2{
    opacity: 0.3;
	animation: 3s ease-in-out 1s alternate infinite rectin2;
}
#rectin3{
	animation: 3s ease-in-out 1s alternate infinite rectin3;
}
#textsvg{
    font-weight: 900;
    font-size: 2em;
    animation: 
	3s ease 1s alternate infinite svgtext;
}
#earth-block{
    transform: scale(0);
    animation: 36s linear 1s infinite earth;
    transition: transform 1s;
}
@keyframes circin0 {
  from { transform: translate3d(0px, 0px, 0px) scale(1);
  } to { 
    transform: translate3d(120px, -60px, 0px) scale(1.8) rotate3d(0, 1, 0, 117deg); }
}
@keyframes circin1 {
  from { transform: translate3d(0px, 0px, 0px) scale(1);
  } to { 
    transform: translate3d(105px, -40px, 0px) scale(1.5) rotate3d(1, 1, 0, 292deg); }
}
@keyframes circin2 {
  from { transform: translate3d(0px, 0px, 0px) scale(1);
  } to { 
    transform: translate3d(158px, -98px, 0px) scale(1.74) rotate3d(1, 0, 1, 78deg); }
}
@keyframes circin3 {
  from { transform: translate3d(0px, 0px, 0px) scale(1);
  } to { 
    transform: translate3d(180px, -50px, 0px) scale(0.6) rotate3d(0, 0, 1, 71deg); }
}
@keyframes circin4 {
  from { transform: translate3d(0px, 0px, 0px) scale(1);
  } to { transform: translate3d(18px, -6px, 0px) scale(1.02); }
}
@keyframes circin5 {
  from { transform: translate3d(0px, 0px, 0px) scale(1);
  } to { 
    transform: translate3d(-20px, 60px, 0px) scale(0.6) rotate3d(0, 1, 1, 5deg); }
}
@keyframes svgtextout {
  from { transform: scale(1) rotate3d(1, 1, 1, 0deg); font-size: 3em;
  } to { transform: scale(2) rotate3d(1.25, 2, -1, 0deg); font-size: 3em; }
}
@keyframes svgtext {
0% {
    transform: scale(1) translate3d(0px, 0px, 0px) rotateZ(0deg);
}

50% {
    transform: scale(1.6) translate3d(50px, -50px, 0px) rotate3d(0, 1, 1, 37deg);
}
100% {
    transform: scale(2.2) rotate3d(0, 1, 1, 77deg) translate3d(70px, -290px, 0px);
    font-size: 3em;
}
}
@keyframes rectin1 {
  from { transform: translate3d(0px, 0px, 0px) scale(1);
  } to { 
    transform: translate3d(20px, -20px, 0px) scale(1.1); }
}
@keyframes rectin2 {
  from { transform: translate3d(0px, 0px, 0px) scale(1);
  } to { 
    transform: translate3d(80px, -50px, 0px) scale(1.2); }
}
@keyframes rectin3 {
  from { transform: translate3d(0px, 0px, 0px) scale(1);
  } to { 
    transform: translate3d(50px, -80px, 0px) scale(1.3); }
}
@keyframes earth {
	0% {
    transform: rotateZ(0deg) scale(1);
}

100% {
    transform: rotateZ(360deg) scale(1);
}
}
video#bg_vid {
    opacity: 0.1;
    z-index: 1;
    display: block;
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%;
    position: relative;
}
#steps {
    display: flex;
    width: 100%;
    box-sizing: border-box;
    padding: 40px;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
    justify-content: center;
}
.step {
    position: relative;
    display: flex;
    width: 100%;
    min-width: 210px;
    height: 180px;
    box-sizing: border-box;
    padding: 8px;
    padding-left: 42px;
    padding-right: 38px;
    transition: all 0.6s;
    max-width: 320px;
    overflow: hidden;
}
.back-step {
    position: absolute;
    top: 73px;
    left: -73px;
    transform: rotate(270deg);
    width: 180px;
    background: #fba883;
    color: #fff;
    text-transform: uppercase;
    box-sizing: border-box;
    padding: 8px;
    font-weight: 800;
    letter-spacing: 2px;
    z-index: 30;
}
.title-step {
    font-size: 20px;
    color: #916278;
    font-weight: 300;
    text-transform: uppercase;
    position: absolute;
    right: 20px;
    bottom: 0;
    top: 0;
    left: 34px;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-top: 1px solid #33333326;
    border-bottom: 1px solid #33333326;
}
.icon-step {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: space-between;
    flex-wrap: nowrap;
}
.icon-step i {
    font-size: 3em;
    border: 0;
    width: auto;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    box-sizing: border-box;
    color: #11111117;
}
.icon-step i:last-child{
    align-items: flex-end;
}
.step:after {
    content: "";
    position: absolute;
    background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220px%22%20height%3D%22180px%22%20viewBox%3D%220%200%2020%20180%22%20fill%3D%22currentColor%22%3E%3Cpath%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20d%3D%22M%200%2C0%20L%2020%2C90%20L%200%2C180%22%20fill%3D%22none%22%20stroke%3D%22%2333333326%22%20stroke-width%3D%221%22%2F%3E%3C%2Fsvg%3E);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    width: 20px;
    height: 180px;
    top: 0;
    z-index: 20;
    right: 0;
}
.step:last-child:after{
    content: "\10f164";
    font-family: "Font Awesome 6 Duotone";
    font-weight: 900;
    background: none;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    font-size: 2em;
    color: #33333326;
    right: 0;
    box-sizing: border-box;
    padding-right: 3px;
    border-radius: 50em;
    border: 1px solid;
    border-left: none;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
span.step-info {
    font-size: 0.8em;
    height: 180px;
    position: absolute;
    z-index: 20;
    background-color: #fff;
    overflow: hidden;
    top: 0;
    display: flex;
    text-align: justify;
    box-sizing: border-box;
    border-top: 1px solid #33333326;
    border-bottom: 1px solid #33333326;
    transition: all 0.4s;
    width: 260px;
    padding: 4px;
    margin-right: 20px;
    left: -260px;
    align-items: center;
}
.step:hover .step-info{
    left: 34px;
}
#cookie_note{
    display: none;
    position: fixed;
    bottom: 15px;
    left: 50%;
    max-width: 90%;
    transform: translateX(-50%);
    padding: 20px;
    background-color: white;
    border-radius: 4px;
    box-shadow: 2px 3px 10px rgba(0, 0, 0, 0.4);
    z-index: 1000;
}

#cookie_note p{
    margin: 0;
    font-size: 0.7rem;
    text-align: left;
    color: black;
    width: 100%;
}

.cookie_accept{
    width: 100px;
    background-color: #916278;
    border: none;
    cursor: pointer;
    font-family: 'Montserrat Alternates';
    text-transform: uppercase;
    color: #fff;
    font-size: 0.7em;
    min-height: 32px;
    margin-top: 20px;
}
@media (min-width: 576px){
    #cookie_note.show{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: space-between;
    }
}

@media (max-width: 575px){
    #cookie_note.show{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    width: 100%;
    }
}
.img-keys {
    height: 120px;
    width: 232px;
}
#map{
    display: block;
    width: 332px;
    height: 610px;
    position: relative;
    z-index: 5;
}
#loading{
    animation: rotate 2s linear infinite;
    width: 45px;
    height: 45px;
    position: absolute;
    bottom: 285px;
    left: 150px;
    border: 5px solid #916278;
    border-bottom: 5px solid transparent;
    border-radius: 50em;
    z-index: -1;
}
.mapper {
    font-size: 0.9em;
    color: #fff;
    text-align: left;
    width: 100%;
    max-width: 350px;
    margin: 20px;
    background-color: #ffffff1c;
    border: 1px solid #ffffff26;
    box-sizing: border-box;
    padding: 8px;
    min-height: 710px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    position: relative;
    overflow: hidden;
}
#divviewer {
    position: absolute;
    height: 100%;
    bottom: 0;
    right: 0;
    width: 50%;
    z-index: 2500;
    background-color: #333333c4;
    color: #fff;
    box-sizing: border-box;
    padding: 8px;
    padding-top: 24px;
    overflow: auto;
}
.close-map-shower {
    position: absolute;
    top: 7px;
    right: 8px;
    color: #ff8484;
    cursor: pointer;
    font-size: 20px;
}
.img-brand-maps-shower {
    width: auto;
    height: auto;
    max-width: 40px;
    max-height: 40px;
    float: left;
    margin-right: 15px;
    margin-bottom: 15px;
}
a.href-maps {
    color: #fff;
}
.maps-shower-header {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 40px;
    margin-bottom: 15px;
    display: block;
}
.maps-shower-proj-img {
    width: auto;
    height: auto;
    max-width: 40px;
    max-height: 40px;
    margin-right: 10px;
}
.href-proj-shower {
    height: 60px;
    display: flex;
    width: 100%;
    color: #fff;
    font-size: 0.9em;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 10px;
}
.href-proj-shower:hover {
    background-color: #ffffff1f;
}
.href-proj-shower {
    height: 60px;
    display: flex;
    width: 100%;
    color: #fff;
    font-size: 0.9em;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 10px;
    border-radius: 5px;
}
.create-route-map-shower {
    position: absolute;
    top: 8px;
    left: 8px;
    font-size: 0.6em;
    background-color: #979797;
    box-sizing: border-box;
    padding: 4px;
    text-transform: uppercase;
    width: 120px;
    text-align: center;
    border-radius: 5px;
    cursor: pointer;
}
@keyframes rotate {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

a.intro-start {
    margin: 8px;
    text-decoration: none;
    text-transform: uppercase;
    box-sizing: border-box;
    width: 100%;
    display: flex;
    height: 80px;
    justify-content: space-evenly;
    font-size: 1.6em;
    /* border-radius: 15px; */
    /* box-shadow: 0 0 8px #00000061; */
    letter-spacing: 1px;
    transition: all;
    transition-duration: 0.8s;
    transition-timing-function: ease-in-out;
    color: #fff;
    background-color: #fba883;
    /* border: 3px solid; */
    flex-direction: row;
    font-weight: 600;
    opacity: 0.4;
    transform: skewX(90deg) translateX(400px) scale(0.1) translateY(400px);
    max-width: 260px;
    align-items: center;
}
.demo-btn:hover,
.promo-registration:hover,
a.intro-start:hover{
	opacity: 1;
    color: #fffdff;
    box-shadow: 0 0 18px #f9e2a0;
}
a.intro-start small.home-username{
	font-size: 0.3em;
	display: block;
	text-align: center;
}
.promo-registration {
    padding: 8px;
    margin: 8px;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    box-sizing: border-box;
    width: 100%;
    display: flex;
    height: 80px;
    justify-content: space-evenly;
    font-size: 1.1em;
    /* border-radius: 15px; */
    /* box-shadow: 0 0 8px #00000061; */
    letter-spacing: 1px;
    transition: all;
    transition-duration: 0.8s;
    transition-timing-function: ease-in-out;
    color: #fff;
    background-color: #fba883;
    /* border: 3px solid; */
    flex-direction: row;
    font-weight: 600;
    opacity: 0.4;
    transform: skewX(90deg) translateX(-400px) scale(0.1) translateY(-400px);
    max-width: 260px;
    align-items: center;
}
.promo-registration span {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.promo-registration .profile {
    font-size: 1.9em;
}
.promo-registration b {
    text-transform: uppercase;
    color: #b1ff8b;
    letter-spacing: 1px;
    font-size: 1.3em;
	text-shadow: none;
}
.arrowup {
    font-size: 1.2em;
    opacity: 0.8;
    text-shadow: none;
    background-color: #fff;
    color: #f1a07cba;
    padding: 8px 10px;
    border-radius: 50em;
}
.profile {
    font-size: 1.2em;
    opacity: 0.8;
    text-shadow: none;
    background-color: #fff;
    color: #f1a07cba;
    padding: 8px 10px;
    border-radius: 50em;
}
.btn-show-presentation,
.demo-btn {
    text-decoration: none;
    margin: 8px;
    text-transform: uppercase;
    box-sizing: border-box;
    width: 100%;
    display: flex;
    height: 80px;
    justify-content: space-evenly;
    /* border-radius: 15px; */
    /* box-shadow: 0 0 8px #00000061; */
    letter-spacing: 1px;
    transition: all;
    transition-duration: 0.8s;
    transition-timing-function: ease-in-out;
    color: #fff;
    background-color: #fba883;
    /* border: 3px solid; */
    flex-direction: row;
    font-weight: 600;
    opacity: 0.4;
    transform: skewX(90deg) translateX(-400px) scale(0.1) translateY(-400px);
    max-width: 260px;
    align-items: center;
    cursor: pointer;
}
.demo-btn span {
    width: min-content;
}
.demo-btn .profile {
    font-size: 2em;
    padding: 8px;
}
.btn-href {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;
}
div[id*='yandex_'] {
    overflow: auto;
}
.video_example {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: center;
    align-items: center;
    padding: 8px;
    box-sizing: border-box;
}
.video_example video{
    width: 100%;
    max-width: 240px;
    box-sizing: border-box;
    box-shadow: 0 0 8px #c9c7c475;
    margin: 10px;
}
.home-from-block .video_example {
    padding: 0;
    max-height: 330px;
}
#btn-share {
    background-color: transparent;
    border: none;
    width: 45px;
    height: 45px;
    font-size: 2.5em;
    color: #ffffffbd;
    cursor: pointer;
    transition: all 0.4s ease-in-out;
    position: absolute;
    top: 14px;
    left: 14px;
    z-index: 10;
}
#btn-apps {
    background-color: transparent;
    border: none;
    width: 45px;
    height: 45px;
    font-size: 2.5em;
    color: #ffffffbd;
    cursor: pointer;
    transition: all 0.4s ease-in-out;
    position: absolute;
    top: 64px;
    left: 14px;
    z-index: 10;
}
span.vk-link {
    width: 100%;
    box-sizing: border-box;
    padding: 0px;
    color: #fff;
    margin-top: 5px;
    display: block;
}
#vk_subscribe {
    width: 100%;
    display: flex
;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 1.1em;
    background-color: #54a9eb;
    padding: 4px;
    box-sizing: border-box;;
}
#vk_subscribe span {
    padding-left: 4px;
}
.example_quest_btn {
    text-decoration: none;
    margin: 8px;
    text-transform: uppercase;
    box-sizing: border-box;
    width: 100%;
    display: flex;
    height: 80px;
    justify-content: space-evenly;
    /* border-radius: 15px; */
    /* box-shadow: 0 0 8px #00000061; */
    letter-spacing: 1px;
    transition: all;
    transition-duration: 0.8s;
    transition-timing-function: ease-in-out;
    color: #fff;
    background-color: #fba883;
    /* border: 3px solid; */
    flex-direction: row;
    font-weight: 600;
    opacity: 0.4;
    transform: skewX(90deg) translateX(-400px) scale(0.1) translateY(-400px);
    max-width: 260px;
    align-items: center;
    cursor: pointer;
}
.mapper-href {
    text-decoration: none;
    /* margin: 8px; */
    text-transform: uppercase;
    box-sizing: border-box;
    width: 100%;
    display: flex;
    height: 80px;
    justify-content: space-evenly;
    /* border-radius: 15px; */
    /* box-shadow: 0 0 8px #00000061; */
    letter-spacing: 1px;
    transition: all;
    transition-duration: 0.8s;
    transition-timing-function: ease-in-out;
    color: #fff;
    background-color: #fba883;
    /* border: 3px solid; */
    flex-direction: row;
    font-weight: 600;
    /* max-width: 260px; */
    align-items: center;
    cursor: pointer;
    opacity: 0.7;
}
.pin-maps {
    width: 45px;
}
.mapper-href:hover {
    opacity: 1;
    color: #fffdff;
    box-shadow: 0 0 18px #f9e2a0;
}
.footer-menu a {
    color: #fff;
    text-decoration: underline;
}
#present-block {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    border: none;
}