:root
{
    --accent-color: rgb(106,58,217);
    --accent-color-05-opacity:  rgba(106,58,217, 0.5);
    --accent-color-02-opacity:  rgba(106,58,217, 0.2);
}

::selection {
  color: black;
  background:var(--accent-color);
}

.transition
{
	-webkit-transition: all .3s ease-in-out;
    -moz-transition:    all .3s ease-in-out;
    -o-transition:      all .3s ease-in-out;
    -ms-transition:     all .3s ease-in-out;
    transition:         all .3s ease-in-out;
}

.secretword
{
  color: var(--accent-color);
}

.big
{
  position:relative;display:block;float:left;width:100%;height: auto;padding:0px 8px 0 8px;margin-top:70px;background-color:rgb(0,0,0);
}

.fivecolumns{display: flex; flex-direction:column;float:left; width: calc(20% - 19.2px);height:calc(100% - 16px); padding:0px 8px 0px 8px; margin-bottom:16px;}



.inside{display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  float:left;
  width:calc(100% - 32px);
  height:auto;
  background-color:rgb(12,12,12);
  margin:16px 0 0 0;padding:16px;line-height: 25px;
  -webkit-transition: all .3s ease;
  -moz-transition: all .3s ease;
  -o-transition: all .3s ease;}

#firstblock:hover .inside{background-color:rgb(15,15,15)}
#zeroblock:hover .ava{opacity:1.0}
#zeroblock:hover .inside{background-color:rgb(15,15,15)}
.hovering:hover {background-color:rgb(15,15,15)}

.block:hover .inside{background-color:rgb(15,15,15)}

.mid_grey_bg:hover 
{
    background-color:rgb(15,15,15);
    cursor:text;
}

.ava{width: 100%;height:auto;display: block;float: left;margin-top:16px;opacity:0.8;-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
-o-transition: all .3s ease;}
.centerize {text-align: center;}
.title {font-size:20px;font-weight: normal;padding:0;margin:0;}
.uppercase{text-transform: uppercase;}
.transparentstyle{background-color: transparent;padding:0 0 20px 0;margin:15px 0 0 0;}
.paddingbottom{padding-bottom: 30px; }
.links{color:rgb(180,180,180)}
p{margin:0;font-size: 14px;}
html{overflow-y: auto; overflow-x: hidden;margin:0 !important;padding:0;}
body {letter-spacing: 1px;font-family: "Lato", sans-serif;background-color:rgb(0,0,0);margin:0;padding:0; color:rgb(180,180,180);overflow-y: hidden;overflow-x: hidden;}


footer {
	text-align: center;
	width:100vw;
	text-transform:uppercase;
	background-color: rgb(12,12,12);	
    height:70px;
}

header{
display:flex;
flex-direction:row;
align-items:center;
    
text-transform: uppercase;
font-size:13px;
height:70px;
background-color:rgb(12,12,12);
padding-left:20px;
position: fixed;
top: 0;
left: 0;
width: 100vw;
float:left;
z-index:9999;
}

header a {color: rgb(230,230,230);}
.logolink
{
    display:block;
    float:left;
    margin:0;
    padding:0px;
}
.scrollto
{
    padding:0;
    margin-left: auto;
}
.scrollto ul {margin:0;display:block;float:right;margin-right:20px;padding-left:0px;}
.scrollto ul li {margin-right:20px;float:left}



a {color:rgb(230,230,230); text-decoration:none;transition: 0.1s linear;}
a:hover {color:var(--accent-color);}






@keyframes showup {
	0% {opacity: 0;visibility: hidden;}
	1% {opacity: 0;visibility: visible;}
	100% {opacity: 1;visibility: visible;}
}
@keyframes hideit {
  0% {opacity: 1;visibility: visible;}
  99% {opacity: 0;visibility: visible;}
  100% {opacity: 0;visibility: hidden;}
}

.h1_h2
{
    font-size: 24px;
    margin-bottom: 40px;
    text-transform: uppercase;

}

.flex_column_center
{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    float:left;
}

.width100
{
    width:100%;
}

