.portfolio-grid .grid-item figure .portfolio-img, .portfolio-grid .grid-item .figure .portfolio-img {transition: all 0.3s ease 0s;-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;-ms-transition: all 0.3s ease 0s;-o-transition: all 0.3s ease 0s;}  .position-relative {position: relative !important;}  .overflow-hidden {overflow: hidden !important;}  /* =================================== Portfolio ====================================== *//* portfolio grid */  .portfolio-grid {list-style: none;padding: 0;margin: 0;}  /* gutter type */  .portfolio-grid.gutter-medium li{padding: 7px 7px}  .portfolio-grid.gutter-medium{margin: 0 7px}  /* portfolio hover style */  .grid-item .portfolio-hover-box {display: table-cell;height: 100%;}  /* portfolio 4 column */  .portfolio-grid.work-4col li{width: 24.5%;display: inline-flex;height: auto;overflow: hidden;margin: 10px 0;}  .portfolio-grid .grid-item figure, .portfolio-grid .grid-item .figure {margin: 0;position: relative;overflow: hidden}  .portfolio-grid .grid-item {opacity: 1;overflow: hidden;}  .portfolio-grid .grid-item .portfolio-img{background-color: var(--color-background-one)}  .portfolio-grid .grid-item figure img, .portfolio-grid .grid-item .figure img {cursor: pointer;display: block;opacity: 1;width: 100%;transition: all 0.3s ease 0s;}  .portfolio-grid .grid-item figcaption, .portfolio-grid .grid-item .figcaption {bottom: 0;left: 0;opacity: 0;position: absolute;transition: all 0.3s ease 0s;-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;-ms-transition: all 0.3s ease 0s;-o-transition: all 0.3s ease 0s;width: 100%;height: 100%;padding: 45px;z-index: 1;text-align: center}  .portfolio-grid .grid-item figure:hover .portfolio-img, .portfolio-grid .grid-item .figure:hover .portfolio-img {transition: all 0.3s ease 0s;-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;-ms-transition: all 0.3s ease 0s;-o-transition: all 0.3s ease 0s;}  .portfolio-grid .grid-item figure .portfolio-img, .portfolio-grid .grid-item .figure .portfolio-img {transition: all 0.3s ease 0s;-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;-ms-transition: all 0.3s ease 0s;-o-transition: all 0.3s ease 0s;}  .portfolio-grid .grid-item figure:hover img, .portfolio-grid .grid-item .figure:hover img {opacity: 0.25;transform: scale(1.1, 1.1);-webkit-transform: scale(1.1, 1.1);-moz-transform: scale(1.1, 1.1);-ms-transform: scale(1.1, 1.1);-o-transform: scale(1.1, 1.1);transition: all 0.3s ease 0s;-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;-ms-transition: all 0.3s ease 0s;-o-transition: all 0.3s ease 0s;}  .portfolio-grid .grid-item figure:hover figcaption, .portfolio-grid .grid-item .figure:hover .figcaption{opacity: 1;transition: all 0.3s ease 0s;-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;-ms-transition: all 0.3s ease 0s;-o-transition: all 0.3s ease 0s;}  .container .hover-option4 .grid-item figcaption, .container .hover-option4 .grid-item .figcaption{padding: 30px;}  /* hover option 6 */  .hover-option6 .grid-item figcaption, .hover-option6 .grid-item .figcaption {height: 100%;position: relative;opacity: 1;padding: 35px 10px;background: #f2f2f2;}  .hover-option6 .grid-item .portfolio-hover-main {transform: none;-webkit-transform: none;-moz-transform: none;-ms-transform: none;-o-transform: none;display: table;height: 100%;top: 0;width: 100%;}  .hover-option6 .grid-item .portfolio-icon {transition: all 0.3s ease 0s;position: absolute;-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);position: absolute;top: 55%;left: 0;right: 0;opacity: 0;text-align: center !important}  .hover-option6 .grid-item figure:hover .portfolio-icon, .hover-option6 .grid-item .figure:hover .portfolio-icon {opacity: 1;top: 50%;}  .hover-option6 .grid-item .portfolio-icon a {border-radius: 50%;border: 2px solid var(--color-background-two);background-color: var(--color-background-one);color: var(--color-background-three);height: 50px;width: 50px;display: inline-block;-webkit-transition: all 0.2s ease 0s;-moz-transition: all 0.2s ease 0s;-ms-transition: all 0.2s ease 0s;-o-transition: all 0.2s ease 0s;transition: all 0.2s ease 0s;text-align: center;margin: 0 7px;}  .hover-option6 .grid-item .portfolio-icon a span {font-size: 1.6em;position: relative;top: 9px}  .hover-option6 .grid-item .portfolio-icon a:hover, .hover-option6 .grid-item .portfolio-icon a:hover span {color: #fff;}  .hover-option6 .grid-item .portfolio-icon a:hover {border: 2px solid var(--color-background-three);color: #fff;transform: scale(1.1, 1.1);-webkit-transform: scale(1.1, 1.1);-moz-transform: scale(1.1, 1.1);-ms-transform: scale(1.1, 1.1);-o-transform: scale(1.1, 1.1);}  .hover-option6 .grid-item figure:hover img, .hover-option6 .grid-item .figure:hover img {cursor: default;opacity: .15;transform: scale(1, 1);-webkit-transform: scale(1, 1);-moz-transform: scale(1, 1);-ms-transform: scale(1, 1);-o-transform: scale(1, 1);}  .hover-option6 .grid-item figure:hover figcaption, .hover-option6 .grid-item .figure:hover .figcaption {cursor: default;}  .hover-option6 .grid-item figure:hover .portfolio-img, .hover-option6 .grid-item .figure:hover .portfolio-img {transition: all 0.3s ease 0s;-webkit-transition: all 0.3s ease 0s;-moz-transition: all 0.3s ease 0s;-ms-transition: all 0.3s ease 0s;-o-transition: all 0.3s ease 0s;}  .container .hover-option6 .grid-item figcaption, .container .hover-option6 .grid-item .figcaption {padding: 25px 10px;}  .portfolio-hover-content h2 a{display: block; font-weight: 600; text-transform: uppercase; color: #222222; margin: 5px 0; text-decoration: none !important; font-size: 0.685em}  .portfolio-hover-content h3{display: block; font-weight: 400; text-transform: uppercase; color: #888888; font-size: 0.785em}  /* portfolio filter tab style 1 */  .portfolio-filter-tab-1 {text-align: center; margin-bottom: 20px;}  .portfolio-filter-tab-1 li {margin: 10px 25px;display: inline-block;float: none}  .portfolio-filter-tab-1 li a {background: transparent;border: none;padding: 0 0 2px 0;display: inline;color: #6f6f6f;margin: 0;text-transform: uppercase;font-size: 1em;text-decoration: none;}  .portfolio-filter-tab-1 li a:hover, .portfolio-filter-tab-1 li a:focus {background: transparent;border-bottom: 1px solid #232323;color: #232323}  .portfolio-filter-tab-1 li.active a {background: transparent !important;border-bottom: 1px solid #232323;color: #232323;}
