@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700,900,300italic,400italic,700italic,900italic);
.animsition-loading:after{position:fixed;top:50%;width:100%;margin-top:40px;font-size:18px;text-align:center;
content:"THE PRIDE";letter-spacing:5px;font-weight:900;font-family:'Roboto Condensed',sans-serif}
*,::after,::before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.clearfix:before{display:table;content:" "}.clearfix:after{clear:both;width:0;height:0}

.animated-item{
position:relative;width:25%;
padding:20px;
display:table;
float:left;
overflow:hidden;
text-align:center;
transition:background .2s linear 0s;
-webkit-transition:background .2s linear 0s;
-moz-transition:background .2s linear 0s;-o-transition:background .2s linear 0s;-ms-transition:background .2s linear 0s;
-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;
background-size:cover
}

.animated-item:hover{background-color:#212121;color:#fff}
.animated-item:hover .side-line:after,.animated-item:hover .side-line:before{border-color:#fff}
.animated-item:hover .section-title-1 h2::after{background-color:#fff}
.ai-cell{display:table-cell;
position:relative;
vertical-align:middle;
text-align:center;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover}

.ai-inner{position:relative;overflow:hidden;max-height:100%}
.ai-intro{
position:relative;
-webkit-transition:all .27s cubic-bezier(0,0,.58,1);
-moz-transition:all .27s cubic-bezier(0,0,.58,1);
-o-transition:all .27s cubic-bezier(0,0,.58,1);
-ms-transition:all .27s cubic-bezier(0,0,.58,1);
transition:all .27s cubic-bezier(23,17,22,17)
}
.ai-icon{margin-bottom:10px;font-size:30px; color:#00adbb;}
.animated-item:hover .ai-icon {color:#ffffff}



.ai-descr{
opacity:0;
position:relative;
font-weight:400;
font-family: Raleway,sans-serif;
font-size:14px;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover;
-webkit-transform-origin:50% 50%;
-moz-transform-origin:50% 50%;
-o-transform-origin:50% 50%;
-ms-transform-origin:50% 50%;
transform-origin:50% 50%;
-webkit-transform:perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
-moz-transform:perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
-o-transform:perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
-ms-transform:perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
transform:perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
-webkit-transition:all .27s cubic-bezier(0,0,.58,1);
-moz-transition:all .27s cubic-bezier(0,0,.58,1);-o-transition:all .27s cubic-bezier(0,0,.58,1);-ms-transition:all .27s cubic-bezier(0,0,.58,1);
transition:all .27s cubic-bezier(1,0,.58,1)
}
.no-mobile .animated-item:hover .ai-intro{opacity:0;transform:scale(0);-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);-ms-transform:scale(0)}
.no-mobile .animated-item:hover .ai-descr{
opacity:1;
-webkit-transform:perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
-moz-transform:perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
-o-transform:perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
-ms-transform:perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
transform:perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg)
}


.page-section {
    background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    box-sizing: border-box;
    display: block;
    overflow: hidden;
    position: relative;
    width: 100%;
	padding: 20px 0;
}

.fontalt4 {
    font-family:Raleway,sans-serif;
}
.hs1 {
    font-size: 20px;
    line-height: 22px;
	font-weight: bold;
}

.animated-item:hover h3{

color:#ffffff;
}

@media only screen and (max-width:767px){.animated-item{width:100%}}