*{
    margin:0;
    padding: 0;
    box-sizing: border-box;
}
body{
    font-family: Arial, Helvetica, sans-serif;
}

nav{
    display: flex;
    justify-content: space-around;
    align-items: center;
    box-shadow: 1px 2px 6px grey;
}

.menu ul{
    list-style-type: none;
    display: flex;
}
.menu a{
    padding: 20px;
    display: block;
    text-decoration: none;
    color:black
}
.menu-bar{
    display: none;
}
.menu a:hover{
    background-color: rgb(244, 246, 248);
}
.logo{
    width: 120px;
    height: 90px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url("../image/logoHrazdan.png");
}
.phone{
    border:2px solid #FFA500;
    border-radius: 8px;
    padding: 10px 20px;
}
.phone .fa-phone{
    color:#FFA500
}
.social a{
    color:black
}
#home{
    width: 100%;
    height: 700px;
    margin:auto;
    position: relative;
}
.home-info{
    position: absolute;
    top: 200px;
    text-align: center;
    color:white;
    width: 80%;
    left:10%
}
.home-color{
    background-color: rgba(0, 0, 0, 0.3);
    width: 100%;
    height: 700px;
    color:white;
    text-align: center;
    padding: 100px;

}
.home-item{
   
    background-position: center 30%;
    background-repeat: no-repeat;
    background-size: cover;
}
.home-item3{
    background-image: url("../image/technique/technique5.jpg");
    background-position: center center;

}
.home-item4{
    background-image: url("../image/technique/technique1.jpg");
    
}
.home-item2{
    background-image: url("../image/landscape-with-country-road-empty.jpg");
}
.home-item1{
    background-image: url("../image/bg-road.jpg");
}
.home-info h1{
    font-size: 72px;
    margin:50px;
}
.home-info p{
    font-size: 32px;
    margin:50px auto;
    width: 70%;
    line-height: 1.4;
   
}

#home .slick-next{
    right: 100px;
}
#home .slick-prev{
    left:100px;
    z-index: 3;
}
#about{
    width: 100%;
    padding: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.about-img-box{
    width: 35%;
    height: auto;
    margin:20px;
    border-radius: 12px;
    box-shadow: 2px 4px 6px rgb(176, 176, 176);
}
.about-img{
    width: 100%;
    height: 600px;
    background-image: url("../image/sevan.jpg");
    background-size: cover;
    background-position: 20% 10%;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}
.about-img-info{
    text-align: center;
    padding: 10px;
    font-size: 14px;
}
.about-info{
    width: 45%;
    height: auto;
    margin:20px;
    text-align: center;
}
.about-info h1,
#materials h1,
#work h1,
#sand-mine h1,
#techniques h1,
#factory h1{
    font-size: 32px;
    margin:20px;
    color:rgb(36, 34, 34)
 
}
.about-info p{
    text-align: justify;

}
.line{
    width: 200px;
    height: 5px;
    background-color: #FFA500;
    margin:30px auto;
    box-shadow: 2px 4px 6px rgb(176, 176, 176);
    border-radius: 3px;
}
#sand-mine{
    text-align: center;  
}
.sand-mine-header>p,
.factory-header>p{
    width: 50%;
    margin:50px auto;
    line-height: 1.6;
}
.sand-mine-container{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.sand-mine-container>*{
    width: 50%;
    height:450px;

}
.sand-mine-info{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 100px;
    font-size: 26px;
    font-weight: 400;
}
.sand-mine-img{
    background-size: cover;
    background-position: center center;
}
.sand-mine-img1{
    background-image: url("../image/hanq1.jpg");
}

.sand-mine-img2{
    background-image: url("../image/hanq2.jpg");
}

.sand-mine-img3{
    background-image: url("../image/hanq.jpg");
}

.sand-mine-img4{
    background-image: url("../image/hanq4\ \(2\).jpg");
    background-position: left 40%;
}

.sand-mine-img5{
    background-image: url("../image/hanq5.jpg");
  
}

.sand-mine-img6{
    background-image: url("../image/hanq6.jpg");
}




.technique-header{
    text-align: center;
}


#materials{
    padding:100px;
    text-align: center;
}
#materials p,
#work p,
#techniques p{
    width: 60%;
    margin: 50px auto;
    line-height: 1.6;
}
.materials-container{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
  

}

