/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/
/* סטילים כלליים */
body, html {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: Arial, sans-serif;
}

.container {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.background{
   position: relative;
    z-index:9
}
 .container:after {
/*     content: "";
    background: #bfbebf;
    position: absolute;
    width: 100%;
    height: 530px; */
}
.additional-text {
    color: #3C2A52; /* צבע הטקסט */
     
    margin-top: 22px; /* מרווח מלמעלה */
    text-align: center; /* יישור למרכז */
    order: 2; /* העבר את האלמנט להיות השני בסדר */
font-size: 1.5em;
MARGIN-TOP: 28PX;
}

.logo-container {
   /* position: absolute;
    top: 5%;*/
}
.logo-container-img {
  width: 100%;width: 100%;text-align: center;
}
.logo-image {
/*     width: 100%;
    max-width: 450px; */
}

.background {
    /*position: relative;*/
    width: 100%;
    /*height: 60vh;*/

    /*overflow: hidden;*/
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.overlay-image {
    margin-top: 5px;
    width: 10%;
    height: auto;
    position: absolute;
    top: 0;
    left: 0;
}

.middle-image {
    width: 60%;
    height: auto;
    position: relative;
    z-index: 1;
    margin-top: -50%;
}
/* סגנון חדש לתמונת Alma */
.logo-alma-image {
    position: absolute;
    top: 2%;
    width: 10%;
    left: 22%;
}
.additional{ 
  
}
.additional-info {
    color: #3C2A52;
    font-size: 22px;
    text-align:  center;
    margin-top: 10px;
    font-weight: bold;
}

.additional-info-p{
    color: #3C2A52;
    font-size: 22px;
    text-align: center;
    margin-top: -20px;
   font-weight: bold;

}
.additional-info-small {
    color: #3C2A52;
    font-size: 12px;
    text-align: center;
    margin-top: -10px;
}

.centered-image {
    display: block; /* כדי שהתמונה תהיה ממורכזת באופן אופקי */
    margin: 0 auto; /* כדי למרכז את התמונה ברוחב */
    max-width: 100%; /* כדי שהתמונה תהיה בגודל מרבי */
   width: 38em;
}


.three-parts {

 position: relative;
    background-image: url(https://25717764.fs1.hubspotusercontent-eu1.net/hubfs/25717764/Image_Alma_il/Purple_rectangle.svg);
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    border-radius: 10px;
    overflow: hidden; /* כדי להסיר את יתרון התמונה מחוץ לגבולות העיגול */
    padding-bottom: 18px;
}

.separator {
    width: 0.8px;
    background-color: white;
    position: absolute;
    height: 64%;
  top:26px;
}

.separator:nth-child(1) {
    left: 33.333%;
}

.separator:nth-child(2) {
    left: 66.666%;
}

.part-image {
    width:36px; /* כאן משתמשים בתכונה calc כדי להחזיר את גודל התמונה לשליש מרוחב הדף ולהוסיף פיקסל פחות כדי לקחת בחשבון את הקווים המפרידים */
    height: auto; /* ניתן לשנות את הגובה לפי הצורך */
}
.part-image-icon{
    width: calc(26.333% - 1px)!important;
    padding-bottom: 17px!important;
    color: #FBBD96!important;
     font-size: 1.2em!important;
padding-bottom: 18px;
}
.icon-three-hand {padding-top: 13px!important;}
 .day-image{
    width: calc(47.333% - 1px)!important;
}

.additional-text-head{
    text-align: center;
 letter-spacing: 1px; 
color: #3C2A52;
    margin-top: 22px;
    text-align: center;
    order: 2;
    font-size: 1.5em;
    MARGIN-TOP: 28PX;

 
}

.additional-text {
    text-align: center;
 letter-spacing: 1px; 

width: calc(33.333% - 1px);
}

.additional-text .date {
    font-size: 16px;
    font-weight: bold;
    margin: 0; /* מוסיף מרווחים בברירת המחדל */
   color:white;
 letter-spacing: 2px; 
}

.additional-text .time {
    font-size: 14px;
    margin: 0; /* מוסיף מרווחים בברירת המחדל */
    color:white;
}


.additional-text .one{
    font-size: 14px;
    margin: 0; /* מוסיף מרווחים בברירת המחדל */
    color:white;
    margin-top: -14px!important;
}
.additional-text .icon-two {
    font-size: 14px;
    margin: 0; /* מוסיף מרווחים בברירת המחדל */
    color:white;

}
.additional-text .icon-three {
    font-size: 14px;
    margin: 0; /* מוסיף מרווחים בברירת המחדל */
    color:white;
}

.register-button-container {
    text-align: center;
    margin-top: 20px; /* הזזה מהשורה שלמעלה */
}


.register-button {
    background-color: #FBBD96; /* צבע רקע */
    color: #442C5C; /* צבע טקסט */
    border: none; /* ללא מסגרת */
    padding: 8px 126px; /* מרווחים בתוך הכפתור */
    border-radius: 30px; /* ריסוס פינות */
    cursor: pointer; /* מראה שהכפתור מקבל פעולה */
    font-size: 16px; /* גודל טקסט */
  display:inline-block;
      margin-bottom: 10px;
}

.Professional-panel{
   font-size: 22px; /* גודל טקסט */
 font-size: 22px;
letter-spacing: 1px;
}

 

.two-images-container {
    display: flex;
    justify-content: space-between;
}

.image-wrapper {
    width: 100%;
    max-width: 300px; /* רוחב מרבי של התמונה */
    text-align: center;
    margin-bottom: 20px; /* מרחק בין התמונות */
}

.image {
    width: 100%;
    max-width: 60%;
}

.image-name {
    font-size: 18px;
font-weight: bold;
}

.image-occupation {
    font-size: 12px;
    margin-top: -17px;
}

.tocniya{margin-top: 2vh;}

.gray-background-title{
      margin-top: 0px;
      margin-bottom: 0px;
        padding-bottom: 25px;
padding-top: 25px;
color: #3C2A52;
}

.gray-background {
    background-color: #f0f0f0; /* רקע אפור */
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* ממרכז את התיבות במרכז המסך */
}

.box-left {
    width: calc(50% - 1px); /* 50% מרחב וההפרדה בין התיבות */
    border-right: 1px solid black;
}
.box-right {
    width: calc(50% - 1px); /* 50% מרחב וההפרדה בין התיבות */
    border-left: 1px solid black;
}

.event-left {
    text-align: right;
  direction: rtl; /* משנה את הכיוון של הטקסט לימין לשמאל */
}

.event-right {
    text-align: left;
}

.time {
    margin: 0;
   color: #3C2A52;
  font-weight: bold;
  font-size: 1.5em;
}

.time-title {
    margin: 0;
   font-size: 12px!important;
}


.white-background {
    background-color: white;  
    text-align: center;
}
.white-background-title{
      margin-top: 0px;
      margin-bottom: 0px;
        padding-bottom: 0px;
padding-top: 0px;
color: #3C2A52;
  font-size: 1.3em;
 font-weight: bold;
}

.weight-nono{
     font-weight: 400;
    margin-top: 25px;
    margin-bottom: 25px;
 font-size: 1.2em;
}





.container-form {
  background-color: #432B5C;l
  padding: 20px;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

.form-title {
  color:#FBBD96;
}

.registration-form {
  width: 95%;
  max-width: 600px; /* רוחב מקסימלי של הטופס */
  margin-top: 20px;
}

.form-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 10px;
}


input[type="text"],
input[type="email"],
input[type="tel"],
button {
  width: calc(50% - 5px);
  padding: 10px;
  margin-bottom: 10px;
 direction: rtl;
}

input[type="email"]
{width: 100%;margin-bottom: 15px;}
input[type="tel"]{width: 100%;}
#address{width: 100%;margin-bottom: 15px;}
#company{width: 100%;margin-bottom: 15px;}

 
.submit-button,  .hs_submit.hs-submit input{
  background-color: #FBBD96;
  color: black;
  border: none;
  cursor: pointer;
  display: block;
  margin: 20px auto; /* מרכז את הכפתור באופן אופקי */
  padding: 10px 20px;
  width: fit-content; /* תאים בגודל הנדרש */
    width: 55%;
 font-size: 1.2em;
  border-radius:30px;
}


input[type="text"],
input[type="email"],
input[type="tel"],
button {
  border: none;
  border-radius: 5px;
  box-sizing: border-box;
}

input[type="text"],
input[type="email"],
input[type="tel"] {
  background-color: #ffffff; /* רקע לבן */
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus {
  outline: none;
  box-shadow: 0 0 5px #007bff; /* צבע כחול כאשר מקבלים פוקוס */
}


.container-foter {
  background-color: black;
  padding: 20px;

    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
color: white;
}
.form-title-foter {
  color:#FBBD96;
margin-bottom: 5px;
}
.waze-icon{ font-size: 1.2em;}

  a {
    color: white;
    text-decoration: none!important;/* מוחק קו תחתון */
  }

  /* כאשר הקישור במצב hover (עכבר מעל קישור) */
  a:hover {
  text-decoration: none!important; /* מחזיר קו תחתון בעת hover */
  }

.social-links {
  display: flex;
  align-items: center;
}

.icons-container {
  margin-left: auto;
}

.icons-container a {
  margin-left: 10px; /* כל קישור בין האייקונים יהיה מרווח מימין */
}
a {
  text-decoration: none!important; /* מונע קו תחתון על הקישור */
}

a:hover {
  text-decoration: none!important;/* מוסיף קו תחתון כאשר העכבר עובר על הקישור */
}



/* סטילים עבור מחשב */
@media only screen and (min-width: 768px) {
    .background {
        /*height: 125vh;*/
/*      height: 442px; */
    }

    .middle-image {
        width: 60%;
    }

    .text-with-line {
        position: absolute;
        /*top: calc(100% + 20px);*/ /* גובה 20px מעל התחתית של התמונה */
        left: 50%; /* מירובע אופקית */
        transform: translateX(-50%); /* מירובע אופקית לאמצע */
    }
}

/* סטילים עבור טאבלט */
@media only screen and (max-width: 768px) {
  .logo-container-img{
    padding-top:60px;
  }
    .background {
        /*height: 60vh;*/
     
    }
  fieldset.form-columns-2 .input input{
    width:100% !important;
  }
    .middle-image {
        width: 80%;
    }

    .logo-container {
       /* position: absolute;
        top: 5%;*/
    }
    .logo-alma-image{
           width: 15%!important;
            right: 4%;
     }
    .text-with-line {
        position: absolute;
        /*top: calc(100% + 20px); *//* גובה 20px מעל התחתית של התמונה */
        left: 50%; /* מירובע אופקית */
        transform: translateX(-50%); /* מירובע אופקית לאמצע */
    }
}

/* סטילים עבור נייד */
@media only screen and (max-width: 480px) {
    .background {
        height: auto;
    }

    .logo-alma-image{
           width: 20%!important;
           right: 4%;
     }
   
.centered-image {
    width: 21em;
}

    .logo-container {
       /* position: absolute;
        top: 5%;*/
        width: 100%;
    }
    .middle-image {
        width: 100%;
    }
    .text-with-line {
        position: absolute;
        /*top: calc(100% + 20px);*/ /* גובה 20px מעל התחתית של התמונה */
        left: 50%; /* מירובע אופקית */
        transform: translateX(-50%); /* מירובע אופקית לאמצע */
    }


}

/* סטילים לתמונת רקע */
.background-image {
    margin-top: -6px;
    width: 5000%;
    height: 850px;
}

/* סטילים עבור מסך רוחבו פחות או שווה ל־274px */
@media screen and (max-width: 274px) {
    .background-image {
        height: auto;
    }
}



/* סגנון חדש לטקסט עם קווים */
.text-with-line {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    order: 1; /* השאר את האלמנט הזה ראשון בסדר */
}

.text-with-line .line {
    width: 100px;
    height: 2px;
    background-color: #3C2A52;
}

.text-with-line .text {
    font-size: 2em;  
    margin: 0 10px;
    color: #3C2A52;
    font-weight: bold;
}




@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-device-pixel-ratio: 3) { 
    /* כאן יש להוסיף עיצובים ספציפיים למסך iPhone */ 
      .tocniya{margin-top: 2vh;}
      .background { height: auto;}

}

 
@media only screen and (min-width: 1230px) and (min-height: 666px) {
  /* כאן יש להוסיף עיצובים ספציפיים למסכים רחבים ברזולוציה 1230x666 */
.tocniya{}
}