body {

    font-family: sans-serif;
    font-size: 20px;
    color: #1B281B;
    line-height: 1.4;
}

.wrapper {
    max-inline-size: 1000px;
    margin-inline: auto;
}

section {
    margin-block: 50px;
}


.two-column {
    display: grid;
    gap: 60px;

    margin-block: 60px;


    @media (min-width: 720px) {
        grid-template-columns: 1fr 1fr;
    }
}

header {
    text-align: center;
    display: flex;
    justify-content: space-between;
}

.primary-navigation ul {
    list-style: none;
    display: flex;
    gap: 30px;
}

.primary-navigation a {
    text-decoration: none;
    font-weight: bold;
    color: black;
    transition: 0.8s;
}

.primary-navigation a:hover .primary-navigation a:focus-visible {
    color: rgb(166, 238, 58);
}




h1 {
    font-family: sans-serif;
    /* burada 3 tane olmasinin sebebi bazi bilgisayarlarda her yazi stilinin calismiyor olmasi. o yuzden biri olmazsa digerini calistiriyor.*/
    color: #474849;
    /* color:inherit yazarsak linklerdeki maviligi normale döndürür.*/
    text-align: center;
    line-height: 1, 1;
    font-size: 65px;

    @media (min-width: 720px) {
        font-size: 120px;
    }
}


h2 {
    font-family: sans-serif;
    color: #cb721c;
}

a {
    color: rgb(2, 134, 2);
}

a:hover,
a:focus-visible {
    color: rgb(166, 238, 58);
}

p {
    font-family: sans-serif;
}

.steal-bg {
    background-color: #22466c;
    border: #4676a9 solid 5px;
    color: #fff;
    padding: 20px;
    text-align: center;
}

.steal-text {
    color: #2a757d;
}

.climp-bg {
    background-image: url(images/simple-steps.jpg);
    padding: 24px;
    border: #4676a9 solid 5px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    color: white;
}


footer {
    background-color: #22466c;
    border: #4676a9 solid 5px;
    color: #fff;
    padding: 20px;
    text-align: center;
}