.road{
    width: 200px;
    height: 250px;
    margin: 20px;
    text-align: center;
}
.road-info{
    padding: 20px;
}
.road-photo{
    width: 100%;
    height: 200px;
    background-size: cover;
    background-position: center center;
    border: 3px solid #FFA500;
    border-radius: 12px;
    box-shadow: 2px 3px 5px grey;
    transition: all 0.7s;
}
.road-photo:hover{
    transform: scale(1.1,1.1);
}
.road-photo1{
    background-image: url("../image/xich.jpg");
}
.road-photo2{
    background-image: url("../image/xich2.jpg");
}
.road-photo3{
    background-image: url("../image/xich3.jpg");
}
.road-photo4{
    background-image: url("../image/xich4.jpg");
}
.road-photo5{
    background-image: url("../image/xich5.jpg");
}
.road-photo6{
    background-image: url("../image/xich6.jpg");
}
.road-photo7{
    background-image: url("../image/xich7.jpg");
}
.road-photo8{
    background-image: url("../image/qar.jpg");
}
.road-photo9{
    background-image: url("../image/xich9.jpg");
}
.road-photo10{
    background-image: url("../image/xich10.jpg");
}
.road-photo11{
    background-image: url("../image/xich11.jpg");
}
.road-photo12{
    background-image: url("../image/xich12.jpg");
}
#work{
    width: 100%;
    margin:auto;
    padding: 100px;
    text-align: center;
    background-color: rgb(245, 245, 245);
}


.slider-for,
.slider-nav,
.home-info-slider{
    display: flex;
    justify-content: center;
    align-items: center;
}
.slider-for{
    width: 50%;
    height: 500px;
    margin:auto
}
.slide{
    width:130px;
    height:200px;
    box-shadow: 2px 4px 6px grey;
    margin:20px;
    display: flex;
    align-items: flex-end;
    transition: all 0.5s;
    border-radius: 8px;
}
.work{
    width: 100%;
    height: 200px;
    background-size: cover;
    background-position: center center;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}
.work1{
    background-image: url("../image/work/work1.jpg");
    /* background-position: ; */
}
.work2{
    background-image: url("../image/work/work2.jpg");
}
.work3{
    background-image: url("../image/work/work3.jpg");
    /* background-position: 10% 20%; */
}
.work4{
    background-image: url("../image/work/work4.jpg");
    /* background-position: 10% 30%; */
}
.work5{
    background-image: url("../image/work/work5.jpg");
    /* background-position: 30% 30%; */

}
.work6{
    background-image: url("../image/work/work6.jpg");
    /* background-position: 30% 30%; */
}
.work7{
    background-image: url("../image/work/work7.jpg");
    /* background-position: 30% 30%; */
}
.work8{
    background-image: url("../image/work/work8.jpg");
    /* background-position: 30% 30%; */
}
.work9{
    background-image: url("../image/work/work9.jpg");
    /* background-position: 30% 30%; */
}
.work10{
    background-image: url("../image/work/work10.jpg");
    /* background-position: 30% 30%; */
}
.work11{
    background-image: url("../image/work/work11.jpg");
    /* background-position: 30% 30%; */
}
.work12{
    background-image: url("../image/work/work12.jpg");
    /* background-position: 30% 30%; */
}
.work13{
    background-image: url("../image/work/work13.jpg");
}
.work14{
    background-image: url("../image/work/work14.jpg");
}
.work15{
    background-image: url("../image/work/work15.jpg");
}
.work16{
    background-image: url("../image/work/work16.jpg");
}
.work17{
    background-image: url("../image/work/work17.jpg");
}
.work18{
    background-image: url("../image/work/work18.jpg");
}
.work19{
    background-image: url("../image/work/work19.jpg");
}
.work20{
    background-image: url("../image/work/work20.jpg");
}
.work21{
    background-image: url("../image/work/work21.jpg");
}
.work22{
    background-image: url("../image/work/work22.jpg");
}
.work23{
    background-image: url("../image/work/work23.jpg");
}
.work24{
    background-image: url("../image/work/work24.jpg");
}
.slider-for .slide{
    height:450px
}
.slider-for .work{
    height: 450px;
}

