@charset "utf-8";
/* отступ от верха сновной части что бы менюха не перекрывала его*/
body {
 padding-top: 60px;}
.header {
		height:322px;
	}
	@media screen and (max-width: 320px) {
   .header {
       background: url(images/header2.jpg);
   }
}
.head-block{
	background-color:#20B2AA;
	height:50px;
		}
.navbar-brand{color:#FFF}
/* цвет фона и рамки навигационного меню */
.navbar-default {
       border-color: #20B2AA;
	    background-color: #20B2AA;
}
/* Цвет пунктов навигационного меню */
.navbar-default .navbar-nav > li > a {
    color: #FFFFFF;}
/* Цвет пункта меню, при поднесении к нему курсора мышки или при его нахождении в фокусе */
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: #008080;
}	
.leftimg {
    float:left; /* Выравнивание по левому краю */
    margin: 7px 7px 7px 0; /* Отступы вокруг картинки */
   }
/* цвет текста (название сайта или бренда), при поднесении к нему курсора мышки или при его нахождении в фокусе */
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
    color: #008080;
}

/* Цвет и фон активного пункта меню, а также поднесении к нему курсора мышки или при его нахождении в фокусе */
.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:hover, 
.navbar-default .navbar-nav > .active > a:focus {
    color: #FFFFFF;
    background-color: #008080;
}

/* Цвет и фон открытого пункта меню, а также поднесении к нему курсора мышки или при его нахождении в фокусе */
.navbar-default .navbar-nav > .open > a, 
.navbar-default .navbar-nav > .open > a:hover, 
.navbar-default .navbar-nav > .open > a:focus {
    color: #d1ffed;
    background-color: #008080;
}

.dropdown-menu  li a:hover {
    color: #008080;}

.dropdown-submenu {
 position: relative;
  }
 
 .dropdown-submenu>.dropdown-menu {
 top: 0;
 left: 100%;
 margin-top: -6px;
 margin-left: -1px;
 -webkit-border-radius: 0 6px 6px 6px;
 -moz-border-radius: 0 6px 6px 6px;
 border-radius: 0 6px 6px 6px;
  }
 
 .dropdown-submenu:hover>.dropdown-menu {
 display: block;
 }
 
 .dropdown-submenu>a:after {
 display: block;
 content: " ";
 float: right;
 width: 0;
 height: 0;
 border-color: transparent;
 border-style: solid;
 border-width: 5px 0 5px 5px;
 border-left-color: #008080;
 margin-top: 5px;
 margin-right: -10px;
 }
 
 .dropdown-submenu:hover>a:after {
 border-left-color: #ffffff;
  }
 
 .dropdown-submenu.pull-left {
 float: none;
 }
 
 .dropdown-submenu.pull-left>.dropdown-menu {
 left: -100%;
 margin-left: 10px;
 -webkit-border-radius: 6px 0 6px 6px;
 -moz-border-radius: 6px 0 6px 6px;
 border-radius: 6px 0 6px 6px;
 }
/* хлебные крошки */
#breadcrumb {
  list-style: none;
  display: inline-block;
  float:right;
  }
#breadcrumb .icon {
  font-size: 14px;
}
#breadcrumb li {
  float: left;
}
#breadcrumb li a {
  color: #fff;
  display: block;
  background: #008B8B;
  text-decoration: none;
  position: relative;
  height: 34px;
  line-height: 34px;
  padding: 0 10px 0 5px;
  text-align: center;
  margin-right: 23px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;  
}
#breadcrumb li:first-child a {
  padding-left: 15px;
  -moz-border-radius: 4px 0 0 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px 0 0 4px;
}
#breadcrumb li:first-child a:before {
  border: none;
}
#breadcrumb li:last-child a {
  padding-right: 15px;
  -moz-border-radius: 0 4px 4px 0;
  -webkit-border-radius: 0;
  border-radius: 0 4px 4px 0;
}
#breadcrumb li:last-child a:after {
  border: none;
}
#breadcrumb li a:before, #breadcrumb li a:after {
  content: "";
  position: absolute;
  top: 0;
  border: 0 solid #008B8B;
  border-width: 17px 10px;
  width: 0;
  height: 0;
}
#breadcrumb li a:before {
  left: -20px;
  border-left-color: transparent;
}
#breadcrumb li a:after {
  left: 100%;
  border-color: transparent;
  border-left-color:#008B8B;
}
#breadcrumb li a:hover {
  background-color:#008080;
}
#breadcrumb li a:hover:before {
  border-color: #008080;
  border-left-color: transparent;
}
#breadcrumb li a:hover:after {
  border-left-color: #008080;
}
#breadcrumb li a:active {
  background-color: #008080;
}
#breadcrumb li a:active:before {
  border-color: #008080;
  border-left-color: transparent;
}
#breadcrumb li a:active:after {
  border-left-color: #008080;
}
#breadcrumb li.current a {
  pointer-events: none;
  cursor: not-allowed;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
  box-shadow: none;
  opacity: .65;
}

/* БЛОКИ СКРЫТОГО ТЕКСТА .скрываем чекбоксы и блоки с содержанием */
.hide,
.hide + label ~ div {
    display: none;
}
/* вид текста label */
.hide + label {
    margin: 0;
    padding: 0;
	color:#20B2AA;
    cursor: pointer;
    display: inline-block;
}
/* вид текста label при активном переключателе */
.hide:checked + label {
    color: #008080;
    border-bottom: 0;
}
/* когда чекбокс активен показываем блоки с содержанием  */
.hide:checked + label + div {
    display: block; 
    margin-left: 20px;
    padding: 10px;
    /* чуточку анимации при появлении */
     -webkit-animation:fade ease-in 0.5s; 
     -moz-animation:fade ease-in 0.5s;
     animation:fade ease-in 0.5s; 
}
/* анимация при появлении скрытых блоков */
@-moz-keyframes fade {
    from { opacity: 0; }
to { opacity: 1 }
}
@-webkit-keyframes fade {
    from { opacity: 0; }
to { opacity: 1 }
}
@keyframes fade {
    from { opacity: 0; }
to { opacity: 1 }   
}
.hide + label:before {
    background-color: #1e90ff;
    color: #fff;
    content: "\002B";
    display: block;
    float: left;
    font-size: 14px; 
    font-weight: bold;
    height: 16px;
    line-height: 16px;
    margin: 3px 5px;
    text-align: center;
    width: 16px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.hide:checked + label:before {
    content: "\2212";
}
#note {
       border: 1px solid #D6D3D3;
	border-bottom: 2px solid #C4C2C2;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px; 
	padding: 8px;
}
.topbutton {
width:80px;
border:2px solid #ccc;
background:#f7f7f7;
text-align:center;
padding:10px;
position:fixed;
bottom:50px;
right:20px;
cursor:pointer;
color:#333;
font-family:verdana;
font-size:12px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
}
.galleria{ width: 550px; height: 400px; background: #AFEEEE }

img {   max-width: 100% }