@import url("/css/reset.css");

/* -------------------------------

Main layout

--------------------------------- */

html {
    font-size: 62.5%; /* reset 1em to 10px */
    height: 100%;
}

body {
	font: normal 1.5em Arial, Helvetica, sans-serif;
	height: 100%;
	background-color: var(--body-bg);
        color: var(--body-text);
	overflow-x: hidden;
}

a{
	color:var(--a-color);
	outline:0 none;
	font-weight:bold;
	text-decoration: none;
}

a:focus,
a:hover{
	color: #36C;
	text-decoration: none;
}


ol, ul {
	margin: 0 1.6em 1.2em 0;
}
ul li {list-style: disc;}
ol li {list-style: decimal;}
li {padding: 2px 0;}



.clear_float{
	height:0;
	clear:both;
}
.wrapper {
	width: 100%;
	min-height: 100%;
	height: auto !important;
	height: 100%;
        background-color: var(--wrapper-bg)

}

header{
	line-height: 30px;
	position: relative;
	z-index: 100;
	width: 100%;
/*	background: rgba( 0, 0, 0, 0.2);
	-pie-background: rgba(0, 0, 0, 0.2);
	behavior: url(/css/PIE.htc);*/

	text-align: left;
	color: var(--body-text);

	height: 30px;
	overflow: visible;
}
#facebook_txt{
	color: #000;
}
#facebook_to{
	display: block;
	float: left;
	height: 24px;
	width: 24px;
	background: url(/images/facebook_to.png) left bottom;
	margin-right: .5em;
}
#facebook_to:hover{
	background: url(/images/facebook_to.png) left top;
}


#page_bg {
	display: block;
	float: right
}
#page_bg img{
	width: 1px;
	height: 1px;
	float: right
}

header, nav, footer, #wrapper, #middle{
	direction: rtl;
}

/* -------------------------------

  NAV

--------------------------------- */
nav {
	position: absolute;
	width: 100%;
	left: 0;
	top: 10px;
	z-index: 100;


}
nav #nav{
	list-style: none;
	margin: 0;
	padding: 0;
	width: 100%;

}
nav #nav li{
	display: block;
	float: right;
	width: 12.5%;

}
nav #nav li .curr img,
nav #nav li a img{
	width: 100%;
	height: auto;
	margin-top: -15px;
}

nav #nav li:first-child a:hover,
nav #nav li:first-child a,
nav #nav li:first-child .curr{
	background: none;
	/*width: 90%;*/
	width: 120px;
}

nav #nav li a,
nav #nav li .curr{
	display: block;
	width:55%;
	line-height: 70px;
	margin-left: auto;
	margin-right: auto;
	text-align:center;
	text-decoration: none;
	color:#000;
	font-size: 24px;
	font-weight: bold;

	background-size: 100% 100%;
	-ms-behavior: url(/css/backgroundsize.min.htc);
	background-image: url(/images/btn_out.png);
	background-repeat:no-repeat;
}
nav #nav li a:focus,
nav #nav li a:hover{
	color:#000;
	font-size: 24px;
	background-image: url(/images/btn_hover2.png);
}
nav #nav li .curr{
	background-image: url(/images/btn_hover2.png);
	color: #FFF;
}

/* Middle
-----------------------------------------------------------------------------*/
#txt_wrapper{
}

#middle{
	direction: rtl;
	position: relative;
	padding-bottom: 56px;
	margin-top: 50px;
}
h1{
	font-size: 1.8em;
	padding-bottom: .5em;
	text-shadow: 2px 2px 10px #000;
	text-align: center;
	color: var(--h1);
	-webkit-font-smoothing: antialiased;

}

h2{
	font-size: 1.4em;
	padding-top: .5em;
	padding-bottom: .5em;
}
.pink{
	color: var(--pink);
}
.square{
	display: block;
	border: 1px solid #999;
	line-height:2em;
	padding: 0;
}
.square .inner{
	padding: 1em;
	margin: 0;
}
.innerform{
	padding: 2.5em;
	margin: 0;
}
.square .inner p{
	margin: 0;
	padding: 0;
}
.square .more{
	display: block;
	text-align: left;
	padding-top: 0;
	color: var(--readmore);
	cursor: pointer;
}


