/*
 * email:shaigeta@walla.com
 * copyright see-date 2020.
 */

 @import url('https://fonts.googleapis.com/css2?family=Assistant&display=swap');

*{margin: 0px;padding: 0px;text-decoration: none;}
html,body {
  width: 100%;
  height: 100%;
  
  font-family: 'Assistant', sans-serif;
background-color:#fff;
/*background-color: #0077A2;*/

/*background-image: linear-gradient( #fff,#55abca);*/


}
body:lang(he),body:lang(ar){
 /*direction: rtl;*/

}
body:lang(en),body:lang(am),body:lang(ch),body:lang(es),body:lang(hi),body:lang(ru){
  direction: ltr;
}
.bar{
  height: 4%;
  /*background: #575D67;
  background-color:#3b3b3b;
  background-color:#383838;
  background-color:#153d3b;*/
  background-color:#17354d;
background-color: #5a2c5f;
background-color: #2f2f2f;
  color: #fff;
  text-align: center;
  padding: 5px;
  border-bottom: 1px solid rgb(69, 100, 238);
}
.bar a{
  color: #fff;
  font-size: 13px;
  padding:0 1%;
}

header:lang(he),header:lang(ar){
  direction: rtl;
}
header{
  width: 100%;
  height: 70px;
  height: 10%;
  height: 35%;
/*background-color:   #009999;
background-color: #008080;
background-color:#0077A2;
background-color:#181613;
background: #575D67;
background: #125c49;
background:#008080;
background-color:#0077A2;*/
background-color:#fff;
height: auto;
/*box-shadow: 1px 2px 10px #888888;*/


}

.header-main-signup{
  width: 80%;
  
  height: 100%;
  margin:0 auto;
  padding: 0.5%;
  /*background: chocolate; */
 display: flex;
border-bottom:1px solid #dbdbdb;
}
header #home_link-signup{
flex:29%;
text-align: center;
/*background: red;*/
text-align: start;
/*background-color: red;*/


}
header #home_link-signup a{
 /* line-height: 170%;
  font-size: 32px;
  text-decoration: none;
  color: #fff;
  color:#7F425E;*/
  /*background-color: blue;*/
 
}
header #home_link-signup img{
 /* width: 26px;
  height: 26px;*/
  width: 100%;
  height:100%;
 
}



header nav{
flex:90%; 
/*background: rebeccapurple;*/
line-height: 350%;
padding-top: 1%;
/*background-color: blue;*/
}

/*********/

header nav form{/*both forms form1 and form2*/
 /* background: rgb(66, 70, 95);*/
  /*text-align: center;*/
  text-align: right;
  /*background-color: red;*/
}
header nav form:lang(he),header nav form:lang(ar){
  text-align: left;
}

header nav ul #form1{
  /*background: green;*/
 /*margin-right: 3px;*/

}

header nav ul #form2{
 /*background: chocolate;*/
width: 100%;
line-height: 200%;
margin-top: 2%;
/*margin: 0 auto;*/
}
header nav ul #form2:lang(he),header nav ul #form2:lang(ar){
 
  direction: rtl;
}
header input:lang(he),header input:lang(ar){
  direction: rtl;
  
}

header #form2 input {
 /* float: left;*/
border: none;
margin-right: 6px;
padding: 2px;
height: 20px;
width: 180px;

border: 1px solid gray;
}


#btn-click-login {/*both forms form1 and form2*/

  border: none;
  /*margin-right:20px;*/
  font-size: 15px;
  font-weight: 500;
 /* padding: 2px 20px;*/
  cursor: pointer;
  border-radius: 3px;
  /*background-color: #0099cc;*/
  background-color: #3580BB;
  background-color: #00EAFA;
  color: #000;
  
  border: 1px #fff solid;
  
  width: auto;
  float: right;
  margin-top: 2%;
  padding: 1% 4%;
  border-radius: 50px;
  
  }
  #btn-click-login:hover{
  color:#fff;
  /*background-color:#80dfff;*/
  background-color:#585858;
  }

  #btn-click-login:lang(he),#btn-click-login:lang(ar){
