.sticky-wrapper {
    height: 80px;
    display: block;
    position: absolute;
    width: 100%;
    top: 0;
}

body,.navigation-main {
    background-color: transparent !important;
}

.navigation-main ul li a {
    color: #FFFFFF !important;
}
.container-fluid {
    padding-left: 0%!important;
    padding-right: 0%!important;
}
.content-info {
    display: flex;
    flex-direction: row;
    align-items: center;
  justify-content: center;
  height: 100%;
}
.container-left {
    width: 40% !important;
    position: relative;
}
.container-right {
    width: 60% !important;
    position: relative;
}
.icon-top {
    position: relative;
    display: inline-block;
    width: 200px;
    top: 2%;
    /*padding-left: calc(4% - 10px);*/
}

.hero .background-content .bg-color
 {
    top:auto !important;
	height:100vh !important;
	bottom:0px !important;
}

.dzsparallaxer:not(.mode-oneelement)
{
    background-color: #000000;
}



@media (max-width: 1024px) /*994*/
{

    .content-info {
        display: flex;
        flex-direction: column;
        align-items: center;
      justify-content: center;
      height: 100%;
    }
    .container-left {
        width: 100% !important;
        position: relative;
        padding-top: 90px;
    }
    .container-right {
        width: 100% !important;
        position: relative;
    }
}

@media (max-width: 768px){  
  .login-style{
    display: none;
  }
}

@media (max-width: 480px)
{
  .icon-top {
    width: 41vw;
    padding-left: calc(4% - 10px);
  }

  .container-left {
    padding-top: 18%;
  }

}
.fadeIn {
    display: block;
    animation: fadeInAnimation ease 6s;
    animation-iteration-count: 0;
    animation-fill-mode: forwards;
}
@keyframes fadeInAnimation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.fadeOut {
    display: none;
    animation: fadeInAnimation ease 6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
@keyframes fadeInAnimation {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
.btn-main {
    color: #FFFFFF !important;
    border-radius: 0px !important;
}

.bg-none {
    background: transparent !important;
}


/*Animations Home*/

.fade-in {
    opacity: 1;
    transform: translateX(-100%);
  }
  
  .fade-out {
    opacity: 0;
    transform: translateX(100%);
  }

  div.slide {
    position: fixed;
    top: 49.5%;
    width: 1%;
    pointer-events: auto;
    cursor: pointer;
    z-index: 99;
    display: none;
  }

  div.slide.left-fixed {
    left: -1.5%;
  }

  div.slide.right-fixed {
    right: -1.5%;
  }

  .show-slide {
    display:block!important;

  }

  div.slide.left-fixed.show-slide {
    animation: showSlideLeftAnim ease 0.5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-delay: 1s;
  }

  @keyframes showSlideLeftAnim {
    0% {
        left: -1.5%;
    }
    100% {
        left: 1.5%;
    }
}

div.slide.right-fixed.show-slide {
    animation: showSlideRightAnim ease 0.5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-delay: 1s;
  }

  @keyframes showSlideRightAnim {
    0% {
        right: -1.5%;
    }
    100% {
        right: 1.5%;
    }
}

.sub-title-section {
    font-size: 2vw;
    margin-bottom: 20px;
}

/* Modal content styles*/
.modal-content {
    background: #11141A;
  }
  .modal-title {
    font-family: 'Space Grotesk', sans-serif;
  }
  .modal-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.8);
  }
  .modal-footer {
    border-top: none;
  }
  .form-control {
    background: #1C1F25;
    color: #FFFFFF;
    border: none!important;
    border-radius: 0.5em;
  }
  textarea {
    resize: none;
  }
 
  .md-form label {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 0.8vw;
  }
  input::placeholder {
    font-family: 'Montserrat', sans-serif;
    font-weight: 300;
    font-size: 0.9vw;
}
  .close {
    font-size: 2vw;
    position: absolute;
    right: 2.5%;
    top: 2.5%;
  }
  .close span{
    font-size: 1.5vw;
    color: #FFFFFF;
  }
  .btn-unique {
    background-color: transparent;
    color: #FFFFFF;
    font-weight: 700;
    display: block;
    margin: 0 auto;
    border-color: #FFFFFF;
    padding-left: 1.8em;
    padding-right: 1.8em;
  }

  .btn-unique:hover {
    color: #000;
    text-decoration: none;
    background: #fff;
  }
  .mb-5, .my-5 {
    margin-bottom: 3rem !important;
  }

  .box-3d {
    border-radius: 0.5em;
  }
  
  a.login-style{
    text-decoration: none;
    color: white;
}

div.login-style{
  position: absolute;
  top: 10px;
  right: 2rem;
  /* padding: 10px 16px; */
  z-index: 100;
}

.success-message svg {
  max-width: 8vw;
}
@media (max-width: 810px){  
  input::placeholder {
    font-size: 2.2vw;
  }
  .md-form label {
    font-size: 2.2vw;
  }
  .close span {
    font-size: 2.2vw;;
  }
  .success-message svg {
    max-width: 15vw;
  }
}

@media (max-width: 768px){  
  input::placeholder {
    font-size: 2.9vw;
  }
  .md-form label {
    font-size: 2.8vw;
  }
  .close span {
    font-size: 4.5vw;;
  }
  .success-message svg {
    max-width: 30vw;
  }

}
@media (max-width: 1080px) and (orientation: landscape){  
  input::placeholder {
    font-size: 1.5vw;
  }
  .md-form label {
    font-size: 1.5vw;
  }
  .close span {
    font-size: 3vw;;
  }
  .success-message svg {
    max-width: 13vw;
  }

}

.portrait-mode-message {
  display: none;
  position: absolute;
  width: 100%;
  height: 100vh;
  background: url(../images/xdev_bg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  z-index: 99;
  text-align: center;
}
.portrait-mode-message .container-mid>img{
  display: block;
  width: 35%;
  margin-bottom: 2em;
  margin: 0 auto;
  transform: translateY(-50%);
}