.whitebg{
	background: var(--white-bg);
	-pie-background: rgba(255, 255, 255, 0.70 );
	behavior: url(/css/PIE.htc);
}
.lightbg{
	background:      var(--light-bg);
	-pie-background: rgba(255, 255, 255, 0.20 );
	behavior: url(/css/PIE.htc);
}
.yelowbg{
	background:     var(--yelow-bg);
	-pie-background: rgba(255, 255, 200, 0.85 );
	behavior: url(/css/PIE.htc);
}
.yelow3bg{
	background: var(--yelow3-bg);
}
.yelow2bg{
	background:      var(--yelow2-bg);
      	-pie-background: rgba(255, 255, 200, 0.50 );
	behavior: url(/css/PIE.htc);
}
.bluebg{
	background:      var(--blue-bg);
	-pie-background: rgba(200, 200, 225, 0.80);
	behavior: url(/css/PIE.htc);
}

.blue2bg{
	background:      var(--blue2-bg);
	-pie-background: rgba(140, 160, 233, 0.50);
	behavior: url(/css/PIE.htc);
}

.redbg{
	background:     var(--red-bg);
	-pie-background: rgba(238, 60, 36, 0.20);
	behavior: url(/css/PIE.htc);
}


/*
 Pages
---------------------------*/
/* העתק של עמודה ימנית שתופיע אח"כ בסלולריים
בעוד העמודה המקורית מוסתרת
כדי שהעמודה המרכזית תופיע בהתחלה */
.right_col_copy{
	display: none;
}

/* home ---*/

#home_txt{
	position: relative;
	margin-left: auto;
	margin-right: auto;
	min-height: 320px;
	z-index: 10;
}
#home_event{
	position:relative;
	width:600px;
	margin: 10px auto 4px;
	display: none;
	margin-bottom: 1em;
	z-index: 100;
}
#home_txt  h1{
	font-size: 6em;
        font-size: 96px;
	line-height: 1em;
	font-weight: normal;
	padding-top: .5em;
}
/* מכיל את כפתורי הפופאפ  */
ul.blocklist {
  list-style:none;
  margin:0 auto;
  padding:0;
  text-align:center;
  width: 100%;
  line-height: 2em;
  position: relative;
  z-index: 100;
}
ul.blocklist li{
    display:inline;
}
ul.blocklist li p{
	display:inline-block;
	width: auto;
	padding: 1em;
	margin: .5em;
	cursor: pointer;
	color: #FFF;
	background:  var(--blocks-home);
	-pie-background: rgba(238, 60, 36, 0.50);
	behavior: url(/css/PIE.htc);
	font-weight: bold;
	line-height: 1em;
	white-space: nowrap;
	border: 1px solid #FFF;
}
ul.blocklist li p:hover{
	background:      rgba(238, 60, 36, 0.70);
	-pie-background: rgba(238, 60, 36, 0.70);
	behavior: url(/css/PIE.htc);
}



/* about ---*/

#about_image{
	/*margin-top:3em;*/
	float: right;
	margin-right: 2%;
	width: 23%;
}

#about_image2 img,
#about_image img{
   border: 1px solid #999;
   width: 100%;
   height: auto;
}

#about_txt{
	float: right;
	margin-right: 5%;
	width: 40%;
}

#about_song{
	width: 23%;
	text-align:center;
	float: left;
	margin-left: 2%;
}

#about_song .more{
	text-align: center;
	font-weight: bold;
}

/* Way ---*/
#way_txt{
	float: right;
	margin-right: 5%;
	width: 44%;
}
#way_stava2,
#way_stava{
	float: right;
	margin-right: 2%;
	width: 17%;
	color: var(--way);
	text-align: center;
	line-height: 3em;
	font-weight: bold;
	border: none;

}

#way_song{
	width: 25%;
	text-align:center;
	float: left;
	margin-left: 2%;
	border: none;
}

/* place ---*/

#place_txt1{
	float: right;
	margin-right: 2%;
	width: 21%;
}
#place_txt1 p{
	line-height: 1.4em;
}

#place_txt2{
	float: right;
	margin-right: 6.2%;
	width: 41%;
}

#place_song {
	width: 21%;
	text-align:center;
	float: left;
	margin-left: 2%;
	line-height: 3em;
}

/* stuff ---*/

