/* ------ general
-----------------------------------------------*/

body {
font-family:Arial, Helvetica, sans-serif;
	margin: 0 auto;
	padding: 0 auto;
	background-color: #bbf8bb;
}
.sitelogo {
	margin-left: -5px;
}
.sitelogo IMG {
	width: 1260px;
	height: 190px;
}
/*spoiler*/
.spoiler_btn {
	background-color: green;
	color: white;
	cursor: pointer;
}
.spoiler {
	display: none;
}


#site{
/*background:#BBE1EA;*/
width:1280px;
height:auto;
position: relative;
min-height: 768px;/* FF, Opera, IE7 */
height:expression(this.scrollHeight < 768? "768px" : "auto" ); /* IE 5 - IE 6 */
margin: 0 auto;
}
#header{
width:1280px;
height:195px;
}
#header-1{
width:120px;
height:auto;
float:left;
margin-top:5px;
}
#header-2{
width:auto;
height:auto;
margin-left:100px;
font-size:120%;
line-height:120px;
}
#body {
width:1260px;
margin:0px;
display: inline-block;
}
#menu{
width:0px; /*300px;*/
height:auto;
float:left;
margin-left:10px;
}
#content{
margin-left:0px;
margin-right:30px;
text-align: justify;
}
#footer{
display: inline-block;
bottom: 0;
width:1280px;
margin-top:10px;
}
#adres{
font-size: 80%;
margin-left:25px;
}
#text{
text-indent:1.5em;
word-wrap:break-word;
text-align: justify;
}
HR {border: thin; color: #9ffc76; background-color: #ffffcc; height: 2px; margin-top:5px; margin-bottom:5px;}
h1 {FONT-SIZE: 18pt; COLOR: #003300;  text-transform: uppercase; font-weight: bold; text-align: center; text-shadow: 1px 1px green;}
h2 {FONT-SIZE: 15pt; COLOR: #00ff00; -webkit-text-stroke: 1px green; text-shadow: 1px 1px gray; }


/*Кнопки  */
#greenButton {
    height:35px;
    width: 16em;
    background-color: #54A9C1;
    border:0px solid black;
    font-weight:bold;
        color:#000000;
        text-decoration: none;
        margin: 10px;
       padding-top:5px;
       padding-bottom:5px;
       padding-left:5px;
       padding-right:5px;
}
#greenButton:hover {
    background-color: #80C9DD;
    color: #fff;
    font-weight: bold;
        cursor: pointer;
        text-decoration: none;
}


/*Аккордион*/
.accordion,
 .accordion ul,
 .accordion li,
 .accordion a,
 .accordion span {
 margin: 0;
 padding: 0;
 border: none;
 outline: none;
 }
 .accordion li {
 list-style: none;
 }

/* Определение и стили элементов */

 .accordion li > a {
 display: block;
 position: relative;
 min-width: 110px;
 padding: 0 10px 0 20px;
 height: 32px;

 color: #341b07;
 font: bold 12px/32px Arial, sans-serif;
 text-decoration: none;
 text-shadow: 0px 1px 0px rgba(0,0,0, .35);


/* меню слева */
 background: #959595;
 background: -moz-linear-gradient(top,  #73f97c 0%, #a4fc75  100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#73f97c), color-stop(100%,#a4fc75));
 background: -webkit-linear-gradient(top,  #73f97c 0%,#a4fc75 100%);
 background: -o-linear-gradient(top,  #73f97c 0%,#a4fc75 100%);
 background: -ms-linear-gradient(top,  #73f97c 0%,#a4fc75 100%);
 background: linear-gradient(top,  #73f97c 0%,#a4fc75 100%);

 -webkit-box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1);
 -moz-box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1);
 box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1);
 }
 .accordion > li:hover > a,
 .accordion > li:target > a,
 .accordion > li > a.active {
 color: Black Bean;
 text-shadow: 1px 1px 1px rgba(255,255,255, .2);

 background: #959595;

/* меню слева при наведении */
 background: -moz-linear-gradient(top,  #86fa8e 0%, #c9fabd 50%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#86fa8e), color-stop(50%,#c9fabd));
 background: -webkit-linear-gradient(top,  #86fa8e 0%,#c9fabd 100%);
 background: -o-linear-gradient(top,  #86fa8e 0%,#c9fabd 50%);
 background: -ms-linear-gradient(top,  #86fa8e 0%,#c9fabd 50%);
 background: linear-gradient(top,  #86fa8e 0%,#c9fabd 50%);
 }
 .accordion li > a span {
 display: block;
 position: absolute;
 top: 7px;
 right: 0;
 padding: 0 10px;
 margin-right: 10px;

 font: normal bold 12px/18px Arial, sans-serif;
 background: #e7e202;

 -webkit-border-radius: 15px;
 -moz-border-radius: 15px;
 border-radius: 15px;

 -webkit-box-shadow: inset 1px 1px 1px rgba(0,0,0, .2), 1px 1px 1px rgba(255,255,255, .1);
 -moz-box-shadow: inset 1px 1px 1px rgba(0,0,0, .2), 1px 1px 1px rgba(255,255,255, .1);
 box-shadow: inset 1px 1px 1px rgba(0,0,0, .2), 1px 1px 1px rgba(255,255,255, .1);
 }
 .accordion > li:hover > a span,
 .accordion > li:target > a span,
 .accordion > li > a.active span {
 color: #fdfdfd;
 text-shadow: 0px 1px 0px rgba(0,0,0, .35);
 background: #3e5706;
 }

/* Иконки перед разделами */

 .accordion > li > a:before {
 position: absolute;
 top: 0;
 left: 0;
 content: '';
 width: 24px;
 height: 24px;
 margin: 4px 8px;

 background-repeat: no-repeat;
 background-image: url(../img/icons.png); /* Ссылка на картинку-спрайт иконок */
 background-position: 0px 0px;
 }

 .accordion li.home > a:before { background-position: 0px 0px; }
 .accordion li.home:hover > a:before,
 .accordion li.home:target > a:before,
 .accordion li.home > a.active:before { background-position: 0px -24px; }

 .accordion li.otdel > a:before { background-position: -24px 0px; }
 .accordion li.otdel:hover > a:before,
 .accordion li.otdel:target > a:before,
 .accordion li.otdel > a.active:before { background-position: -24px -24px; }

 .accordion li.abitur > a:before { background-position: -48px 0px; }
 .accordion li.abitur:hover > a:before,
 .accordion li.abitur:target > a:before,
 .accordion li.abitur > a.active:before { background-position: -48px -24px; }

 .accordion li.stud > a:before { background-position: -72px 0px; }
 .accordion li.stud:hover > a:before,
 .accordion li.stud:target > a:before,
 .accordion li.stud > a.active:before { background-position: -72px -24px; }

/* Стили для под меню */

 .sub-menu li a {
 color: #161616;
 text-shadow: 1px 1px 0px rgba(255,255,255, .2);

 background: #bdfd9b;
 border-bottom: 1px solid #bff8c3;

 -webkit-box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1);
 -moz-box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1);
 box-shadow: inset 0px 1px 0px 0px rgba(255,255,255, .1), 0px 1px 0px 0px rgba(0,0,0, .1);
 }

 .sub-menu li:hover a { background: #f4fbb5; }

 .sub-menu li:last-child a { border: none; }

 .sub-menu li > a span {
 color: #abb1c9;
 text-shadow: 1px 1px 0px rgba(255,255,255, .2);
 background: transparent;
 border: 1px solid #b6bdcb;

 -webkit-box-shadow: none;
 -moz-box-shadow: none;
 box-shadow: none;
 }
 .sub-menu em {
 position: absolute;
 top: 0;
 left: 0;
 margin-left: 14px;
 color: #afb6c9;
 font: normal 10px/32px Arial, sans-serif;
 }

/* Скрываем неактивные блоки */

 .accordion li > .sub-menu {
 display: none;
 }
 .accordion li:target > .sub-menu {
 display: block;
 }



/* ------ mobilyslider
-----------------------------------------------*/

#contentslider {
width:450px;
margin:20px auto 20px;
}

.slider {
float:left;
width:450px;
height:300px;
position:relative;
padding-bottom:26px;
background:url(../gfx/bottom_shadow.png) no-repeat bottom center;
}

.sliderContent {
float:left;
width:450px;
height:300px;
clear:both;
position:relative;
overflow:hidden;
}

.sliderArrows a {
display:block;
text-indent:-9999px;
outline:none;
z-index:50;
background-image:url(../gfx/prev_next.png);
width:42px;
height:42px;
position:absolute;
top:50%;
margin-top:-34px;
}

.prev {
background-position:0 0;
left:15px;
}

.prev:hover {
background-position:0 -44px;
}

.next {
right:15px;
background-position:-44px 0;
}

.next:hover {
background-position:-44px -44px;
}

.sliderContent .item {
position:absolute;
width:800px;
height:350px;
background:#fff;
}

.sliderBullets {
position:absolute;
bottom:0;
left:50%;
z-index:50;
margin-left:-45px;
}

.sliderBullets a {
display:block;
float:left;
text-indent:-9999px;
outline:none;
margin-left:5px;
width:10px;
height:11px;
background:url(../gfx/bullets.png) no-repeat;
}

.sliderBullets .active {
background-position:0 -11px;
}

.sliderContent a {
outline:none;
}

  img.big {cursor: pointer; max-width: 200px;}
  img.big:hover {max-width: none;}


  .foc {width: 200px; cursor:pointer; display:inline;}
.foc:focus {width: auto; z-index:100;}

#gallery {
  position: relative;
  padding-top: 50%;
  -moz-user-select: none; user-select: none;
}

#gallery1 {
  position: relative;
  padding-top: 50%;
  -moz-user-select: none; user-select: none;
}

#gallery {
  position: relative;
  padding-top: 50%;
  -moz-user-select: none; user-select: none;
}

#gallery img {
  position: absolute;
  top: 25%;
  left: 12.5%;
  max-width: 24.5%;
  max-height: 49.5%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  cursor: zoom-in;
  transition: .2s;
}
#gallery img:nth-child(4n-2) {left: 37.5%;}
#gallery img:nth-child(4n-1) {left: 62.5%;}
#gallery img:nth-child(4n) {left: 87.5%;}
#gallery img:nth-child(n+5) {top: 75%;}

#gallery img:focus {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  max-width: 100%;
  max-height: 100%;
  outline: none;
  pointer-events: none;
}

#gallery img:focus ~ div {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #fff;
  cursor: zoom-out;
}



#gallery1 img {
  position: absolute;
  top: 25%;
  left: 12.5%;
  max-width: 24.5%;
  max-height: 49.5%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -moz-user-select: none; user-select: none;
  cursor: zoom-in;
}
#gallery1 img:nth-child(4n-2) {left: 37.5%;}
#gallery1 img:nth-child(4n-1) {left: 62.5%;}
#gallery1 img:nth-child(4n) {left: 87.5%;}
#gallery1 img:nth-child(n+5) {top: 75%;}

#gallery1 img:focus {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 31;
  max-width: 100%;
  max-height: 100%;
  outline: none;
  pointer-events: none;
}

#gallery1 img:focus ~ div {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 30;
  background: rgba(240,240,240,.9);
  cursor: zoom-out;
}