.slider{
position:relative;
}
.slider > .item{
position: absolute;
opacity: 0;
z-index: 0;
width:100%;
height: 100%;
top:0;
left:0;
overflow:hidden;
background-repeat: no-repeat !important;
background-size: cover !important;
}
.slider > .item.active{
opacity: 1;
z-index:10;
}
.slider .slider-control {
color: #000;
position: absolute;
top: calc(50% - 30px);
height: 60px;
width: 60px;
line-height: 60px;
z-index: 100;
text-align: center;
cursor: pointer;
background: #ffce10;
border-radius: 50%;
transition: 0.4s all ease;
box-shadow: 0px 1px 4px #00000045;
}
.slider .slider-control:hover{
background: #000;
color: #fff;
}
.slider .slider-control:hover{
opacity: 1;
}
.slider .slider-control.next{
right:15px;
}
.slider .slider-control.prev{
left:15px;
}
.slider .slider-nav{
width:100%;
height: 40px;
position: absolute;
z-index: 100;
text-align:center;
bottom:0;
left:0;
}
.slider .slider-nav a{
display: inline-block;
margin:5px;
width:15px;
height:15px;
background: rgba(255,255,255,.6);
overflow: hidden;
border-radius:50%;
opacity: .5;
box-shadow: 0px 1px 4px #00000045;
}
.slider .slider-nav a:hover{
opacity: .9;
}
.slider .slider-nav a.active{
background: #ffce10;
opacity: 1;
}   .slider .item.active .item-content {
animation-name: fadeUp;
animation-duration: 0.5s;
}
.slider .item.active .item-content p {
animation-name: fadeUp;
animation-duration: .8s;
}
@keyframes fadeUp {
0% {
margin-top: 60px;
opacity: 0;
}
100% {
margin-top: 0;
opacity: 1;
}
} body {
background: #333;
color: #fff;
font-family: sans-serif;
transition: background 2s;
}
.slider {
min-height: 563px;
background: #fff;
color: #000;
box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.8);
}
.slider > .item {
text-align: center;
}
.search-bloc{
position: absolute;
z-index: 99;
bottom: 0;
left: 0;
right:0;
}