.slider-container {
width: 100%;
height: 600px;
position: relative;
overflow: hidden;
}

.slider {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
list-style: none;
}

.slide {
position: absolute;
top: 0;
left: 0;
width: 100%;
}

.slide-bg {
position: relative;
overflow: hidden;
z-index: 1;
}

.slide-bg img {
width: 100%;
height: auto;
display: block;
}

.slide-content {
position: absolute;
top: 0;
width: 100%;
z-index: 2;
color: white;
padding: 5% 0 0 15%;
text-shadow: 0 1px 2px rgba(0,0,0,0.1);
}

.slide-content h2 {
font-size: 52px;
width: -moz-fit-content;
margin: 0 0 10px;
text-transform: uppercase;
font-family: 'Poppins', sans-serif;
-webkit-transition: all 0.2s ease;
background: #50aab2;
width: fit-content;
color: #fff;
padding: 14px;
}

.slide-content p {
font-size: 20px;
margin: 0 0 30px;
-webkit-transition: all 0.2s ease;
}

.slide-content a {
color: #333;
padding: 10px;
line-height: 1;
background: white;
border-radius: 3px;
display: inline-block;
text-decoration: none;
-webkit-transition: all 0.2s ease;
}

.slider-controls {
position: absolute;
top: 0;
width: 100%;
height: 100%;
}

.slide-nav {

}

.slide-nav .prev,
.slide-nav .next {
	position: absolute;
    top: 50%;
    z-index: 10;
    color: white;
    background: #000000a6;
    padding: 8px 16px;
}

.slide-nav .prev {
left: 20px;
}

.slide-nav .next {
right: 20px;
}

.slide-list {
position: absolute;
bottom: 10%;
z-index: 10;
margin: 0;
padding: 0;
width: 100%;
list-style: none;
text-align: center;
}

.slide-list li {
margin: 0 10px;
display: inline-block;
}

.slide-list li a {
opacity: 0.7;
width: 15px;
height: 15px;
display: block;
background: white;
border-radius: 20px;
text-indent: -9999px;
}

.slide-list li.active a {
opacity: 1;
}

.slide-list li a:hover {
opacity: 1;
}

@media only screen and (max-width: 640px) {
.slide-content {
    padding: 35px 12px 0;
    text-align: center;
}
.slide-content h2 {
    font-size: 13px;
    line-height: 0;
}
.slide-content p {
    font-size: 14px;
    margin: 0 0 10px;
    text-align: left;
}
.slide-content a {
    float: left;
}
}