.stories-section{
position: relative;
padding: 110px 0px 80px;
background-attachment: fixed;
background-repeat: no-repeat;
background-position: center center;
}
.stories-section .auto-container{
position:relative;
}
.stories-section:before{
position: absolute;
content: '';
left: 0px;
top: 0px;
width: 100%;
height: 100%;
display: block;
background-color: rgba(68,57,134,0.90);
}
.stories-section .title-column{
position: relative;
margin-bottom: 30px;
}
.stories-section .title-column .inner-column{
position: relative;
}
.stories-section .title-column .sec-title{
position: relative;
margin-bottom: 25px;
}
.stories-section .title-column .inner-column .text{
position: relative;
color:#cccccc;
font-size: 16px;
line-height: 1.7em;
}
.stories-section .blocks-column,
.stories-section .blocks-column .owl-carousel,
.stories-section .blocks-column .owl-carousel .owl-stage,
.stories-section .blocks-column .owl-carousel .owl-stage-outer{
position:static;
}
.stories-section .owl-nav{
display:none;
}
.stories-section .owl-dots{
position:absolute;
left: 15px;
bottom: 190px;
}
.stories-section .owl-dots .owl-dot{
position:relative;
width:10px;
height:8px;
margin:0px 5px;
display:inline-block;
border-radius:50%;
background-color:#cccccc;
transition:all 0.3s ease;
-moz-transition:all 0.3s ease;
-webkit-transition:all 0.3s ease;
-ms-transition:all 0.3s ease;
-o-transition:all 0.3s ease;
}
.stories-section .owl-dots .owl-dot:hover,
.stories-section .owl-dots .owl-dot.active{
position:relative;
width:22px;
height:8px;
border-radius:10px;
background-color:var(--theme-color);
} .story-block{
position:relative;
margin-bottom: 30px;
}
.story-block .inner-box{
position: relative;
}
.story-block .inner-box .image{
position: relative;
overflow: hidden;
}
.story-block .inner-box .image::before {
position: absolute;
top: 50%;
left: 50%;
z-index: 1;
display: block;
content: '';
width: 0;
height: 0;
background: rgba(255, 255, 255,.2);
border-radius: 0%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
opacity: 0;
}
.story-block .inner-box:hover .image::before {
-webkit-animation: circle .95s;
animation: circle .95s;
}
.story-block .inner-box .image img{
position: relative;
width:100%;
display: block;
transition: all 500ms ease;
}
.story-block .inner-box .image img{
transform: scale(1.05);
}
.story-block .inner-box .lower-content{
position: relative;
padding-top: 40px;
}
.story-block .inner-box .lower-content h3{
position: relative;
font-size: 22px;
font-weight: 600;
line-height: 1.4em;
margin-bottom: 10px;
}
.story-block .inner-box .lower-content h3 a{
position: relative;
color:#ffffff;
transition:all 0.3s ease;
-moz-transition:all 0.3s ease;
-webkit-transition:all 0.3s ease;
-ms-transition:all 0.3s ease;
-o-transition:all 0.3s ease;
}
.story-block .inner-box .lower-content .text{
position: relative;
color:#cccccc;
font-size: 16px;
line-height: 1.8em;
margin-bottom: 25px;
}
.story-block .inner-box .lower-content .read-more{
position: relative;
color: var(--theme-color);
font-size: 13px;
font-weight: 700;
padding-right: 30px;
text-transform: uppercase;
display: inline-block;
}
.story-block .inner-box .lower-content h3 a:hover{
color:var(--theme-color);
}
.story-block .inner-box .lower-content .read-more .fa{
position: relative;
font-weight: 600;
margin-right: 4px;
color:#ffffff;
top: -2px;
}