.slick-next:before, .slick-prev:before{
    color:rgb(184, 182, 182);
    font-size: 26px;
}
#work .slick-prev{
    left:-31px

}
#techniques{
    width: 100%;
    padding: 100px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.technique{
    width: 300px;
    height: 300px;
    box-shadow: 2px 4px 8px grey;
    border-radius: 8px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    margin:10px;
    transition: all 0.4s;
}
.technique1{
    width: 100%;
    height: 600px;
    background-image: url("../image/technique/hanq1.jpg");
 
   
}
.technique2{
    background-image: url("../image/technique/technique4.jpg");
}
.technique3{
    background-image: url("../image/technique/technique10.jpg");
}
.technique4{
    background-image: url("../image/technique/technique5.jpg");
}
.technique5{
    background-image: url("../image/technique/technique6.jpg");
}
.technique6{
    background-image: url("../image/technique/technique8.jpg");
}
.technique7{
    background-image: url("../image/technique/technique12.jpg");
}
.technique8{
    background-image: url("../image/technique/technique11.jpg");
}
.technique9{
    background-image: url("../image/technique/technique13.jpg");
}
.technique10{
    background-image: url("../image/technique/technique16.jpg");
}
.technique11{
    background-image: url("../image/technique/technique3.jpg");
}
.technique12{
    background-image: url("../image/technique/technique9.jpg");
}
.technique13{
    background-image: url("../image/technique/technique7.jpg");
}
.technique14{
    background-image: url("../image/technique/technique14.jpg");
}
.technique15{
    background-image: url("../image/technique/technique2.jpg");
}
#factory{
    padding: 100px ;
    text-align: center;
}
.factory-img-1,
.factory-img-11,
.factory-img-12,
.fact-img-box2>*,
.fact-img-box3>*{
    box-shadow: 2px 4px 8px grey;
    border-radius: 8px;
}




.factory-img{
    width: 100%;
    height: 700px;
    display: flex;
    justify-content: space-between;
    margin:20px 0;
}
.factory-img-1{
    width: 38%;
    height:700px;
    background-image: url("../image/factory/factory19.jpg");
    
}
.fact-img-all{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;

}
.fact-img{
    height: 700px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;

}
.fact-img-box2{
    width: 35%;
}
.fact-img-box3{
    width: 22%;
}
.fact-img-2{
    width: 100%;
    height: 35%;
    background-image: url("../image/factory/factory2.jpg");
   
}
.fact-img-3{
    width: 100%;
    height: 60%;
    background-image: url("../image/factory/factory10.jpg");
   
}
.fact-img-4{
    width: 100%;
    height: 60%;
    background-image: url("../image/factory/factory18.jpg");

}
.fact-img-5{
    width: 100%;
    height: 35%;
    background-image: url("../image/factory/factory9.jpg");

}
.fact-img-6{
    width: 100%;
    height: 35%;
    background-image: url("../image/factory/factory1.jpg");
}
.fact-img-7{
    width: 100%;
    height: 60%;
    background-image: url("../image/factory/factory3.jpg");

}
.fact-img-8{
    width: 100%;
    height: 60%;
    background-image: url("../image/factory/factory5.jpg");

}
.fact-img-9{
    width: 100%;
    height: 35%;
    background-image: url("../image/factory/factory4.jpg");

}
.factory-img-11{
    width: 38%;
    height:700px;
    background-image: url("../image/factory/factory11.jpg");
    
}
.factory-img-12{
    width: 38%;
    height:700px;
    background-image: url("../image/factory/factory14.jpg");
    
}
.fact-img-13{
    width: 100%;
    height: 35%;
    background-image: url("../image/factory/factory13.jpg");

}
.fact-img-14{
    width: 100%;
    height: 60%;
    background-image: url("../image/factory/factory17.jpg");

}
.fact-img-15{
    width: 100%;
    height: 60%;
    background-image: url("../image/factory/factory7.jpg");

}
.fact-img-16{
    width: 100%;
    height: 35%;
    background-image: url("../image/factory/factory8.jpg");

}