#stuff_hl{
	position: relative;
	width: 80%;
	margin: auto;
	text-align:center;
	color: #FFC;
}
#stuff_txt{
	position: relative;
	width: 80%;
	min-height: 100px;
	padding-top: 12px;
	padding-left: 12px;
	margin: auto;
}
#stuff_txt .image{
	position: relative;
	width: 70px;
	height: 70px;
	float:right;
	margin-right: 12px;
	background-color: #FFF;
	background-repeat: no-repeaclose_opt;
	background-position: center center;
	-webkit-border-radius: 35px;
	-moz-border-radius: 35px;
	border-radius: 35px;
	behavior: url(/css/PIE.htc);
	border: 1px solid #999;
}

#stuff_txt .imagebig{
	position: relative;
	width: 150px;
	height: 150px;
	float:right;
	margin-right: 12px;
	background-color: #FFF;
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-border-radius: 75px;
	-moz-border-radius: 75px;
	border-radius: 75px;
	behavior: url(/css/PIE.htc);
	border: 1px solid #999;
}
#stuff_txt .text_detail{
	margin-right:175px;
}

#stuff_txt section{
	width: 50%;
	float: right;
 	line-height: 1.2em;
}
#stuff_txt .txt{
	margin-right: 94px;
 	min-height: 82px;
	padding-bottom: 1em;
}
#stuff_txt h2{
	margin-bottom: 0;
	padding-bottom: 0;
}

.todetail{
	text-decoration: none;
	color:var(--readmore);

}

#stuff_buttons{
	display: block;
	float:left;
	margin-left: 10%;
}

#stuff_buttons a{
	display: block;
	padding: 1em;
	text-decoration: none;
	color: #FF9;
	float: left;
	margin-right: 1em;
	background:      rgba(238, 60, 36, 0.20);
	-pie-background: rgba(238, 60, 36, 0.20);
	behavior: url(/css/PIE.htc);
	font-weight: bold;
}

#stuff_buttons a:hover{
	color: #FFF;
	background:      rgba(238, 60, 36, 0.50);
	-pie-background: rgba(238, 60, 36, 0.50);
	behavior: url(/css/PIE.htc);
}


/*----------------------------------*/

.fromto{
	display:block;
	float: left;
}
.whait{
	display: block;
	min-width: 12.5%;
	min-height: 100px;
	background-image:url(/images/whait.gif);
	background-repeat: no-repeat;
	background-position:  center center;
}

#events, #pop1,#pop2, #pop3{
	direction: rtl;
	min-width: 90%;
	max-width: 400px;
	padding: 20px;
	background: #FFF;
	display: none;

	overflow: auto;
}

.col{
	display: block ;
	width: 140px;
	float: right;
}
#time_headline{
}
#time_txt{
	direction: ltr;
	width: 90%;
	margin: auto;
	height: auto;
	overflow:auto;
}
/*------------------------------
	Table
-------------------------------*/
table{
	direction:rtl;
 	width: 100%;
	min-width: 500px;
	border-top:  1px solid  var(--table-border);
	border-left: 1px solid  var(--table-border);
	background: var(--table-bg);
	-pie-background: rgba(255, 255, 255, 0.70 );
	behavior: url(/css/PIE.htc);


}
th {

	font-weight: bold;
}
th, td{
	text-align: center;
	vertical-align: middle;
	padding: 2px;
	margin: 0;
	border-bottom: 1px solid var(--table-border);
	border-right:  1px solid var(--table-border);
}
th{

	background:      var(--th-bg);
	-pie-background: rgba(140, 160, 233, 0.50);
	behavior: url(/css/PIE.htc);

}
td{
	background:     var(--td-bg);
	-pie-background: rgba(255, 255, 255, 0.70 );
	behavior: url(/css/PIE.htc);
}

/* login admin
-----------------------------------------------------------------------------*/
#login_txt{
	margin-top: 5em;
	margin-left: auto;
	margin-right: auto;
	width: 490px;


}
#admin_form{
	padding: 1em;
	border: 1px dashed #333;
}
/* Gallery
-----------------------------------------------------------------------------*/

#gallery_hl{
	position: relative;
	width: 50%;
	margin: auto;
	text-align:center;
	color: #FFF;
}



#gallery{
	padding-top: 30px;
	position: relative;
  	margin: 0 auto;
}
#gallery .item{
	width: 150px;
	height: auto;
	background: var(--body-text);
	float:right;
	margin-bottom: 30px;
	border: 4px solid #FFF;
	display: none;
}

