@charset "utf-8";
/* CSS Document */

@import 'opensans.css';

body {font-family: 'Open Sans Hebrew'; font-size: 15px; overflow-x: hidden; }

p {margin: 0;}

.img-fluid {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;}

.text-left {text-align: left !important;}
.text-right {text-align: right !important;}

 .btn-primary-old {color: #fff;  background-color: #337ab7;  border-color: #2e6da4;}
        .btn-primary-old:hover {background-color: #337ab7;opacity: 0.8; color: #fff;}
.modal {z-index: 1100;} /* tooltip is 1070 */
.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;
}


/***************************************************
| Header
***************************************************/


.regular_header {text-align: center; padding: 15px 0;background: #0063ae; position: sticky; 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;}


/***********************************************************************
| Login page
************************************************************************/
    .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.input-group {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;}
	
	
/***************************************************
|PDF FORMS
***************************************************/

.top_button {padding: 6px 26px;font-size: 1.2em;}

 .form_container {margin: 20px auto; width: 
                           100%; overflow: auto; /**  for smartphones - in a not reponsive view **/
                          }

.do_form_save {min-height: 70px; text-align: center; padding: 15px 0 0 0; background: #0063ae; position: sticky; width: 100%;top: 0; z-index: 99; }
    
.frm_save input[type=text] {font-family: arial;}

.btn_add_signature, .btn_add_image  { border: 1px solid #0072c6; height: 100%; width: 100%; background: #E0F2FE;}
  .btn_add_signature {text-align: center;}
 
.btn_remove_signature {display:none; margin-left: 0px; margin-top: -10px; padding: 0px 2px; z-index: 999; color: red;
                                  border: 1px solid red; font-size: 11px; osition: 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], .element_container .is_mobile
   
   /***   padding: 0 !important; line-height: 10px !important; min-height: 18px/19px;   for IPHONE ***/
   {border: 1px solid #0072c6; /*background: #E0F2FE;*/  padding: 0; line-height: 10px; min-height: 16px; }
   .element_container textarea {resize: none; /*background: #E0F2FE;*/ 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-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;
 }
    

 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; }  


  /*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;
  }
    
    
  .english_only   {direction:ltr; text-align: left;}
     
  .link_in_form a {color: #000; text-decoration: underline;}
    
  /****************************************/

   .attachment {cursor: pointer; background: url(/images/attachment-icon.png); 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; color: red;}
      .btn_remove_attachment .fa {font-size: 11px; color: red;}
      
   .attachment_help {position: absolute; top: -18px; right: 0; font-size: 12px; width: 200px; color: blue;  }

   /***  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 before */
    .show_uploaded_file {position: absolute; top: -10px; right: -85px;  font-size: 25px;}

    /*checkboxes or radio button */
    .hide_labels {border:none!important; background: none !important; cursor: default !important;}




   /*** 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; outline: none}
   
   .no_border.error {/*background-color: indianred !important;*/ border: 2px dashed red !important;}


   .powered_by_iforms {position: absolute;top: 0; right: 20px; }

   .btn_white {background: #fff; color: #0063ae;}
      .btn_white:hover {background: #fff;opacity: 0.8;}


  /*** confirmation page ***/
  
  .confirmation_page_header {margin: 25px 0;}

 .confirm_btn {padding: 6px 26px;font-size: 1.2em; margin-left: 15px; }
    .confirm_btn:last-child {margin-left: 0;}


   /***  SELECT2 ***/
  
   .select2-container { 
	    margin: -11px 0 0 0;   
   }
   
   .select2-container .select2-selection--single {  
      height: 19px;  
   }
   .select2-container--default .select2-selection--single .select2-selection__rendered {    
      line-height: 19px;
   }
   .select2-container--default .select2-selection--single .select2-selection__arrow {
      height: 26px; 
      top: -3px;   
   }
   
   

   /**  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;
   }

   .contact_details_modal .modal-body p {
      margin-bottom: 10px;
   }



/* CSS for responsive iframe */
/* ========================= */

/* outer wrapper: set max-width & max-height; max-height greater than padding-bottom % will be ineffective and height will = padding-bottom % of max-width */
#Iframe-Master-CC-and-Rs {
  max-width: 512px;
  max-height: 100%; 
  overflow: hidden;
}

/* inner wrapper: make responsive */
.responsive-wrapper {
  position: relative;
  height: 0;    /* gets height from padding-bottom */
  
  /* put following styles (necessary for overflow and scrolling handling on mobile devices) inline in .responsive-wrapper around iframe because not stable in CSS:
    -webkit-overflow-scrolling: touch; overflow: auto; */
  
}
 
.responsive-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  
  margin: 0;
  padding: 0;
  border: none;
}

/* padding-bottom = h/w as % -- sets aspect ratio */
/* YouTube video aspect ratio */
.responsive-wrapper-wxh-572x612 {
  padding-bottom: 107%;
}

/* general styles */
/* ============== */
.set-border {
  border: 5px inset #4f4f4f;
}
.set-box-shadow { 
  -webkit-box-shadow: 4px 4px 14px #4f4f4f;
  -moz-box-shadow: 4px 4px 14px #4f4f4f;
  box-shadow: 4px 4px 14px #4f4f4f;
}
.set-padding {
  padding: 0px;
}
.set-margin {
  margin: 30px;
}
.center-block-horiz {
  margin-left: auto !important;
  margin-right: auto !important;
}
/************************************************/




/***************************************************
|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: 50px;}
   	
}


@media screen and (max-width: 700px) {

    .top_button {padding: 6px 10px;font-size: 1.0em;}
    .go_backward {display:none;}
		
		#tofes_area  label{width: 20px; height: 20px; }
		
		#tofes_area  label:before{top:4px;  left:4px; height: 10px; width: 10px;  }
		
		.client_logo {margin-bottom: 20px;}
		
		.powered_by_iforms {width: 70px; top: 16px; right: 10px;} 
		
		.login_page .login_screen {
		    margin: 0px auto 0;
		    padding: .5em .5em;
		    width: 95%;
		    height: 100%;
		    background: url(/images/admin/backg_image_transparent.png);
		    border-radius: 5px;
		}
		
	    				

}


@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 */
}

