*{
    font-family: 'Gilroy-black', sans-serif !important;
    scroll-behavior: smooth;
}
  body{
      max-width: 100%;
      overflow-x: hidden;
  }
  body h1{
    font-family: 'Gilroy-black', sans-serif !important;
  }
  body h2{
    font-family: 'Gilroy-black', sans-serif !important;
  }
  
  body h3{
    font-family: 'Gilroy', sans-serif !important;
    

  }

.active {
    padding-left: 3.5rem !important;
}
 
@media only screen and (max-width: 991px) {
    .section_nav {
      background-color: #000 !important;
    }
  }
  @media only screen and (max-width: 785px) {
    .any_class {
        padding-left: 35px;
    }
  }
  @media only screen and (max-width: 575px) {
    .fixer_class {
        padding-left: 35px;
    }
  }
  @media only screen and (max-width: 575px) {
    .mostly_sec {
        padding-left: 35px;
    }
  }
  @media only screen and (max-width: 575px) {
    .aligner {
        padding-left: 0 !important; 
    }
  }
  @media only screen and (max-width: 1503px) {
    .image {
        opacity: 1;
        display: block;
        width: 100%;
        height: auto;
        transition: .5s ease;
        backface-visibility: hidden;
      }
       
      .middle { 
        transition: .5s ease; 
        opacity: 0; 
        position: absolute; 
        top: 50%; 
        left: 50%; 
        transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        text-align: center;
      }
      
      .img_check:hover .image {
        opacity: 0.3;
      }
          
      .img_check:hover .middle {    
        opacity: 1;    
      }    
          
      .text_fix {    
            color: white;    
            font-size: 20px;    
            position: absolute;    
            top: 50%;    
            left: 50%;    
            -webkit-transform: translate(-50%, -50%);    
            -ms-transform: translate(-50%, -50%);    
            transform: translate(-50%, -50%);    
            text-align: center;    
      }    
        
      .image {    
        display: block;    
        width: 100%;    
        height: auto;    
      }    
      .img_check {
          position: relative;
      }
      .img_asset{
          position: relative;
      }
      .overlay{
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        height: 100%;
        width: 100%;
        opacity: 0;
        transition: .5s ease;
        background-color: rgba(0,0,0,0.7);
      }
      .img_check:hover .overlay{
        opacity: 1;
        transition: .5s ease;
      }
    }
  }

  @media only screen and (max-width: 991px) {
    .picture_one {
        padding-bottom: 15%;
    }
  }
  @media only screen and (max-width: 991px) {
    .fixer_text {
        align-items: center;
        justify-content: center;
        text-align: center;
    }
  }
  @media only screen and (max-width: 991px) {
    .aligner {
       text-align: left !important;
    }
  }

.first_section .span_color {
color: #e0221c;
}
.first_section {
    
background-image: url(../images/hao-wang-pVq6YhmDPtk-unsplash.jpg);
background-repeat: no-repeat;
background-size: cover ;

    text-align: center;
}
 .first_section .title_check {
color: #f0fcfd;
}
.btn_fixer {
    background-color: rgba(255,255,255,0.15);
    color: #fff;
    padding: 15px 50px;
    border-radius: 5px;
}
.overlay_firstsection {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0,0,0,0.7);
    min-height: 100vh !important;
}

.first_section .title_check {
    padding-bottom: 25px;
}

