*, ul,ol{
    padding: 0;
    margin: 0;
}
:root {
 --primaryColor:#00EA96;
 --secondaryColor:#0e2673;
 --black:#575756;
 --raleway: 'Raleway', sans-serif;
 --roboto: 'Roboto', sans-serif;
 --openSans: 'Open Sans', sans-serif;
}

html,
body {
    height: 100%;
    scroll-behavior: smooth;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--roboto);
    font-weight: 800;
}

p {
    font-family: var(--opensans);
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
}
.btn_style{
    border:2px solid var(--primaryColor);
    border-radius: 25px;
    color:#fff;
    font-size: 17px;
    text-align: center;
    transition:  all 0.5s ease-in-out;
    letter-spacing: 2px;
    padding: 10px 25px;
    display: inline-block;
    text-decoration: none;
    background-color: var(--secondaryColor);
    font-family: var(--raleway);
    font-weight: 550;
    text-decoration: none;
}
.btn_style:hover{
    border:2px solid var(--secondaryColor);
    background-color: var(--primaryColor);
    color:#fff;
}
.nav-head{
    font-weight: 550;
    font-size: 17px;
}
.header-bg{background: url(../images/4.png);
    height: 500px;
	background-size: 100% 100%;
}
.header-bg h1{
    font-size: 70px;
    font-weight: 620;
    text-align: center;
    color:#fff;
    letter-spacing: 1.5px;
    font-family: var(--raleway);
}
.header-bg h1:first-child{
    padding-top: 13%;
}
.about{
    margin: 6% 0;
}
.about h2{
    font-weight: 620;
    font-size:54px;
    color:var(--secondaryColor);
    font-family: var(--raleway);
    padding-top: 70px;
}
.about p{
        font-size: 17px;
        color: #333;;
}
.important{background-color: var(--primaryColor);
    height: 385px;
	background-size: 100% 100%;
}
.important .row img{
     padding-top: 50%;
}
.important .row h2{
    font-weight: 620;
    font-size:50px;
    color:var(--secondaryColor);
    font-family: var(--raleway);
    padding-top: 70px;
}
.important .row p{
    font-size: 18px;
    color: #fff;
}
.specialists{
    margin: 8% 0 5%;
}
.sp{
    background-color: var(--secondaryColor);
    border-radius: 50%;
    width: 76%;
    height: 100%;
    margin-left: 20%;
    border:3px dotted var(--primaryColor)
}
.sp h2{
    font-weight: 620;
    font-size: 35px;
    color: var(--primaryColor);
    padding: 53px 0 0 95px;
    font-family: var(--raleway);
}
.sp p{
    font-size: 17px;
    color: #fff;
    padding-left: 45px;
    padding-top: 24px;
}
.footer-bg{
    background:url(../images/footer.png);
    height: 385px;
	background-size: 100% 100%;
}
.footer-bg h2{
    color:var(--secondaryColor);
    text-align: center;
    padding-top: 85px;
    font-size: 36px;
}
.footer-bg p{
    color: #fff;
    text-align: center;
    font-size: 24px;
    font-family: var(--roboto);
    font-weight: 550;
    padding-top: 5px;
}
.link{
    text-align: center;
    text-decoration: none;
    color: #fff;
    font-size: 20px;
    padding-bottom: 5px;
}
.footer-bg a:hover{
    color: var(--secondaryColor);
}
.footer-bg i{
    color: var(--secondaryColor);
}
.copy{
    text-align: center;
    font-size: 14px;
    padding-bottom: 0;
    margin: 0;
}
.nav-bg h1{
    text-align: center;
    font-size: 65px;
    color: #fff;
    padding-top:13%;
}
.nav-bg p{
    text-align: center;
    font-size: 23px;
    color: var(--primaryColor);
}
.nav-bg{background: url(../images/4.png);
    height: 440px;
	background-size: 100% 100%;
}
.sample h2{
    color:var(--secondaryColor);
    font-size: 40px;
    text-align: center;
}
.sample h6{
    color:var(--primaryColor);
    font-size: 18px;
    padding-top: 10px;
    text-align: center;
}
form{
    margin-left: 33%;
    margin-top: 3%;
    margin-bottom: 3%;
}
  input{
    border: 2px solid var(--secondaryColor);
    border-radius: 2px;
    color: #333;
    margin-bottom: 10px;
    padding: 3px 200px 13px 4px;
  }
  textarea{
    border: 2px solid var(--secondaryColor);
    border-radius: 2px;
    color: #333;
    margin-bottom: 10px;
    padding: 3px 185px 31px 4px;  
  }
  .product{
      margin: 6% 0;
  }
  .product h2{
        color:var(--secondaryColor);
        text-align: center;
        font-size: 36px;
    }
    .product p{
        color: var(--primaryColor);
        font-size: 22px;
        font-family: var(--roboto);
        font-weight: 550;
        padding-top: 5px;
    }  
    .product ul{
        list-style-type: square;
    } 
    .product ul li{
        color: #333;
        font-size: 20px;
        font-family: var(--roboto);
        font-weight: 550;
        padding-top: 5px;
    }
    .home-bg{background: url(../images/home.png);
        height: 375px;
        background-size: 100% 100%;
    }
    .home-bg h2{
        color:var(--secondaryColor);
        text-align: center;
        font-size: 36px;
        padding-top: 3%;
    }
    .home-bg p{
        color: #fff;
        font-size: 22px;
        font-family: var(--roboto);
        font-weight: 550;
        padding-top: 5px;
        padding-left: 3%;
    }   
    .home-bg ul li{
        color: #333;
        font-size: 20px;
        font-family: var(--roboto);
        font-weight: 550;
        padding-top: 5px;
        padding-left: 3%;
    }
    .oflative{
        margin: 6% 0;
    }
    .oflative h2{
          color:var(--secondaryColor);
          text-align: center;
          font-size: 36px;
      }
      .oflative p{
          color: var(--primaryColor);
          font-size: 22px;
          font-family: var(--roboto);
          font-weight: 550;
          padding-top: 5px;
      }  
      .oflative ul{
          list-style-type: square;
      } 
      .oflative ul li{
          color: #333;
          font-size: 20px;
          font-family: var(--roboto);
          font-weight: 550;
          padding-top: 5px;
      }
    .in-bg{background: url(../images/industry.png);
        height: 375px;
        background-size: 100% 100%;
    }
    .in-bg h2{
        color:var(--secondaryColor);
        text-align: center;
        font-size: 36px;
        padding-top: 3%;
    }
    .in-bg p{
        color: #fff;
        font-size: 22px;
        font-family: var(--roboto);
        font-weight: 550;
        padding-top: 5px;
        padding-left: 3%;
    }   
    .in-bg ul li{
        color: #333;
        font-size: 20px;
        font-family: var(--roboto);
        font-weight: 550;
        padding-top: 5px;
        padding-left: 3%;
    }

    .slider h2{
        color:var(--secondaryColor);
        text-align: center;
        font-size: 40px;
        padding-top: 3%;
    }
    .window {
        --dark-background: #5a5a5a;
        --light-background: #8a8a8a;
        --light-foreground: #ededed;
        --shadow: #112211;
        border-radius: 0.5rem;
        box-shadow: 0px 1px 2px var(--shadow);
        margin-left: 30%;
        max-width: 500px;
        overflow: hidden;
        position: relative;
      }
      
      .window__current-img {
        display: flex;
        position: absolute;
        bottom: 8px;
        left: 50%;
        transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
      }
      
      .window__current-img__btn {
        box-shadow: 1px 1px 3px var(--shadow),
        -1px -1px 3px var(--shadow);
        transition: background-color 0.25s ease-in-out;
        -moz-transition: background-color 0.25s ease-in-out;
        -o-transition: background-color 0.25s ease-in-out;
        -webkit-transition: background-color 0.25s ease-in-out;
        cursor: pointer;
        border-radius: 50%;
        border: none;
        width: 7px;
        height: 7px;
      }
      
      .window__current-img__btn:not(:last-child) {
        margin-right: 4px;
      }
      
      .window__current-img__btn:hover {
        background-color: var(--light-background);
      }
      
      .window__current-img__btn:active {
        transform: scale(0.8);
        -ms-transform: scale(0.8);
        -o-transform: scale(0.8);
        -webkit-transform: scale(0.8);
        -moz-transform: scale(0.8);
      }
      
      .window__current-img__btn--current {
        background-color: var(--dark-background);
      }
      
      .window__slide-left {
        box-shadow: 0px 1px 2px var(--shadow),
        -1px -1px 3px var(--shadow);
        transition: background-color 0.25s ease-in-out, opacity 0.25s ease-in-out;
        -o-transition: background-color 0.25s ease-in-out, opacity 0.25s ease-in-out;
        -moz-transition: background-color 0.25s ease-in-out, opacity 0.25s ease-in-out;
        -webkit-transition: background-color 0.25s ease-in-out, opacity 0.25s ease-in-out;
        opacity: 0.6;
        background-color: var(--dark-background);
        color: var(--light-foreground);
        cursor: pointer;
        border-radius: 50%;
        border: none;
        width: 2.5rem;
        height: 2.5rem;
        font-size: 1.5rem;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 50%;
        left: 8px;
        transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
      }
      
      .window__slide-left:hover {
        background-color: var(--light-background);
        opacity: 0.9;
      }
      
      .window__slide-left:active {
        transform: translateY(-50%) scale(0.95);
        -moz-transform: translateY(-50%) scale(0.95);
        -ms-transform: translateY(-50%) scale(0.95);
        -o-transform: translateY(-50%) scale(0.95);
        -webkit-transform: translateY(-50%) scale(0.95);
      }
      
      .window__slide-left > i {
        transform: translateX(-1px);
        -ms-transform: translateX(-1px);
        -moz-transform: translateX(-1px);
        -o-transform: translateX(-1px);
        -webkit-transform: translateX(-1px);
      }
      
      .window__slide-right {
        box-shadow: 0px 1px 2px var(--shadow),
        -1px -1px 3px var(--shadow);
        transition: background-color 0.25s ease-in-out, opacity 0.25s ease-in-out;
        -o-transition: background-color 0.25s ease-in-out, opacity 0.25s ease-in-out;
        -moz-transition: background-color 0.25s ease-in-out, opacity 0.25s ease-in-out;
        -webkit-transition: background-color 0.25s ease-in-out, opacity 0.25s ease-in-out;
        opacity: 0.6;
        background-color: var(--dark-background);
        color: var(--light-foreground);
        cursor: pointer;
        border-radius: 50%;
        border: none;
        width: 2.5rem;
        height: 2.5rem;
        font-size: 1.5rem;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 50%;
        right: 8px;
        transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
      }
      
      .window__slide-right:hover {
        background-color: var(--light-background);
        opacity: 0.9;
      }
      
      .window__slide-right:active {
        transform: translateY(-50%) scale(0.95);
        -moz-transform: translateY(-50%) scale(0.95);
        -ms-transform: translateY(-50%) scale(0.95);
        -o-transform: translateY(-50%) scale(0.95);
        -webkit-transform: translateY(-50%) scale(0.95);
      }
      
      .window__slide-right > i {
        transform: translateX(1px);
        -moz-transform: translateX(1px);
        -ms-transform: translateX(1px);
        -webkit-transform: translateX(1px);
        -o-transform: translateX(1px);
      }
      
      .window__slider {
        transition: transform 0.5s ease-in-out;
        -o-transition: transform 0.5s ease-in-out;
        -moz-transition: transform 0.5s ease-in-out;
        -webkit-transition: transform 0.5s ease-in-out;
        display: flex;
      }
      
      .window__slider__img-container {
        transition: opacity 0.5s ease-in-out 0.375s;
        -o-transition: opacity 0.5s ease-in-out 0.375s;
        -moz-transition: opacity 0.5s ease-in-out 0.375s;
        -webkit-transition: opacity 0.5s ease-in-out 0.375s;
        min-width: 100%;
        max-width: 100%;
      }
      
      .window__slider__img-container--opacity {
        opacity: 1;
      }
      
      img {
        display: block;
      }
      .contact{
          margin: 6% 0;
      }
      .contact h2{       
        color:var(--secondaryColor);
        text-align: center;
        font-size: 36px;
        padding-top: 10%;
    }
    .contact h6{
        color: var(--primaryColor);
        font-size: 17px;
        font-family: var(--roboto);
        font-weight: 550;
        padding-top: 5px;
    }
    .contact p{
        color: #333;
        font-size: 16px;
        font-family: var(--roboto);
        font-weight: 550;
        padding-top: 7px;
    }

    .contact p i{
        color: var(--secondaryColor);
        font-size: 19px;
    }