?? GreyFile — Mystic File Browser

Current path: home/webdevt/www/wdp/wp-content/themes/quadric/assets/css/scss/modules/shortcodes/


?? Go up: /home/webdevt/www/wdp/wp-content/themes/quadric/assets/css/scss/modules

?? Viewing: _team.scss

/* ==========================================================================
# Team style - begin
========================================================================== */

/* Team type main info on hover - begin
========================================================================== */

.edgtf-team.main-info-on-hover {

	&:not(.main-info-below-image) {
		overflow:hidden;
	}

	.edgtf-team-inner {
		overflow:hidden;
		width: 100%;
	}

	.edgtf-team-image {
		position:relative;
		overflow: hidden;

		img {
			width: 100%;
			vertical-align: middle;
		}

	}

	.edgtf-team-name,
	.edgtf-team-position {
		color: #fff;
	}

	.edgtf-team-position {
		padding-top: 21px;
	}

	.edgtf-team-description {
		display: table;
		width: 100%;
		height: 100%;
	}

	.edgtf-team-text {
		padding: 20px 0 20px;
	}

	.edgtf-team-social-wrapp {
		margin: 17px 0;
	}

	.edgtf-team-title-holder {
		padding: 18px 0;
	}

	.edgtf-team-social {
		display: table;
		width: 100%;
		height: 100%;
		opacity:0;
		@include edgtfTransition(opacity .3s ease-out);
		.edgt_icon_ion_icon:before,
		.edgt_icon_linea_icon:before {
			line-height: inherit;
		}

	}

	.edgtf-team-social-inner {
		display: table-cell;
		vertical-align: middle;
		text-align: center;
		position: relative;
	}

	.edgtf-team-social-holder {
		position: absolute;
		height: 100%;
		width: 100%;
		left:0;
		top: 0;		
		display:table-cell;
		vertical-align: middle;
		background-color: rgba(13, 45, 50, 0);;
		@include edgtfTransition(background-color 0.3s ease-out);
		@include edgtfTransform(translateZ(0px));

		.social_icon {
			font-size: inherit;
			line-height: inherit;
		}

		.social_icon {
			display: block;

			&:before{
				display: block;
			}

		}

		.edgtf-icon-shortcode:not(:last-child){
			margin-right:21px;
		}

		.edgtf-icon-shortcode{
			border-radius:4px;
			vertical-align:middle;
			background-color:#fff;

			&:hover {
				background-color: $first-main-color;

				.edgtf-icon-element{
					color: #fff;
				}
			}

			.edgtf-icon-element{
				color:rgba(49, 61, 68, 1);
			}
		}

	}

	&:hover {

		.edgtf-team-social-holder{
			background-color:rgba(13, 45, 50, 0.9);			
		}

		.edgtf-team-social{
			opacity:1;
		}

	}

}

.touch .edgtf-team .edgtf-team-social-holder {
	cursor: pointer;
}

/* Team type main info on hover - end
========================================================================== */

/* Team type main info below image - begin
========================================================================== */

.edgtf-team.main-info-below-image {
	-webkit-transform: translateZ(0);

	.edgtf-team-info {

		.edgtf-team-name {
			color: #1a3545;
			margin-top:40px;
			margin-bottom: 20px;
		}

		.edgtf-team-position {
			color: #1a3545;
		}

	}

	.edgtf-team-image {
		overflow: visible;
		position:relative;

		img{
			vertical-align:middle;
		}
	}

	.edgtf-team-social-holder-between{
		text-align:center;
		position:absolute;
		width:100%;
		height:100%;
		top:0;
		left:0;
		background-color:rgba(49, 61, 68, 0);		
		@include edgtfTransition(background-color .3s ease-out);
	}

	.edgtf-team-social{
		position:relative;
		display:inline-block;
		top:50%;		
		@include edgtfTransform(translateY(-50%));
		opacity:0;
		@include edgtfTransition(opacity .3s ease-out);

		.edgtf-icon-shortcode:not(:last-child){
			margin-right:21px;
		}

		.edgtf-icon-shortcode{
			border-radius:4px;
			vertical-align:middle;
			background-color:#fff;

			.edgtf-icon-element{
				color:rgba(49, 61, 68, 1);
			}
		}
	}

	.edgtf-team-social-wrapp ul {
		list-style: none;
		position: relative;
		display: block;
		z-index: 990;
	}

	.edgtf-team-social-wrapp ul li{

		&:first-child {
			bottom: 56px; /* social share icon + space between icons */
			transition-delay: .5s;
		}

		&:nth-child(2) {
			bottom: 102px; /* previous icon position + icon height + space between icons */
			transition-delay: .4s;
		}

		&:nth-child(3) {
			bottom: 148px;  /* previous icon position + icon height + space between icons */
			transition-delay: .3s;
		}

		&:nth-child(4) {
			bottom: 194px;  /* previous icon position + icon height + space between icons */
			transition-delay: .2s;
		}

		&:nth-child(5) {
			bottom: 240px;  /* previous icon position + icon height + space between icons */
			transition-delay: .1s;
		}

	}

	.edgtf-team-social.normal-social .edgtf-team-social-wrapp ul li {

		position: absolute;
		bottom: 0;
		left: 0;
		text-align: center;
		opacity: 0;
		-webkit-transition: opacity .03s ease-out, position .1s ease-out;
		transition:  opacity .03s ease-out, position .1s ease-out;

		&:first-child {
			bottom: 50px;
		}

		&:nth-child(2) {
			bottom: 90px;
		}

		&:nth-child(3) {
			bottom: 130px;
		}

		&:nth-child(4) {
			bottom: 170px;
		}

		&:nth-child(5) {
			bottom: 210px;
		}

	}

	.edgtf-team-info {
		margin-top: 20px;
	}

	.edgtf-team-info {
		margin-top: 0;
	}

	.edgtf-team-text {
		padding: 0;
	}

	&:hover {

		.edgtf-team-social-wrapp ul li {
			opacity: 1;
			cursor: pointer;

			&:first-child {
				transition-delay: .1s;
			}

			&:nth-child(2) {
				transition-delay: .2s;
			}

			&:nth-child(3) {
				transition-delay: .3s;
			}

			&:nth-child(4) {
				transition-delay: .4s;
			}

			&:nth-child(5) {
				transition-delay: .5s;
			}

		}

		.edgtf-team-social-holder-between{
			background-color:rgba(49, 61, 68, 0.75);
		}

		.edgtf-team-social{
			opacity:1;
		}

	}

}

/* Team type main info below image - end
========================================================================== */

/* ==========================================================================
# Team style - end
========================================================================== */

??

??