float: left;
  }

/*both forms form1 and form2*/
header nav form .btn-login  {

border: none;
/*margin-right:20px;*/
font-size: 15px;
font-weight: 500;
padding: 2px 20px;
cursor: pointer;


background-color: #3580BB;
background-color:#00EAFA;
color: #000;

border: 1px #fff solid;
height: 25px;
width: auto;
border-radius: 50px;
}
header nav ul form .btn-login:hover{
color:#fff;
background-color:#585858;

}
header nav ul form input{
  border-radius: 10px;
}

header nav ul  #ForgotPassword{
 
  padding: 0;
  margin: 0;
  width: 90%;
  line-height: 100%;
 /* background: rgb(97, 84, 146);*/
}
header nav ul  #ForgotPassword a{
  /*color: rgb(255, 255, 255);*/
  color: rgb(53, 53, 53);
  font-size: 15px;
 
}
header nav ul .errorMSG2{
  /* background: turquoise;*/
   padding: 0;
   font-size: 16px;
 text-align: right;
  
   color: #FF1486;
   width: 100%;

   line-height: 100%;
   /*text-align: center;*/
 }
 header nav ul .errorMSG2:lang(he),header nav ul .errorMSG2:lang(ar){

 text-align: left;
  

 }








/*----------signup-------*/
#signup {
 height: 60%;
  
  width:80%;
  margin:0px auto;
  margin-top: 1%;
  font-size: 14px;
  color:gray;
  font-weight: bold;
  display: flex;
  

/*background: chartreuse;*/
 }

  
 #signup:lang(he){
 /* flex-direction: row-reverse;*/
 }
 

  #signup-section1:lang(he),#signup-section1:lang(ar){
    direction: rtl;
 }

/*Registration*/
 #signup #signup-section1{
  /*flex: 30%;*/
 

  flex: 40%;
  
  

 }
 #signup-section1-form{
  
  padding: 2% 4% ;
  /*background-image: linear-gradient( #008080,rgb(131, 133, 56));*/
  margin-right: 40%;
  /*background: 	 	 #99004d;
 
  background-color:#702d4c;
  background-color: #357da4;*/
  background-color: #fff;
  
  border: 1px solid rgb(214, 57, 175);
  border: 1px solid rgb(184, 184, 184);

 box-shadow: 4px 7px 8px #888888;
   /*border-radius: 5%;*/
   border-radius: 5%;
   color:#fff;
   color: rgb(42, 42, 42);
   max-height:500px;
  
   opacity: 0.9;
 }
 
 
 #signup-section1-form .singnup_title h1{
  text-align: center;
  padding: 4% 0;
  font-size: 27px;
  font-weight: 300;
  color:#373737;
}
/*form{background-color:#ffe6e6;}*/
#signup-section1-form input,#signup-section1-form button{
  margin:2px;
  padding:3px;
  height: 22px;
  width: 95%;
  display:block;
  border-radius: 5px;
  border: 1px solid #bcbcbc;
  border-radius: 10px;
}
#signup-section1-form .radio{
  padding: 6px;
width: 50px;
height:35px;
float: left;
text-align: center;

}
#signup-section1-form .radio input{
  height:15px;

}
#signup-section1-form button{
margin-top: 5px;
/*background-color: #538cc6 ;
background-color: orange;
background-color: rgb(216, 216, 216);
background-color: #e42893;
background:#e42893;*/
background:#21949c;
background-color: #880015;
background-color: #FF1486;
color: #fff;

font-weight: 600;
height: 35px;
width: 101.5%;
cursor: pointer;
}
#signup-section1-form p{
  /*background: crimson;*/
 
}
#signup-section1-form .iagree{
  font-size:14px;
  font-size:84%;
  color:#262626;
  color: #000;

}
#signup-section1-form .iagree a{
  color: rgb(99, 189, 203);
  color: #00cbda;
}

#signup-section1 .errorMSG{
  /*color:red;*/
  color: #FF1486;
  /*text-align: center;*/
  padding-top: 1%;
}

#signup-section1-form .sigText{
margin-top: 4px;
font-size:88%;
}

