height: auto;
padding: 0 0.625rem 1.25rem; }
-.gallery .ngg-gallery-thumbnail, .gallery .ngg-gallery-thumbnail-box {
- float: none; }
-.gallery li a img {
- display: block;
- width: 100%;
- border-radius: 4px; }
-.gallery .ngg-gallery-thumbnail, .gallery .ngg-gallery-thumbnail-box {
- float: none; }
-.gallery .ngg-album-compact h4 .ngg-album-desc {
- height: auto;
- font-family: Georgia, Cambria, "Times New Roman", Times, serif;
- font-weight: 400; }
-.gallery .ngg-album-compact .album-meta-wrapper h4 a {
- font-style: normal; }
-.gallery .album-meta-wrapper {
- display: block;
- height: 54px;
- margin-bottom: 20px; }
-.gallery .ngg-glmalbums {
- margin: 10px 0; }
-.gallery .ngg-fancybox .image_overlay {
- cursor: pointer;
- -webkit-transition: background 0.3s linear;
- -moz-transition: background 0.3s linear;
- -ms-transition: background 0.3s linear;
- -o-transition: background 0.3s linear;
- transition: background 0.3s linear;
- background-image: url("../assets/portfolio-overlay.png");
- background-size: cover;
- background-repeat: no-repeat;
- background-position: center; }
-.gallery .ngg-fancybox:hover img {
- opacity: 0.3; }
-.gallery .ngg-fancybox .photoTitle {
- color: #0568b3;
- font-weight: bold;
- max-width: 220px; }
-.gallery .ngg-fancybox .photoHead {
- color: white;
- font-style: normal;
- text-decoration: none;
- max-width: 220px; }
-.gallery .ngg-fancybox img {
- margin: 0 !important; }
-.gallery #homepage_problem_solvers {
- text-align: center; }
-.gallery .ngg-galleryoverview {
- padding: 20px; }
-.gallery .ngg-gallery-thumbnail span {
- max-width: 220px;
- max-height: 75px; }
-.gallery .ngg-gallery-thumbnail-box {
- border: 1px solid lightgrey;
- border-radius: 4px;
- color: #0568b3;
- background: white;
- font-family: times;
- font-size: 18px;
- /* font-style: italic;*/ }
-.gallery .image_overlay img {
- width: 100%; }
-.gallery #fancybox-title-inside {
- background: #0568b3;
- border-radius: 4px;
- color: white;
- font-family: times;
- font-size: 16px; }
- .gallery #fancybox-title-inside a {
- text-decoration: underline;
+.gallery {
+ margin: 0 auto; }
+ .gallery .ngg-gallery-thumbnail, .gallery .ngg-gallery-thumbnail-box {
+ float: none; }
+ .gallery li a img {
+ display: block;
+ width: 100%;
+ border-radius: 4px; }
+ .gallery .ngg-gallery-thumbnail, .gallery .ngg-gallery-thumbnail-box {
+ float: none; }
+ .gallery .ngg-album-compact h4 .ngg-album-desc {
+ height: auto;
+ font-family: Georgia, Cambria, "Times New Roman", Times, serif;
+ font-weight: 400; }
+ .gallery .ngg-album-compact .album-meta-wrapper h4 a {
+ font-style: normal; }
+ .gallery .album-meta-wrapper {
+ display: block;
+ height: 54px;
+ margin-bottom: 20px; }
+ .gallery .ngg-glmalbums {
+ margin: 10px 0; }
+ .gallery .ngg-fancybox .image_overlay {
+ cursor: pointer;
+ -webkit-transition: background 0.3s linear;
+ -moz-transition: background 0.3s linear;
+ -ms-transition: background 0.3s linear;
+ -o-transition: background 0.3s linear;
+ transition: background 0.3s linear;
+ background-image: url("../assets/portfolio-overlay.png");
+ background-size: cover;
+ background-repeat: no-repeat;
+ background-position: center; }
+ .gallery .ngg-fancybox:hover img {
+ opacity: 0.3; }
+ .gallery .ngg-fancybox .photoTitle {
+ color: #0568b3;
+ font-weight: bold;
+ max-width: 220px; }
+ .gallery .ngg-fancybox .photoHead {
color: white;
- font-style: italic; }
-.gallery .ngg-fancybox {
- margin: 0 !important; }
-.gallery .ngg-fancybox img {
- padding: 0;
- margin: none auto !important;
- width: 100%;
- border: 0; }
-.gallery .slideshowlink {
- display: none; }
-.gallery #fancybox-title {
- position: absolute;
- top: 0;
- padding-top: 10px;
- padding-bottom: 5px; }
- .gallery #fancybox-title #fancybox-title-inside {
- padding: 2px 0; }
-.gallery #fancybox-outer, .gallery #fancybox-left, .gallery #fancybox-right {
- padding-top: 40px; }
+ font-style: normal;
+ text-decoration: none;
+ max-width: 220px; }
+ .gallery .ngg-fancybox img {
+ margin: 0 !important; }
+ .gallery #homepage_problem_solvers {
+ text-align: center; }
+ .gallery .ngg-galleryoverview {
+ padding: 20px; }
+ .gallery .ngg-gallery-thumbnail span {
+ max-width: 220px;
+ max-height: 75px; }
+ .gallery .ngg-gallery-thumbnail-box {
+ border: 1px solid lightgrey;
+ border-radius: 4px;
+ color: #0568b3;
+ background: white;
+ font-family: times;
+ font-size: 18px;
+ /* font-style: italic;*/ }
+ .gallery .image_overlay img {
+ width: 100%; }
+ .gallery #fancybox-title-inside {
+ background: #0568b3;
+ border-radius: 4px;
+ color: white;
+ font-family: times;
+ font-size: 16px; }
+ .gallery #fancybox-title-inside a {
+ text-decoration: underline;
+ color: white;
+ font-style: italic; }
+ .gallery .ngg-fancybox {
+ margin: 0 !important; }
+ .gallery .ngg-fancybox img {
+ padding: 0;
+ margin: none auto !important;
+ width: 100%;
+ border: 0; }
+ .gallery .slideshowlink {
+ display: none; }
+ .gallery #fancybox-title {
+ position: absolute;
+ top: 0;
+ padding-top: 10px;
+ padding-bottom: 5px; }
+ .gallery #fancybox-title #fancybox-title-inside {
+ padding: 2px 0; }
+ .gallery #fancybox-outer, .gallery #fancybox-left, .gallery #fancybox-right {
+ padding-top: 40px; }
/* Styles for specific templates */
-#gallery-glmphotos-light-3 .special a {
- background-position: 50% 50%;
- background-repeat: no-repeat;
- background-origin: border-box;
- display: inline-block;
- width: 100%;
- height: 270px;
- border-width: 135px;
- border-color: transparent;
- border-radius: 100%;
- -moz-border-radius: 100%;
- -webkit-border-radius: 100%;
- -webkit-box-sizing: border-box;
- -moz-box-sizing: border-box;
- box-sizing: border-box;
- -webkit-transition: 0.5s ease;
- -moz-transition: 0.5s ease;
- -ms-transition: 0.5s ease;
- -o-transition: 0.5s ease;
- transition: 0.5s ease; }
-#gallery-glmphotos-light-3 .special a:hover {
- border-width: 0;
- border-color: rgba(0, 0, 0, 0.5); }
-#gallery-glmphotos-light-3 .special .one {
- border-style: solid; }
-#gallery-glmphotos-light-3 .special .two {
- border-style: dashed; }
-#gallery-glmphotos-light-3 .special .three {
- border-style: dotted; }
-#gallery-glmphotos-light-3 .special .yon {
- border: 50px solid rgba(0, 0, 0, 0.7); }
-#gallery-glmphotos-light-3 .special .goo {
- border: 50px dashed rgba(0, 0, 0, 0.7); }
-#gallery-glmphotos-light-3 .special .rok {
- border: 50px dotted rgba(0, 0, 0, 0.7); }
-#gallery-glmphotos-light-3 .special .ryk {
- border: 50px double rgba(0, 0, 0, 0.7); }
-#gallery-glmphotos-light-3 .special .yon:hover {
- border: 1px solid rgba(0, 0, 0, 0.7); }
-#gallery-glmphotos-light-3 .special .goo:hover {
- border: 1px dashed rgba(0, 0, 0, 0.7); }
-#gallery-glmphotos-light-3 .special .rok:hover {
- border: 1px dotted rgba(0, 0, 0, 0.7); }
-#gallery-glmphotos-light-3 .special .ryk:hover {
- border: 1px double rgba(0, 0, 0, 0.7); }
-#gallery-glmphotos-light-3 .special .x7, #gallery-glmphotos-light-3 .special .x8, #gallery-glmphotos-light-3 .special .x9 {
- border-radius: 0;
- -moz-border-radius: 0;
- -webkit-border-radius: 0; }
-#gallery-glmphotos-light-3 .special .x7 {
- border: 50px solid rgba(0, 0, 0, 0.7); }
-#gallery-glmphotos-light-3 .special .x8 {
- border: 50px dashed rgba(0, 0, 0, 0.7); }
-#gallery-glmphotos-light-3 .special .x9 {
- border: 50px dotted rgba(0, 0, 0, 0.7); }
-#gallery-glmphotos-light-3 .special .x7:hover {
- border: 1px solid rgba(0, 0, 0, 0.7); }
-#gallery-glmphotos-light-3 .special .x8:hover {
- border: 1px dashed rgba(0, 0, 0, 0.7); }
-#gallery-glmphotos-light-3 .special .x9:hover {
- border: 1px dotted rgba(0, 0, 0, 0.7); }
+#gallery-glmphotos-light-3 .special {
+ clear: both;
+ max-width: 270px;
+ margin: 0 auto;
+ text-align: center; }
+ #gallery-glmphotos-light-3 .special a {
+ background-position: 50% 50%;
+ background-repeat: no-repeat;
+ background-origin: border-box;
+ display: inline-block;
+ width: 100%;
+ height: 270px;
+ border-width: 135px;
+ border-color: transparent;
+ border-radius: 100%;
+ -moz-border-radius: 100%;
+ -webkit-border-radius: 100%;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ -webkit-transition: 0.5s ease;
+ -moz-transition: 0.5s ease;
+ -ms-transition: 0.5s ease;
+ -o-transition: 0.5s ease;
+ transition: 0.5s ease; }
+ #gallery-glmphotos-light-3 .special a:hover {
+ border-width: 0;
+ border-color: rgba(0, 0, 0, 0.5); }
+ #gallery-glmphotos-light-3 .special .one {
+ border-style: solid; }
+ #gallery-glmphotos-light-3 .special .two {
+ border-style: dashed; }
+ #gallery-glmphotos-light-3 .special .three {
+ border-style: dotted; }
+ #gallery-glmphotos-light-3 .special .yon {
+ border: 50px solid rgba(0, 0, 0, 0.7); }
+ #gallery-glmphotos-light-3 .special .goo {
+ border: 50px dashed rgba(0, 0, 0, 0.7); }
+ #gallery-glmphotos-light-3 .special .rok {
+ border: 50px dotted rgba(0, 0, 0, 0.7); }
+ #gallery-glmphotos-light-3 .special .ryk {
+ border: 50px double rgba(0, 0, 0, 0.7); }
+ #gallery-glmphotos-light-3 .special .yon:hover {
+ border: 1px solid rgba(0, 0, 0, 0.7); }
+ #gallery-glmphotos-light-3 .special .goo:hover {
+ border: 1px dashed rgba(0, 0, 0, 0.7); }
+ #gallery-glmphotos-light-3 .special .rok:hover {
+ border: 1px dotted rgba(0, 0, 0, 0.7); }
+ #gallery-glmphotos-light-3 .special .ryk:hover {
+ border: 1px double rgba(0, 0, 0, 0.7); }
+ #gallery-glmphotos-light-3 .special .x7, #gallery-glmphotos-light-3 .special .x8, #gallery-glmphotos-light-3 .special .x9 {
+ border-radius: 0;
+ -moz-border-radius: 0;
+ -webkit-border-radius: 0; }
+ #gallery-glmphotos-light-3 .special .x7 {
+ border: 50px solid rgba(0, 0, 0, 0.7); }
+ #gallery-glmphotos-light-3 .special .x8 {
+ border: 50px dashed rgba(0, 0, 0, 0.7); }
+ #gallery-glmphotos-light-3 .special .x9 {
+ border: 50px dotted rgba(0, 0, 0, 0.7); }
+ #gallery-glmphotos-light-3 .special .x7:hover {
+ border: 1px solid rgba(0, 0, 0, 0.7); }
+ #gallery-glmphotos-light-3 .special .x8:hover {
+ border: 1px dashed rgba(0, 0, 0, 0.7); }
+ #gallery-glmphotos-light-3 .special .x9:hover {
+ border: 1px dotted rgba(0, 0, 0, 0.7); }
#gallery-glmphotos-light-3 .ngg-gallery-thumbnail-box {
border: none; }
#gallery-glmphotos-light-3 .ngg-gallery-thumbnail {
padding: 10px;
position: relative;
margin-bottom: 10px;
- /*Hover states*/ }
+ /*Hover states*/
+ transition: all 0.1s ease 0s; }
#gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox img {
opacity: 1.0;
- border-radius: 4px; }
- #gallery-glmphotos-light-3 .ngg-gallery-thumbnail:hover {
+ border-radius: 4px;
+ transition: all 1s ease 0s;
+ -webkit-transition: border-radius 1s ease 0s;
+ -moz-transition: border-radius 1s ease 0s;
+ -o-transition: border-radius 1s ease 0s; }
+ #gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox:hover img {
opacity: 0.75;
+ border-radius: 30px;
transition: all 0.5s ease 0s;
- transform: scale(1.025);
- -webkit-transform: scale(1.025);
- -moz-transform: scale(1.025);
- -o-transform: scale(1.025);
- border-radius: 30px; }
- #gallery-glmphotos-light-3 .ngg-gallery-thumbnail:hover .ngg-fancybox img {
- border-radius: 30px;
- -webkit-transition: border-radius 2s;
- -moz-transition: border-radius 2s;
- -o-transition: border-radius 2s; }
- #gallery-glmphotos-light-3 .ngg-gallery-thumbnail:hover .ngg-fancybox .title {
- border-top-left-radius: 30px;
- border-top-right-radius: 30px;
- -webkit-transition: border-radius 2s;
- -moz-transition: border-radius 2s;
- -o-transition: border-radius 2s; }
+ transition: border-radius 1s ease 0s;
+ -webkit-transition: border-radius 1s ease 0s;
+ -moz-transition: border-radius 1s ease 0s;
+ -o-transition: border-radius 1s ease 0s; }
+ #gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox:hover .title {
+ border-top-left-radius: 30px;
+ border-top-right-radius: 30px;
+ transition: border-radius 1s ease 0s;
+ -webkit-transition: border-radius 1s ease 0s;
+ -moz-transition: border-radius 1s ease 0s;
+ -o-transition: border-radius 1s ease 0s; }
#gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox .image_title {
display: table;
height: auto;
display: table-cell;
vertical-align: middle;
/*Hover effect - default state*/
+ transition: all 0.5s ease 0s;
transform: scale(0.2);
- transition: all 0.25s;
border-top-left-radius: 4px;
border-top-right-radius: 4px; }
#gallery-glmphotos-light-3 .ngg-gallery-thumbnail .ngg-fancybox:hover {
font-family: "Lato"; }
#gallery-glmphotos-light-3 .photoTitle {
width: 90%;
- text-transform: uppercase;
+ text-transform: capitalize;
padding: 10px 0;
margin: 8px auto 0; }
#gallery-glmphotos-light-3 .photoTitle:hover a {
?>
<?php if (!defined ('ABSPATH')) die ('No direct access allowed'); ?><?php if (!empty ($gallery)) : ?>
+
+
<div id="gallery-glmphotos-light-3" class="ngg-galleryoverview" id="<?php echo $gallery->anchor ?>">
<!-- Thumbnails -->
<?php $i = 0; ?>
<ul class="gallery small-block-grid-2 medium-block-grid-3 large-block-grid-3">
+
<?php foreach ( $images as $image ) : ?>
- <li>
+ <?php if ($image->pid == 36) { ?>
+ <div style="width: 100%;">
+ <div class='special'>
+
+ ~ Sample Circle style ~
+ <hr>
+ <a class="one"
+ href="<?php echo nextgen_esc_url($image->imageURL) ?>"
+ title="<?php echo esc_attr($image->description) ?>"
+ data-src="<?php echo nextgen_esc_url($image->imageURL) ?>"
+ data-thumbnail="<?php echo nextgen_esc_url($image->thumbnailURL); ?>"
+ data-image-id="<?php echo esc_attr($image->pid); ?>"
+ data-title="<?php echo esc_attr($image->alttext); ?>"
+ data-description="<?php echo esc_attr($image->description); ?>" style='background-image:url("<?php echo nextgen_esc_url($image->thumbnailURL) ?>");'>
+ </a>
+
+ <hr>
+ </div>
+ </div>
+ <?php } ?>
+
+ <li>
<div id="ngg-image-<?php echo $image->pid ?>" class="ngg-gallery-thumbnail-box imgBorderMe" <?php echo $image->style ?> >
<div class="ngg-gallery-thumbnail" >
<?php echo $image->size ?> />
<?php } ?>
- <?php
- $imageTitle = !preg_match(';is\d{2,}-\d{10,}-\d{5,}$;', $image->alttext) ? $image->alttext: '';
- ?>
<div class="image_title">
<h5 class="title">
- <?php if (!$image->hidden) { echo esc_attr($imageTitle); }?>
+ VIEW PROFILE
</h5>
</div>
+
+ <?php
+ $imageTitle = !preg_match(';is\d{2,}-\d{10,}-\d{5,}$;', $image->alttext) ? $image->alttext: '';
+ ?>
<div class="photoTitle" title="<?php echo esc_attr($imageTitle) ?>">
<a href="<?php echo nextgen_esc_url($image->imageURL) ?>"
title="<?php echo esc_attr($image->description) ?>"
</a>
</div>
</div>
- <div class='special'>
- <a class="one"
- href="<?php echo nextgen_esc_url($image->imageURL) ?>"
- title="<?php echo esc_attr($image->description) ?>"
- data-src="<?php echo nextgen_esc_url($image->imageURL) ?>"
- data-thumbnail="<?php echo nextgen_esc_url($image->thumbnailURL); ?>"
- data-image-id="<?php echo esc_attr($image->pid); ?>"
- data-title="<?php echo esc_attr($image->alttext); ?>"
- data-description="<?php echo esc_attr($image->description); ?>" style='background-image:url("<?php echo nextgen_esc_url($image->thumbnailURL) ?>");'>
- </a>
-
- <div class="photoTitle" title="<?php echo esc_attr($imageTitle) ?>">
- <a href="<?php echo nextgen_esc_url($image->imageURL) ?>"
- title="<?php echo esc_attr($image->description) ?>"
- data-src="<?php echo nextgen_esc_url($image->imageURL) ?>"
- data-thumbnail="<?php echo nextgen_esc_url($image->thumbnailURL); ?>"
- data-image-id="<?php echo esc_attr($image->pid); ?>"
- data-title="<?php echo esc_attr($image->alttext); ?>"
- data-description="<?php echo esc_attr($image->description); ?>"
- <?php echo $image->thumbcode ?> >
- <?php if (!$image->hidden) { echo esc_attr($imageTitle); }?>
- </a>
- </div>
- <a class="three"
- href="<?php echo nextgen_esc_url($image->imageURL) ?>"
- title="<?php echo esc_attr($image->description) ?>"
- data-src="<?php echo nextgen_esc_url($image->imageURL) ?>"
- data-thumbnail="<?php echo nextgen_esc_url($image->thumbnailURL); ?>"
- data-image-id="<?php echo esc_attr($image->pid); ?>"
- data-title="<?php echo esc_attr($image->alttext); ?>"
- data-description="<?php echo esc_attr($image->description); ?>" style='background-image:url("<?php echo nextgen_esc_url($image->thumbnailURL) ?>");'>
- </a>
- <a class="yon"
- href="<?php echo nextgen_esc_url($image->imageURL) ?>"
- title="<?php echo esc_attr($image->description) ?>"
- data-src="<?php echo nextgen_esc_url($image->imageURL) ?>"
- data-thumbnail="<?php echo nextgen_esc_url($image->thumbnailURL); ?>"
- data-image-id="<?php echo esc_attr($image->pid); ?>"
- data-title="<?php echo esc_attr($image->alttext); ?>"
- data-description="<?php echo esc_attr($image->description); ?>" style='background-image:url("<?php echo nextgen_esc_url($image->thumbnailURL) ?>");'>
- </a>
- <a class="rok"
- href="<?php echo nextgen_esc_url($image->imageURL) ?>"
- title="<?php echo esc_attr($image->description) ?>"
- data-src="<?php echo nextgen_esc_url($image->imageURL) ?>"
- data-thumbnail="<?php echo nextgen_esc_url($image->thumbnailURL); ?>"
- data-image-id="<?php echo esc_attr($image->pid); ?>"
- data-title="<?php echo esc_attr($image->alttext); ?>"
- data-description="<?php echo esc_attr($image->description); ?>" style='background-image:url("<?php echo nextgen_esc_url($image->thumbnailURL) ?>");'>
- </a>
- <a class="ryk"
- href="<?php echo nextgen_esc_url($image->imageURL) ?>"
- title="<?php echo esc_attr($image->description) ?>"
- data-src="<?php echo nextgen_esc_url($image->imageURL) ?>"
- data-thumbnail="<?php echo nextgen_esc_url($image->thumbnailURL); ?>"
- data-image-id="<?php echo esc_attr($image->pid); ?>"
- data-title="<?php echo esc_attr($image->alttext); ?>"
- data-description="<?php echo esc_attr($image->description); ?>" style='background-image:url("<?php echo nextgen_esc_url($image->thumbnailURL) ?>");'>
- </a>
- <a class="x7"
- href="<?php echo nextgen_esc_url($image->imageURL) ?>"
- title="<?php echo esc_attr($image->description) ?>"
- data-src="<?php echo nextgen_esc_url($image->imageURL) ?>"
- data-thumbnail="<?php echo nextgen_esc_url($image->thumbnailURL); ?>"
- data-image-id="<?php echo esc_attr($image->pid); ?>"
- data-title="<?php echo esc_attr($image->alttext); ?>"
- data-description="<?php echo esc_attr($image->description); ?>" style='background-image:url("<?php echo nextgen_esc_url($image->thumbnailURL) ?>");'>
- </a>
- <a class="x8"
- href="<?php echo nextgen_esc_url($image->imageURL) ?>"
- title="<?php echo esc_attr($image->description) ?>"
- data-src="<?php echo nextgen_esc_url($image->imageURL) ?>"
- data-thumbnail="<?php echo nextgen_esc_url($image->thumbnailURL); ?>"
- data-image-id="<?php echo esc_attr($image->pid); ?>"
- data-title="<?php echo esc_attr($image->alttext); ?>"
- data-description="<?php echo esc_attr($image->description); ?>" style='background-image:url("<?php echo nextgen_esc_url($image->thumbnailURL) ?>");'>
- </a>
- <a class="x9"
- href="<?php echo nextgen_esc_url($image->imageURL) ?>"
- title="<?php echo esc_attr($image->description) ?>"
- data-src="<?php echo nextgen_esc_url($image->imageURL) ?>"
- data-thumbnail="<?php echo nextgen_esc_url($image->thumbnailURL); ?>"
- data-image-id="<?php echo esc_attr($image->pid); ?>"
- data-title="<?php echo esc_attr($image->alttext); ?>"
- data-description="<?php echo esc_attr($image->description); ?>" style='background-image:url("<?php echo nextgen_esc_url($image->thumbnailURL) ?>");'>
- </a>
- </div>
+
</div>
</li>
<?php if ( $image->hidden ) continue; ?>