
@font-face {
    font-family: 'Avenir Black';
    src: url('https://umb-4553t5.s3.eu-west-1.amazonaws.com/8494/fonts/Avenir-Black.woff2') format('woff2'),
        url('https://umb-4553t5.s3.eu-west-1.amazonaws.com/8494/fonts/Avenir-Black.woff') format('woff'),
        url('https://umb-4553t5.s3.eu-west-1.amazonaws.com/fonts/Avenir-Black.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Avenir Medium';
    src: url('https://umb-4553t5.s3.eu-west-1.amazonaws.com/8494/fonts/Avenir-Medium.woff2') format('woff2'),
        url('https://umb-4553t5.s3.eu-west-1.amazonaws.com/8494/fonts/Avenir-Medium.woff') format('woff'),
        url('https://umb-4553t5.s3.eu-west-1.amazonaws.com/8494/fonts/Avenir-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Derbyshire';
    src: url('https://umb-4553t5.s3.eu-west-1.amazonaws.com/8494/fonts/ShireTypes-Derbyshire.woff2') format('woff2'),
        url('https://umb-4553t5.s3.eu-west-1.amazonaws.com/8494/fonts/ShireTypes-Derbyshire.woff') format('woff'),
        url('https://umb-4553t5.s3.eu-west-1.amazonaws.com/8494/fonts/ShireTypes-Derbyshire.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
    font-display: swap; }


body {
    margin: 0;
    padding: 0;
    position: relative;
    min-height: 100vh;
    background-color: #FBD700;
    position: relative;
    overflow-x: hidden;
    color: #0B4C8D;
    text-align: center;
    font-family: 'Avenir Medium',sans-serif;
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: 17px;
    letter-spacing: 0.15px;
    text-align: center;
    -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
}


.container-fluid{
    max-width: 1600px;
}

ul {
    margin-left: 0px;
}

.custom-content ul{
    padding-left: 10px;
}



/* 2. Layering */
.bg-layer {
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
}

/* 2. Blending Layer  */
.bg-layer.blend {
    background-color: rgba(254, 227, 199, 0.76);
    mix-blend-mode: multiply;
}

/* 3. Gradient  blend on Top */
.bg-layer.gradient {
    background: linear-gradient(180deg,
            #F1E4B2 0%,
            rgba(242, 235, 207, 0.65) 29.81%,
            rgba(245, 245, 245, 0.00) 100%);
    height: 467px;
    width: 100%;
    mix-blend-mode: multiply; 
}

.fw-bold {
    font-weight: 900 !important;
    font-family:"Avenir Black",sans-serif ;
}

.headline {
    /* min-width: 360px; */
    width: 360px;
    height: auto;
}

.text-primary{
  color: #0F4284 !important;
} 

.text-danger {
  color: #DC1415!important;
}

.text-info {
  color: #0B4C8D!important;
}

.text-warning {
  color: #FCD914!important;
}

h1,h2,h3,h4,
.big-title, 
.title, 
.yellow-title, 
.navigation-text,
.text-form
{
    font-family: 'Derbyshire', serif;
    font-style: normal;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
}

.big-title {
    color: #0F4284;
    font-size: 32px;
    line-height: normal;
    letter-spacing: 0.32px;
 }

 .title {
    color: #DC1415;
    font-size: 25px;
    line-height: 28px;
    letter-spacing: 0.25px;
 }

 .yellow-title {
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0.3px;
 }

.main-text {
 
    font-size: 15px;
    font-style: normal;
    line-height: 17px;
    letter-spacing: 0.15px;
    color:#0B4C8D;
    font-family: 'Avenir Medium', sans-serif;
    
}

.text-form{
    font-size: 15px;
    letter-spacing: 0.15px;
    font-family: 'Derbyshire', serif;
    font-style: normal;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.small-text {
    font-size: 9px;
    font-style: normal;
    line-height: 11px;
    letter-spacing: 0.07px;
}

.navigation-text {
    font-size: 12px;
    line-height: normal;
    letter-spacing: 0.1px;
    color: #0F4284;
}


.logo {
   width: 108px;
}

.notes{
    font-size: 11px;
}



.btn-warning,
.btn-warning:visited,
.btn-warning:hover,
.btn-warning:active,
.btn-warning:focus {
    border-radius: 45px;
    background: #FAC500;
    color: #0F4284;
    text-align: center;
    font-size: 12px;
    height: 40px;
    font-family: 'Derbyshire',serif;
    align-items: center;
    justify-content: center;
    letter-spacing: 0.117px;
    padding: 10px 60px;
    width: 200px;

}



.btn-secondary,
.btn-secondary:visited,
.btn-secondary:hover,
.btn-secondary:active,
.btn-secondary:focus {
    border-radius: 25px;
    border: 2.5px solid #0B4C8D;
    background: #FAC500;
    height: 32px;
    width: 150px;
    color: #0B4C8D;
    align-items: center;
    justify-content: center;
    font-family: 'Derbyshire',serif;
    font-size: 12px;
    font-style: normal;
    letter-spacing: 1.8px;
    line-height: normal;

}

.btn-primary,
.btn-primary:visited,
.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus {
    border-radius: 25px;
    background: #0f4284;
    height: 40px;
    width: 180px;
    color: #fac500;
    align-items: center;
    justify-content: center;
    font-family: 'Derbyshire', serif;
    font-size: 12px;
    letter-spacing: 1.8px;

}

.btn-primary-cst,
.btn-primary-cst:visited,
.btn-primary-cst:hover,
.btn-primary-cst:active,
.btn-primary-cst:focus{
    background: #0F4284;
    color: #FAC500;
    font-family: 'Derbyshire', serif;
    font-size: 12px;
    letter-spacing: 1.8px;
    border: 2px solid #0F4284;
    border-radius: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
}

.custom-footer {
    padding: 20px 15px;
}

.navigation-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    max-width: 100%;
    overflow-x: auto;
    white-space: nowrap;
}

.navigation-content a {
    text-decoration: none;
    display: inline-flex;
    align-items: center;
}

.navigation-content img {
    width: 17px;
    height: 17px; 
}

.footer-icons,
.footer-links {
    display: flex;
    align-items: center;
    gap: 10px;
}

.footer-links a {
    color: #003b82;
    font-weight: 800;
    text-decoration: none;
    transition: opacity 0.2s ease;
}


sub {
    bottom: -0.1em!important;
}



.footer-links a:hover {
    opacity: 0.7; 
}

.form-control {

    color: #0B4C8D;
    background-color: #ffffff00;

}

.form-floating>.form-control-plaintext~label,
.form-floating>.form-control:focus~label,
.form-floating>.form-control:not(:placeholder-shown)~label,
.form-floating>.form-select~label {
    opacity: .65;
    transform: scale(.75) translateY(-.5rem) translateX(3.5rem);
}

.form-floating>label {
    padding: 10px .75rem;
}


.form-check-input {
    appearance: none;
    -webkit-appearance: none;
    background-color: #0F4284;
    border: 2px solid #FAC500;
    border-radius: 50% !important;
    width: 17px;
    height: 17px;
    margin-top: 0em;
    /* margin-right: 12px; */
    position: relative;
    flex-shrink: 0;
    justify-content: center;
    display: flex;
    align-items: flex-start;
}


.form-check-input:checked::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 7px;
    height: 7px;
    background-color: #FAC500;
    border-radius: 50%;
    transform: translate(-50%, -50%); 
}

.form-check {
    display: flex;
    align-items: flex-start;
    gap: 12px;
   
}

.invalid-feedback {

    /* color: #0B4C8D; */
    color: #023261;
    text-align: center;
    font-family: 'Avenir Medium', sans-serif;

}

.form-control.is-valid,
.was-validated .form-control:valid {
    border-color: #084298;
}



.form-box {
    background-color: #fac500;
    border-radius: 60px;
    width: 350px;
    padding: 20px 27px;
    text-align: center;
}


.form-floating>.form-control {
    border: none;
    border-bottom: 1px solid #0f4284;
    border-radius: 0;
    background-color: transparent;
    padding-bottom: 12px;
    width: 280px;
    margin: 0 auto;
    text-align: center;
    /* font-family: 'Avenir Medium', sans-serif; */
}

.form-floating>label {
    text-align: center;
    width: 100%;
}

/* Όταν το input είναι σε focus */
.form-control:focus {
    box-shadow: none;
    border-color: #0f4284; 

}

.form-floating>.form-control-plaintext:focus,
.form-floating>.form-control-plaintext:not(:placeholder-shown),
.form-floating>.form-control:focus,
.form-floating>.form-control:not(:placeholder-shown) {
    padding-top: 1.98rem;
    padding-bottom: .9rem;
}




.modalBg-warning {
    border-radius: 30px;
    box-shadow: none;
    background-color: #fac500;
}

.modal-dialog-warning {
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
}

.modal-header {
    border-bottom: none;
}

.modal-footer {
    border-top: none;
}

@media (min-width: 768px) {

body {
font-size: 20px;
font-style: normal;
font-weight: 500;
line-height: 24px;
letter-spacing: 0.2px;
}


.headline {
    width: 100%;
    max-width: 800px;
    height: auto;
}

.form-check-input {
    width: 34px;
    height: 34px;
    border-width: 5px;
}

.form-check-input:checked::before {
    width: 14px;
    height: 14px;
}
   
.logo {
    width: 258px;
}

.big-title {
    font-size: 85px;
    
}

.title {
    font-size: 50px;
    line-height: 50px;
    letter-spacing: 0.5px;

}

.main-text {

    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0.2px;
 }

 .small-text {
     font-size: 10px;
     line-height: 14px;
     letter-spacing: 0.1px;
 }

 .yellow-title {
     font-size: 30px;
     line-height: 50px;
     letter-spacing: 0.6px;
 }
 .navigation-text {
     font-size: 15px;
     line-height: normal;
     letter-spacing: 0.2px;
 }

.btn-warning,
.btn-warning:visited,
.btn-warning:hover,
.btn-warning:active,
.btn-warning:focus {
     font-size: 24px;
     letter-spacing: 0.24px;
     /* padding: 10px 80px; */
     height: 82px;
     width: 365px;

 }

 .btn-secondary,
 .btn-secondary:visited,
 .btn-secondary:hover,
 .btn-secondary:active,
 .btn-secondary:focus {
     border-radius: 60px;
     border: 4px solid #0B4C8D;
     height: 82px;
     width: 365px;
     font-size: 24px;
     letter-spacing: 4.8px;
     background-color: #fac50000;

 }

 .btn-primary,
 .btn-primary:visited,
 .btn-primary:hover,
 .btn-primary:active,
 .btn-primary:focus {
     border-radius: 40px;
     height: 82px;
     width: 340px;
     color: #fac500;
     font-size: 25px;
     letter-spacing: 2.5px;

 }

 .btn-primary-cst,
 .btn-primary-cst:visited,
 .btn-primary-cst:hover,
 .btn-primary-cst:active,
 .btn-primary-cst:focus {
     font-size: 14px;
     letter-spacing: 0.9px;

 }

 .modal-dialog-warning {
     max-width: 800px;

 }

 .modalBg-warning {
     border-radius: 60px;
     background-color: #fac500;
 }
 
 .text-form {
     font-size: 24px;
     letter-spacing: 0.24px;
 }
 .notes {
     font-size: 14px;
 }

 .form-floating>.form-control {
     padding-bottom: 20px;
     width: 450px;
     font-size: 19px;
 }

.form-floating>.form-control-plaintext~label,
.form-floating>.form-control:focus~label,
.form-floating>.form-control:not(:placeholder-shown)~label,
.form-floating>.form-select~label {
    opacity: .65;
    transform: scale(.70) translateY(-.5rem) translateX(10rem);
}

 .navigation-content img {
     width: 24px;
     height: 24px;
 }

 .footer-icons,
 .footer-links {
     display: flex;
     align-items: center;
     gap: 16px;
 }

 .form-box {
     border-radius: 40px;
     width: 100%;
     max-width: 800px;
     min-width: 626px;
 }

 .custom-content ul {
     padding-left: 20px;
 }

}
/* uri */
.terms .hero-content{
    display: none;
}

.faq .hero-content {
    display: none;
}






.main-header {
    position: relative;
    /* min-height: 60vh; */
    overflow: hidden;
    background: #fac500;
    padding-bottom: 160px;
    z-index: 0;
}

header.position-relative.main-header.animated-form {
    padding-bottom: 110px;
}

.ray-bg img {
    bottom: -82%;
    left: 50%;
    /* transform: translateX(-50%); */
    width: 900px;
    z-index: 1;
    pointer-events: none;
}

.thankyou .ray-bg img {
    bottom: -117%;
}

.animated-form.ray-bg img {
    bottom: -107%;
    width: 690px;
}

.animated-form2.ray-bg img {
    bottom: -86%;
    width: 690px;

}

.animation-content .ray-bg img {
  display: none;
}

@keyframes spin-rays {
    from {
        transform: translateX(-50%) rotate(0deg);
    }

    to {
        transform: translateX(-50%) rotate(360deg);
    }
}

.ray-rotate {
    animation: spin-rays 20s linear infinite;
    transform-origin: center center;
}

.sun-bg img {
    bottom: -256px;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 278px;
    /* max-width: 500px; */
    /* min-width: 280px; */
    z-index: 2;
    pointer-events: none;
}

.cloud-bg img {
bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    /* max-width: 100%; */
    z-index: 3;
}

.planes-bg img {
    bottom: 5%;
    left: 0;
    width: 100%;
    z-index: 4;
    pointer-events: none;
    }

.sandwich {
    position: relative;
    z-index: 5;
   
}

.sandwich img {
    position: relative;
    z-index: 5;
    display: block;
    margin: 0 auto;
    width: 187px;
    /* width: 100%; */
    margin-top: -80px;
    pointer-events: none;
}

.blue-bottom {
    overflow: hidden;
    padding-top: 100px;
    padding-bottom: 10px;
    margin-top: -98px;
    z-index: auto;
}

.blue-bottom::before {
    content: "";
    position: absolute;
    top: 92px;
    left: 0;
    width: 100%;
    height: calc(100% - 92px);
    background-color: #0B4C8D;
    z-index: -1;
}


.shape {
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 102%;
    z-index: 1;
    pointer-events: none;
}

.bread {
    position: absolute;
    top: 20px;
    left: 0%;
    /* transform: translateX(-50%); */
    width: 150px;
    z-index: 10;
}


.content-over-bg {
    z-index: 10;
    position: relative;
    /* padding-top: 2rem; */
}

@media (min-width: 490px) {




    .planes-bg img {
        bottom: 7%;
    }

    .sun-bg img {
        bottom: -300px;
        width: 318px;
    }
    .bread {
        
        top: 27px;
        left: 10%;
        width: 150px;
    }

    .ray-bg img {
        bottom: -90%;
    }

    .thankyou .ray-bg img {
        bottom: -116%;
    }

  .animated-form.ray-bg img {
      bottom: -107%;
      width: 690px;
  }

    .animated-form2.ray-bg img {
        bottom: -115%;
        bottom: -96%;
        width: 690px;

    }
}

@media (min-width: 768px) {
    .main-header {
        padding-bottom: 240px;
        }

    header.position-relative.main-header.animated-form {
        padding-bottom: 223px;
    }

    .sun-bg img {
        bottom: -460px;
        width: 495px;
    }
  
    .ray-bg img {
        bottom: -79%;
        width: 1400px;
    }

    .thankyou .ray-bg img {
        bottom: -95%;
        width: 1320px;
    }

    .animated-form.ray-bg img {
        bottom: -102%;
        width: 1320px;

    }

    .animated-form2.ray-bg img {
        bottom: -87%;
        width: 1320px;

    }

    .planes-bg img {
        bottom: 7%;
    }

    .bread {
        top: 40px;
        left: 10%;
        width: 180px;
    }

    .animated-form.bread {
        top: 87%;
        left: 4%;
        width: 180px;
    }

    .animated-form2.bread {
        top: 86%;
    }

    .sandwich img {
        width: 277px;
        margin-top: -152px;
    }

    .blue-bottom {
        padding-top: 134px;
        margin-top: -125px;
    }
}

@media (min-width: 1000px) {
    .bread {
        top: 133px;
        left: 5%;
        }

    .thankyou .ray-bg img {
        bottom: -87%;
        width: 1320px;
    }

    .animated-form.bread {
        top: 88%;
        left: 8%;
        width: 180px;
    }

    .animated-form2.bread {
        top: 87%;
    }
}

@media (min-width: 1200px) {

    .main-header {
        padding-bottom: 320px;
        }

    header.position-relative.main-header.animated-form {
        padding-bottom: 300px;
    }
    .ray-bg img {
        bottom: -102%;
        width: 1800px;
    }

    .thankyou .ray-bg img {
        bottom: -92%;
        width: 1440px;
    }

    .animated-form.ray-bg img {
        bottom: -92%;
        width: 1440px;

    }

    .animated-form2.ray-bg img {
        bottom: -91%;
        width: 1440px;


    }

    .sun-bg img {
        bottom: -430px;
        width: 495px;
    }

    .planes-bg img {
        bottom: 10%;
    }

    .bread {
        top: 150px;
        left: 12%;
        width: 180px;
    }

    .animated-form.bread {
        top: 86%;
        left: 17%;
        width: 231px;
    }

    .animated-form2.bread {
    top: 85%;
    }

    .sandwich img {
        width: 307px;
        margin-top: -172px;

    }

    .blue-bottom {
        padding-top: 154px;
        margin-top: -145px;
    }
    
}

@media (min-width: 1400px) {

    .main-header {
        padding-bottom: 360px;
    }

    .ray-bg img {
    bottom: -93%;
    width: 1800px;

    }

    .thankyou .ray-bg img {
        bottom: -92%;
        width: 1440px;
    }

    .animated-form.ray-bg img {
        bottom: -114%;
        width: 1590px;

    }
/* 
    .animated-form2.ray-bg img {
        bottom: -124%;
        bottom: -138%;

    } */

    .sun-bg img {
        bottom: -630px;
        width: 701px;
    }

    .planes-bg img {
        bottom: 11%;
    }

    .bread {
        top: 181px;
        left: 15%;
        width: 207px;
    }

    .animated-form.bread {
        top: 88%;
        left: 17%;
        width: 231px;
    }

    .animated-form2.bread {
        top: 86%;
    }

    .sandwich img {
        width: 387px;
        margin-top: -222px;

    }

    .blue-bottom {
    padding-top: 194px;
    margin-top: -180px;
    }

}

.form-check-input.is-invalid~.form-check-label,
.was-validated .form-check-input:invalid~.form-check-label {
    color: #fac500;
}

.form-check-input.is-valid~.form-check-label,
.was-validated .form-check-input:valid~.form-check-label {
    color: #fff;
}

.form-check-input.is-valid,
.was-validated .form-check-input:valid {
    border-color: #fac500;
}