@font-face {
	font-family: 'shofar';
	src: url('shofardemi-bold-webfont.eot');
	src: url('shofardemi-bold-webfont.eot?#iefix') format('embedded-opentype'),
		 url('shofardemi-bold-webfont.woff') format('woff'),
		 url('shofardemi-bold-webfont.ttf') format('truetype'),
		 url('shofardemi-bold-webfont.svg#shofarbold') format('svg');t
	font-weight: bold;
	font-style: normal;
}

html, form, body
{
	width: 100% ;
	height: 100% ;
	margin: 0px ;
	padding: 0px ;
	text-align:center ;
	font-size: 1.1vw ;
	background-color: White ;
	direction: rtl ;
	font-family: 'shofar';
}

.azure { background-color: #67bae8 ;}

body
{
	color: Black ;
}             

.failureNotification,
.red { color: #9e2c31 ;}

a, a:hover, a:active, a:visited, input { cursor: pointer ; color: Black ; text-decoration: none ;}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) 
{
	/* IE10+ CSS styles go here */
}

p
{
	font-size: 1.4rem ;
	padding: 0px ;
	margin: 0px ;
	margin-bottom: 0.3rem ;
}

textarea
{
	font-family: Arial ;
	font-size: 1rem ;
}

.invisible { display: none ;}

#upperBar
{
	width: 100% ;
	background-color: #67bae8 ;
}

#mainimage, .mainimage
{
	width: 72% ;
}

#menuBar
{
	width: 70% ;
	margin: 0px auto ;
	text-align: right ;
	height: 2.5rem ;	
	line-height: 2.5rem ;
	color: White ;
}

#menuRight
{
	width: 70% ;
	display: inline-block ;
}

#menuBar a
{
	color: White ;
	text-decoration: none ;
	font-size: 1.4rem ;
	font-weight: bold ;
	margin-left: 1rem ;	
}
	   
.advertizement
{
	/*border: 1px solid  #05494f ;*/
	background-color: Transparent ;
	vertical-align: bottom ;
	overflow: hidden ;	
	padding: 0px ;	
	width: 80% ;
	margin: 0.1rem auto ;	
	position: absolute ;
	top: 4rem ;
	height: 70% ;
	width:12% ;
} 

#content
{
	width: 70% ;
	margin: 0px auto ;
	text-align: justify ;
	font-size: 1.4rem ;
	background-color: #eef6fc ;
	padding: 1% ;
	min-height: 20rem ;
}

#footer, #footer a, #footer a:visited
{
	background-color: #eef6fc ;
	width: 72% ;
	min-height: 4rem ;
	margin: auto ;
}

.button, input[type='button']
{
	font-size: 1.5rem ;
	color: White ;
	background-color: #67bae8 ;
	display: block ;
	border: 0px ;
}

#menuBar a.yellowtext, #menuBar a.yellowtext:visited, #menuBar a.yellowtext:active
{
	color: #fba61c ;
	font-size: 1.5rem ;
	font-weight: bold ;
}

.register, .login
{	
	display: inline-block;
	font-weight: bold ;
}

.register label, .login label
{
	width: 8rem;
	display: inline-block ;
}

.register input, .login input, .register select
{
	width: 22rem ;
	font-size: 1.5rem ;
	margin-bottom: 0.4rem ;
	border: 2px solid #94abb1 ;
}

.TextBox
{
	cursor: text ;
}

span.TextBox { height: 2rem; display: inline-block ; width: 22.1rem; border: 2px solid #94abb1; margin-bottom: 0.4rem;}
span.TextBox input { width: 1.5rem ; height: 1.5rem ; vertical-align: middle ;}
span.TextBox label { width: 30% ; display: inline-block ;} 

.submitButton
{
	display: inline-block ;
	margin: 2rem 4rem 0px 0px ;
	vertical-align: top ;
}

.submitButton input
{
	width: 6rem ;
	height: 6rem ;
}

#toolbar
{
	background-color: transparent ;
	padding: 0px ;
	height: 3.2rem ;
	width: 100% ;
	text-align: center ;
	overflow: visible ;
	margin-bottom: 0.5rem;
}

#toolbar img { height: 3rem;}

#title
{
	display: inline-block ;
	height: 3rem ;
	margin: 0px ; 
	padding: 0px ;
	overflow: hidden ;
	vertical-align: middle ;
	text-align: right ;
	margin-right: 0.3rem ;
	line-height: 3rem ;
}

.hideSkiplink
{
	margin-top: 1rem ;
}

.userName
{
	/*
	display: inline-block ;
	color: #fba61c ;
	font-size: 1.4rem ;
	font-weight: bold ;
*/
}

#navigationButtons
{
	position: relative ;
	display: inline-block ;
	height: 3rem ;
	line-height: 3rem ;
	float: right ;
	font-size: 1rem ;
	z-index: 8 ;
}


span.piuctureButton
{
	display: inline-block ;
	height: 2.7rem ;
	text-align: center ;
	line-height: 2.6rem ;
	cursor: pointer ;
	padding: 0px ;
	vertical-align: top ;
}

.selected { color: #fba61c ; }

.genericform
{
	position: fixed ;
	background-color: #e5edf0 ;
	height: 12rem ;
	width: 20rem ;	
	padding: 1rem ;
	z-index: 20 ;
	top: 50%;
	left: 50%;
	text-align: right ;
	font-size: 1.2rem ;
	color: #05494f ;	
	border: 0.1rem solid #05494f ;
	border-collapse: collapse ;
	margin-left: -11rem;
	margin-top: -10rem;
}

.genericform p
{
}

.genericform label
{
	margin-left: 1rem ;
	width: 3rem ;
	display: inline-block ;
}

.genericform input, .genericform textarea, .TextBox
{
	font-size: 1.2rem ;
	border: 0.1rem solid #b5c4c7 ;    
}
.genericform textarea { width: 99% ; display: block ; height: 5rem ;}

.genericform .TextBox
{
	width: 20rem ;
}

.formInner
{
	margin: 1.2rem ;
}

div.formCaption input, div.typeSelectorCaption input { border: 0px ; width: 1.6rem ; height: 1.6rem ; margin-left: 1rem ; vertical-align: middle ;}

div.formCaption
{
	width: 92% ;
	padding: 0.3rem 4% ;
	margin: 0px ;
	font-size: 1.6rem ;
	color: White ;
	text-align: right ;
	border-bottom: 0.1rem solid #05494f ;
	font-weight: bold ;
}

div.formCaption input
{
	margin-left: 0px ;
	vertical-align: middle ;
	margin-top: 0.1rem;
}

.eventCaption
{
	font-size: 2.6rem ;
	font-weight: bold ;
	display: block ;
	width: 80% ;
	margin: 0.2rem 0px ;
	padding: 0px ;
	display: inline-block ;
}

.mhour
{
	font-size: 0.9em ;
	margin-left: 0.2rem;
}

.weekCellContent, input.weekCellContent
{
	display: block ;	
	font-size: 0.9rem ;
	height: auto ;
	width: 100% ;
	margin: 0px ;
	padding: 0px ;
	font-weight: bold ;
}

.weekCellContent input:hover
{
	color: White ;
}

.iconframe
{
	display: inline-block ;
	position: relative ;
	min-width: 48% ;
	vertical-align: top ;
	text-align: left ;
	font-size: 2rem ;
	font-weight: bold ;
	font-family: Guttman Haim, Arial ;
	direction: ltr ;
	white-space: nowrap ;
}

.iconframe span
{
	direction: rtl ;
	display: inline-block;
}

.iconframe img
{
	display: inline-block ;	
	width: 5.6rem ;
	vertical-align: middle ;
	margin: 0.2rem ;
}

.iconframe input
{
	position: absolute ;
	top: 0px ;
	left: 0px ;
	width: 100% ;
	bottom: 0px ;
	background-color: transparent ;
	border: 0px ;
}

.block
{
	min-width: 5rem ;
	width: 5rem ;
	text-align: center ;
	font-size: 1rem ;
	font-family: Arial ;
}

div.block img
{
	width: 3.8rem ;
	height: 3.8rem ;
}

.block span, .block img { display: block ; margin: auto ;}
.block img { width: 5rem; height: 5rem ;}

.homepageiconsarea
{
	width: 60%; 
	display: block; 
	text-align: center;
	vertical-align: top ;
	margin: 0px 0px 2rem auto ;
	display: inline-block;
}

.overlay
{
	position: absolute ;
	top:0px ;
	left:0px ;
	right: 0px ;
	bottom: 0px ;
	width: 100% ;
	height: 100% ;
	background-color: Black ;	
	opacity: 0.6 ;
	z-index: 19 ;
}

.homepageRegister
{
	width: 47% ;
	margin: 0px auto ;	
	font-size: 1.2rem ;
	text-align: center ;right
}

.homepageRegister input, .homepageRegister a
{
	width: 100% ;
	margin-top: 0.5rem ;
	display: block ;
}

h1
{
	color: #67bae8 ;
	font-size: 2rem ;
	-webkit-margin-before: 0.2em;
	-webkit-margin-after: 0.2em;
	margin: 0.2rem 0px ;
}

.register span.checkbox
{
	width: 8rem ;
	display: inline-block ;
}

.checkbox input
{
	width: 1.5rem ;
	height: 1.5rem ;	
	vertical-align: middle ;
}

#upperIcons
{
	display: inline-block ;
	margin: 0px ;
	float: left ;
	margin-left: 1% ;
	margin-top: 0.5rem ;
}

.logo
{
	display: inline-block ; 
	width: 18% ;
	position: relative ; 
	top: -3.5rem ;
	left: 2.5rem ;
	z-index: 1 ;
}

#mainContent
{
	margin-top: -1.8rem ;
}

#leftMenuPart
{
	text-align: left;
	margin: 0px ;
	padding: 0px ;
	display: inline-block ;
	float: left ;
	margin-left: 0px ;
}

#mainMenuDiv
{
	display: inline-block ;
}

#mainMenuDiv a
{
	font-size: 1.2rem ;
	display: inline-block ;
}

.homePageContainer
{
	margin: 0px ;
	padding: 0px ;
}

.right { float: right ;}
.left { float: left ; }

.label
{
	display: inline-block ;
}

.textBoxDiv
{
	display: inline-block ;
}

.selected:hover
{
	background-color: #05494f ;
}

.checkboxlist td
{
	padding: 0px 0.5rem ;	
}

.checkboxlist input
{
	width: 1.2rem ;
	height: 1.2rem ;
	margin-left: 0.5rem ;
	vertical-align: middle ;
}

h3
{
	font-size: 1.6rem ;
	margin: 0.3rem 0px 0.1rem 0px ;
}


#pageTitle { display: inline-block ; text-align: center; vertical-align: top; line-height: 2.4rem; margin-left: 1rem;  }    
#pageTitle h1 { font-size: 2.8rem ; font-family: Aharoni CLM ; margin: 0px ;}
#pageTitle h2 { font-size: 1.1rem ; font-family: Aharoni CLM ; margin: 0px ; overflow: hidden ;}



/**
 * Tooltip Styles
 */

/* Add this attribute to the element that needs a tooltip */
[tooltip]
{
  position: relative;
  z-index: 8;
  cursor: pointer;
}

/* Hide the tooltip content by default */
[tooltip]:before,
[tooltip]:after 
{
  visibility: hidden;
/*  
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;*/
  pointer-events: none;
}

/* Position tooltip above the element */
[tooltip]:before 
{
  position: absolute;
  bottom: 150%;
  left: 50%;
  margin-bottom: 0.8rem;
  margin-left: -4rem;
  padding: 0.6rem;
  width: 7rem;
  -webkit-border-radius: 0.4rem;
  -moz-border-radius: 0.4rem;
  border-radius: 0.4rem;
  background-color: #000;
  /*background-color: hsla(0, 0%, 20%, 0.9);*/
  color: #fff;
  content: attr(tooltip);
  text-align: center;
  font-size: 1.2rem;
  z-index: 9 ;
}

/* Triangle hack to make tooltip look like a speech bubble */
[tooltip]:after 
{
  position: absolute;
  bottom: 150%;
  left: 50%;
  margin-left: -1rem;
  width: 0;
  border-top: 1rem solid #000;
  /*border-top: 5px solid hsla(0, 0%, 20%, 0.9);*/
  border-right: 1rem solid transparent;
  border-left: 1rem solid transparent;
  content: " ";
  font-size: 0;
  line-height: 0;
}

/* Show tooltip content on hover */
[tooltip]:hover:before,
[tooltip]:hover:after 
{
  visibility: visible;
  /*
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;*/
}

#underConstruction
{
	border: 0.2rem solid #05494f ;
	width: 70% ;
	min-height: 20rem ;
	border-radius: 2rem ;
	margin: auto ;
	padding: 4% ;
}

#underConstruction img
{
	width:40%; float:left;
}
@media print
{
	#weekly1 { color: Black ;display: block ; width: 100%; }
	#content { width: 90% ;}
	#calendar { width: 96% ;}
	input, .advertizement, #upperIcons, #navigationButtons, #moreButtons, #upperBar, #footer, .logo, #weekly1 table td.todayCell img, #calendar table td input.addButton, .addApointmentButton, .addIcon
	{ display: none ;}
}



/* Add this attribute to the element that needs a tooltip */
[title]
{
  position: relative;
  z-index: 8;
  cursor: pointer;
}

/* Hide the tooltip content by default */
[title]:before,
[title]:after 
{
  visibility: hidden;
/*  
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;*/
  pointer-events: none;
}

/* Position tooltip above the element */
[title]:before 
{
  position: absolute;
  bottom: 150%;
  left: 50%;
  margin-bottom: 0.8rem;
  margin-left: -4rem;
  padding: 0.6rem;
  width: 7rem;
  -webkit-border-radius: 0.4rem;
  -moz-border-radius: 0.4rem;
  border-radius: 0.4rem;
  background-color: #000;
  /*background-color: hsla(0, 0%, 20%, 0.9);*/
  color: #fff;
  content: attr(title);
  text-align: center;
  font-size: 1.2rem;
  z-index: 9 ;
}

/* Triangle hack to make tooltip look like a speech bubble */
[title]:after 
{
  position: absolute;
  bottom: 150%;
  left: 50%;
  margin-left: -1rem;
  width: 0;
  border-top: 1rem solid #000;
  /*border-top: 5px solid hsla(0, 0%, 20%, 0.9);*/
  border-right: 1rem solid transparent;
  border-left: 1rem solid transparent;
  content: " ";
  font-size: 0;
  line-height: 0;
}

/* Show tooltip content on hover */
[title]:hover:before,
[title]:hover:after 
{
  visibility: visible;
  /*
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;*/
}

[tooltip] input
{
	background-color: transparent ;
	color: #9e2c31 ;
	border: 0px ;
}

#books img
{
	height: 7rem ;
	width: 4.6rem ;
	margin: 0.2rem ;
}

#rightPart
{
	width: 56% ;
	text-align: justify ;
	display: inline-block ;
	margin: 0px 2% ;
}

#leftPart
{
	text-align: justify ;
	width: 39% ;
	display: inline-block ;
	vertical-align: top ;
	margin-top: 0.6rem ;
}

#books
{
	width: 100% ;
	overflow: hidden ;
	white-space: nowrap ;
	margin: 1rem auto ;
}

#books div
{
	top: 0px ;
	left: 0px ;
	z-index: 10 ;
	animation-name: ticker;
	animation-duration: 20s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;	
	position: relative ;
}

@keyframes ticker
{
	from {left: 0%;}
	to {left: 100%;}
}


#search, #register
{
	color: #67bae8 ;	
	font-size: 2rem ;
	font-weight: bold ;
	width: 90% ;
	margin: 0.5rem auto ;
}

#register { font-size: 1.6rem ;}

#search input, #register input
{
	vertical-align: middle ;
}

#search input[type="text"]
{
	border: 0.2rem solid #c7e3f7 ;
	font-size: 1.8rem ;
	width: 70% ;	
}

#search input[type="image"]
{
	border: 0px ;
	width: 10% ;
}

#search input[type="checkbox"]
{
	width: 1.5rem ;
	height: 1.5rem ;
	vertical-align: baseline ;
}

#register input
{
	border: 0px ;
	width: 18% ;
}

#promise p
{
	font-size: 0.9rem ;
	padding: 0px 5% ;
}

#menuBar a.selected
{
	color: Navy ;
	cursor: default ;
}

#menuBar a.selected:hover
{
	background-color: transparent ;
}

div.accountInfo
{
	font-size: 2rem ;
	border: 1px solid black ;
	width: auto ;
}

.formWrapper
{
	display: inline-block ;
	width:40% ;
	border: 1px solid black ;
	vertical-align: top ;
	margin: 2% ;
	padding: 2% ;
	min-height: 24rem ;
	text-align: center ;	
	font-size: 1.6rem ;
}

.formWrapper .textBoxDiv input
{
	width: 80% ;
	margin: 0.2rem auto ;
	padding:4px;  
	font-size: 0.8em;
}

.formWrapper .checkBox
{
	display: block;
}

.formWrapper .checkBox input
{
	width: 1.5rem ;
	height: 1.5rem ;
	margin-left: 1rem ;
}

.formWrapper .button
{
	margin: 1em auto ;
}


.facebookButton, .accountInfo input.facebookButton, .googleButton, .accountInfo input.googleButton
{
	width: 20rem ;
	height: 4.2rem ;
	background: url('../images/facebook_button.png') ;
	background-size: 100% 100% ;
	padding-right: 70px ;
	color: white ;
	border: 0px ;
	cursor: pointer ;
	margin: 0.5em auto ;
	font-size: 0.8em;
}

.googleButton, .accountInfo input.googleButton
{
	background: url('../images/google_button.png') ;
	background-size: 100% 100% ;
}

.or
{
	width: 100% ;
	text-align: center ;
	font-size: 3rem ;
}

#booktext
{
	font-family: Times New Roman ;
}

.categorySection, #booktext div
{
	margin: 1em ;
	background-color: White ;	
	border-radius: 1rem ;
	padding: 1em ;
}
	
#booktext p 
{
	margin: 0.2rem 0px ;
/*	background-color: White ;
	padding: 0.5rem ;
	border-radius: 1rem ;*/
}

.questionAnswer
{
	font-weight: bold ;
	font-size: 1.3em ;
}
	
#booktext input { height: 2rem; vertical-align: top ; float: left ; margin: 0.1rem;}

.popup
{
	width: 200px;
	height: 200px;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-left: -100px;
	margin-top: -100px;
	border:  3px solid black ;
	background-color: Yellow ;
}

.leftButton, .rightButton
{ 
	background-color: #67bae8;
	border: 0px ;
	border-radius: 0.5em ;
	color: White ;
	font-size: 0.9em;
	padding: 0.4em ;
}
.leftButton{ float: left ;}
.rightButton{ float: right ;}

#toolbar { background-color: #f0f0f0 ; margin-bottom: 0px ; margin-top: 0px ;}

#toolbar input, #toolbar img { width: 1.5rem ; height: 1.5rem ;  vertical-align: middle ; }

#booktext a, #booktext a:visited
{
	font-weight: bold ;
	color: #10ff10 ;
}

#booktext a:hover { text-decoration: underline ;}

h1 { display: inline-block ; font-size: 2em; text-align: center ; width: 100% ; margin-top: 0.2em; }