body {
 font-family: "Figtree", sans-serif !important;
}


/* Header Menu */ 

.home .uk-navbar
{
    height:80px;
}

.tm-header 
{
    position: absolute;
    width: 100%;
}

.subhome .tm-header
{
    position: absolute !important;
    width: 100%;
}

.sub .tm-header
{
    position:relative;
}
.uk-navbar-container:not(.uk-navbar-transparent)
{
    background:transparent;
}


.sub .uk-navbar-container:not(.uk-navbar-transparent)
{
    background:white;
}

.subhome .uk-navbar-container:not(.uk-navbar-transparent)
{
    background:transparent !important;
}

.uk-logo img 
{
    width:136px;
}

.header-uk-cta-button 
{
     font-family: "Figtree", sans-serif !important;
    background: linear-gradient(90deg, #F62609 0%, #F4530C 100%);
    box-shadow: 0px 2px 4px -1px #0000000F;
    box-shadow: 0px 4px 6px -1px #0000001A;
    width:202px;
    padding:0px 16px;
    border: solid 1px white;
    border-radius:10px;
    color:white;
    font-size:18px;
    line-height:26px;
    height:56px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight:500;
}

.header-uk-cta-button img 
{
    margin-right:5px;
}

.uk-navbar-right, .subhome .uk-navbar-right 
{
    color:white;
    gap:18px;
}

.subhome .uk-navbar-right 
{
    color:white !important;
    gap:18px !important;
}

.sub .uk-navbar-right 
{
    color:black;
}

.uk-navbar-right div strong, .subhome .uk-navbar-right div strong
{
    font-size:24px;
    display:block;
}

.subhome .uk-navbar-right div strong
{
    font-size:24px !important;
    display:block !important;
}

.sub .uk-navbar-right div strong 
{
    color:#f53d0b;
}

.uk-navbar-right div 
{
    font-size:16px;
    line-height:22px;
}

.uk-navbar-right .center 
{
    border-left:solid 1px #012cbc;
    border-right:solid 1px #012cbc;
    padding:0px 18px 0px 18px
}

.uk-navbar-item, .uk-navbar-nav>li>a, .uk-navbar-toggle
{
    min-height:120px;
}

.divider 
{
    height: 1px;
    background: linear-gradient(90deg, hsl(226deg 99% 37% / 5%) 0%, hsl(226deg 99% 37% / 50%) 50%, hsl(226deg 99% 37% / 5%) 100%);

}

.subhome .divider
{
    height: 1px;
    background: linear-gradient(90deg, hsl(226deg 99% 37% / 5%) 0%, hsl(226deg 99% 37% / 50%) 50%, hsl(226deg 99% 37% / 5%) 100%) !important;

}

.sub .divider 
{
    background:#E0DFDF;
}

/* Banner */ 
.main-banner {
    background: radial-gradient(70.87% 70.87% at 17.43% 50%, #0048CE 0%, #00146C 100%);
    position:relative;
    padding-top:180px;
}


.form-title 
{
     font-family: "Figtree", sans-serif !important;
    color:white;
    font-size:50px;
    font-weight:700;
    line-height: 120%;
    margin-top:-90px;
}

.uk-zindex
{
    z-index:9;
}

.header-input
{
    position:relative;
    height:68px !important;
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    background:white;
    padding-top:10px;
}

.header-input label 
{

    color:black;
    padding-left:10px;
    font-size:16px;
     font-family: "Figtree", sans-serif !important;
    font-weight:500;
}

.header-input input 
{
    border: none;
    background: transparent;
    margin-top: -8px;
}

.header-input input:focus 
{
    background-color:transparent !important;
}

.banner-button 
{
    height:68px !important;
    border:solid 1px white;
    border-top-right-radius:10px;
    border-bottom-right-radius:10px;
    background: linear-gradient(90deg, #F62609 0%, #F4530C 100%);
    color:white;
    font-size:18px;
    font-weight:700;
    text-transform: capitalize;
    padding: 0 12px;
}

.form-sums 
{
    color:white;
}

.form-sums svg 
{
    margin-top:-4px;
}

.stars 
{
    font-size:16px;
    line-height:22px;
    color:white;
    text-align:left;
}

.stars .uk-flex
{
    gap:18px;
    align-items: center;
}

.stars strong {
    font-size:24px;
    display:block;
}


/* Section */

.background-brown 
{
    background: #F5F5F5;
}

.quote svg path
{
    fill: #10ad69 !important;
}

.quote 
{
    box-shadow: 0px 2px 4px -1px #0000000F !important;
    padding:20px;
    border-radius:10px;
}

.quote .uk-card-title 
{
     font-family: "Figtree", sans-serif !important;
    font-size:18px;
    font-weight:500;
    margin-top:10px !important;
    margin-bottom:10px;
}

.quote p 
{
    color:black;
    font-size:18px;
}

.quote .customer 
{
    font-weight:700;
    font-size:18px;
    color:black;
}

.quote-title 
{
    font-size:28px;
    font-weight:500;
     font-family: "Figtree", sans-serif !important;
    margin-bottom:5px;
    margin-top:0px;
}

.quote-sums
{
    font-size:18px;
     font-family: "Figtree", sans-serif !important;
}

.uk-section-footer 
{
     font-family: "Figtree", sans-serif !important;
    font-size:18px;
}

.uk-section-footer .uk-navbar-center .uk-navbar-nav li a
{
    color:black;
    text-transform: capitalize;
}

.mobile-form 
{
    display:none;
}


/* Question Section */

.question-section-title 
{
     font-family: "Figtree", sans-serif !important;
    color:black;
    font-size:18px;
}

.question 
{
     font-family: "Figtree", sans-serif !important;
    font-size:24px;
    font-weight:500;
}

.uk-form-answer-button, .carmodel, .dobwrapper, .cartrim
{
    border: 1px solid #E0DFDF;
    border-radius:10px;
    background:white;
    color:black;
    font-size:16px;
    width:100%;
    height:56px;
    line-height:56px;
    margin-bottom:15px !important;
}

.dobinput {
    border:none;
    padding-left:10px;
    padding-right:10px;
    text-align:center;
}

.border-input 
{
    position:relative;
}

.border-input:after 
{
    height: 15px;
    content:'';
    position:absolute;
    left:0;
    width:2px;
    background: #00000080;
    top:20px;
}

.border-input:before 
{
    height: 15px;
    content:'';
    position:absolute;
    right:0;
    width:2px;
    background: #00000080;
    top:20px;

}

.dobinput::placeholder 
{
    text-align:center;
    color:#00000080;

}
.uk-form-answer-button:hover, .carmodel:hover, .cartrim:hover
{
    border: 1px solid #F4530C;
    color:#F4530C;
    cursor:pointer;
}

.carmodel, .cartrim {
    margin-bottom:15px !important;
}

.likeinput 
{ 
    text-align: left;
    padding-left: 15px; 
    background-image: url(../img/input.png);
    background-repeat: no-repeat;
    background-position: 98%;
    width: calc(100% - 15px);
}

.car, #car-icon
{
    width:64px;
}

.likeinput:hover
{
    background-image: url(../img/inputactive.png);
}
.make
{
    border: 1px solid #E0DFDF;
    border-radius: 10px;
    background: white;
    color: black;
    font-size: 16px;
    width: 100%;
    height: 90px;
    /* line-height: 56px; */
    /* display: flex
; */
    padding-top: 20px;
    margin-bottom:15px !important;
}

.make:hover 
{
    border: 1px solid #F4530C;
    color:#F4530C;
    cursor:pointer;
}

.make img 
{
    height: 44px;
    object-fit: contain;
    width: 64px;
}

.uk-child-width-1-4>div 
{
    margin-bottom:10px;
}

#showAccidentsList, #showMoreAges {
height:68px !important;
border:solid 1px white;
border-radius:10px;
background: grey;
color:white;
font-size:18px;
font-weight:700;
text-transform: capitalize;
padding: 0 12px;
line-height: 68px;
}

.formnext
{
    height:68px !important;
    border:solid 1px white;
    border-radius:10px;
    background: linear-gradient(90deg, #F62609 0%, #F4530C 100%);
    color:white;
    font-size:18px;
    font-weight:700;
    text-transform: capitalize;
    padding: 0 12px;
    line-height: 68px;
}
.forminput 
{
    border: 1px solid #E0DFDF;
    border-radius:10px;
    background:white;
    color:black;
    font-size:16px;
    width:100%;
    height:56px;
    line-height:56px;
    text-align:left;
}
.forminput::placeholder
{
 color:#0000006f;
}

.disclamer 
{
     font-family: "Figtree", sans-serif !important;
    font-size:16px;
    color: #0000006f;

}

#car-icon {
    transition: left 0.5s ease-in-out;
}

.completed 
{
     font-family: "Figtree", sans-serif !important;
    position:absolute;
    right:0;
    color:black;
    font-size:16px;
    top:44px;
}

.completed span, .uk-card-title span
{
    color: #F62609;
}
#zipcode-error 
{
    width: auto;
    display: block;
    color: red;
    margin-top: 5px;
    font-size: 13px;
}
.uk-form-box 
{
    box-shadow:0px 14px 17px 0px #0000001c;
}

.uk-form-header 
{
    background: radial-gradient(77.88% 77.88% at 66.37% 27.7%, #0048CE 0%, #00146C 100%);
padding:50px 20px;
padding:80px 20px;
border-top-right-radius: 20px;
border-top-left-radius: 20px;
}

.uk-home-form-main 
{
    background:white;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
}

.uk-form-header .uk-h1 
{
    color:white;
}
.fade-out-down {
    animation: fadeOutDown 0.5s ease-out forwards;
  }
  .fade-in-up {
    animation: fadeInUp 0.5s ease-out forwards;
  }

  @keyframes fadeOutDown {
    from {
        opacity: 1;
        transform: translateY(0px);
    }
    to {
        opacity: 0;
        transform: translateY(20px);
    }
  }
  @keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
  }

  @media (max-width: 600px)
  {

    
  .uk-width-xlarge
  {
    width:100%
  }

    .mobile-form 
    {
        display:block;
    }
    .uk-navbar-item, .uk-navbar-nav>li>a, .uk-navbar-toggle 
    {
        min-height:72px;
    }

    .uk-logo img
    {
        width:215px;
    }

    .m-padidng 
    {
        padding-left:15px !important;
        padding-right:15px !important;
    }

    .form-title 
    {
        font-size:26px;
        text-align:center;
    }

    .stars 
    {
        display:none;
    }

    .m-banner 
    {
        display:none;
    }
    .main-banner
    {
        height: 620px;
        padding: 15px;
    }

    .desktop-form 
    {
        display:none;
    }
    .header-input 
    {
        border-radius:10px;
    }

    .banner-button
    {
        margin-top:10px;
        border-radius:10px;
        width:100%;
    }
    .form-sums
    {
        text-align:center;
    }

    .uk-navbar-nav {
        flex-direction: column;
        align-items: flex-start;
      }
    
      .uk-navbar-nav > li {
        width: 100%;
        margin-bottom: 5px;
        text-align:center;
      }
    
      .uk-navbar-nav > li > a {
        display: block;
        width: 100%;
        min-height: auto !important
      }

      .uk-form-answer-button, .carmodel, .dobwrapper, .make, .cartrim
      {
        margin-bottom:15px !important;
      }

      .car, #car-icon
      {
        width:40px;
      }


  }

  .lp-text span 
  {
    color: #FFE100;
    text-decoration:underline;
  }

  .lp-sums 
  {
    color:white;
    font-size:20px;
  }

  .uk-home-form-main{
    text-align: center;
    padding: 20px;
  }



  .uk-home-form-main .uk-form-answer-button
  { 
    border: solid 1px white;
    border-radius: 10px;
    background: linear-gradient(90deg, #F62609 0%, #F4530C 100%);
    color:white;
    text-align:center;
  }

  .quote-box {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
}

.quote-card {
    background: white;
    color: black;
    width: 80%;
    max-width: 400px;
    padding: 15px 20px;
    border-radius: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 500;
    font-size: 16px;
    height:40px;
}

.subhomelp .uk-navbar-item, .uk-navbar-nav>li>a, .uk-navbar-toggle 
{
    min-height: 80px;
    margin-top:17px;
}

.loader-spinner {
    width: 20px;
    height: 20px;
    border: 3px solid #eee;
    border-top: 3px solid black;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.uk-form-box .quote
{
    color:white;
}

.agent-box 
{
    background:white;
}


/* sayaç kapsayıcısı */
.timer {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;              /* sayı blokları ve iki nokta arası boşluk */
    margin-top: 20px;
  }
  
  /* dakika / saniye blokları */
  .timer-min,
  .timer-sec {
    position: relative;
    width: 70px;
    height: 50px;
    background: #f5f5f5;    /* açık gri kutu rengi */
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 36px;
    font-weight: 700;
    color: #E65100;         /* turuncu rakam rengi */
  }
  
  /* iki nokta (:) */
  .timer .colon {
    font-size: 36px;
    font-weight: 700;
    color: #333;
  }
  
/* ALT YAZILAR: MIN / SEC */
.timer-min::after,
.timer-sec::after {
  content: attr(data-label);
  position: absolute;
  bottom: -22px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 12px;
  font-weight: 500;
  color: #333;
}