#albom_home{
	direction: rtl;
	position: absolute;
	left: 6%;
	top: 50%;
	width: 88%;
	margin-top: -6%;
}
#albom_home .ctegory{
	direction: rtl;
	float:right;
	width: 20%;
	margin-right: 10%;
	text-align: center;
	font-size: 1.1em;
	line-height: 1.8em;
	font-weight: bold;
	color: var(--body-text);
	background:      rgba(255, 255, 255, 0.30);
        background: var(--category);
	-pie-background: rgba(255, 255, 255, 0.30 );
	behavior: url(/css/PIE.htc);
}

#albom_home .ctegory .image{
	display: block;
 	background: #FFF;
	padding: 8px;
 	overflow: hidden;
}

#albom_home .ctegory .image img{
	display: block;
	width: 100%;
	height: auto;
}

#gallery_buttons a{
	display: block;
	position: absolute;
	right:5rem;
	top:100px;
	padding: .5em 1em;
	text-decoration: none;
	font-weight: bold;
	z-index: 200;
        font-size: .9em;
        color: #FFF;
        background:      rgba(238, 60, 36, 0.50);
	-pie-background: rgba(238, 60, 36, 0.50);
	behavior: url(/css/PIE.htc);
}
#gallery_buttons a:hover{
	color: #FFF;
	background:      rgba(238, 60, 36, 0.60);
	-pie-background: rgba(238, 60, 36, 0.60);
	behavior: url(/css/PIE.htc);
}


/*
	FORM
*************************/

.form ol {
	padding:0;
	margin:0;
}
.form ol li {
	list-style:none;
	display:block;
	padding-top:0px;
	padding-bottom:10px;
}
.form ol li ul{
	list-style: disc;
	margin: 0 1.6em 1.2em 0;
}
.form ol li ul li{
	list-style: disc;
}

.form input {
	font-size: 1em;
	line-height: 25px;
	font-family: Arial;
	height:25px;
}
.form ol li label,
.form ol li .label {
	display:block;
	padding-left:5px;
	font-family:Arial,Helvetica,sans-serif;
	line-height:25px;
	text-align:left;
	float:right;
	width: 75px;


}
.form textarea {
	overflow:auto;
	font:12px Arial,Helvetica,sans-serif;
}
.input1,
.input2,
.input3 {
	width:330px;
	padding: 3px;
	background-color: var(--input-bg);
	border: 1px solid #CCC;
        color: var(--body-text);
}
.input3{
	width:610px;
}
.input2{
	width:60px;
}


.form ol li.error {
	display:none;
}
.error,
.form ol li.error,
.form ol li.buttons,
.form ol li.info {
	margin-right:80px;
}
.form ol li.buttons {
	margin-bottom:0;
}
.error {
	color: var(--input-error);
}
.form ol li.info {
	padding-bottom:2px;
	font-size:.9em;
}

#contactform{
}

.form #contactform ol li label {
	float: none;
	text-align:right;
	width:auto;
}
.form #contactform ol li.error,
.form #contactform ol li.buttons {
	margin-right:0px;
}

.input_focus {
	background-color: var(--input-focus);
	border: 1px solid var(--input-focus-border);
        outline: none;
}

.button{
	color: #5A5A5A;
	background: #FFCD00;
	width: 80px;
	border-style: none;
	display:block;
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	overflow: hidden;
	line-height: 30px;
	text-decoration: none;
	color: #333;
}
.button:hover{
	background: #CB2027;
	color: #FFF;
}

.ckbx input{
	width: 13px;
    height: 13px;
    padding: 0;
    margin:0;
    vertical-align: bottom;
    position: relative;
    top: -1px;
    *overflow: hidden;
}

.thankyou{
	text-align: center;
}
/* ----------------------------*/
#address_copy{
	display: none;
}
#map{
	float: right;
	margin-right: 2%;
	width: 18%;
	line-height: 1em;
}
#map p {
	line-height: 1.4em;
}
#map #contact_map img{
	width: 100%;
	height: auto;
}

#form{
	margin-right: 10%;
	float: right;
	width: 40%;
	min-height: 445px;
}

#more_txt{
	float: left;
	margin-left: 2%;
	width: 18%;
}
#more_txt p{
	line-height: 1.4em;
}

#contactform ol li .input1{
	width: 99%
}

/*--------------------------------

 	Paging

----------------------------------*/


