@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;300;400;500;600&display=swap');
:root{
    --main-color:#FFC61A;
    --black-color:#151414;--bla-color:rgb(15, 14, 14);
}   
*{
    font-family: 'Poppins', sans-serif;
    margin:0;
    padding:0;
    box-sizing:border-box;
    outline:none;
    border:none;
    text-decoration:none;
    text-transform:none;
    transition: 0.2s ease;}
    
    html{font-size:62.5%;
    overflow-x:hidden ;
    min-height: 20vh;max-width:100%;background:url(../images/paper-v3.png)!important;background-color:rgba(rgb(249, 213, 86,0.9));opacity:1 ;background-size: cover ;
    }
    html::-webkit-scrollbar{background-color: white;
    width:1rem;}
    html::-webkit-scrollbar-thumb{background-color:var(--main-color);border-radius:3rem;}
    .title{font-size:30rem;}
    button{background-color: transparent;}
    
    
    
.header .logo img{width:10rem;margin-right:10px}
    /* HEADER START */
    .header .logo img{width: 10rem;}
     
    .header{
        background-color:white;
        display:flex;
        align-items:center;
        justify-content:center;
        padding:0 7%;
        z-index: 10000;
        
        box-shadow:0px 0px 17px -2px rgba(0,0,0,0.75);
        position:sticky;
        top:0;
    }   
    
    .mainbuttons{margin-left:5rem}
    .mainbuttons i {margin-left:10px;
    cursor:pointer;
    font-size:2.5rem;}
    .rmbuttons{margin-right:10rem;font-family: 'Poppins', sans-serif;}
    
    .iconcizgi::after{content:"|";margin:0 10px;height:2rem;width:0.3rem;color:var(--black-color)}
        .rmbuttons a {
            color: white;
            text-decoration: none;
            
            font-size:medium;

        }
        
        
        .rmbuttons a:visited {
            color: white;
        }
        
        
        .rmbuttons a:hover{
            color:rgb(228, 152, 21) ;

        }
        .rmbuttons a:hover i{
            color:rgb(228, 152, 21)!important ;
            
        }
        .ad{font-size: 1.7rem!important;font-family: 'Poppins', sans-serif!important;
        text-decoration: none;
        font-style:normal;
        color:white}
        .ad:hover{color:rgb(228, 152, 21);}
        .hkmd:hover{cursor: pointer;}
    
    .main{
        height:5rem;
        background-color:rgb(43, 41, 41);
        justify-content:space-between;
        align-items: center;
        display: flex;
        
        }
     
    .yan2 .yanara2{
        padding-left: 1rem;
        margin-left:auto;
        display:inline-block;
        padding:2.7rem 2.01rem;
        border-radius:0;
        font-size:1.3rem;
        background-color:rgb(43, 41, 41);
        color:#fff;
        cursor:pointer;}
    
    .yan .yanara{margin-left:auto;
        display:inline-block;
        padding:2.7rem 2rem!important;
        border-radius:0;
        font-size:1.3rem;
        background-color: rgb(0, 166, 42);
        color:#fff;
        cursor:pointer;

    }
    
    .yan .yanara a,.yan2 .yanara2 a{color:#fff;font-weight:bold;}
    .yan{display: flex;position:sticky;flex:1;z-index: 2001;bottom:15rem;}
    .yan2{display: flex;position:sticky;flex:1;z-index: 2001;bottom:7rem;}
    .navbar a{color: var(--black-color);
        text-decoration: none;
        margin:0 2rem;
        border-bottom: 0.2rem solid transparent;

        font-size:1.6rem;
        }
    
    .navbar .link{
        
        text-decoration: none;
        background-color: transparent;
        text-align: center;
        align-items:center;
        padding:0 20px;
        font-size: 2rem;
        font-weight: 600;}    
    .navbar a:hover{border-color:var(--main-color)!important;
        padding-bottom:0.5rem; 
        
        }
    .navbar .simdikisayfam {border-color:var(--main-color);
        padding-bottom:0.5rem;
        margin:0 1rem;
        border-bottom:0.2rem solid var(--main-color)}
    
    /*.iconcizgi2 {
        width: 5px; 
        height: 20px; 
        background-color: var(--black-color); 
        margin: 0 30px;
    }*/
    .wpbutton{
        bottom:50px;
        right:10px;
        background-image:"images/wp.jpeg";
        background-size:cover;
        
    }
   
    .navbar{margin-right:1rem;}

    .ust{
        min-height: 80vh;
        background: url(../images/hakkimdabgv2.png)
        no-repeat;
        background-size: cover;
        background-position: center;
        color:#fff;
        
        padding:-1rem 0; 

        
    }
    .ust-container{
        display:block;
    }
    .ust .content{
        max-width: 70vh;
        padding: 5rem;
        padding-left: 5rem;
        margin-left: 10rem;
        color: var(--main-color);
        display: inline-flex;
        flex-direction: column;
        
    }
    
    .ust .content h3{
        font-size: 3.5rem;
        font-weight:bold
        
    }
    .ust .alotaksi{
        display: block;
    }
    .ust .content p{font-size:1.8rem;
    font-weight:700}
    .ust .btn{position: relative;
        top: 80%;
        left: -32.9%;
        display: inline-block;
        padding: 2rem 3.75rem;
        border-radius: 30rem;
        font-size: 2rem;
        background-color: var(--main-color);
        color: #fff;
        cursor: pointer;
        font-weight: bold;}
    .hizmets{padding-top:3%!important;padding:1.5% 5%;color:white;background-color: transparent;}
    .hg{background-color:transparent;color:white;}
    .orta .hg h3,.hizmets p{font-size:2.5rem;font-weight:600}
   
    /*.orta .box img .cıbıq{width:1rem;height:4rem;position:fixed;left:0;}*/
    /*.orta .box-container{
        display:grid;
        grid-template-columns:repeat(auto-fit,minmax(30rem,1fr)) ;
        gap:4rem;
        margin:3rem 6rem;
        height:15rem
    }*/
    .all{background:url(../images/paper-v2png.png)!important;}
    .orta{background-color:rgba(255, 255,255 , 0.5);opacity:0.1;background-position: center;z-index:1;padding-bottom:3rem;}
    
    .orta .box-container {padding-top:10rem}
    .orta .box-container .box h3{color:#FFC61A!important}
    .orta .box-container .box{
        
        padding:2rem;
        height: 20rem;
        font-size:1.8rem;
        font-weight: 200;
        border-radius:0rem;
        background-color:transparent;
        min-height: 19rem;
        display: flex;
        flex-direction: column;
        
        padding:1rem 0; 
        
    }
    
    .orta .box-container .box-yazi p{color:var(--black-color)!important;padding:1rem 0;font-weight: 500;align-items: left!important;display:flex;width: 40%;}
    .orta .box-container .box:hover h3   {color:var(--main-color)!important;
    }
    /*.orta .box-container .box:hover{box-shadow:-12px 12px 10px 3px rgba(0,0,0,0.75);}*/
    .orta .box-container .box img{transform: scale(0.7);}
    .orta .box-container .box:hover img {transform:scale(1.0) ;-webkit-transform: scale(1.0);transition-duration: 0.30s;}
    /*.orta .hizmets{width:190rem;
    height:5rem;background-color: var(--black-color);
    border:5rem solid #151414;
    padding:-3rem -7%;}*/
      
    .orta .box-container {padding:1 0;padding:3rem 10%}
    .orta .box-container .box img{width:10rem;
        }
    
    .orta .hizmets h3{border-bottom:0.2rem solid var(--black-color);}
    .orta h3 .hizmet{font-size:4rem;color:var(--black-color);
        padding:0 2rem}
    .orta .box-container .box h3{font-size: 3rem;
    color:rgb(0, 0, 0);
    }
    .orta {background-size:cover;background-position: center;min-height:55rem;
    background-color:rgba(255, 255,255 , 0);opacity:1;}
    .hizmetler {height:auto;font-size:4rem;color:var(--main-color);   padding:1.5% 5%; }
    .hizmets2{font-size: 600;color:var(--black-color);background-color:transparent;height:10rem;border-bottom:0.2rem solid var(--black-color);padding:2%!important;}
    .hizmets2 p{position:relative;top:15%}
    .hizmet-box-container {display:grid;
        grid-template-columns:repeat(auto-fit,minmax(30rem,1fr)) ;
        gap:6rem;
        margin: 4rem 9rem;
        
        }

    .hizmet-box{background-color: transparent;
    min-height:30rem;
    border-radius: 0rem;
    padding:2% 7%;max-height: 10;display: flex;gap:2rem;}
    .money{display: flex;
        height: fit-content;
        align-items: left;
        vertical-align: middle;
        padding: 7.5rem 0;
        position: relative;
        width: 36%;
        bottom: 16%;}
    .money-colored{align-items:left;vertical-align:middle;padding:7.5rem 0;position:absolute;display:none}
    .box-line{border-left: 0.7rem solid rgb(96, 95, 95);height: 19rem;border-radius: 2rem;position: relative;width: 1rem;
        
        vertical-align: middle;z-index: 1000;top:11%
        }
    .hizmet-box:hover{box-shadow:-10px 10px 10px -2px rgba(0,0,0,0.51);}
    .hizmet-box:hover .box-line{border-color:#ffad84;}
    /*.hizmet-box:hover .money{display:none}*/
    .hizmet-box:hover .money-colored{display: inline-block;}
    .hizmet-box:hover .box-title,.hizmet-box:hover .box-title2{color:#dd8724!important}
    .box-title{color:rgb(96, 95, 95);animation-delay: 0s;position: relative;
        
        font-size: 2.5rem;
        font-weight: 600;
    right:2%}
    .hizmet-box .box-title .write,.hizmet-box .box-title2 .write    {max-width: 29rem;
    font-size: 2rem;
    font-weight: 500;
    position: relative;
    }
    .hizmet-box .box-title2{color: rgb(96, 95, 95);
        animation-delay: 0s;
        position: relative;
        top: -19rem;
        left: 10rem;
        font-size: 2.5rem;
        font-weight: 600;
        }
    .taban{background-color:rgb(43, 41, 41);height:30rem;width:100%;display: flex;bottom:0;padding:1rem 2rem}
    .taban .iletisim{width:15rem}
    .taban .iletisim .iletbilgi{font-size: 1.5rem;font-weight:400;color:var(--main-color);border-bottom:0.1rem solid var(--main-color);padding-left: 1rem;text-align: left;}
    .taban .iletisim .bilgi{font-size:1.5rem;color:white;font-weight:300;padding-bottom:-2rem}
    .taban .iletisim a {color:white;font-weight: 350;}
    .taban .iletisim a:hover{color:var(--main-color)}
    .taban .konum{position:relative;left:5rem;width: 30rem;}
    .taban .durakkonum{position: relative;
    left: 7rem;}
    .taban .reklamolcaktabi{width:20rem;position:relative;left: 11rem;}
    .box-img{        display: contents;
        max-width: 31%;
        position: relative;
        bottom: 2rem;}
    .container{max-width: 1170px;
    margin:auto;
}
    .row{display:flex;
    flex-wrap:wrap;margin:auto}
    .row ul{list-style:none;
    }
    .footer{background-color:rgb(43, 41, 41) ;padding:0 15px;height: auto;}
    .col{
        width:25%;
        padding:0 15px;
    }
    .col h4{
        font-size: 1.4rem;
        color: white;
        text-transform: capitalize;
        margin-bottom: 1rem;
        font-weight: 300;
        position: relative;    
    }
    .footer-head{    font-size: 1.7rem!important;
        font-weight: 500!important;
        border-bottom: 0.2rem solid var(--main-color);
        color: var(--main-color)!important;
        margin: 1rem 0.2rem;}
    .col a{
        color: white;
        font-size: 1.5rem;
    }
    .col a:hover{
        color:var(--main-color)
    }
    
    @media (max-width:600px){
        html {
            font-size:45%;
            
        }
        h3{
            font-size: 50%;
        }
        .row{
            display: flex;
    flex-wrap: wrap;
    margin: auto;
    font-size: 1rem !important;
    flex-direction: row;
    align-content: stretch;
    justify-content: space-around;
    align-items: flex-start;
        }
        .col{
            width:50%;
        }
        .ust .content{
            margin-left:0;
        }
        .ust .content h3 {
            font-size: 2.2rem;
            font-weight: bold;
        }
        .ust .content p {
            font-size: 1.6rem;
            font-weight: 700;
        }
        .ust .content p {
    font-size: 1.6rem;
    font-weight: 700;
        }
        .ust .alotaksi {
            display: block;
            top: 35rem;
            left: 22rem;
            /* font-size: 0rem; */
            position: relative;
        }
        .orta .box-container {
           
            padding: 2rem 4%;
        }
    }