body{
   font-family: Montserrat, Arial, sans-serif;
   color: #191919;
   background: #000;
}

.flexbox{
  height:100%;
}

.layout-start-page{
  height: 100%;
  display: flex;
    align-items: center;
    justify-content: center;
  margin:0;
  padding:0;
}

img {
  max-width: 100%;
  display: inline-block;
}

img.landing-logo {
  max-width: 90%;
 }

img.prod-logo {
  max-width: 90%;
}

.logos{
  display: flex;
    align-items: center;
    justify-content: center;
  width:100%;
  height:100%;
}

.col-50{
  width:50%;
  flex:auto;
  text-align:center;
  height:100%;
  align-items: center;
    display: flex;
  flex-direction:column;
    justify-content: center;
  padding:0 45px;
}

.logos .col-50:first-of-type{
  border-right:6px solid #fff;
}

.logos .col-50:last-of-type{
  border-left:6px solid #fff;
}

.col-50 a{
  display: flex;
  align-items: center;
  justify-content: center;
}

.btn-holder{
  margin-top:50px;
  margin-bottom:20px;
}

.btn-holder a{
  text-decoration:none;
  transition:0.5s all;
  position:relative;
}

.btn-holder a:hover{
  padding-left:25px;
}

.bg {
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
   /*background-image: linear-gradient(270deg,#ce0e2d,#000000,#00287f);*/
  /*background-image: linear-gradient(294deg, #01020f, #0c1ae8, #e12b29, #01020f, #0c1ae8, #e12b29);
  background-size: 250% 250%;*/
}

@-webkit-keyframes Move {
    0% {
      transform: translateX(-75%);
    }
    50% {
      transform: translateX(0%);
    }
    100% {
      transform: translateX(-75%);
    }
}

@-moz-keyframes Move {
    0% {
      transform: translateX(-75%);
    }
    50% {
      transform: translateX(0%);
    }
    100% {
      transform: translateX(-75%);
    }
}

@keyframes Move { 
    0% {
      transform: translateX(-75%);
    }
    50% {
      transform: translateX(0%);
    }
    100% {
      transform: translateX(-75%);
    }
}

@-webkit-keyframes Circle { 
    0% {
      transform: translate(-30%, -35%);
    }
    25% {
      transform: translate(0, -50%);
    }
    50% {
      transform: translate(30%, -35%);
    }
    75% {
      transform: translate(0, -50%);
    }
    100% {
      transform: translate(-30%, -35%);
    }
}

@-moz-keyframes Circle { 
    0% {
      transform: translate(-30%, -35%);
    }
    25% {
      transform: translate(0, -50%);
    }
    50% {
      transform: translate(30%, -35%);
    }
    75% {
      transform: translate(0, -50%);
    }
    100% {
      transform: translate(-30%, -35%);
    }
}

@keyframes Circle { 
    0% {
      transform: translate(-30%, -35%);
    }
    25% {
      transform: translate(0, -50%);
    }
    50% {
      transform: translate(30%, -35%);
    }
    75% {
      transform: translate(0, -50%);
    }
    100% {
      transform: translate(-30%, -35%);
    }
}

@-webkit-keyframes CircleMobile {
  0% {
      transform: translate(-65%, -25%);
    }
    25% {
      transform: translate(-35%, -55%);
    }
    50% {
      transform: translate(0, -25%);
    }
    75% {
      transform: translate(-35%, -55%);
    }
    100% {
      transform: translate(-65%, -25%);
    }
}

@-moz-keyframes CircleMobile { 
  0% {
      transform: translate(-65%, -25%);
    }
    25% {
      transform: translate(-35%, -55%);
    }
    50% {
      transform: translate(0, -25%);
    }
    75% {
      transform: translate(-35%, -55%);
    }
    100% {
      transform: translate(-65%, -25%);
    }
}

@keyframes CircleMobile { 
    0% {
      transform: translate(-65%, -25%);
    }
    25% {
      transform: translate(-35%, -55%);
    }
    50% {
      transform: translate(0, -25%);
    }
    75% {
      transform: translate(-35%, -55%);
    }
    100% {
      transform: translate(-65%, -25%);
    }
}

.image-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow: hidden;
  z-index: -1;
}

.image-bg img.big-gradient {
  width: 400%;
  max-width: none;
  -webkit-animation: Move 50s ease-in-out infinite;
  -moz-animation: Move 50s ease-in-out infinite;
  animation: Move 50s ease-in-out infinite;
}

.image-bg img.circle-gradient {
  position: absolute;
  width: 200%;
  max-width: none;
  left: -50%;
  top: 100%;
  transform: translate(-30%, -35%);
  -webkit-animation: Circle 30s ease-in-out 7s infinite;
  -moz-animation: Circle 30s ease-in-out 7s infinite;
  animation: Circle 30s ease-in-out 7s infinite;
}

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

  .image-bg img.big-gradient {
    width: 800%;
    -webkit-animation: Move 50s ease-in-out infinite;
      -moz-animation: Move 50s ease-in-out infinite;
      animation: Move 50s ease-in-out infinite;
  }

  .image-bg img.circle-gradient {
    width: 600%;
      max-width: none;
      transform: translate(-65%, -25%);
    -webkit-animation: CircleMobile 30s ease-in-out 7s infinite;
    -moz-animation: CircleMobile 30s ease-in-out 7s infinite;
    animation: CircleMobile 30s ease-in-out 7s infinite;
  }
  
  .layout-start-page{
    /*align-items: baseline;*/
    height:99%
  }
  
  .logos{
    flex-direction:column;
    height:100%;
    width:100%;
    padding:0;
    
  }
  
  .col-50{
     width:100%;
     padding:0px;
     height:50%;
  }
  
  .logos .logo-img{
    height:100px;
    max-width:87%;
    margin-top:60px;
  }
  
  .landing-logo{
    width:77%;
  }
  
  .logos .col-50:first-of-type{
  border-bottom:5px solid #fff;
  border-right:0;
    }

   .logos .col-50:last-of-type{
  border-top:5px solid #fff;
  border-left:0;
   }
  
  .btn-holder{
     margin:0;
     margin-top:20px;
    }
  
  .btn-holder a{
     transform:scale(0.8);
    }
  

  .logos .col-50:first-of-type .btn-holder{
        position:relative;
    top:-10px;
  }
  
}

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

}