/*signup-section1-btn-click{*/
#signup-section1-btn-click{
  /*background: red;*/
  /*flex: 40%;*/
  margin-right: 0%;
  /*background-color: gray;*/
  }
  #signup-section1-btn-click h3{
color:#26546b;
color:#000;
font-size: 49px;
font-weight: 500;

  }
  #signup-section1-btn-click p{
    color:#5b5b5b;
    font-size: 19px;
    font-weight: 200;
    padding-bottom: 2%;
    
      }
  #signup-section1-btn-click button {/*both forms form1 and form2*/

    border: none;
    /*margin-right:20px;*/
    font-size: 15px;
    font-weight: 500;
   /* padding: 2px 20px;*/
    cursor: pointer;
    border-radius: 3px;
    /*background-color: #0099cc;
    background-color: #6f1855;*/
    background-color: #880015;
    background-color: #FF1486;
   
    color: #fff;
    
    border: 1px #fff solid;
    
    width: auto;
   
    margin-top: 2%;
    padding: 3% 4%;
    border-radius: 50px;
    
    }
    #signup-section1-btn-click button:hover{
    color:#fff;
    background-color:#585858;
    
    }
  





/*section2  imgs*/
 #signup #signup-section2 {
 /*background: red;*/
  flex: 40%;
  padding:0 0 0 8% ;
 /*background-color: #0077A2;*/
 }

 #signup #signup-section2 #signup-section2-img{
  /* background: red; */
  height: 30%;
  display: flex;
  justify-content: center;
 
 }
 #signup #signup-section2 #signup-section2-img img{
  
  height: 100%;
   width: 24%;
   border-radius: 50%;
   margin:0 2% 0 0;
   box-shadow: 4px 7px 8px #888888;
 }

 #signup-section2-p:lang(he),#signup-section2-p:lang(ar){
  direction: rtl;
}
 #signup #signup-section2 #signup-section2-p
 {
  height: 20%;
  /* background: blue; */
  text-align: center;
  font-size: 20px;
  color: #3d3d29;
  padding-top: 4%;
  margin-bottom: 0%;
  text-shadow: 4px 7px 8px #888888;
  }
 
 #signup-section2 #signup-section2-img2 {
  /* background: yellow; */
  
   height: 50%;
  
   display: flex;
   /*background: gray;*/
  
  
 }

 #signup-section2 #signup-section2-img2 div{
  /*border: 1px solid black;*/
  flex:30%;
 
  
 
 }

 #signup-section2 #signup-section2-img2 img{
   

  width: 100%;
  border-radius: 50%;
 
 }
 #signup-section2-img2 #animated_div_first{
 
   text-align: center;
   font-size: 13px;
 }
 #signup-section2-img2 #animated_div{
  
  margin-left: -60%;
  margin-top: -12%;
 width: 30%;
 
 }
 #signup-section2-img2 #animated_div span{
  margin-left:-4px;
 }

 #signup-section2 #signup-section2-img2 #animated_div{
   color:#000;

  width: 50px;
  height: 40px;

  background:  #4deede  ;
  
  position: relative;
  -webkit-animation: myfirst 5s 2; /* Safari 4.0 - 8.0 */
  -webkit-animation-direction: alternate; /* Safari 4.0 - 8.0 */
  animation: myfirst 5s 2;
  animation-direction: alternate;
  border-radius: 10%;


  width: 0; 
  height: 0; 
  border-left: 25px solid transparent;
  border-right: 25px solid transparent;
  
  /*border-top: 20px solid #8cb3d9;
  border-bottom: 20px solid #2d5986;*/
  border-top: 20px solid #ff1486;
  border-bottom: 20px solid #3ac2b4 ;
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes myfirst {
  /*0%   {background: #fff; left: 0px; top: 0px;}
  25%  {background: #5a5a5a; left: 200%; top: 0px;}
  50%  {background: #7e7e7e; left: 200%; top: 100%;}
  75%  {background: #051318; left: 0px; top: 100%;}
  100% {background: #ffffff; left: 0px;   top: 100%;  }*/
  /*0%   {background: #fff; left: 0px; top: 0px;}
  25%  {background: #880015; left: 200%; top: 0px;}
  50%  {background: #336699; left: 200%; top: 100%;}
  75%  {background: #b3ecff; left: 0px; top: 100%;}
  100% {background: #4080bf; left: 0px;   top: 100%;  }*/
}


