@font-face {
    font-family: Swis;
    font-style: normal;
    src: url('../fonts/Swis.ttf') format('truetype');
}

.SingleTech{
    background-color:#333;
    padding: 170px 0 120px;
}

#back-top{
    display:none !important;
}

.tech-container{
    width:1200px;
    margin:0 auto;
    height:100%;
    box-shadow:0 0 20px 10px #0000005e;
    position:relative;
}

.Image1{
    width:29%; 
    position:absolute;
    top:-6%;
    left:7%;
}


.margin-left-1{
    margin-left:40%;
}

.margin-left-2{
    margin-left:40%;
}

.margin-left-3{
    margin-left:40%;
}

.image3{
    width:120px; 
    position:absolute;
    bottom:6%;
    left:8.5%;
}

.content{
    color:white;
    width:80%;
    margin:8.5% 10% 13%
}

.content p{
    font-family:Iranyekan,Ebrima;
    line-height:1.5;
}

.tech-container li{
    font-family:Iranyekan,Ebrima;
    line-height:1.5;
    text-align:right;
    padding-right:5%;
    direction:rtl;
}

.margin-bottom{
    margin-bottom:20px;
}


.content h3{
    font-family:Beirot;
    font-size:280%;
    color:yellow;
    margin-bottom:20px;
    text-align:right;
}

.font{
    font-family:Swis;
    font-size:100%;
}
.phone{
        display:none;
    }
    
    .window{
        display:block
    }


@media only screen and (max-width:1400px){
    .tech-container{
        width:1000px;
    }

    .margin-left-3{
         margin-left:0;
    }
    
    .Image1{
        width:24%;
        top:-4%;
    }
}

@media only screen and (max-width:1200px){
    .Image1{
        width:27%;
        top:-3%;
        left:4%;
    }
    
    .tech-container{
        width:900px;
    }
}


@media only screen and (max-width:991px){
    .tech-container{
        width:720px;
    }
    
    .SingleTech{
        padding:140px 0 80px;
    }
    
    .margin-left-2{
        margin-left:0;
    }
    
    .content{
        margin:10.5% 10% 13%;
    }
    
    .margin-left-1{
        margin-left:31%;
    }
    
    .Image1{
        width:24%;
        top:-4%;
        left:7%;
    }
    
    .image3{
        width:100px;
        bottom:4%;
    }
    
    .content h3{
        font-size:240%;
    }

}


@media only screen and (max-width:767px){

    .tech-container{
        width:520px;
    }
    
    .margin-left-1{
        margin-left:0;
    }
    
    .Image1{
        width:34%;
        top:unset;
        left:28%;
        bottom:0;
    }
    
    .content{
        margin:10.5% 10% 87%;
    }
    
    .image3{
        bottom:2%;
    }
    
    .SingleTech{
        padding:120px 0 80px;
    }
}


@media only screen and (max-width:575px){
    .tech-container{
        width:90%;
    }
    .content h3{
        font-size:200%;
    }
}

@media only screen and (max-width:450px){
   .Image1{
       width:53%;
       left:20%;
   }
   
   .content h3{
       font-size:180%;
   }
   
   
   .SingleTech{
       padding:100px 0 80px;
   }


    .image3{
        bottom:4%;
        width:80px;
    }
    
    .content{
        margin:10.5% 10% 118%;
    }
    
    .Image1{
        width:43%;
        left:21%;
        bottom:1.5%;
    }
    
    .image3{
        bottom:1.5%;
    }
}


@media only screen and (max-width:340px){

}