body {
  margin: 0;
  overflow-x: hidden;
}
.kilavuz {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 999;
  display: flex;
  justify-content: space-between;
}
.kilavuz div {
  width: 75px;
  background-color: #ff0000;
  opacity: 10%;
}
.kilavuz div:nth-child(2) {
  position: relative;
  left: -330px
}
.kilavuz div:nth-child(3) {
  position: relative;
  left: 330px
}
.menu {
  font-size: 12px;
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  gap: 15px;
  display: flex;
  margin: 0;
  width: 100%;
  max-width: 1220px;
  padding: 20px 0px;
}
.menu a{
  text-decoration: none;
  color: #1A1714;
}
.birinci-ust img {
    width: 450px;
    max-width: 100%;
    height: 340px;
    object-fit: cover;
    flex-shrink: 0;
}
.birinci-yazilar span:nth-child(1) {
    font-size: 32px;
    text-align: end;
    font-weight: 300;
}
.birinci-yazilar strong {
    font-size: 32px;
    text-align: end;
    font-weight: 600;
}
.birinci-yazilar span:nth-child(2),
.birinci-yazilar span:nth-child(3) {
    font-size: 16px;
    max-width: 676px;
}
.birinci-yazilar {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.birinci-ust {
    display: flex;
    flex-direction: row;
    gap: 88px;
    padding-bottom: 70px;
}
.birinci-alt div div span {
    font-size: 32px;
    font-weight: 300;
}
.birinci-alt div div strong {
    font-size: 36px;
    font-weight: 600;
}
.birinci-alt .alt-span {
    font-size: 16px;
    max-width: 676px;
    display: block;
}
.birinci-alt div div {
    display: flex;
    flex-direction: column;
    gap: 0px;
}
.birinci-alt div {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.birinci-alt iframe {
    width: 450px;
    max-width: 100%;
    flex-shrink: 0;
}
.birinci-alt {
    display: flex;
    flex-direction: row;
    gap: 88px;
}
.birinci-bolum {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 100px;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
}
/*ikinci bölüm*/

.ikinci-bolum .baslik {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    border-bottom: 5px solid #E8A07C;
    text-align: end;
    width: 100%;
    max-width: 1214px;
    box-sizing: border-box;
}
.ikinci-bolum .baslik span {
    font-size: 24px;
    color: #797979;
}
.ikinci-bolum .baslik strong {
    font-size: 36px;
}
.ikinci-bolum .orta-icerik .ust img,
.ikinci-bolum .orta-icerik .alt img {
    height: 150px;
}
.ikinci-bolum .yazilar {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.ikinci-bolum .yazilar strong {
    font-size: 32px;
    font-weight: 400;
    text-align: center;
    display: block;
}
.ikinci-bolum .yazilar span {
    font-size: 16px;
    font-weight: 250;
    max-width: 324px;
    display: block;
}
.ikinci-bolum .optima{
    font-size: 32px !important;
    width: 200px !important;
    font-weight: 600 !important;
}
.ikinci-bolum .kart {
    background-color: white;
    width: 344px;
    max-width: 100%;
    height: 457px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px;
    box-sizing: border-box;
}
.ikinci-bolum .bir .yazilar {
    align-items: center;
    text-align: center;
}
.ikinci-bolum .alt-orta .bir {
    border: 4px solid #E8A07C;
}
.ikinci-bolum .ust-ust,
.ikinci-bolum .ust-alt,
.ikinci-bolum .alt-ust,
.ikinci-bolum .alt-orta,
.ikinci-bolum .alt-alt {
    display: flex;
    flex-direction: row;
    gap: 90px;
}
.ikinci-bolum .orta img {
    width: 236px;
    height: 112px;
}
.ikinci-bolum .orta span {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-size: 20px;
    color: white;
    font-weight: 250;
}
.ikinci-bolum .orta {
    display: flex;
    flex-direction: row;
    background-color: #0A2947;
    max-width: 761px;
    height: 112px;
    padding: 0 40px;
    gap: 145px;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}
.ikinci-bolum .orta div {
    display: flex;
    flex-direction: column;
}
.ikinci-bolum .orta strong {
    font-weight: 700;
}
.ikinci-bolum {
    display: flex;
    flex-direction: column;
    gap: 56px;
}
.ikinci-bolum .ust,
.ikinci-bolum .alt {
    display: flex;
    flex-direction: column;
    gap: 50px;
}
.ikinci-bolum .orta-icerik {
    display: flex;
    flex-direction: column;
    gap: 100px;
    align-items: center;
}
.ikinci-bolum {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 100px;
}
#svg {
    height: 120px;
}

@media (max-width: 1300px) {
    .birinci-bolum,
    .ikinci-bolum {
        padding-left: 40px;
        padding-right: 40px;
        box-sizing: border-box;
    }
    .birinci-ust,
    .birinci-alt {
        flex-direction: column;
        align-items: center;
        gap: 30px;
        width: 100%;
    }
    .birinci-ust img {
        width: 100%;
        max-width: 450px;
        height: auto;
        aspect-ratio: 450 / 340;
    }
    .birinci-yazilar {
        align-items: center;
        text-align: center;
        max-width: 100%;
    }
    .birinci-yazilar span:nth-child(1),
    .birinci-yazilar strong {
        text-align: center;
    }
    .birinci-yazilar span:nth-child(2),
    .birinci-yazilar span:nth-child(3) {
        max-width: 100%;
    }
    .birinci-alt {
        text-align: center;
    }
    .birinci-alt div {
        align-items: center;
    }
    .birinci-alt .alt-span {
        max-width: 100%;
    }
    .ikinci-bolum .baslik {
        text-align: center;
    }
    .ikinci-bolum .ust-ust,
    .ikinci-bolum .ust-alt,
    .ikinci-bolum .alt-ust,
    .ikinci-bolum .alt-orta,
    .ikinci-bolum .alt-alt {
        flex-wrap: wrap;
        justify-content: center;
    }
    .ikinci-bolum .orta {
        max-width: calc(100% - 40px);
    }
}

@media (max-width: 820px) {

    .birinci-bolum,
    .ikinci-bolum {
        padding-left: 20px;
        padding-right: 20px;
    }
    .menu {
        font-size: 11px;
        gap: 8px;
        padding: 16px 0;
    }
    .ikinci-bolum .orta {
        gap: 60px;
        padding: 0 20px;
    }
    .ikinci-bolum .orta img {
        width: 160px;
        height: auto;
        max-width: 100%;
    }
}

@media (max-width: 480px) {
    .birinci-yazilar span:nth-child(1),
    .birinci-yazilar strong {
        font-size: 24px;
    }
    .birinci-alt div div span {
        font-size: 24px;
    }
    .birinci-alt div div strong {
        font-size: 26px;
    }
    .ikinci-bolum .baslik strong {
        font-size: 26px;
    }
    .ikinci-bolum .baslik span {
        font-size: 18px;
    }
    .ikinci-bolum .yazilar strong {
        font-size: 24px;
    }
    .ikinci-bolum .kart {
        width: 100%;
        max-width: 320px;
        height: auto;
    }
    .ikinci-bolum .orta {
        flex-direction: column;
        height: auto;
        gap: 16px;
        padding: 20px;
    }
    .ikinci-bolum .orta img {
        width: 130px;
    }
    .ikinci-bolum .orta div {
        align-items: center;
        text-align: center;
    }
}