#slider-wrap{ /* Оболочка слайдера и кнопок */
	/*width:660px; */
	}
#slider,
#slider1,
#slider2{ /* Оболочка слайдера */
	width:640px;
	height:360px;
	overflow: hidden;
	border:#eee solid 10px;
	position:relative;
margin: 0px auto;
}
.slide,
.slide1,
.slide2{ /* Слайд */
	width:100%;
	height:100%;
    text-align: center;
	}
.sli-links,
.sli-links1,
.sli-links2{ /* Кнопки смены слайдов */
	margin-top:10px;
	text-align:center;}
.sli-links .control-slide,
.sli-links1 .control-slide1,
.sli-links2 .control-slide2{
	margin:2px;
	display:inline-block;
	width:16px;
	height:16px;
	overflow:hidden;
	text-indent:-9999px;
	background:url(/wp-content/themes/premiumfoto/js/hwSlider/radioBg.png) center bottom no-repeat;}
.sli-links .control-slide:hover,
.sli-links1 .control-slide1:hover,
.sli-links2 .control-slide2:hover{
	cursor:pointer;
	background-position:center center;}
.sli-links .control-slide.active,
.sli-links1 .control-slide1.active,
.sli-links2 .control-slide2.active{
	background-position:center top;}
#prewbutton, #nextbutton,
#prewbutton1, #nextbutton1,
#prewbutton2, #nextbutton2{ /* Ссылка "Следующий" и "Педыдущий" */
	display:block;
	width:15px;
	height:100%;
	position:absolute;
	top:0;
	overflow:hidden;
	text-indent:-999px;
	background:url(/wp-content/themes/premiumfoto/js/hwSlider/arrowBg.png) left center no-repeat;
	opacity:0.8;
	z-index:3;
	outline:none !important;}
#prewbutton,#prewbutton1,#prewbutton2{left:10px;}
#nextbutton,#nextbutton1,#nextbutton2{
	right:10px;
	background:url(/wp-content/themes/premiumfoto/js/hwSlider/arrowBg.png) right center no-repeat;}
#prewbutton:hover, #nextbutton:hover,
#prewbutton1:hover, #nextbutton1:hover,
#prewbutton2:hover, #nextbutton2:hover{
	opacity:1;}

.hovergallery img{
	-webkit-transform:scale(0.8); /*Webkit: уменьшаем размер до 0.8*/
	-moz-transform:scale(0.8); /*Mozilla: масштабирование*/
	-o-transform:scale(0.8); /*Opera: масштабирование*/
	-webkit-transition-duration: 0.5s; /*Webkit: длительность анимации*/
	-moz-transition-duration: 0.5s; /*Mozilla: длительность анимации*/
	-o-transition-duration: 0.5s; /*Opera: длительность анимации*/
	opacity: 1; /*Начальная прозрачность изображений*/
	margin: 0 10px 5px 0; /*Интервалы между изображениями*/
	z-index: 9;
}

.hovergallery img:hover{
	-webkit-transform:scale(1.5); /*Webkit: увеличиваем размер до 1.2x*/
	-moz-transform:scale(1.5); /*Mozilla: масштабирование*/
	-o-transform:scale(1.5); /*Opera: масштабирование*/
	box-shadow:0px 0px 30px gray; /*CSS3 тени: 30px размытая тень вокруг всего изображения*/
	-webkit-box-shadow:0px 0px 30px gray; /*Webkit: тени*/
	-moz-box-shadow:0px 0px 30px gray; /*Mozilla: тени*/
	opacity: 1;
	z-index: 9999;
}






$gray: #333;
$gray-light: #aaa;
$gray-lighter: #eee;
$space: 40px;
$blue: #428bca;
$blue-dark: darken($blue, 5%);

// Mixin for transition/transform
@mixin translate($x, $y) {
  -webkit-transform: translate($x, $y);
      -ms-transform: translate($x, $y); // IE9+
          transform: translate($x, $y);
}
@mixin transition($transition) {
  -webkit-transition: $transition;
          transition: $transition;
}
@mixin transition-transform($transition) {
  -webkit-transition: -webkit-transform unquote($transition);
     -moz-transition: -moz-transform unquote($transition);
       -o-transition: -o-transform unquote($transition);
          transition: transform unquote($transition);
}

.btn{
  background: $blue;
  border: $blue-dark solid 1px;
  border-radius: 3px;
  color: #fff;
  display: inline-block;
  font-size: 14px;
  padding: 8px 15px;
  text-decoration: none;
  text-align: center;
  min-width: 60px;
  position: relative;
  transition: color .1s ease;
  
  &:hover{
    background: $blue-dark;
  }
  
  &.btn-big{
    font-size: 18px;
    padding: 15px 20px;
    min-width: 100px;
  }
  
}

.btn-close{
  color: $gray-light;
  font-size: 30px;
  text-decoration: none;
  position: absolute; right: 5px; top: 0;
  
  &:hover{
     color: darken($gray-light, 10%);
  }
  
}

.modal{
  
  // This is modal bg
  &:before{
    content: ""; 
    /*display: none;*/
    background: rgba(0,0,0,0); 
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0; 
    z-index: -1;
    
  }
  
  &:target{
    
    // Active animate in modal
    &:before{
      @include transition-transform("0.9s ease-out");
    z-index:10;  
    background: rgba(0,0,0,.6); 
      /*display: block;*/
    } 
  }
  
}
.modal:target + .modal-dialog{
      @include translate(0, 0);
      top: 20%;  
    }



.modal-dialog{
  background: #fefefe;
  border: $gray solid 1px;
  border-radius: 5px;
  margin-left: -200px;
  position: fixed; 
  left: 50%; 
  top: -100%;  
  z-index: 11; 
  width: 360px;
  @include translate(0, -500%);
  @include transition-transform("0.3s ease-out");
}

.modal-body{
  padding: $space/2;
}

.modal-header,
.modal-footer{
  padding: $space/4 $space/2;
}

.modal-header{
  border-bottom: $gray-lighter solid 1px;
  
  h2{
    font-size: 20px;
  }
  
}

.modal-footer{
  border-top: $gray-lighter solid 1px;
  text-align: right;
}