@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700|Roboto:300,400,500,700);
@import url(https://fonts.googleapis.com/earlyaccess/opensanshebrew.css);

body {direction: rtl; font-family: 'Open Sans Hebrew', sans-serif;}
#wrap {width: 980px; margin: 0 auto;}
.large {font-size: 22px;}
.stop_mess {padding: 20px; font-size: 22px; line-height: 30px; color: red; text-align: center;}
.clr {clear: both;}
.bold {font-weight: bold;}
#form_body {padding: 20px 0 20px 0;}
#form_title {font-size: 30px; font-weight: bold; margin-top: -2px; float: left;}
.form_row {padding: 12px 70px 0 0; }
.form_row2 {padding-top: 28px}
.form_text {padding: 0 70px 0 80px; text-align: justify; text-indent: 20px;}
.justify {text-align: justify; padding-left: 10px;}
.form_label {float: right; width: 30%; font-size: 16px;}
.form_label2 {margin-top: 35px;}
.form_label0 {margin-top: 15px;}
.form_label4 {cursor: default;}
.form_element {float: right; width: 62%; position: relative;}
.form_element2_1 {width: 17%; margin-left: 30px;}
.form_element2_2 {width: 17%; margin-left: 30px;}
.form_element2_3 {width: 8%; margin-left: 30px;}
.form_element2_4 {width: 8%;}
.input_text {width: 96%;}
.text_area {width: 96%; height: 100px;}
.text_area0 {width: 96%; height: 60px;}
.red {color: red; font-size: 18px; font-weight: bold;}
.form-actions .form_element {text-align: left;}
.form_row_sign {height: 50px;}
#paintBox {border: 1px solid #9A9A9A;}
#signModal {width: 430px;}
#signModal2 {width: 500px;}
.element_error {position: absolute; top: 20px; color: red; background-color: #fff; border-radius: 5px;}
.element_comment {position: relative; top: -10px; font-weight: bold;}
.req_field_symbol {position: absolute; top: -3px; right: -8px; color: red; font-size: 18px; font-weight: bold;}
.element_error2 {position: absolute; top: 100px; color: red;}
.element_error0 {position: absolute; top: 67px; color: red;}
.border_error {border: 1px solid red !important;}
.form_element_label {position: absolute; top: -21px; right: 0;}


.form-actions {position: relative;}
.truma {position: absolute; top: -50px; right: 180px; width: 110px; height: 117px;}

.box-header2 {
    background-color: #111111 !important;
    border-color: #111111 !important;
    color: #111111 !important;
    border-radius: 4px 4px 4px 4px !important;
    margin-bottom: 20px !important;
/*    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) !important;*/
	background-image: none !important;
	padding: 24px 5px !important;
	position: relative !important;
	filter: none !important;
	
}

#thanksModal {width: 400px !important;}
h3 {font-size: 20px !important;}
.thanksModal-body {font-size: 16px;}
.help-block {
	width: 98%;
	font-size: 12px;
}

.box-header2 h2 i {opacity : 1 !important; margin: 6px 3px 0 0px !important; }
.box-header2 h2 {color: #fff !important; text-shadow : none !important; font-weight: bold !important; 
	font-size: 20px !important; 
	margin-top: -2px !important;
}

.box-header2 h2 .send_before_time {display: inline-block; width: 490px; text-align: center;}
.box-header2 h2 .registration_closes {display: inline-block;}

.box-header2 .break {padding: 24px 0 24px !important;}
.box-header2 .btn-small {font-size: 18px !important; cursor: default !important; padding: 2px 0px !important; width: 38px !important;}

#clock_legend {    
	color: #FFFFFF;
    left: 10px;
    position: absolute;
    top: 1px;
}

#clock_legend div {width: 56px; text-align: center; float: right;}
.p10 {padding: 0 5px 0 0;}
.border_error:focus {
  border-color: #953b39;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392 !important;
     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392 !important;
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #d59392 !important;
}
#image_captcha {float: right;}
#input_captcha {float: right;}
#input_captcha input{width: 120px;}

#relative_form_element {position: relative;}

.ehi {text-align: center; font-size: 38px; font-weight: bold; color: #000; padding: 0px 0 35px 0; line-height:38px;}
#footer_page {color: #000; padding: 20px 0 25px 0;}

#signatureparent {
	color:darkblue;
	background-color:darkgrey;
	/*max-width:600px;*/
	padding:20px;
	width: 425px;
	height: 115px;
	max-width: calc(100% - 40px);
}

/*This is the div within which the signature canvas is fitted*/
#signature, #signature2 {
	border: 2px dotted black;
	background-color:lightgrey;
	direction: ltr;
	width: 100%;
	height: 90%;
}

/* Drawing the 'gripper' for touch-enabled devices */ 
html.touch #content {
	float:left;
	width:92%;
}
html.touch #scrollgrabber {
	float:right;
	width:4%;
	margin-right:2%;
	background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAFCAAAAACh79lDAAAAAXNSR0IArs4c6QAAABJJREFUCB1jmMmQxjCT4T/DfwAPLgOXlrt3IwAAAABJRU5ErkJggg==)
}
html.borderradius #scrollgrabber {
	border-radius: 1em;
}