@keyframes myfirst {
  0%   {background: #2cfffb; left: 0px; top: 0px;}
  25%  {background: #4deede; left: 200%; top:80%}
  50%  {background: #34ffff; left: 200%; top: 80%;}
  75%  {background: #4ddeee; left: 200%;; top: 0px;}
  100% {background: #22fbff; left: 0px;   top: 80%;  }

   /* 0%   {background: #fff; left: 0px; top: 0px;}
  25%  {background: #264d73; left: 200%; top:80%}
  50%  {background: #336699; left: 200%; top: 80%;}
  75%  {background: #b3ecff; left: 200%;; top: 0px;}
  100% {background: #4080bf; left: 0px;   top: 80%;  }*/

}


/*@keyframes myfirst {
  0%   {background: red; left: 0px; top: 0px;}
  25%  {background: yellow; left: 300px; top: 0px;}
  50%  {background: blue; left: 200px; top: 200px;}
  75%  {background: green; left: 0px; top: 200px;}
  100% {background: red; left: 0px;   top: 200px;  }

}
*/

 #signup #signup-section2 #joinUs{
   font-size: 34px;
 }


 #seeWebsiteHeader{
  width: 100%;
 height:150px;
 line-height: 150px;
  /*background-color: #f5f5f0;
  background-color: #abc7d3;*/
  background-color: #4d315e;
  
  background-color: #275f89;
  background-color: #00eafa;
   text-align: center;
    color:rgb(85, 81, 81); 
    color: #fff;
    color: #000;
    margin-top:7%;
    
    font-size: 150%;
    font-weight: 300;
   /* box-shadow: 4px 7px 8px #888888;*/
   margin-top: 0%;
    
}

#continer-seeWebsiteImg1{
  border-bottom: 1px solid rgb(218, 218, 218);

  
  /*background-image: url("/images/l2.jpg"); */
  width: 100%;
  height:auto;

  
  /*background-position:center;
  
  background-repeat: no-repeat; 
  background-size: cover; */

  
}
#continer-seeWebsiteImg2{
  background-color:rgba(51, 51, 51, 0.5);
  background-color: #d3d3d3;
  background-color: rgb(255, 255, 255);
  padding: 3% 0;

  width: 100%;
  height:auto;
 
}
 .seeWebsiteImg{
 
  
   margin: 2% 10%;
     display:flex;   
        justify-content: space-between;
       
        
 }
 .seeWebsiteImg div{
  height: auto;
   
   /*border: 1px solid rgb(209, 211, 211);*/
   border-radius: 4%;
   padding: 1%;
  
 }
 /*.seeWebsiteImg div:hover{
  border: 1px solid rgb(136, 104, 104);
    transform: scale(1.1,1.1);
    display: inline-block;
    border-radius: 150px;
 }*/
 

 .seeWebsiteImg img{
  height:100%;
   width: 100%;
  border-radius: 300px;
  border: 1px dotted rgb(61, 61, 61);
  border: 7px double #ececec;
 }


 #seeWebsiteFooter{
text-align: center;
margin-top: 0%;
font-size: 140%;
background-color:#e3e3e3 ;
background-color: #FF1486;

color: rgb(102, 25, 25);
color: rgb(255, 255, 255);
padding: 3% 0;
 }




footer{
  
  /*margin-top: 100px;*/
 
background-color:   #004466;
background-color:   #404040;


/*height: 20%;*/
min-height: 150px;


}
footer a{
  color:  #fff;
  font-size: 16px;
  font-weight: 500;
  font-size: 16px;
}

