html,body,div,ul,li,dl,dt,dd,td,th,h1,h2,h3,h4,h5,h6,p,pre,blockquote,fieldset,form,input,button,textarea {margin:0;padding:0;}h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th {font-size:1.0em;font-weight:normal;font-style:normal;}ul,li {list-style:none;}fieldset,img {border:none;}img {-ms-interpolation-mode:bicubic;}caption, th {text-align:left;}table {border-collapse:collapse;border-spacing:0;}input,textarea,select {font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select {font-size:100%;}button {background-color:transparent;text-decoration:none;}label {cursor:pointer;}
*,* :after,* :before { box-sizing:border-box;-webkit-user-drag:none!important; }
::-webkit-scrollbar {	background-color:rgba(0,0,0,0);width:1px;height:1px;border-radius:10px;}::-webkit-scrollbar-thumb {background-color:#0090e0;border-radius:10px;	}
::-moz-scrollbar {	background-color:rgba(0,0,0,0);width:1px;height:1px;border-radius:10px;}::-moz-scrollbar-thumb {background-color:#0090e0;border-radius:10px;	}
::-ms-scrollbar {	background-color:rgba(0,0,0,0);width:1px;height:1px;border-radius:10px;}::-ms-scrollbar-thumb {	background-color:#0090e0;border-radius:10px;	}

[view="yes"] { display:block; }
[view="no"] { display:none; }

a { color:inherit;text-decoration:none;border:0; }
a.lnk { border-bottom:1px dashed rgba(0,0,0,0.3); }
a[name] { position:absolute;height:2.4em;margin-top:-2.4em;}

body  {--fs:1vw;font: 300 1.5em/1.3em arial,sans-serif;letter-spacing:0;height:300vh; }
body * { -webkit-appearance: none!important; }

h2 {font-weight:400;font-size:2em;line-height: 1em;margin-bottom:1em;text-align:left;}
h3 {font-weight:400;font-size:1.5em;margin-bottom:0.75em;text-align:left;}

.col  {position:relative;display:inline-block;width:33.333%;margin:0;padding:0;vertical-align:top;}
.col1 {position:relative;display:inline-block;width:25%;margin:0;padding:0;vertical-align:top;}
.col2 {position:relative;display:inline-block;width:50%;margin:0;padding:0;vertical-align:top; }
.col3 {position:relative;display:inline-block;width:66.666%;margin:0;padding:0;vertical-align:top;}
.col4 {position:relative;display:inline-block;width:100%;margin:0;padding:0;vertical-align:top;}

textarea,
input {width: calc(100% - 6em);background-color: #fff;outline:none;border:0;padding:0.5em 1em;margin:0 0 0.5em 0;border-radius:1em;position: relative;float: right;}
textarea:-webkit-autofill,
input:-webkit-autofill{-webkit-box-shadow:inset 0 0 0 50px #fff!important;-webkit-text-fill-color:#000!important;color:#000!important;}
textarea::-webkit-input-placeholder,input::-webkit-input-placeholder{text-indent:0px;font-size:0.8em;line-height:2em;transition:text-indent 0.3s ease;text-align:left;color:rgba(0,0,0,0.5);}
textarea::-moz-placeholder,input::-moz-placeholder                  {text-indent:0px;font-size:0.8em;line-height:2em;transition:text-indent 0.3s ease;text-align:left;color:rgba(0,0,0,0.5);}
textarea:-moz-placeholder,input:-moz-placeholder                    {text-indent:0px;font-size:0.8em;line-height:2em;transition:text-indent 0.3s ease;text-align:left;color:rgba(0,0,0,0.5);}
textarea:-ms-input-placeholder,input:-ms-input-placeholder          {text-indent:0px;font-size:0.8em;line-height:2em;transition:text-indent 0.3s ease;text-align:left;color:rgba(0,0,0,0.5);}
textarea:focus,input:focus { background-color:#fff; }
textarea:focus::-webkit-input-placeholder,
input:focus::-webkit-input-placeholder {text-indent:70em;transition:text-indent 0.7s ease;text-align:left;white-space:nowrap;}
textarea:focus::-moz-placeholder,
input:focus::-moz-placeholder      {text-indent:70em; transition:text-indent 0.7s ease;text-align:left;white-space:nowrap;}
textarea:focus:-moz-placeholder,
input:focus:-moz-placeholder       {text-indent:750em; transition:text-indent 0.7s ease;text-align:left;white-space:nowrap;}
textarea:focus:-ms-input-placeholder,
input:focus:-ms-input-placeholder  {text-indent:70em; transition:text-indent 0.7s ease;text-align:left;white-space:nowrap;}

textarea {height: 5em;display: block;font-size:1em;line-height:1.25em;}

.pdf,.pdf2,button {position: relative;border:0;outline:none!important;box-shadow:inset 0 0.05em 0.1em 0px rgba(0,0,0,0.5),inset 0 1em 0.5em 0 #eee;width:-webkit-max-content;width:max-content;height:2.5em;font-size:1em;line-height:1.1em;color: #000;background-color: #fff;padding:0.75em 1.5em;cursor: pointer;border-radius:2em;white-space: nowrap;}
.pdf:hover,.pdf2:hover,button:hover { line-height:1.2em;background-color:rgba(255,255,255,0.75);box-shadow:inset 0 0.1em 0.2em 0px rgba(0,0,0,0.5),inset 0 -1em 0.5em 0 #fff; }
button.center { display:block;margin-left:auto;margin-right:auto; }

.pdf,.pdf2 { color:#000;margin: 2em 0;z-index:12; }
.pdf::before,.pdf2::before { content:'Подробнее'; }
.pdf2 {background-color:#ccc;box-shadow:inset 0 0.025em 0.2em 0px rgba(0,0,0,0.5),inset 0 1em 0.5em 0 #fff;}


ul {margin:0;padding: 0 0 1em 1.25em;}
ul li {list-style-type:square;}

ol {margin:0;padding: 0 0 0 calc(3*var(--fs));counter-reset: myCounter;}
ol li{list-style: none;margin-bottom: calc(1*var(--fs));min-height: calc(2.5*var(--fs));padding: calc(0.75*var(--fs)) 0 0 0;}
ol li:before {counter-increment:myCounter;content:counter(myCounter);color:#ffffff;background-color: #0090e0;position: absolute;display: block;text-align:center;font-size: 1em;line-height: 2em;width: 2em;height: 2em;border-radius: 1em;margin-top: -0.25em;margin-left: -2.5em;}


#menu {position:fixed;width:30em;height:30em;left:50vw;top:50vh;z-index:1;transform:scale(0.01);transform-origin:center center;transition:all .5s ease;padding:0;margin:-15em;overflow-x:hidden;overflow-y:auto;-webkit-user-select:none;user-select:none;opacity:0;}
#menu:target { transform:scale(1);z-index:4;opacity:1;}
#menu:target + a .sm-menu { opacity:0; }

ul.menu { padding:0;margin:0; }
ul.menu li {list-style-type:none;position:relative;float:left;font-size: 1em;line-height:1.25em;width: 10em;height: 10em;text-align:center;background-color:#909090;color:#fff;padding: 4em 1em;cursor:pointer;margin: 0;box-shadow: inset -3em 3em 3em -2em #ffffff22, inset 0 0 2px 0 #fff;}
ul.menu li:hover,
ul.menu li[act="yes"] { box-shadow: inset 3em -3em 3em -2em #00000022, inset 0 0 2px 0 #fff;}

#logo {position:fixed;left:5em;top:5em;height: 3em;z-index: 12;cursor:pointer;background-color: rgba(255,255,255,0.5);text-align: center;padding: 1em;border-radius: 2em;box-shadow: inset 0 0.05em 0.1em 0px rgba(0,0,0,0.5), inset 0 0.75em 1em 0 #eee;}
#logo img {position: relative;float: left;overflow: hidden;height: 1em;}

.sm-menu {position: fixed;top: 2.5em;right: 2.5em;color: #000;width: 1.5em;height: 1.5em;font-size: 2em;line-height: 1em;z-index: 9;background-color: rgba(255,255,255,0.5);text-align: center;padding:calc(2px + 0.25em) 0.25em;border-radius: 1em;opacity: 1;box-shadow: inset 0 0.05em 0.1em 0px rgba(0,0,0,0.5), inset 0 1em 0.5em 0 #eee;}
.sm-menu::before { position:relative;content:'\2261';display:block;}.sm-menu0::before { content:'\2237';}.sm-menu1::before { content:'\2261';}.sm-menu2::before { content:'\2263';}.sm-close::before { content:'\2715';}.sm-close1::before { content:'\2716';}.sm-close2::before { content:'\2297';}

#next {position:fixed;left:calc(50vw - 1.5em);bottom:5em;width:3em;height:3em;z-index:4;cursor:pointer;background-color: rgba(255,255,255,0.5);text-align: center;padding: 0.9em;border-radius: 2em;box-shadow: inset 0 0.05em 0.1em 0px rgba(0,0,0,0.5), inset 0 0.75em 1em 0 #eee; }
#next img {height:1.2em;}

#phone {position: fixed;top: 2.5em;right: 5em;color: #000;width: 1.5em;height: 1.5em;font-size: 2em;line-height: 1em;z-index: 9;background-color: rgba(255,255,255,0.5);text-align: center;padding:calc(2px + 0.25em) 0.25em;border-radius: 1em;opacity: 1;box-shadow: inset 0 0.05em 0.1em 0px rgba(0,0,0,0.5), inset 0 1em 0.5em 0 #eee;}
#phone::before {position:relative;font-size: 0.7em;font-weight: 600;content: ')';transform: rotate(35deg);display:block;}

#logo:hover,
.sm-menu:hover,
#phone:hover,
#next:hover { background-color:rgba(255,255,255,0.75);box-shadow:inset 0 0.1em 0.2em 0px rgba(0,0,0,0.5),inset 0 -1em 0.5em 0 #fff; }

h1 {position:fixed;right:0;bottom:5em;margin: 0;z-index:10;text-align:center;color: #000;font: 400 1em/1em sans-serif;text-transform: uppercase;background-color: rgba(255,255,255,0.9);padding: 2em 5em;overflow: hidden;}
p {position:relative;width:100%;text-align:justify;margin-bottom:0.75em;}
p span { position:relative;float:left;font-size:0.5em;margin-top:-1em;margin-bottom:-0.1em; }
p span.n { font-size:1em;margin:0;width:6em; }

section {position:fixed;left:0;top:0;width:100vw;height:100vh;overflow:hidden;background: #fff none center center / cover no-repeat;transition:transform 0.5s,opacity 0.4s,background 3s;opacity:0;transform-origin:center center;}
section.on { transform:scale(1);opacity:1;z-index:3; }
section.fwd { transform:scale(0.5);opacity:0;z-index:0;}
section.bck { transform:scale(2);opacity:0;z-index:0;}

#c1   {background-image: url(1.jpg); }
#c2   {background-image: url(2.jpg); }
#c3   {background-image: url(3.jpg); }
#c4   {background-image: url(4.jpg); }
#c5   {background-image: url(5.jpg); }
#c6   {background-image: url(6.jpg); }
#c7   {background-image: url(7.jpg); }
#c8   {background-image: url(8.jpg); }
#c9   {background-image: url(9.jpg); }

.left section { background-position:left center; }
.right section { background-position:right center; }

article { position:fixed;left:50vw;top:50vh;width:30em!important;height:30em!important;margin:-15em;z-index:4;background-color:#fff;padding:4.5em;opacity:0.9;transform-origin:center center;transition:opacity 0.5s;box-shadow: 0 0 0 1px #fff, 0 0 1em 0 #fff, 0 0 5em 0 #fff; } 

#quest    {opacity:0!important;z-index:1!important;color:#fff!important;transform:rotate(180deg) scale(0.01)!important;transition:all 1s ease,border-radius 1s 0.5s ease!important;border-radius:50%!important;box-shadow:none;}
#quest:target    {transform:rotate(0deg) scale(1)!important;background-color:#3090c0!important;z-index:19!important;opacity: 1!important;border-radius:0!important;}
#quest h2 { font-size: 1.75em!important;color:#fff!important; }
#quest .n {float: left;width: 7em;font-size: 0.8em;line-height: 3.2em;}
#quest button {margin-top:1em;overflow:hidden;}
#quest button.no {float: right;margin: 1em 0 0 -1em;transform: scale(0.7);transform-origin: right bottom;color: rgba(0,0,0,0.7);}
#quest button.yes {float: left;margin-left: 6em;width: 8em;}

#contacts {opacity:0!important;z-index:1!important;color: #000!important;transform:rotate(180deg) scale(0.01)!important;transition:all 1s ease,border-radius 1s 0.5s ease!important;border-radius:50%!important;box-shadow:none;background-color: #fff!important;}
#contacts:target {transform:rotate(0deg) scale(1)!important;z-index:12!important;opacity: 1!important;border-radius:0!important;}
#contacts h2 { font-size: 1.75em!important;color:#2088cc!important; }
#contacts img {position:relative;float:right;width:50%;margin:0;}
#contacts p {font-size: 0.8em;}
#contacts p .n {position: inherit;font-size: 0.8em;line-height:1.5em;float: none;margin:0;width: 100%;display: block;}

.fwd article, .bck article { opacity:0;}

ul.menu li.shopping {background-color: #eee;color: #000;}
ul.menu li.expo { background-color:#3c90cc;color:#fff; }
ul.menu li.ai { background-color:#2c66cc;color:#fff; }
ul.menu li.partners { background-color:#ffffff;color:#000; }
ul.menu li.modes { background-color:#d03060;color:#fff; }
ul.menu li.space { background-color:#000000;color:#fff; }
ul.menu li.security { background-color:#005070;color:#fff; }
ul.menu li.faq { background-color:#e0e6f3;color:#000; }
ul.menu li.team { background-color:#002950;color:#fff; }

#msg {position:fixed;opacity: 1;right:-150vw;top: calc(50vh - 3.5em);width: 30em;height: 7em;margin:0;background-color: rgba(255,255,255,0.9);box-shadow: 0 0 0 1px #fff, 0 0 1em 0 #fff, 0 0 5em 0 #fff;padding:0;font-weight:400;font-size:1em;line-height:1.25em;padding: 3em;border-radius:0;color:#000;text-align:center;z-index:500000000;}
#msg { -webkit-transition:all 0.3s ease-out;-moz-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out;transition:all 0.3s ease-out;}
#msg[view="yes"] {
-webkit-animation:msg 3s 1 alternate ease-in-out;
   -moz-animation:msg 3s 1 alternate ease-in-out;
     -o-animation:msg 3s 1 alternate ease-in-out;
        animation:msg 3s 1 alternate ease-in-out;
}
@-webkit-keyframes msg { 5%,95% { opacity:1;right:calc(50vw - 15em);} 0%,100% { opacity:0;right:-150vw;} }
   @-moz-keyframes msg { 5%,95% { opacity:1;right:calc(50vw - 15em);} 0%,100% { opacity:0;right:-150vw;} }
     @-o-keyframes msg { 5%,95% { opacity:1;right:calc(50vw - 15em);} 0%,100% { opacity:0;right:-150vw;} }
        @keyframes msg { 5%,95% { opacity:1;right:calc(50vw - 15em);} 0%,100% { opacity:0;right:-150vw;} }

.rotate { animation: rotate 1s infinite linear; }
@-webkit-keyframes rotate {
  0% { transform:rotate(0deg); }
  100% { transform:rotate(360deg); }
}
@keyframes rotate {
  0% { transform:rotate(0deg); }
  100% { transform:rotate(360deg); }
}

@media (max-width:1600px) {
  body { font-size:1.2em; }
  #logo { left:3em;top:3em;}
  .sm-menu {top:1.5em;right:1.5em; }
  #phone {top:1.4em;right:4em;}
  #next {bottom:3em;}
}

@media (max-width:900px) {
  body { font-size:0.9em; }
  #logo { left:2em;top:2em;}
  .sm-menu {top:1em;right:1em;padding:0.25em;}
  #phone {top:1em;right:3em;padding:0.25em;}
  #next {bottom:2em;}
}
@media (max-width:600px) {
  body { font-size:0.75em; }
}

