#intro {
    width:100%;
    background-image: url("../asset/img/intro.jpg");
    transform: translateZ(0); 
    -webkit-transform: translateZ(0); 
    -moz-transform: translateZ(0); 
    position: relative;
    top: 0;
    z-index: -1;
    height: 100vh;
    background-attachment: cover;
    background-size: cover;
    background-repeat: no-repeat;
}

#intro img {
    width: 100%;
    object-fit: cover;
    box-shadow: 10px 5px 2px #510000;
}

#intro-title {
    position: absolute;
    top: 55%;
    left: 0;
    width: 100%;
    font-weight: 300;
    color: #EDEDED;
    font-family: 'Krona One', sans-serif;
    padding: 0 20px 0 20px;
    background-color: rgba(71,67,67,0.7);
}

#intro-title::after {
    position: relative;
    left: 12%;
    content: "Zarif Hali";
    font-family: 'Londrina Outline', cursive;
    font-size: 80px;
    
}

#intro-title::before {
    position: relative;
    left: 12%;
    font-size: 70px;
    content: "Taşın En";
    font-family: 'Anton', sans-serif;
}


/*Who are we section*/

#who-are-we {
    background-color: #EDEDED;
    text-align: center;
    margin-bottom: 30px;
    width:100%;
}

.who-are-we-section {
    top: 70px;
    position: relative;
}

#who-are-we h3 {
    color: #0B0A0A;
    font-size: 50px;
    font-family: 'Teko', sans-serif;
}

#who-are-we p {
    font-family: 'Hind', sans-serif;
    padding: 20px;
    font-size: 20px;
}


/*Parallax Section*/
.row{
    margin:0;
}

.parallax-div {

    margin-top: 190px;
    height: 500px;
    background-image: url('../../assets/img/parallax.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    background-position:center; 
    -o-background-size:cover; 
    -moz-background-size:cover; 
    -webkit-background-size:cover; 
}

.happy-clients {
    height: 400px;
    width: 100%;
    background-color: rgba(71,67,67,0.7);
    position: relative;
    top: 50px;
    z-index: 0;
}

.happy-clients-icon {
    text-align: center;
    position: relative;
    top: 120px;
    transition: all .5s ease-in-out;
}

.happy-clients-icon i {
    color: #EDEDED;
    font-size: 80px;
    transition: all 0.6s;
}

.happy-clients-icon:hover i {
    color: black;
    font-size: 100px;
}

.happy-clients-text {
    position: relative;
    top: 40px;
}

.happy-clients-text h4 {
    color: #EDEDED;
    font-size: 20px;
    font-family: 'Krona One', sans-serif;
}


/*Products Section*/

#products-title h2 {
    bottom: 30px ;
    font-family: 'Teko', sans-serif;
    font-size: 60px ;
    position: relative;
    font-weight: 400 ;
    margin-top: 150px;
    color: #474343 ;
}

.cont {
    width: 69%;
    margin: auto;
    transition: all .5s ease-in-out;
}

#products {
    padding: 30px 20px 25px 20px;
    position: relative;
    text-align: center;
    background-color: #EDEDED;
}

.product-text-title h2 {
    color: #474343;
    padding: 10px;
font-family: 'Teko', sans-serif;
    font-size:45px;
}
.product-text-title a {
    text-decoration: none;
}
.product-text-paragraph a {
  font-family: 'Teko', sans-serif;
    color:rgb(58, 31, 5) ;
    text-decoration: none;
}

#products p {
    color: #474343;
    padding:  0px 30px 10px 30px;
    font-size: 20px;
  font-family: 'Hind', sans-serif;
}

.product-box {
    overflow: hidden;
    text-overflow: ellipsis;
    border: #510000;
    background-color: #EDEDED;
    width: 100%;
    margin-bottom: 30px;
    padding-bottom: 15px;
}

.product-text-title {
    position: relative;
    top: 10px;
    text-overflow: clip;
    width: 100%;
}

.product-text-paragraph {
    width: 100%;
}

.product-img img {
    height: 350px;
    width: 100%;
    object-fit: cover;
    box-shadow: 5px 5px 5px 5px #474343;
}

.row {
    flex-wrap: wrap;
    display: flex;
    padding: 0 4px;
}


/*About Us*/

#about-us {
    background-color: #0B0A0A;
    text-align: center;
    margin-bottom: 30px;
}

.about-us-section {
    top: 80px;
    position: relative;
}

#about-us h3 {
    color: #EDEDED;
  font-size: 50px;
    font-family: 'Teko', sans-serif;
}

#about-us p {
    background-color: #474343;
    padding: 20px;
    color: #EDEDED;
    font-size: 20px;
}

#about-us hr {
    background-color: #EDEDED;
}
@media screen and (min-width:1025px){
    #intro{
        background-attachment:fixed;
    }
    .parallax-div{
        background-attachment:fixed;
    }
}
@media screen and (max-width:1200px) {
    .cont {
        width: 96%;
    }
}
@media screen and (max-width:767px){
	    .happy-clients-icon {
        top: 0px;
    }
    .happy-clients-icon i {
        font-size: 40px;
        margin-top: 30px;
    }
    .happy-clients-text {
        position: relative;
        top: 30px;
    }
    .happy-clients-text h4 {
    font-size: 15px !important;

    }
    #intro-title::before{
    left:0;
    font-size:55px ;
    
    }
    #intro-title::after{
      font-size:65px;
      left:0;
    }
}