.what_we_do {
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.simple_chart {
    padding-bottom: 35px;
}
.name_red {
    padding-bottom: 35px;
    color: #e9251d;
    font-size: 2.5rem;
}
.paragraph_do {
    padding-bottom: 35px;
}
.what_we_do_pic {
    border-radius: 5px;
}
.header_class {
    color: #4d4442;
    padding-bottom: 35px;
}
.img_asset:hover {
    color: red;
}
.services_clas {
    color: #e0221c;
    padding-bottom: 35px;
}
.see_all a {
    color: #e0221c;
    text-decoration: none;
    
}
.see_all {
    display: flex;
    justify-content: flex-end;
}
.pictuer_class img{
    height:70px;
}
.alarm_section {
    min-height: 20vh;
    display: flex;
    align-items: center;
    justify-content: center;

}
.image_fix {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.fotoo {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100px;
}
.intelligent_section {
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.safe_class {
    padding-bottom: 30px;
}
.installation_class {
    padding-bottom: 30px;
    color: #e0221c;
}
.paragraph_contact {
    padding-bottom: 30px;
}
.fixer_text {
    padding-left: 10%;
}
.intelligent_section a {
color: #808384;
}
.heading_class {
    padding-top: 30px;
}
.work_section {
    min-height: 50vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.aligner {
    padding-left: 20%;
}
.electronica_class {
    font-size: 1rem;
    padding-bottom: 30px;
}
.href_class {
    color: black;
    text-decoration: none;
   
}
.href_class:hover {
    color: red;
    text-decoration:none ;
}
.fix_href{
    padding: 10px;
}
.footer_section {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 70vh;
    background-color: #f4f5f4;
    border-bottom: 2px solid #bcbec0;
}
.line{
    border-top: 2px solid #bdbfc0;
    }
    .pic_bau {
        padding-bottom: 30px;
    }
    .work_class {
        color: #e0221c;
    }
    .pictuer_class {
        padding: 35px;

    }
    .img_check {
        width: 100%;
        height: 70vh;
    }
    .img_asset {
        height: 100%;
        width: 100%;
    }

    .img_asset img{
        height: 100%;
        object-fit: cover;
    }
    .chech_button {
        display: flex;
        align-items: center;
        justify-content: center;
        padding-top: 20px;
    }
    .fix {
        display: flex;
    }
    .contact_section {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 80vh;
    }
    .position_fix {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding-bottom: 30px;
    }
    .contact_footer {
        min-height: 80vh;
        align-items: center;
        justify-content: center;
        padding-top: 60px;
    }
    #more {display: none;}
    .same_col {
color: #e0221c;
padding-bottom: 40px;
    }
    .responsible_section {
     min-height: 40vh;
     display: flex;   
     align-items: center;
     justify-content:center;
    }
    .section_nav .style_fix {
        text-decoration: none;
        color: #fff;
        margin: 55px;
        transition: color 0.3s;

    }
    .hrefs {
        padding: 10px;

    }
    .section_nav .borders {
        border-left: 1px solid #fff;
    }
    .white-background .borders {
        border-left: 1px solid #000;
    }
    .section_nav {
        background-color: transparent;
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        transition: background-color 0.3s;
    }
    .white-background{
        background-color: #fff;
        transition: background-color 0.3s;
        z-index: 9999;
    }
    .section_nav .hrefs a{
        color: #fff!important;
        transition: color 0.3s;
    } 
     .white-background .hrefs a{
        color: #000!important;
        transition: color 0.3s;
        z-index: 9999;
    } 
    #myBtn {
        cursor: pointer;
    }
    #myBtn:hover {
     color: red;
    }
    
.line{
    width: 112px;
    height: 47px;
    border-bottom: 1px solid black;
    position: absolute;
    }
.hrefs a{
    padding: 0!important;
    margin: 0 10px;
}
    .hrefs .active{
        position: relative;

    }
    
    .hrefs .active::before{
        position: absolute;
        content: '';
        bottom: 0;
        right: 0;
        left: 0;
        height: 2px;
        background-color: #fff;
    }
    .white-background .hrefs .active {
        position: relative;
    }
    .white-background .active::before {
        position: absolute;
        content: '';
        bottom: 0;
        right: 0;
        left: 0;
        height: 2px;
        background-color: #000;
    }
    @media only screen and (max-width: 991px) {
        .white-background .hrefs a {
          color: white !important;
        }
        }
        @media only screen and (max-width: 991px) {
            .white-background .hrefs .active {
                position: relative;
            }
            .white-background .active::before {
                position: absolute;
                content: '';
                bottom: 0;
                right: 0;
                left: 0;
                height: 2px;
                background-color: #fff;
            }
            }
          
          .image {
            opacity: 1;
            display: block;
            width: 100%;
            height: auto;
            transition: .5s ease;
            backface-visibility: hidden;
          }
          
          .middle {
            transition: .5s ease;
            opacity: 0;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            text-align: center;
          }
          
          .img_check:hover .image {
            opacity: 0.3;
          }
          
          .img_check:hover .middle {
            opacity: 1;
          }
          
          .text_fix {
                color: white;
                font-size: 20px;
                position: absolute;
                top: 50%;
                left: 50%;
                -webkit-transform: translate(-50%, -50%);
                -ms-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
                text-align: center;
          }
        
          .image {
            display: block;
            width: 100%;
            height: auto;
          }
          .img_check {
              position: relative;
          }
          .img_asset{
              position: relative;
          }
          .overlay{
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            height: 100%;
            width: 100%;
            opacity: 0;
            transition: .5s ease;
            background-color: rgba(0,0,0,0.7);
          }
          .img_check:hover .overlay{
            opacity: 1;
            transition: .5s ease;
          }
   
                 @media only screen and (max-width: 991px) {
            .after_class {
                align-items: center;
                padding-top: 70px;
                padding-bottom: 70px;
                text-align: center;
            }
          }
          @media only screen and (max-width: 991px) {
            .picture_one {
                padding-bottom: 70px;
            }
          }
          .aligner_text {
              text-align: center;
          }
          .button_order {
            color: #fff;
            border-radius: 40px;
            align-items: center;
            justify-contect: center;
            display: flex;
            text-align: center;
            align-items: center;
            background: black;
            width: 10%;
        }
          }
          .button {
            border-radius: 4px;
            background-color: #f4511e;
            border: none;
            color: #FFFFFF;
            text-align: center;
            font-size: 28px;
            padding: 20px;
            width: 200px;
            transition: all 0.5s;
            cursor: pointer;
            margin: 5px;
          }
          
          .button span {
            cursor: pointer;
            display: inline-block;
            position: relative;
            transition: 0.5s;
          }
          
          .button span:after {
            content: '\00bb';
            position: absolute;
            opacity: 0;
            top: 0;
            right: -20px;
            transition: 0.5s;
          }
          
          .button:hover span {
            padding-right: 25px;
          }
          
          .button:hover span:after {
            opacity: 1;
            right: 0;
          }
          .get_started{
            padding:30px; 
            background-color: rgba(255, 255, 255, 0.1);
            border-color: black;
            color: white;
            /* width: 16px; */
            height: 60px;
            border-radius: 10px;
            transition: background-color 0.3s;
          }
          .get_started:hover{
            padding:30px; 
            background: rgba(0,0,0, 0.3);
            border-color: black;
            color: white;
            height: 50px;
            border-radius: 10px;
            transition: background-color 0.3s;}
.footer_logo {
    width: 100px;
}
.exit_class {
    text-decoration: none;
    color: #000;
}
.exit_class:hover {
    text-decoration: none;
    color: red;
}
.paragraph_one {
color: #918488;
}
.check_us {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 6%;
}
.chech_me {
    padding-left: 6%;
}