.box-header {
	height: 20px;
  	border: 1px solid #ddd;
	margin-bottom: -1px;
  	padding: 10px;
  	background-color: #fafafa;
  	background-image: -moz-linear-gradient(top, #fafafa, #efefef);
  	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fafafa), to(#efefef));
  	background-image: -webkit-linear-gradient(top, #fafafa, #efefef);
  	background-image: -o-linear-gradient(top, #fafafa, #efefef);
  	background-image: linear-gradient(to bottom, #fafafa, #efefef);
  	filter: progid:dximagetransform.microsoft.gradient(startColorstr='#fafafa', endColorstr='#efefef', GradientType=0);
  	-webkit-box-shadow: none;
     	-moz-box-shadow: none;
          box-shadow: none;
  	-webkit-border-radius: 2px 2px 0px 0px;
       -moz-border-radius: 2px 2px 0px 0px;
          	border-radius: 2px 2px 0px 0px;
	overflow: hidden;
}

.box-header h2{
	font-size: 16px;
	line-height: 16px;
	float:right;
	margin-top: 2px;
	color: #646464;
	font-weight: normal;
	text-shadow: 0px 1px 0px #fff;
}

.box-header h2 i{
	margin: 1px 3px 0px 5px;
	opacity: .4;
}

.box-header .break{
	border-left: 1px solid #fcfcfc;
	border-right: 1px solid #ddd;
	margin: -12px 10px -10px 10px;
	padding: 12px 0px 10px 0px;
	
}

.box-header .box-icon {
	float:right;
	margin-top: 1px;
}

.box-header .box-icon i {
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition: all 0.1s ease-in-out;
	-o-transition: all 0.1s ease-in-out;
	-ms-transition: all 0.1s ease-in-out;
	transition: all 0.1s ease-in-out;
	opacity: .4;
}

.box-header .box-icon i:hover {
	opacity: .8;
}

.box-header .box-icon a {
	margin: 0px 5px;
}

.box-content {
  	margin-top: -1px;
	padding: 20px 0 0 0;
  	border: 1px solid #ddd;
  	background: #fcfcfc;
  	-webkit-border-radius: 0px 0px 2px 2px;
	   -moz-border-radius: 0px 0px 2px 2px;
          	border-radius: 0px 0px 2px 2px;
	-webkit-box-shadow: 0 1px 0px rgba(255, 255, 255, .6);
	   -moz-box-shadow: 0 1px 0px rgba(255, 255, 255, .6);
			box-shadow: 0 1px 0px rgba(255, 255, 255, .6);
}
.wrap500px {display:none}

.modal-footer .btn:hover {background-position: inherit !important;}

@media screen and (min-width: 768px) and (max-width: 980px) {
	.box-header2 h2 {font-size: 13px !important;}
    .box-header2 h2 .send_before_time {width: 346px;}
}

@media screen and (min-width: 500px) and (max-width: 767px) {
	.form_row.form_text {padding: 0 10px 0 10px;}	
	.ehi {font-size: 25px;}
	.box-header2 {height: 50px; padding-top: 6px !important; padding-right: 22px !important;}
	.box-header2 h2 {font-size: 14px !important;}
	.form_text {padding: 0 30px 0 30px;}
	.box-header2 .break, .box-header2 i {display: none;}
	.box-header2 .btn-small{font-size: 14px !important; padding: 0 !important;}
	#clock_back {position: absolute; top: 42px; right: 140px;}
	#clock_legend {top: 22px; right: 128px;}

	.form_row {padding: 12px 30px 0px 0px;}	
	#form_title {font-size:20px !important;}
	.form_label {font-size:14px !important;}
    .box-header2 h2 .send_before_time {width: auto;}
}

@media screen and (min-width: 200px) and (max-width: 500px) {
	.form_row.form_text {padding: 0 10px 0 10px;}
	.ehi {font-size: 22px;line-height:22px;}
	.form_row {padding: 12px 10px 0px 0px;}	
	.truma {right:20px; width: 80px; top:-25px;}
	.element_comment {position: static;}
	label {font-size:12px; min-width:50px;}
	.form_element2_4, .form_element2_3 {margin-top:0px;}
	.box-header.box-header2 {display:none;}
	body{padding-left: 2px !important;padding-right: 2px !important;}
    #form_title {font-size:16px !important;}
    .form_label {font-size:12px !important; float: none; width: 100%;}
    .wrap500px {display:block; padding: 5px 0 0 0; text-align: center;line-height:14px;}
    #form_body {padding:0}
    #signModal2 { width: 96%; max-width: 96%;}
    #signatureparent {height: 95px;}
    .modal-footer {text-align: right;}
    .form_element {float: none; width: 96%; margin-left: 0; margin-bottom: 5px;}
    .form_element#your_sign {float: right; width: auto;}
    .form_label2 {margin-top: 5px;}
    .form_element_label {position: static; top: 0; margin-bottom: 1px;}
    .form_row.form_row_sign .form_label {float: right; width: auto;}
    .element_error {font-size: 12px; position: static;}
    input[type="text"].input_text {margin-bottom: 0;}
    .text_area {margin-bottom: 0;}
}

@media screen and (min-width: 280px) and (max-width: 340px) {
	#wrap {width: 260px !important;}
}


@media screen and (min-width: 200px) and (max-width: 280px) {
	#wrap {width: 190px !important;}
}
#mask_wrap {position:absolute;  left: 0px; top: 0px; width:180px; text-align: right; display: none};