.navbar{
    width:90%;
    max-width:1200px;
    height:85px;
    margin:0 auto; 

    display:flex;
    justify-content:space-between;
    align-items:center;

    background:#fff;
    padding:0 30px;
    box-sizing:border-box;
}

header{
    width:100%;
    background:#fff;
}

.logo h1{
    font-size:28px;
    font-weight:300;
        color:#555;
    transition:.3s;
    cursor:pointer;
}
.logo h1:hover{
    color:#d3d3d3;
}

.menu{
    display:flex;
    list-style:none;
    gap:35px;
}

.menu a{
    text-decoration:none;
    color:#555;
    font-size:17px;
        color:#555;
    text-decoration:none;
    transition:.3s;
}
.menu a:hover{
    color:#ff7a00;
}


#menu-toggle{
    display:none;
}

.hamburger{
    display:none;
    font-size:34px;
    cursor:pointer;
}


@media (max-width:900px){

    .hamburger{
        display:block;
    }

    .menu{
        position:absolute;
        top:85px;
        right:0;
        width:240px;
        background:white;

        flex-direction:column;
        align-items:flex-start;
        gap:0;

        display:none;
    }

    .menu li{
        width:100%;
    }

    .menu li a{
        display:block;
        width:100%;
        padding:18px 25px;
        border-bottom:1px solid #ddd;
    }


    #menu-toggle:checked ~ .menu{
        display:flex;
    }
}

.telefon{
    font-style: 4px;
}
.ustbar{
    background:rgb(8, 60, 88);
    height:50px;
    width:100%;
}

.ustbar .container{
    width:1140px;
    margin:auto;
    display:flex;
    justify-content:space-between;
    align-items:center;
    height:50px;
}

.telefon{
    color:white;
    font-size:18px;
    font-weight:bold;
    margin-left: 25px;
}

.sosyal a{
    color:white;
    margin-left:18px;
    text-decoration:none;
    font-size:18px;
}

.sosyal a:hover{
    color:#d9d9d9;
}
.cözümlerimizbaslik{
    font-size:135%;
    font-weight:500;
    margin-top:2.5%;
    margin-left:20.1%;

}

.turuncucizgi{
width: 85px;
    height: 2px;
    background-color: #fd7e14;
    margin-top: 0.3%; 
    margin-left: 20.1%; 
}




*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    text-deceration:none;
    color:inherit;
}

body{
    font-family:Arial,Helvetica,sans-serif;
    background:#fff;
}

.services{

    width:90%;
    max-width:1200px;

    margin:60px auto;

    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:70px 100px;

}


.service{


    width:25%;

    min-width:220px;

    text-align:center;

    text-decoration:none;

    color:#d35f00;   

}

.service,
.service:visited,
.service:hover,
.service:active{
    text-decoration: none;
    color: #d35f00;
}

.icon{

    width:90px;
    height:90px;

    margin:auto;

    border-radius:50%;

    background:#ef4444;

    display:flex;
    justify-content:center;
    align-items:center;

    transition:.35s;

}

.icon i{

    color:white;
    font-size:40px;

}

.service span{

    display:block;

    margin-top:22px;

    font-size:22px;

    font-weight:600;

    color:#d35f00;  

}



.service:hover .icon{

    background:#dff3ff;

}

.service:hover .icon i{

    color:#ef4444;

}

.service:hover span{

    color:#d35f00;

}



@media(max-width:900px){

.service{

    width:40%;

}

}



@media(max-width:600px){

.service{

    width:100%;

}

.service span{

    font-size:18px;

}

.icon{

    width:75px;
    height:75px;

}

.icon i{

    font-size:32px;

}
}





.alt-bilgi{
    width:100%;
    background:#0e4761;
    color:white;
    text-align:center;
    padding:45px 20px;
}


.firma{
    font-size:22px;
    margin-bottom:30px;
}


.cizgi{
    width:70%;
    height:1px;
    background:rgba(255,255,255,.2);
    margin:0 auto 25px auto;
}


.copyright{
    font-size:14px;
}


@media (max-width:768px){

    .firma{
        font-size:18px;
    }

    .copyright{
        font-size:12px;
    }

    .cizgi{
        width:90%;
    }

}