footer .container-links{
/*background-color: #076b84;*/
display: flex;
align-items: center;
justify-content: center;
}
footer #p-link-lang,#p-footer-links,#p-copy-right{
  text-align: center;
  
}
footer #p-footer-links a{
  color:  #eabe2d;
  color:  #00EAFA;
}
footer #p-copy-right{
  font-weight: 300;
  color:  #4dffff;
  color:  #afafaf;
  padding: 0 1%;
  font-size: 17px;
}

/* Social Media Buttons */
/* Style all font awesome icons */
.fa {
  padding: 10px;
  font-size: 15px;
  width: 18px;
  text-align: center;
  text-decoration: none;
  margin: 7px 2px;
  border-radius: 50%;

}

/* Add a hover effect if you want */
.fa:hover {
  opacity: 0.7;
}

/* Set a specific color for each brand */

/* Facebook */
.fa-facebook {
  background: #3B5998;
  color: white;
}

.fa-instagram {
  background: #771f64;
  color: white;
}

footer #google-play{
  
  text-align: center;
}

footer #google-play img{
  width: 140px;
  height: 40px;
  border-radius: 10px;
}


/* dektop */
/* @media only screen and (min-width: 900px) { 
  #signup{
    width: 50%;
  }
  footer {
background: #5c5c3d;
    
    
  }
}*/
/* tablet */
@media only screen and (max-width: 900px) {
  body {
    /*background-color: blue;*/
  }

  .bar a{
    font-size: 11px;
  }
  
 
  header #home_link-signup{
    text-align: center;
  }
  header nav {
    /*background: chocolate;*/
    
  }
  header nav form{
    text-align: center;
  }
  header nav ul #form2{
    text-align: center;
   }
   header nav ul #form2 input{
    width: 30%;
   }
   header nav ul  #ForgotPassword{
padding: 1% 0;

   }
   header nav ul .errorMSG2{
    /* background: turquoise;*/
    padding-bottom: 1%;
    text-align: center;
   }


  #signup{
    width: 100%;
    height: auto;
  flex-direction: column;
  
  }
  #signup #signup-section1{
    /*background-color: #004466;*/
 width: 100%;

    order: 2;
   
    margin-top: 3%;
   
   padding: 0;
  }
 
  #signup-section1-form {
    width: 40%;
    margin: 0 auto;
  }
  #signup-section1 .errorMSG{
    text-align: center;
        }

  #signup-section1-btn-click{
    width: 70%;
    margin: 0 auto;
    text-align: center;
  }
  #signup-section1-btn-click h3{
     
    font-size: 37px;
    font-weight: 500;
    
      }
      #signup-section1-btn-click p{
        
        font-size: 18px;
        
        
          }

  #signup #signup-section2 {
    /*background: blue;*/
    padding: 0;
    order: 1;
    width:80%;
    margin: 0 auto;
  }
  #signup #signup-section2 #signup-section2-p
  {   
    /* background: red;*/
    font-size: 28px;
   padding:0% 4% 12% 4%;
   margin-bottom:0;    
   } 
  #signup #signup-section2 #signup-section2-img{
     /*background: blue; */
    
     padding: 2%;
    
   
   }
   #signup #signup-section2 #signup-section2-img img{
  
    height: 150px;
    width: 150px;
   
   }
  
   #signup #signup-section2 #signup-section2-img2{ 
   /*background: darkgreen;*/
   margin: 0;
   padding: 0 10%;

   }

   #seeWebsiteHeader{