#location{
    width: 100%;
    height: 510px;
    position: relative;
    border:3px solid #FFA500
}
.address-location{
 
    padding: 30px;
    border:3px solid #FFA500;
    box-shadow: 2px 4px 6px grey;
    border-radius: 16px;
    position: absolute;
    right: 100px;
    bottom: -150px;
    z-index: 3;
    background-color: white;

}
#location ol{
    list-style-type: none;
}
#location ol>li{
    padding: 10px;
}
#location .fa-solid{
    color:#FFA500;
    font-size: 20px;
    margin:10px
}
iframe{
    width: 100%;
    height: 500px;
}
footer{
    display: flex;
    padding: 100px;
    background-color: #FFA500;
    color:white
}
footer ol,
footer ul{
    list-style: none;

}
footer ol>li,
footer ul>li{
    padding: 8px;
}
footer>*{
    padding:0px 50px;
}
footer a{
    color:white;
    text-decoration: none;
}
footer h2{
    margin:20px
}
footer .logo{
   
    width: 200px;
    height: 170px;
    margin:20px;
    background-image: url("../image/logoHrazdan2.jpg");
}
@media only screen and (max-width:1024px) {
    nav{
        height: 80px;
        position: relative;
     }
    .menu{
        left:-200%;
        position: absolute;
        top:80px;
        background-color: white;
        transition: all 0.8s;

       }
       .menu ul{
        flex-direction: column;
       }
    .menu-bar{
        display: block;
        background-color: transparent;
        border:none;
        color:#FFA500;
        font-size: 32px;
     }
    .fa-xmark{
        display: none;
    }
    
    .show{
        left:0;
    }
    .show-xmark{
        display: block;
    }
    .hidden{
        display: none;
    }
    #home{
        height: 600px;
    }
    .home-color{
        padding: 50px;
        height: 600px;
    }
    .home-info{
        top:150px
    }
    .home-info>h1{
        font-size: 52px;
    }
    .home-info p{
        font-size: 26px;
    }
  
    #about{
        flex-direction: column;
        padding: 50px;
    }
    .about-img,
    .about-info{
        width: 100%;
    }
    .about-info{
        order:1
    }
    .about-img{
        order:2
    }
    .sand-mine-header>p,
    .factory-header>p {
        width: 80%;
    }
    .sand-mine-info{
        padding: 20px;
        font-size: 22px;
    }
    #materials,
    #work,
    #techniques,
    #factory  {
        padding: 50px;
    }
    #materials p,
    #work p,
    #techniques p{
        width: 90%;

    }
    .slider-for{
        width: 100%;
     
    }
    .slide{
        height: 200px;
        border-radius: 8px;
    }
    .factory-img-1,
    .fact-img,
    .factory-img,
    .factory-img-11,
    .factory-img-12{
        height: 600px;
    }
    .address-location{
        padding: 10px;
        
    }
    footer{
        padding: 50px;
    }
}
@media only screen and (max-width:600px) {
    .menu{
        width: 100%;
        z-index: 10;
    }
    .phone{
        padding: 4px 8px;
    }
    #home{
        height: 350px;
    }
    .home-color{
        padding: 10px;
        height: 350px;
    }
    .home-info{
        top:100px
    }
    .home-info>h1{
        font-size: 30px;
        margin:20px
    }
    .home-info p{
        font-size: 16px;
    }
    #home .slick-prev{
        left:8px;
    }
    #home .slick-next{
        right: 8px;
    }
    .slick-prev{
        left:0px
    
    }
    .slick-next{
        right:0px
    }
    .slick-next:before,
    .slick-prev:before{
        font-size: 20px;
    }
    #about,
    #materials,
    #work,
    #techniques,
    #factory{
        padding: 20px;
    }
    .about-info h1,
     #materials h1, 
     #work h1,
     #techniques h1{
        font-size: 22px;
    }
    .about-img{
        height: 400px;
    }
    .about-img-box{
        width: 90%;
    }
    .line{
        margin:10px auto;
    }
    .sand-mine-container>*{
        width: 100%;
    }
    .sand-mine-info{
        height: 250px;
        font-size: 20px;
    }
   
    .sand-mine-img1{
        order:1
    }
    .sand-mine-info1{
        order:2
    }
    .sand-mine-info2{
        order:4
    }
    .sand-mine-img2{
        order:3
    }
    .sand-mine-info3{
        order:6
    }
    .sand-mine-img3{
        order:5
    }
    .sand-mine-info4{
        order:8
    }
    .sand-mine-img4{
        order:7
    }
    .sand-mine-info5{
        order:10
    }
    .sand-mine-img5{
        order: 9;
    }
    .sand-mine-info6{
        order:12
    }
    .sand-mine-img6{
        order:11
    }
 
    #materials p,
    #work p,
    #techniques p,
    .factory-header>p {
        margin:10px auto;
        width: 100%;

    }
  
    .slider-for .work{
        height: 350px;

    }
    .slider-for .slide{
        height: auto;
    }
    .technique{
        width: 100%;
    }
    .technique1{
        height: 300px;
    }
    .factory-img-1,
    .fact-img,
    .factory-img,
    .factory-img-11,
    .factory-img-12{
        height: 300px;
    }
    .factory-img{
        flex-wrap: wrap;
        height: auto;
    }
    .factory-img-1,
    .fact-img-box2,
    .factory-img-11,
    .factory-img-12 {
        width: 48%;
    }
    .fact-img-box3 {
        width: 100%;
        height: 400px;
        margin:20px 0
    }
    .fact-box1{
        order:1
    }
    .fact-box3{
        order:2;
    }
    .fact-box2{
        order:3
    }

    footer{
        padding: 10px;
    }
    iframe{
        height: 300px;
    }
    #location{
        position: static;
        height: auto;
    }
    .address-location{
        position: static;
    }
    .contacts{
        display: none;
    }
    footer .logo{
        width: 100px;
        height: 80px;
    }
    footer>*{
        padding: 0;
    }
  
}