.div_about
{
    margin-bottom: 20px;
    width:50vw;
    height:auto;
}

.standart4
{
    width: calc(100% - 200px);
    min-height: calc(100vh - 270px);
    height: min-content;
    padding: 100px 100px 100px 100px;
    text-transform:uppercase;
    text-align: center;
}

.p2
{
    font-size: 14px;
    padding:15px 20px 15px 20px;
    margin:0;
    line-height:30px;
}

.form-control
{
    margin-top: 10px;
    border-style: none;
    color:rgb(180,180,180);
    border-width: 0px;
    padding:10px;
    text-transform: uppercase;
    width: 100%;
    max-width: 500px;
}

.form-control:focus
{
    outline: none;
}

.mid_grey_bg
{
    background-color: rgb(12,12,12)
}

.height40
{
    height:40px;
}

.height100
{
    height:100px;
}

.height_min_content
{
    height:min-content
}

.width100percent_max520px
{
    width: 100%;
    max-width: 520px;
    margin-top: 20px;
}

.margin_0
{
    margin: 0px;
}

.btn-primary
{
    text-transform: uppercase;
    border: none;
    color: rgb(180,180,180);
    padding: 12px 25px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
}
.btn-primary:hover
{
    cursor: pointer;
    background-color: var(--accent-color);
    color: black;
}



.backshow 
{
    animation-name: showup;
}

.backhide 
{
    animation-name: hideit;
}

.background
{
    animation-duration: 1s; 
    animation-fill-mode: both; 
    width: calc(100vw - 180px);
    position:fixed;
    top:0;
    left:0;
    height:100vh; 
    z-index:99999;  
    background-color:rgba(0,0,0,0.9); 
    text-align:center;
    padding-top: calc(50vh - 14px);
    padding-left:90px;
    padding-right:90px; 
    visibility: hidden;
}


.cross 
{
  position:fixed;
  top:30px;
  right:30px;
  z-index:99996;
  width:60px;
  height:60px;
  transform-origin: center;
  transform: rotate(45deg);
  transition: 0.3s linear;
}

.strip
{
    position:absolute;
    background-color:rgb(220,220,220);
}

.stripone
{
    z-index:999991; 
    width:100%;
    height:8px; 
    left:0px;
    top:26px;
}

.striptwo
{
    z-index:999992; 
    width:8px;
    height:100%; 
    left:26px;
    top:0px;
}

.cross:hover
{
    cursor: pointer;
    transform: rotate(-45deg);
}

.cross:hover .strip
{
    background-color:var(--accent-color);
    -webkit-box-shadow: 0px 0px 20px var(--accent-color-05-opacity);
	-moz-box-shadow: 0px 0px 20px var(--accent-color-05-opacity);
	-o-box-shadow: 0px 0px 20px var(--accent-color-05-opacity);
	box-shadow: 0px 0px 20px var(--accent-color-05-opacity);
}

.lines
{
    font-size: 20px;
    margin-top: 7px;
    margin-bottom: 7px;
}



@media only screen and (max-width: 1920px){

header{font-size:10px;}
footer p{font-size:10px;}
}

@media only screen and (max-width: 1400px){
  .fivecolumns{flex-direction:row;width:calc(100vw - 16px);align-items: stretch;  align-content: stretch;margin-bottom:0;}
  .tabletgroup{flex-grow: 1;display: flex; flex-direction:column;margin-right:16px;}
  .block {flex-grow: 1;
    display: flex;
    flex-direction: column;}

  .inside {flex-grow: 1;}
  .last {margin-bottom:16px;}


}

@media only screen and (max-width: 1000px){
  .fivecolumns{flex-direction:column;width:calc(100vw - 16px);align-items: stretch;  align-content: stretch;margin-bottom:0;}
  .tabletgroup{display: block;margin-right:16px; width:calc(100% - 16px);}
    .last {margin-bottom:16px;}

}

@media only screen and (max-width: 750px)
{

    .standart4
    {
        width: calc(100% - 80px);
        padding: 150px 40px 150px 40px;
    }

    .div_about
    {
        width:80vw;
    }
}