margin-top: 8%;
   }

   footer .container-links{
    flex-direction: column;
   }
}
/* mobile */
@media only screen and (max-width: 500px) {
  body {
    /*background-color: green;*/
  
  }
/****************/
.bar{
  width: 100%;
  padding: 1% 0;
}
.bar a{
  font-size: 10px;
  padding: 1%;
}
header{
  box-shadow: none;


}
.header-main-signup{
  width: 90%;
  flex-direction: column;

  
 }
 
 header #home_link-signup{
  /* background-color:#004466;
   background-color: #004d4d;*/
  
  
   width: 100%;
   text-align: center;
   /* background: red; */
 
   }
   header #home_link-signup img{
    /* width: 26px;
     height: 26px;*/
     width: 65%;
     height:100%;
  
    
   }
   header nav{
    /*background: rgb(161, 71, 124);*/
    width:100%;
    /*padding-bottom: 12%;*/
    padding: 0;
   
   }
 
  
   header nav  form{ 
    
   /*background-color: blue;*/
    text-align: center;
  
   }
   header nav ul #form2{
    text-align: center;
   }
   header nav ul #form2 input:first-child{
    width: 42%;
    
   }
   header nav ul #form2 input{
    width: 24%;
    
   }
   header nav form .btn-login  {/*both forms form1 and form2*/
    padding: 2px 7px;
    
    
    }
    header nav #btn-click-login{
      margin:  0 44%;
    }
    header nav ul .errorMSG2:lang(he),header nav ul .errorMSG2:lang(ar){

      text-align: center;
    
     }
   

  /********************/
  #signup{
    flex-direction: column;
    width: 100%;
   /* background: orange;*/
    }
    #signup #signup-section1{
    /*  width: 70%;
      margin: 0 auto 9% auto;
      order: 2;
      margin-top:20%;
      padding: 4% 7%;*/
     
      
    }
    #signup-section1 input,#signup-section1 button{
      width: 90%;
    }
  
    #signup-section1-form {
      width: 75%;
      margin: 0 auto;
     /* background-color: #00EAFA;*/
    }

    #signup-section1 .errorMSG{
      text-align: center;
          }

    #signup-section1-btn-click{
      width: 60%;
      margin: 0 auto;
      text-align: center;
    }
    #signup-section1-btn-click h3{
     
      font-size: 22px;
      font-weight: 500;
      margin-top: 2%;
      
        }
        #signup-section1-btn-click p{
          
          font-size: 15px;
          
          
            }

    #signup #signup-section2{
      /*background: #4080bf;*/
      margin: 0;
      padding: 0;
      width: 100%;
      margin-top: 10%;
      order: 1;
    }
  
   
   
    #signup #signup-section2 #signup-section2-img img{ 
      height: 100px;
      width: 100px;    
     
     }
     #signup #signup-section2 #signup-section2-p
     {    
       font-size: 28px;
      padding:0% 4% 12% 4%;
      margin-bottom: -4%;    
      font-size: 18px;
      }
      #signup-section2 #signup-section2-img2 { 
       margin: 0;
        padding: 3%;
        /*background: blue;*/
       
      }
      #signup-section2 #signup-section2-img2 div{
       /* background:yellow;*/
        
       }
     
      #signup-section2 #signup-section2-img2 img{
     

      }

       

     

      /* Safari 4.0 - 8.0 */
@-webkit-keyframes myfirst {
  0%   {background: #2cfffb; left: 0px; top: 0px;}
  25%  {background: #4deede; left: 200%; top: 0px;}
  50%  {background: #34ffff; left: 200%; top: 100%;}
  75%  {background: #4ddeee; left: 0px; top: 100%;}
  100% {background: #22fbff; left: 0px;   top: 100%;  }
}


@keyframes myfirst {
  0%   {background: #2cfffb; left: 0px; top: 0px;}
  25%  {background: #4deede; left: 200%; top:70%}
  50%  {background: #34ffff; left: 200%; top: 70%;}
  75%  {background: #4ddeee; left: 200%;; top: 0px;}
  100% {background: #22fbff; left: 0px;   top: 70%;  }

}

#seeWebsiteHeader{
height:100px;
line-height: 100px;
}
#seeWebsiteHeader p{
font-size: 18px;
}

.seeWebsiteImg{
 
  display: flex;
  display: flex;
width: 80%;
flex-wrap: wrap;

 
        
 }

 .seeWebsiteImg div{
  width: 40%;
  height: 100%;
  
  margin: 2%;
  
 }
 /*.seeWebsiteImg div:hover{
  
  transform: scale(1.1,1.2);
    
 }*/
 
 #seeWebsiteFooter{
 
  
  font-size: 100%;
   }

footer {

  min-height: 30%;
  padding:3%;
}
footer a{
  
  font-size: 14px;
  font-weight: 100;
  padding: 4% 0;
 
 
}
    
}