@import url('https://fonts.googleapis.com/css2?family=Agbalumo&family=Oswald:wght@200..700&display=swap'); 
@import url('https://fonts.googleapis.com/css2?family=Crimson+Text:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap');

:root {
  --font-family-a: 'Oswald', sans-serif;
  --font-family-b: 'Crimson Text', serif;

--sub-nav-top: 48px;
--sub-nav-left: 5px;

--header-border-color: white;
--header-nav-color: white;
--header-nav-font-weight: 500;
--contact-btn-color: white;
--socials-color: white;
--lang-box-color: white;
--lang-sub-box-top: 35px;
--lang-sub-box-left: -30px;

--element-details-image-max-width: 700px;

--contact-field-border: 0px;

--swiper-pagination-color: #ddd;
--swiper-pagination-active-box-shadow: none;
--swiper-pagination-bullet-width: 12px;
--swiper-pagination-bullet-height: 12px;
} .block-component .block-image {//box-shadow: 0px 0px 10px 5px #ccc;
margin-bottom: 3rem;} .heading-component .style-1 {    color: #222;
    font-size: 50px;
    font-weight: 500;} .heading-component .style-1.text-color-0 {color: white;
text-shadow: 0px 0px 2px #999;} .heading-component .style-2 {    color: #aaa;
    font-family: Crimson Text, serif;
    font-size: 21px;
    font-style: italic;} .heading-component .style-2.text-color-0 {color: white;
text-shadow: 0px 0px 2px #999;} .header .nav-holder {padding: 0px 50px;} .header .nav-holder a {color: white; font-weight: 500;} .header .middle-line-inner {justify-content: center;

@media screen and (max-width: 992px) {
   flex-direction: column;
}} .main-swiper-section {    height: calc(100vh - 0px);} .desc {    color: #666;
    font-weight: 300;
    max-width: 400px;} .footer .menu .navv {display: inline-block;
margin-bottom: 10px !important;} .contact-component .submit-btn {background-color: #59815c;
    color: white;} .urunler-lister .row > div:first-child .image-holder div,.urunler-lister .row > div:nth-child(3) .image-holder div {background-position: 0% 50%;} .main-swiper-section .hl2 {font-size: 25px !important;} .middle-line .block-image { opacity: 0;
  transform: translateX(0%);
  transition: all 0.6s ease-out;} .i3-blocks .block-image { opacity: 0;
  transform: translateX(-10%);
  transition: all 0.6s ease-out;} .i3-blocks .flex-column-reverse-md .block-image {    transform: translateX(10%);}