/* Выпадающее меню карусели */
/*--карусель--*/
.carousel1{
	width:100%;
	list-style:none;
	font-weight:bold;
	font-family:Arial,Verdana,sans-serif;
	font-size:0.75em;
	color:#050835;
	 text-align: center;
}
.carousel1 li a:hover{
	color:#5f68f7;
	background:#12166c;
	text-decoration:underline;
}
img.cloudcarousel {

	 border: 1px solid #5f68f7;
	 outline: 1px ridge #1f247f;


}

	img.cloudcarousel:hover {
    filter: alpha (Opacity=70);  /* прозрачность для IE */
    opacity: 0.7;    /* прозрачность для других браузеров */
	}
/*--- ВЫПАДАЮЩИЕ ПУНКТЫ ---*/
.carousel1 ul{
  background: #12166c;
  min-width: 20em;
  padding: 5px;
  border-radius: .2em .2em .2em .2em;
   border: 1px solid #165cdb;
 /*--- ширина ---*/  
   width:21%;
   margin-top:1%;
   z-index:10001;
	list-style:none;
	position:absolute;
	left:-9999px; /* Скрываем за экраном, когда не нужно (данный метод лучше, чем display:none;) */
	opacity:0; /* Устнавливаем начальное состояние прозрачности */
	-webkit-transition:0.75s linear opacity; /* В Webkit выпадающие пункты будут проявляться */
}
.carousel1 ul li{
	padding-top:1px; /* Вводим отступ между li чтобы создать иллюзию разделенных пунктов меню */
	float:none;

}
.carousel1 ul b{
	white-space:nowrap; /* Останавливаем перенос текста и создаем многострочный выпадающий пункт */
	display:block;
	font: bold  175%;
	color: #a3a8fb;
}
.carousel1 ul a{
	white-space:nowrap; /* Останавливаем перенос текста и создаем многострочный выпадающий пункт */
	display:block;
}
.carousel1 li:hover ul{ /* Выводим выпадающий пункт при наведении курсора */
     position:relative;

	left:-11%; /* Приносим его обратно на экран, когда нужно */
	opacity:1; /* Делаем непрозрачным */
}
.carousel1 ul:hover b{ /* Устанавливаем стили для верхнего уровня, когда выводится выпадающий список */

	 /* Выглядит полупрозрачным */
	  background: #12166c;
 
    border-bottom: 1px solid #165cdb;
	text-decoration:underline;
	text-decoration:none;
	-webkit-transition:-webkit-transform 0.075s linear;
	        font-size: 16px;
        font-weight: 100;
        color: #5f68f7; 
}
.carousel1:hover ul b{ /* Изменяем некоторые стили верхнего уровня при выводе выпадающего пункта */
	text-decoration:none;
	text-align: center;
	padding:inherit;
	  border-bottom: 1px solid #165cdb;
	-webkit-transition:-webkit-transform 0.075s linear;
	        font-size: 16px;
	font: bold  175%; 
        font-weight: 100;
    	  text-shadow:  1px 1px 2px #165cdb;


}
.carousel1 li:hover a{ /* Устанавливаем стили для верхнего уровня, когда выводится выпадающий список */

	  background: #12166c;
	  border-bottom: 1px solid #165cdb;
 	text-decoration:underline;
}
.carousel1 li:hover ul a{ /* Изменяем некоторые стили верхнего уровня при выводе выпадающего пункта */
	text-decoration:none;
	-webkit-transition:-webkit-transform 0.075s linear;
	        font-size: 16px;
	
        font-weight: 100;
        color: #878efa;

}
.carousel1 li:hover ul li a:hover{ /* Устанавливаем стили для выпадающих пунктов, когда курсор наводится на конкретный пункт */
	background:#080c4a;
	background:rgba(8,12,74,0.75); /* Будет полупрозрачным */
	  text-shadow:  1px 1px 1px #165cdb;

	
}

.butLeft   {
		position:absolute;
		top:6%;
		left:45%;
		padding:5px;
        background: #12166c;
        border-radius: 3px;
		-moz-border-radius:3px;
		-webkit-border-radius:3px;
        display: block;
        padding: 10px 7px;
		border: 1px solid #165cdb;
		width: 40px;
        height: 3px;
  			    }
    .butLeft .bar{
        display: block;
		float:left;
        width: 18px;
        margin-bottom: 3px;
        height: 2px;
        background-color: #165cdb;
        border-radius: 1px;
		-moz-border-radius:1px;
		-webkit-border-radius:1px;
	}
	.butRight   {
		position:absolute;
		top:6%;
		left:50%;
		padding:5px;
        background: #12166c;
        border-radius: 3px;
		-moz-border-radius:3px;
		-webkit-border-radius:3px;
        display: block;
        padding: 10px 7px;
		border: 1px solid #165cdb;
		width: 40px;
        height: 3px;
  			    }
    .butRight .bar{
        display: block;
		float:right;
        width: 18px;
        margin-bottom: 3px;
        height: 2px;
        background-color: #165cdb;
        border-radius: 1px;
		-moz-border-radius:1px;
		-webkit-border-radius:1px;
	}