Directory:~$ /proc/self/root/home/lmsyaran/public_html/j3/templates/g5_hydrogen/custom/scss/

Upload File

[Home] [System Details] [Kill Me]

// Set the variable defaults in case they are missing in the template
$base-title-color: #4d4d4d !default;

.g-hotspots {
	margin-left: -($content-padding);
	margin-right: -($content-padding);
	.g-hotspots-left {
		.g-content {
			margin: 0 $content-margin 0 0;
			padding-top: 0;
			padding-bottom: 0;
		}
		@include breakpoint(mobile-only) {
			margin-bottom: 40px;
		}
	}
	.g-hotspots-right {
		.g-content {
			margin: 0 0 0 $content-margin;
			padding-top: 0;
			padding-bottom: 0;
		}
		&.align-right {
			text-align: right;
		}
	}
	.image-block {
		text-align: center;
	}
	.image-bottom {
		margin-bottom: -($content-margin + $content-padding + $section-padding);
		@include breakpoint(mobile-only) {
			margin-bottom: 0;
		}
	}
	.g-block {
		&:not(.image-block) {
			text-align: center;
		}
	}
	.g-hotspots-container {
		position: relative;
		display: inline-block;
		ul {
			margin: 0;
			list-style: none;
		}
	}
	.g-hotspots-item-toggle {
		border: 3px solid rgba(255, 255, 255, 0.2);
		border-radius: 50%;
		cursor: pointer;
		box-shadow: 0 2px 7px rgba(0, 0, 0, 0.5);
		display: inline-block;
		span {
			border-radius: 50%;
			width: 22px;
			height: 22px;
			line-height: 22px;
			text-align: center;
			background: $base-title-color;
			color: #ffffff;
			font-size: 12px;
			@include transition(all 0.2s);
		}
		&:hover {
			span {
				background: lighten($base-title-color, 20%);
			}
		}
	}
	.g-hotspots-item {
		position: absolute;
		&.uk-active {
			.g-hotspots-item-toggle {
				span {
					background: $accent-color-1;
				}
			}
		}
	}
	.g-hotspots-item-image {
		display: inline-block;
		border: 5px solid #ffffff;
		border-radius: 50%;
		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.22);
		margin-bottom: 25px;
		overflow: hidden;
		img, .uk-overlay-panel {
			width: 270px;
			height: 270px;
			border-radius: 50%;
			@include breakpoint(small-mobile-range) {
				width: 220px;
				height: 220px;
			}			
		}
		img {
			@include transition(all 1s);
		}
		.uk-overlay-panel {
			z-index: 2;
		}
	}
	.g-hotspots-title {
		margin: 0;
		a {
			color: $base-title-color;
			&:hover {
				color: $accent-color-1;
			}
		}
	}
	.g-hotspots-desc {
		margin-top: 20px;
	}
	.g-hotspots-special {
		font-style: italic;
		margin-top: 30px;
		@include breakpoint(small-mobile-range)  {
			float: none;
		}
		@include breakpoint(tablet-range) {
			float: none;
		}
		i {
			margin-right: 8px;
		}
	}
	.g-hotspots-link {
		//float: right;
		margin-top: 30px;
		@include breakpoint(small-mobile-range) {
			float: none;
			margin-top: 5px;
		}
		@include breakpoint(tablet-range) {
			float: none;
			margin-top: 5px;
		}
	}
	&.big-special {
		.g-hotspots-special {
			font-size: 26px;
			font-style: normal;
			font-weight: 600;
		}
	}
	.g-hotspots-content {
		&:hover {
			.g-hotspots-item-image {
				img {
					@include transform(scale(1.15));
				}
			}
		}
	}
}