
/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 04 - OUR TEAM*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
.team {width: 100%; position: relative; float: left; text-align: center;padding-bottom: 75px;}
.team .team-title {position: relative; float: none; display: inline-block; padding: 120px 0px 40px;}
.team-title h4 {padding-top: 10px;}
.block-team {text-align: center; width: 100%; float: left; cursor: pointer;}
.block-team .button-img {position: relative; display: inline-block; float: none; margin-bottom: 10px; white-space: nowrap; font-size: 16px; border:0px;}

.team-info {position: relative; width: 100%; float: left; text-align: center; padding-bottom: 50px;}
.team-info ul {float: none; position: relative; display: inline-block; text-align: center; padding: 20px 0px 16px;}
.team-info ul li span {font-weight:700;}
.team-info ul li {font-size: 13px; line-height: 30px; text-transform: uppercase;}

.team-info .follow-icon {position: relative; float: none; width: 100%; display: inline-block;}
.sicon {position:relative; margin: 0px 8px;}
.sicon img {position: relative; width: 20px; height: 20px; transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} 
.sicon .roll{position:absolute; left:0px; top:0px; opacity:0; width: 20px; height: 20px;}

.team-bg {text-align: center; position: relative; float: left; width: 100%;}
.man-img {position: relative; width: 100%;}
.man-img img {position: absolute; bottom: 0px; left:0px;transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;}
.layer-team {opacity: 0;}
.block-team:hover .layer-black{opacity: 0;}
.block-team:hover .layer-team {opacity: 1; z-index: 14;}
.layer-team.view {opacity: 1; z-index: 14;}
.layer-black.view {opacity: 1; z-index: 10;}

.team-click {text-align: center; width: 569px; height: 265px; position: absolute; top:108px; left: 0px; background: url('../img/orange_pattern.png'); visibility: hidden;
    transform: translate3d(-100%, 0, 0) rotateY(-90deg);
    -webkit-transform: translate3d(-100%, 0, 0) rotateY(-90deg);
    -moz-transform: translate3d(-100%, 0, 0) rotateY(-90deg);
    -o-transform: translate3d(-100%, 0, 0) rotateY(-90deg);
    -ms-transform: translate3d(-100%, 0, 0) rotateY(-90deg);
    transform-origin: 100% 50%;
    -webkit-transform-origin: 100% 50%;
    -moz-transform-origin: 100% 50%;
    -o-transform-origin: 100% 50%;-ms-transform-origin: 100% 50%;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;   
}
.team-click ul {position: relative; float: right; text-align: center; padding: 50px 60px 45px 60px;}
.team-click ul li {font-size: 14px; line-height: 34px; text-transform: uppercase;}
.team-click.slide {z-index: 5;visibility: visible;-webkit-transition: -webkit-transform 0.5s;transition: transform 0.5s;transform: translate3d(0%, 0, 0) rotateY(0deg);}
.team-click-left {text-align: center; width: 569px; height: 265px; position: absolute; top:108px; left: -250px; background: url('../img/orange_pattern.png'); visibility: hidden;
    transform: translate3d(-100%, 0, 0) rotateY(90deg);
    -webkit-transform: translate3d(-100%, 0, 0) rotateY(90deg);
    -moz-transform: translate3d(-100%, 0, 0) rotateY(90deg);
    -o-transform: translate3d(-100%, 0, 0) rotateY(90deg);
    -ms-transform: translate3d(-100%, 0, 0) rotateY(90deg);
    transform-origin: 100% 50%;
    -webkit-transform-origin: 100% 50%;
    -moz-transform-origin: 100% 50%;
    -o-transform-origin: 100% 50%;
    -ms-transform-origin: 100% 50%;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
}
.team-click-left ul {position: relative; float: left; text-align: center; padding: 50px 0px 45px 60px;}
.team-click-left ul li {font-size: 14px; line-height: 34px; text-transform: uppercase;}
.team-click-left.slide {z-index: 5;visibility: visible;-webkit-transition: -webkit-transform 0.5s;transition: transform 0.5s;transform: translate3d(0%, 0, 0) rotateY(0deg);}

.team-click-left .close-info {display: none; position:relative; float: none; height: 35px;}
.team-click .close-info {display: none; position:relative; float: none; height: 35px;}
.close-info img {position: absolute; top: 0px;width: 35px;height: 35px; cursor: pointer; left: 50%;
margin-left: -17px;}


/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 09 - MEDIA QURIES*/
/*-------------------------------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 1199px) {
    .team-click.slide {width: 100%; top: 62px; height: 360px; z-index: 20;cursor: default;}
    .team-click ul {float: none; padding: 50px 0px;}
    .team-click .close-info {display: inline-block; cursor: pointer;}
    .team-click-left.slide {width: 100%; top: 62px; height: 360px; left: 0px; z-index: 20;cursor: default;}
    .team-click-left ul {float: none; padding: 50px 0px;}
    .team-click-left .close-info {display: inline-block;}
    .layer-black{opacity: 0; display: none;}
    .layer-team {opacity: 1;}
    .block-team:hover .layer-black{opacity: 0;display: none;}
    .block-team:hover .layer-team {opacity: 1!important; z-index: 10;}
}


@media screen and (max-width: 768px) {
    .team {padding-bottom: 55px;}
    .team .block-team {position: relative; display: inline-block; float: none;width: 270px;}
    .team .team-title {padding-top: 86px;}
    .sicon {margin: 0px 17px;}
  
  
}

/*==================================*/
/* no animation */
/*==================================*/
