@charset "utf-8";
/* CSS Document */

@import 'opensans.css';

body {font-family: 'Open Sans Hebrew'; font-size: 15px; overflow-x: hidden;  padding-top: 70px;}

p {margin: 0;}

.img-responsive {display: inline-block;}
    
 iframe {max-width: 100% !important;}
.fb_iframe_widget, .fb_iframe_widget span, .fb_iframe_widget span iframe[style] {
  width: 100% !important;
}

a, .btn {transition: all 0.3s;}

h1, h2 {margin-top: 0;}


.btn-primary-old {color: #fff;  background-color: #337ab7;  border-color: #2e6da4;}
        .btn-primary-old:hover {opacity: 0.8; color: #fff;}

.modal-header {display: block;} /*  display: flex aligns the content to the left */


input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

/**  בשביל נגישות **/
button:focus {  
  border: 3px solid #000;
}

/* align placeholder to the right  */
::-webkit-input-placeholder {
  text-align: right; letter-spacing: normal;
}
:-moz-placeholder {
  text-align: right; letter-spacing: normal;
}


/***********************************************************************
| Login page  (user needs password)
************************************************************************/
  .login_page {font-family: 'Open Sans Hebrew'; font-size: 15px; overflow-x: hidden;
                       color: #333333; background: #F7F7F7;
                      }
        
	.login_page  .login_screen {
	   margin: 50px auto 0;
	   padding: 1.5em 2.5em;
	   width: 42%; height: 32%;
	   background: url(/images/admin/backg_image_transparent.png);
	   border-radius: 5px;
	}
	
	.login_screen .input-group-text {
       background: #2780B8;    color: white;  padding: 1.1rem .75rem;
    }
	
	.welcome {font-size: 2.6em; text-align: right; margin: 0 auto 15px;}
	  .welcome span {background: white; padding: 0.2em 0.5em; border-radius: 50%;}
	  
		
	.login_txt {font-size: 1.1em; margin-top: 5px;}
	  .login_txt  p {line-height: 19px;}
	
			.form_fields {margin-top: 1.3em;}
			 .btn-login { 
			  color: #ffffff; 
			  background-color: #6CA80B; 
			  border-color: #67A109; 
			} 
 			
				
	.login_screen .form_fields div {margin-bottom: 1em; }
	
	 .login_screen .form_fields .form-control {height: 3.2em;}
	
		
	  .login_screen .form_fields input[type=text],
	  .login_screen .form_fields input[type=password] {font-size: 1.1em;}
		
	.login_screen .input-group-addon {background: #2780B8; color: white;}
	
	

/***************************************************
| Header
****************************************************/
.regular_header {text-align: center; padding: 15px 0;background: #0063ae; position: fixed; width: 100%;top: 0; z-index: 999; min-height: 70px; }


/***************************************************
| show signature 
****************************************************/

.signature_modal .image_upload .open {margin: 10px 0;}

.signature_modal .buttons_container {margin: 10px 0 0 0; text-align: center;}


/***************************************************
|PDF FORMS
***************************************************/

 .form_container {margin: 20px auto; width:  100%; 
         
 }

.do_form_save {
	  text-align: center; padding: 15px 0 0 0; background: #0063ae; position: fixed;
    width: 100%;  top: 0; z-index: 99;	
}

.powered_by_iforms {
    position: absolute;  top: 0; right: 20px;
}

.print_form {color: #fff;}


.btn_white {
    background: #fff;  color: #0063ae;
}
  .btn_white:hover {opacity: 0.8;}

.frm_save input[type=text] {font-family: arial;}

.btn_add_signature { border: 1px solid #0072c6; height: 100%; width: 100%; text-align: center;}
.btn_add_image  { border: 1px solid #0072c6; height: 100%; width: 100%; }
 
.btn_remove_signature {display:none; margin-left: 0px; margin-top: -10px; padding: 0px 2px; z-index: 999; color: red; position: relative;}
 
.hidden_file_input {display: none !important;}
 
 .signature-thumb-image {width: auto; height: 100%; vertical-align: top;}

#signature_modal  canvas{
	cursor: url('/images/pen.png'), default;
}


.element_container {position: absolute;}
   .element_container .item {position: absolute; top: 0; left: 0; height: 100%; width: 100%; }
   .element_container  input[type=text], .element_container  input[type=email], .element_container  textarea,
   .element_container  select, .element_container  input[type=number]  
   
   /***   padding: 0 !important; line-height: 10px !important; min-height: 18px/19px;   for IPHONE ***/
   {border: 1px solid #0072c6; padding: 0; line-height: 10px; min-height: 18px; }
   .element_container textarea {resize: none; line-height: 14px;}
   
  .element_container  input[type=email] {direction:ltr; text-align: left;}  
      
.image-upload {position: absolute;}
.image-upload .btn_add_signature {border: 1px solid #0072c6;} 

.required {border: 1px solid red !important;}

.numeric_fld {direction:ltr; text-align: left; padding-right: 0; padding-left: 3px;}

.add_border {border: 1px solid #0072c6;}
 
 .error  {border: 2px solid red !important; }
   /*select.error + .select2 .selection .select2-selection--single {border: 2px solid red !important;}*/
   select.error ~ .select2-container {border: 2px solid red !important;}

     .tooltip_error_message {
       position: absolute;  margin-top: 7px; right: 0px; color: #000; display: block;
       min-width: 120px; font-size: 12px; z-index: 2; 
       border: 1px solid gray; background-color: #fff; padding: 1px 5px 0 5px; border-radius: 2px;
       box-shadow: 0px 5px 10px -3px rgba(0, 0, 0, 0.1), 8px 10px 8px -3px rgba(0, 0, 0, 0.1);
     }

      .tooltip_error_message  .myicon {color: #FF8C00;}
  
     .tooltip_error_message::before {
       content: ''; border-bottom: 8px solid gray; border-left: 8px solid transparent;  border-right: 8px solid transparent;
       position: absolute; top: -8px; right: 4px;        
     }

   
 /***   only one radio button gets ** em ** error field !!!             ******/
 input[type=checkbox].error ~ label, input[type=radio].error ~ label  {border: 2px solid red;}  
   

.ui-datepicker {z-index: 9 !important;}
.date_field {text-align: center }

#tofes_area select {font-size: 13px; }  


   /*  אחרת יש שוליים תחתונים שמורידים את המיקום של הודעת השגיאה    */
   /*  לשוליים יש כנראה משמעות רק בהקשר של הודעת השגיאה  */
  .element_container_checkbox, .element_container_radio {min-height: 17px; } 
  
  /*Hide the radio button:*/
   #tofes_area input[type=radio], #tofes_area input[type=checkbox]{
     /*position: absolute; left: -99999px*/ display:none;
    }
 /*Then, style the label so it looks like however you want:*/

  .element_container_checkbox label, .element_container_radio label {
    width: 16px; height: 16px; 
    border: 1px #0072c6 solid;
    line-height:16px; /* display:block;*/
    text-align:center;    color:black;
    font-size:16px;    cursor:pointer;
    /*background: #E0F2FE;*/ position:relative; z-index: 9; margin: 0; padding: 0;
    } 
     .element_container input:checked + label:before, .element_container input:checked + em + label:before{
       opacity:1;      
    }
    
     .element_container   input[type=radio]:checked + label:before{
        border-radius: 50%;
     }
     
     .element_container_checkbox  label:before, .element_container_radio label:before{
        position:absolute;
        top:4px;
        left:4px;
        height: 7px;
        width: 7px; 
        background:#3a3a3a ;
        content:''; opacity:0;        
    }

    .element_container_radio label:before{   
      border-radius:12px;     
    }
    
    .is_radio_label {border-radius: 50%; }
    
    
    
    .sr-only { /*   נחוץ בגלל ההגדרות שכאן מעל  */
       position: absolute !important;  width: 1px !important; height: 1px !important; border: 0 !important;
    }
    
        
    em.error {  /* sr-only definition  */
          
        position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
        overflow: hidden; clip: rect(0, 0, 0, 0);  white-space: nowrap;   border: 0;
            
        /**
         position: absolute; min-width: 50px; height: 12px; padding: 0; top: -13px; right: 0;
        border:none !important; color: red; font-size: 11px;  
        font-family: arial; z-index: 2; 
        */
       
    } 


    .item::placeholder {
      font-weight: normal; color: #ddd; font-size: 13px;
    }

    
    
    /****************************************/

   .attachment {cursor: pointer; background-image: url(../images/attachment-icon.png); 
                      background-color: transparent !important; position: relative; width: 87px !important; height:16px !important; }
                      
    .btn_remove_attachment {display:none; position: absolute; top: 10px; right: -15px; padding: 0px 2px;
                                             font-size: 11px; border: 1px solid red;}
      .btn_remove_attachment .fas {font-size: 11px; color: red !important;}
      
   .attachment_help {position: absolute;  right: 0; font-size: 12px; width: 200px; min-height: 20px; color: blue;  
                     transform: translateY(-100%); line-height: 15px;  /*top: -30px;*/
                    }

   /***  attachment modal ***/
   .frm_attachment {margin: 20px 0;}
   .attachment_title {font-weight: bold;}
   
   .frm_attachment  .submit_btn {margin: 20px 0 0 0;}
   
	.attachment_modal #output{
		padding: 5px; font-size: 14px; font-weight: bold; text-align: center;
	}
	
	/* prograss bar */
	.attachment_modal #progressbox {
		border: 1px solid #CAF2FF; padding: 1px; 	position:relative; width:400px;
		border-radius: 3px; margin: 10px auto; display:none;text-align: center;
	}
	.attachment_modal #progressbar {
		height:23px; border-radius: 3px; background-color: #CAF2FF; width:1%; 
	}
	.attachment_modal #statustxt {
		top:3px; left:45%; position:absolute; display:inline-block; 	color: #FFFFFF;
	}

    
     /* view attachment uploaded in first stage  */
    .show_uploaded_file {position: absolute; top: -10px; left: -30px;  font-size: 25px;}



   /*** click to download modal  ****/

  .frm_email  label {border:none;}
  
  /** when we have stages **/
  .no_border {border: none !important; background: none !important;  outline: none;}
  /**  hide arrow **/
   select.no_border {-webkit-appearance: none;    -moz-appearance: none;    text-indent: 1px; line-height: 20px;}

   .no_border:focus,.no_border:active:focus {  
      outline: none;
   }



 .english_only   {direction:ltr; text-align: left;}

 .link_in_form a {color: #000; font-family: arial; text-decoration: underline;}

 .warning_background {background-color: #FF919A !important;}
   

 .contact_details_modal .modal-body p {margin-bottom: 10px; }



   /***  SELECT2 ***/ 
   
   .select2-container { 
	    margin: -11px 0 0 0;   
   }
   
   .select2-container .select2-selection--single {  
      height: 19px;  border-radius: 0;
   }
   .select2-container--default .select2-selection--single .select2-selection__rendered,
   .select2-container--classic .select2-selection--single .select2-selection__rendered
   {    
      line-height: 19px;
   }
   .select2-container--default .select2-selection--single .select2-selection__arrow {
      height: 26px; 
      top: -3px;   
   }
   
   .select2-container--classic .select2-selection--single .select2-selection__arrow {height: 18px;}
  
    
   /**  Readonly select2 !!!  **/
   select[readonly].select2-hidden-accessible + .select2-container {
       pointer-events: none;
       touch-action: none;
   }
   select[readonly].select2-hidden-accessible + .select2-container .select2-selection {
       background: transparent;
       box-shadow: none;
       border:none;
   }
   select[readonly].select2-hidden-accessible + .select2-container .select2-selection__arrow, select[readonly].select2-hidden-accessible + .select2-container .select2-selection__clear {
       display: none;
   }


   a {color: #006ADB;}

   .negishut_area {
    background-color: #EDF3F7; z-index: 999; max-height: 80px; overflow: auto;
   }


   .modal h2 {font-size: 1.5rem;}

  

/***************************************************
|footer
***************************************************/

footer {text-align:  center; margin: 30px 0 0  0; background: #EEEEEE; padding: 15px 0;}

  footer a {color: #000;}





/*** Media Queries ***/


@media screen and (max-width: 1024px) {
	
	  .btn-show {margin-bottom: 20px;}
	
}



@media screen and (max-width: 991px) {
	

  .screen { padding-right: 10px; padding-left: 10px;}
	
  .btn-show {margin-bottom: 20px;}
	
  .top_image .content ul.features li {line-height: 1.2em; }
  
  .form_container {padding-top: 20px;}
   	
}


@media screen and (max-width: 767px) {
	
	 .powered_by_iforms { width: 80px; top: 16px; right: 10px;}
	
	 .login_page {
		          font-family: 'Open Sans Hebrew'; font-size: 15px; overflow-x: hidden;
		          color: #34495e;  background: #CBDEE2;
		          -webkit-background-size: cover;  -moz-background-size: cover;   -o-background-size: cover;
		          background-size: cover;
		 }
			
			
		 .login_page .login_screen {
		    margin: 20px auto 0;
		    padding: 1.5em 2.5em;
		    width: 100%;
		    height: 32%;    
		 }
		 
		 .welcome {font-size: 1.7em;}
		 .login_screen img {max-width: 200px;} 
		 
		 /*.link_in_form {display:none;}*/

}


@media screen and (max-width: 640px) {
		
		#tofes_area  label{width: 20px; height: 20px; }
		
		#tofes_area  label:before{top:4px;  left:4px; height: 10px; width: 10px;  }
		
	  .show_uploaded_file {left: 30px;  top: 0px;}		    			
	  
	  
	 .form_container  {overflow: auto; /**  for smartphones - in a not reponsive view **/ } 	

}


@media screen and (max-width: 320px) {
	
	
}




/*** 5 columns
***************************************************/
.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-15 {
    width: 20%;
    float: right;
}
@media (min-width: 768px) {
.col-sm-15 {
        width: 20%;
        float: right;
    }
}
@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: right;
    }
}
@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: right;
    }
}


@media all and (-ms-high-contrast:none)   {
     .element_container .item { line-height: 10px;} /* IE10 */
     *::-ms-backdrop, .element_container  .item {line-height: 10px;} /* IE11 */
}