ul.paging {
  direction:rtl;
  list-style:none;
  padding:0;
  text-align:left;
  margin-top: 4px;
}
ul.paging li{
    display:inline-block;;
}
ul.paging li .curr_page,
ul.paging li a{
	dis1play:block;
	color:#FFC;
	padding: 2px 10px;
	margin-right: 5px;
	text-decoration:none;
	background:      rgba(238, 60, 36, 0.20);
	-pie-background: rgba(238, 60, 36, 0.20);
	behavior: url(/css/PIE.htc);
}
ul.paging li .curr_page,
ul.paging li a:hover{
	font-weight: bold;
	color:#FFF;
	background:      rgba(0, 0, 0, 0.20);
	-pie-background: rgba(0, 0, 0, 0.20);
	behavior: url(/css/PIE.htc);
}


#teacher_paging .paging{
	width:81%;
	margin:0 auto;
}
#teacher_paging ul.paging li .curr_page,
#teacher_paging ul.paging li a:hover{
	background:      rgba(0, 0, 0, 0.40);
	-pie-background: rgba(0, 0, 0, 0.40);
	behavior: url(/css/PIE.htc);
}
#teacher_paging ul.paging li a{
	background:      rgba(238, 60, 36, 0.40);
	-pie-background: rgba(238, 60, 36, 0.40);
	behavior: url(/css/PIE.htc);
}


/*-----------------------------------------------------------------------

 Footer
-----------------------------------------------------------------------------*/
footer{
 	width: 100%;
	height:34px;
	margin-top: -39px;
	padding-top: 5px;
	position: relative;
	z-index: 100;
	background: rgba( 0, 0, 0, 0.5);
	-pie-background: rgba(0, 0, 0, 0.5	);
	behavior: url(/css/PIE.htc); /

}
footer .copy_r{
	display: none;
}

footer .info{
	color: #FFF;
	z-index: 100;
 	width: 100%;
	line-height:24px;
	text-align: center;
}
footer .facebook{
	margin-left: 1em;
	float:left;
}

footer .share{
	margin-right: 1em;
	float:right;
}
footer .share .txt,
footer .share a{
	display: block;
	float:right;
	margin-left:.5em;
	border: none;
	text-decoration: none;
}
footer .share a img{
	border: 1px solid #999;
}
footer .copyright{
	margin-left: 1em;
}
header a, header a:hover,
footer a, footer a:hover{
	color: #FFF;
	text-decoration: none;
}
.red{
	color:#C30;
}
/* -------------------
	Mobile Logo
---------------------- */
#mobile_logo{
	padding-top: 30px;
	text-align: center ;
	margin-bottom: -15px;
	display: none;
}
/* -------------------
	Mobile Nav
---------------------- */
#mobile_nav {
	direction: rtl;
	position:absolute;
	width: 100%;
	height: auto;
	z-index:10000;
	font-size: 11pt;
	line-height: 30px;
	left: 0;
	top: 0;
	display: none;
	padding: 0;

}
#mobile_nav a {
	display: block;
	text-decoration:none;
	color: #FFF;
	padding-right: 30px;

}
#mobile_nav a#pull {
	height: 30px;
	line-height: 30px;
	display: block;
	position: relative;
	background-image: url(/images/nav-icon.png);
	background-repeat:  no-repeat ;
	background-position: 20px center;
	background-color: #333;
}
#mobile_nav a#pull .pull{
	float: left;
	margin-left: 55px;
	color: #999;
}
#mobile_nav a#pull #page_lable{
}
ul#mobile_menu {
	display: none;
	margin:0;
	padding: 0;
}

ul#mobile_menu li {
	width: 100%;
	list-style:none;
	display:block;
	margin:0;
	padding: 0;

}
ul#mobile_menu li .curr,
ul#mobile_menu li a{
	display: block;
	text-decoration:none;
	color: #FFF;
	padding-right: 30px;
	display: block;
	height: 30px;
	line-height: 30px;
	border-bottom: 1px solid #7D7D7D;
	background:      rgba(50, 50, 50, 0.70);
	-pie-background: rgba(50, 50, 50, 0.70);
	behavior: url(/css/PIE.htc);
}
ul#mobile_menu li .curr{
	font-weight: bold;
	color: #FFF;
	background: #333
}

.monochrome{
    filter: grayscale(100%);
}