/* 
Theme Name: Hello Elementor Child
Theme URI: #
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/*Shreeji Photography*/

.ehf-header #masthead{background-color: transparent; position: sticky; top: 0; left: 0;}
.ehf-header #masthead.sticky-header{background-color: rgba(255,255,255, 1); box-shadow: 0 0 20px rgba(0,0,0,0.1);}

.shreeji-photography-section1-animation-text .cd-headline.slide .cd-words-wrapper {vertical-align: middle !important;margin-top: -20px;}
.shreeji-photography-section1-animation-text .cd-intro { margin:0 auto !important;}
.shreeji-photography-menu-page-left-menu .hfe-nav-menu li a { justify-content: normal !important; text-align:left !important;overflow: hidden;background: linear-gradient(to right,#000000,#000000 50%,#ffffff 50%);background-clip: text;-webkit-background-clip: text;    -webkit-text-fill-color: transparent;background-size: 200% 100%;background-position: 100%;transition: background-position 1575ms ease; text-decoration: none;}
.shreeji-photography-menu-page-left-menu .hfe-nav-menu li a:hover {background-position: 0 100%;}
.shreeji-photography-menu-page-right-btn .elementor-button-icon {opacity:0;}
.shreeji-photography-menu-page-right-btn .elementor-button-link:hover .elementor-button-icon { opacity:1;}
.shreeji-photography-top-header-nev .menu-overlay{overflow:hidden;}
.shreeji-photography-top-header-nev .menu-overlay .content-type-saved_page{width: 100%;}
.shreeji-photography-top-header-nev .icon-bars{}


.footerlinks { color:#ffffff;}
.footerlinks:hover { color:#e94444;}
.shreeji-photography-slider-middle .skt-slider-content { width:100% !important; position:relative !important; z-index:8;}
.shreeji-photography-slider-middle .skt-slider-slide::after { content:''; width:100%; height:100%; background:rgba(0,0,0,0.4);position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);z-index: 5;}
.shreeji-photography-slider-middle .skt-slider-slide { position:relative !important;}
.shreeji-photography-slider-middle .skt-slider-button { position:relative !important;}
.shreeji-photography-section2 { position:relative !important;}
.shreeji-photography-section2-our-title { position:absolute !important; top:7%; left:50%; transform:translateX(-50%); z-index:9; width:100%;}
.shreeji-photography-contact-img .elementor-widget-container::before {content: '';width: 100%;height: 100%;position: absolute;top: 20px;left: -88px;background: url(images/contact-img-before.png);background-repeat: no-repeat;z-index: -1;}
.shreeji-photography-contact-img .elementor-widget-container::after {content: '';width: 100%;height: 54px;position: absolute;bottom: -80px;left:50%; transform:translateX(-50%);background: url(images/contact-img-after.png);background-repeat: no-repeat;z-index: -1; background-size:100%;}
.shreeji-photography-contact-img .elementor-widget-container { position:relative !important;}
.wmis_image_link{pointer-events: none !important;}
.wmis_main_container { width:97% !important; margin:0 auto !important; text-align:center;}
.wmis_articles a img { width: auto !important;}
.wmis_articles { background:none !important; border:none !important;}
body.page{background-image: url(images/site-bg.jpg);
    background-position: center center;
    background-repeat: repeat;
    background-size: auto;}
	.shreeji-photography-toggle .elementor-tab-title { text-align:center !important; position:relative !important;}
	.shreeji-photography-toggle .elementor-toggle-icon { position:absolute; right:70px; font-size:20px;top: 50%;
    transform: translateY(-50%);}
	.shreeji-photography-toggle .elementor-tab-content { text-align:center !important;}
	.shreeji-photography-menu-page-right-inner{display:flex;}
	
.shreeji-icon{}
.shreeji-logo{position: relative; left: 0; transition: all 0.3s;}
.shreeji-logo-out{left: -50px; opacity: 0; visibility: hidden; z-index: -1;}

.shreeji-photography-toggle .elementor-tab-title:hover .elementor-toggle-icon { color:#E94444 !important;}
.shreeji-photography-toggle .elementor-tab-title:hover .elementor-toggle-title { color:#E94444 !important;}
.skt-slider-next { right:70px !important;}
.skt-slider-prev { left:70px !important;}
.shreeji-photography-section1-animation-text .cd-words-wrapper { width:auto !important;}

.shreeji-photography-menu-page-left-menu .hfe-nav-menu li:nth-child(5) a{ font-size:30px !important;}
.shreeji-photography-menu-page-left-menu .hfe-nav-menu li:nth-child(6) a{ font-size:30px !important;}
.shreeji-photography-menu-page-left-menu .hfe-nav-menu li:nth-child(7) a{ font-size:30px !important;}


.gallery-list.gallery-style-1 .gallery-list-content .post-hover-content,
.gallery-list.gallery-style-3 .gallery-list-content .post-hover-content{top: 0; left: 0; transform: none; height: 100%; width: 100%;}
.gallery-list .meta-search-icon{display: block; position: absolute; height: 100%; width: 100%; left: 0; top: 0;}
.gallery-list .meta-search-icon a{position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  max-width: 100% !important;
  width: 100%;
  height: 100%;
  transform: none !important;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;}
  
  .shreeji-photography-section1-inner-img .elementor-widget-container img {filter: grayscale(100%);transition: all 0.7s ease-in-out;cursor: pointer;}
  .shreeji-photography-section1-inner-img .elementor-widget-container img:hover {filter: grayscale(0%);transition: all 0.7s ease-in-out;}

@media(max-width: 479px){
	.shreeji-photography-menu-page-left { padding:15px !important; margin-bottom:-30px; --align-self: start !important;}
	.shreeji-photography-menu-page-right { padding:15px !important;--align-self: start !important;}
	.shreeji-photography-menu-page-left .e-con-inner { padding:0 30px !important;}
	.shreeji-photography-menu-page-right .e-con-inner { padding:30px !important;}
	.shreeji-photography-menu-page-right-btn .elementor-widget-container { margin:20px 0 !important;}
	.shreeji-photography-toggle { width:100% !important;}
	.shreeji-photography-toggle .elementor-toggle-icon {right: 40px;}
	.shreeji-photography-section1-animation-text .cd-words-wrapper { text-align:center !important;}
	.skt-slider-next { right:10px !important;}
    .skt-slider-prev { left:10px !important;}
	

}
@media (min-width: 480px) and (max-width: 767px) {
	.shreeji-photography-menu-page-left { padding:15px !important; margin-bottom:-25px; --align-self: start !important;}
	.shreeji-photography-menu-page-right { padding:15px !important;--align-self: start !important;}
	.shreeji-photography-menu-page-left .e-con-inner { padding:0 30px !important;}
	.shreeji-photography-menu-page-right .e-con-inner { padding:30px !important;}

	
}
@media (min-width: 768px) and (max-width: 1023px) {
	.shreeji-photography-menu-page-left { padding:15px !important; margin-bottom:-170px; --align-self: start !important;}
	.shreeji-photography-menu-page-right { padding:15px !important;--align-self: start !important;}
	.shreeji-photography-menu-page-left .e-con-inner { padding:0 30px !important;}
	.shreeji-photography-menu-page-right .e-con-inner { padding:30px !important;}
	.shreeji-photography-toggle { width:100% !important;}
	.shreeji-photography-toggle .elementor-toggle-icon { right:140px;}
	.shreeji-photography-contact-img .elementor-widget-container::before { height:90% !important;}
	.shreeji-photography-menu-page-left .e-con-inner {padding: 0 0px !important;}
	.shreeji-photography-menu-page-right-inner .e-con-inner { display:block !important; padding-left:0 !important; padding-top:25px !important;}
	.shreeji-photography-menu-page-left-mobilemenu .elementor-icon-list-items li:nth-child(5) a{ font-size:30px !important;}
	.shreeji-photography-menu-page-left-mobilemenu .elementor-icon-list-items li:nth-child(6) a{ font-size:30px !important;}
	.shreeji-photography-menu-page-left-mobilemenu .elementor-icon-list-items li:nth-child(7) a{ font-size:30px !important;}
	.shreeji-photography-menu-page-right-btn .elementor-widget-container { margin-top:0 !important;}
	
}
@media (min-width: 1024px) and (max-width: 1191px) {
	.shreeji-photography-toggle .elementor-toggle-icon { right:20px;}
	.shreeji-photography-menu-page-left { padding:15px !important; margin-bottom:-170px; --align-self: start !important;}
	.shreeji-photography-menu-page-right { padding:15px !important;--align-self: start !important;}
	.shreeji-photography-menu-page-left .e-con-inner { padding:0 30px !important;}
	.shreeji-photography-menu-page-right .e-con-inner { padding:30px !important;}
	.shreeji-photography-toggle { width:100% !important;}
	.shreeji-photography-menu-page-right-inner .e-con-inner { display:block !important; padding-left:0 !important; padding-top:0 !important;}
	.shreeji-photography-menu-page-left-mobilemenu .elementor-icon-list-items li:nth-child(5) a{ font-size:30px !important;}
	.shreeji-photography-menu-page-left-mobilemenu .elementor-icon-list-items li:nth-child(6) a{ font-size:30px !important;}
	.shreeji-photography-menu-page-left-mobilemenu .elementor-icon-list-items li:nth-child(7) a{ font-size:30px !important;}
}


/* Homepage Slider */

.project-label {
  display:block;
  position:absolute;
  -ms-backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
  top:80px;
  left:50%;
  transform:translate(-50%,-50%);
  -moz-transform:translate(-50%,-50%);
  -webkit-transform:translate(-50%,-50%);
  -o-transform:translate(-50%,-50%);
  -ms-transform:translate(-50%,-50%)
}
.project-label h6 {
  color:#fff;
  font-family: "Poppins", Sans-serif;
  font-size: 42px;
  font-weight: 600
}

.portfolio {
  padding:0
}
.view-portfolio-btn {
  left:0;
  right:0;
  margin:auto
}
.view-portfolio-btn .elementor-align-icon-right {
  width:0;
  transition:0.2s;
  overflow:hidden
}
.view-portfolio-btn .elementor-align-icon-right svg {
  width:36px;
  padding-left:5px
}
.view-portfolio-btn:hover .elementor-align-icon-right {
  width:38px;
  transition:0.2s
}
.red-overlay {
  position:absolute;
  width:100%;
  height:100%;
  left:0;
  top:0;
  background: #000;
  z-index:-1
}
.portfolio-wrapper {
  overflow:hidden;
  width:100%;
  padding: 9% 8%;
  margin:0;
  height:100%;
  position:relative
}

@media only screen and (min-width:1024px) {
  .portfolio-wrapper .portfolio li {
    font-size:5.25em;
    display:flex;
    align-items:center
  }
  .portfolio-wrapper .portfolio li a {
    font-size: 90px;
    font-family: "Poppins", Sans-serif;
  }
  .portfolio-wrapper .portfolio li .portfolio-mask-wrap {
    line-height:1.2em
  }
  .portfolio-wrapper .portfolio li .portfolio-mask,
  .portfolio-wrapper .portfolio li .portfolio-mask-wrap,
  .portfolio-wrapper .portfolio li .portfolio-mask>span {
    height:220px
  }
}
@media only screen and (max-width:1023px) {
  .portfolio-wrapper {
    overflow:hidden;
    width:100%;
    padding:0%;
    margin:0;
    height:auto;
    position:relative
  }
  .portfolio-wrapper>.hp-footer {
    display:none
  }
  .portfolio-wrapper>.hp-footer h6 {
    transition:all 350ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 350ms cubic-bezier(.77,0,.175,1)
  }
  .portfolio-wrapper li {
    transition:all 350ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 350ms cubic-bezier(.77,0,.175,1);
    text-align:center;
    position:relative;
    overflow:hidden;
    font-size:3em;
    padding:15vh 0
  }
  .portfolio-wrapper .portfolio-mask-wrap {
    width:100%;
    z-index:150;
    margin:0;
    padding:0
  }
  .portfolio-wrapper .portfolio-mask {
    display:block;
    height:auto
  }
  .portfolio-wrapper .portfolio-item.in-middle .portfolio-item-img img {
    transform:scale(1.05);
    -moz-transform:scale(1.05);
    -webkit-transform:scale(1.05);
    -o-transform:scale(1.05);
    -ms-transform:scale(1.05)
  }
  .portfolio-wrapper a {
    transition:all 350ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 350ms cubic-bezier(.77,0,.175,1);
    font-family: "Poppins", Sans-serif;
    text-align:center;
    display:inline-block;
    position:relative;
    color:#fff;
    font-weight: 700;
    line-height:1.3em
  }
  .portfolio-wrapper a:before {
    content:"";
    transition:all 350ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 350ms cubic-bezier(.77,0,.175,1);
    transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    -webkit-transform-origin:50% 50%;
    -ms-transform-origin:50% 50%;
    transform-origin:50% 50%;
    display:block;
    position:absolute;
    background-color:#fff;
    width:3px;
    height:15px;
    top:50%;
    right:-1em
  }
  .portfolio-wrapper a:after {
    content:"";
    transition:all 350ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 350ms cubic-bezier(.77,0,.175,1);
    transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
    -webkit-transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    -webkit-transform-origin:50% 50%;
    -ms-transform-origin:50% 50%;
    transform-origin:50% 50%;
    display:block;
    position:absolute;
    background-color:#fff;
    width:3px;
    height:15px;
    top:46%;
    right:-1em
  }
  .portfolio-wrapper .portfolio-item-img {
    transition:all 350ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 350ms cubic-bezier(.77,0,.175,1);
    position:absolute;
    top:0%;
    left:0%;
    height:100%;
    width:100%;
    z-index:-1;
    background-color:#253069
  }
  .portfolio-wrapper .portfolio-item-img img {
    transition:all 350ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 350ms cubic-bezier(.77,0,.175,1);
    transform:scale(1);
    -moz-transform:scale(1);
    -webkit-transform:scale(1);
    -o-transform:scale(1);
    -ms-transform:scale(1);
    height:100%;
    opacity:.75;
    -o-object-fit:cover;
    object-fit:cover
  }
}
@media only screen and (max-width:47.9em) {
  .portfolio-wrapper li {
    font-size:2em;
    line-height:2em
  }
  .portfolio-wrapper a:before {
    top:49%
  }
  .portfolio-wrapper a:after {
    top: 45%;
  }
}
@media only screen and (min-width:64em) {
  .portfolio-wrapper li {
    position:relative
  }
  .portfolio-wrapper li:before {
    display:none
  }
  .portfolio-wrapper:before {
    content:"";
    transition:all 500ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 500ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 500ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 500ms cubic-bezier(.77,0,.175,1);
    display:block;
    position:absolute;
    top:0;
    left:50%;
    right:0;
    bottom:0;
    background-color: #000;
    z-index:-1
  }
  .portfolio-wrapper>.hp-footer {
    height:2em;
    width:100%;
    overflow:hidden;
    font-size:.8em;
    position:fixed;
    transform:rotate(-90deg);
    -moz-transform:rotate(-90deg);
    -webkit-transform:rotate(-90deg);
    -o-transform:rotate(-90deg);
    -ms-transform:rotate(-90deg);
    font-weight:600;
    -webkit-transform-origin:0 0;
    -ms-transform-origin:0 0;
    transform-origin:0 0;
    bottom:60px;
    left:66px
  }
  .portfolio-wrapper>.hp-footer h6 {
    line-height:2rem;
    margin:0;
    padding:0;
    transition:all 500ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 500ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 500ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 500ms cubic-bezier(.77,0,.175,1)
  }
  .portfolio-wrapper>.hp-footer .project-caption {
    position:absolute;
    font-weight:600;
    top:0;
    transform:translateY(100%);
    -moz-transform:translateY(100%);
    -webkit-transform:translateY(100%);
    -o-transform:translateY(100%);
    -ms-transform:translateY(100%);
    left:0;
    color:#fff
  }
  .portfolio-wrapper>.hp-footer .project-caption.hovered {
    top:0%
  }
  .portfolio-wrapper.selected:before {
    left:0
  }
  .portfolio-wrapper.selected>.hp-footer h6.copyright {
    transform:translate(0,-100%);
    -moz-transform:translate(0,-100%);
    -webkit-transform:translate(0,-100%);
    -o-transform:translate(0,-100%);
    -ms-transform:translate(0,-100%)
  }
  .portfolio-wrapper.selected>.hp-footer .project-caption.hovered {
    transform:translateY(0);
    -moz-transform:translateY(0);
    -webkit-transform:translateY(0);
    -o-transform:translateY(0);
    -ms-transform:translateY(0)
  }
  .portfolio-wrapper li {
    transition:all 350ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -webkit-transition-delay:0.15s;
    -moz-transition-delay:0.15s;
    -o-transition-delay:0.15s;
    -ms-transition-delay:0.15s;
    transition-delay:0.15s;
    height:85px;
    position:relative;
    line-height:1.2em;
    font-size:2.5em
  }
  .portfolio-wrapper li:nth-child(2) {
    -webkit-transition-delay:0.15s;
    -moz-transition-delay:0.15s;
    -o-transition-delay:0.15s;
    -ms-transition-delay:0.15s;
    transition-delay:0.15s
  }
  .portfolio-wrapper li:nth-child(3) {
    -webkit-transition-delay:0.125s;
    -moz-transition-delay:0.125s;
    -o-transition-delay:0.125s;
    -ms-transition-delay:0.125s;
    transition-delay:0.125s
  }
  .portfolio-wrapper li:nth-child(4) {
    -webkit-transition-delay:0.1s;
    -moz-transition-delay:0.1s;
    -o-transition-delay:0.1s;
    -ms-transition-delay:0.1s;
    transition-delay:0.1s
  }
  .portfolio-wrapper li:nth-child(5) {
    -webkit-transition-delay:0.075s;
    -moz-transition-delay:0.075s;
    -o-transition-delay:0.075s;
    -ms-transition-delay:0.075s;
    transition-delay:0.075s
  }
  .portfolio-wrapper li.active:hover .portfolio-mask {
    transform:translateX(0%);
    -moz-transform:translateX(0%);
    -webkit-transform:translateX(0%);
    -o-transform:translateX(0%);
    -ms-transform:translateX(0%);
    transition:all 400ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 400ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 400ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 400ms cubic-bezier(.77,0,.175,1)
  }
  .portfolio-wrapper li.active:hover .portfolio-mask>span {
    transform:translateX(0%);
    -moz-transform:translateX(0%);
    -webkit-transform:translateX(0%);
    -o-transform:translateX(0%);
    -ms-transform:translateX(0%)
  }
  .portfolio-wrapper li.active:before {
    bottom:0;
    opacity:1
  }
  .portfolio-wrapper li .active:nth-of-type(8):before {
    bottom:5%
  }
  .portfolio-wrapper .fake-link:before {
    content:attr(data-mask-link);
    color:#fff;
    opacity:.5
  }
  .portfolio-wrapper a {
    transition:all 350ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 350ms cubic-bezier(.77,0,.175,1);
    font-family:"Montserrat","Open Sans",sans-serif;
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
    display:block;
    width:100%;
    overflow:hidden;
    line-height:1.25em;
    color:rgba(37,48,105,.15);
    font-weight:800
  }
  .portfolio-wrapper a:before {
    content:"";
    transition:all 350ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 350ms cubic-bezier(.77,0,.175,1);
    transform:rotate(90deg) translate(0%,40%);
    -moz-transform:rotate(90deg) translate(0%,40%);
    -webkit-transform:rotate(90deg) translate(0%,40%);
    -o-transform:rotate(90deg) translate(0%,40%);
    -ms-transform:rotate(90deg) translate(0%,40%);
    -webkit-transform-origin:50% 50%;
    -ms-transform-origin:50% 50%;
    transform-origin:50% 50%;
    display:block;
    position:absolute;
    background-color:#fff;
    width:4px;
    height:20px;
    text-align:center;
    top:50%;
    right:0em;
    opacity:0
  }
  .portfolio-wrapper a:after {
    content:"";
    transition:all 350ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 350ms cubic-bezier(.77,0,.175,1);
    transform:rotate(-90deg) translate(0%,-40%);
    -moz-transform:rotate(-90deg) translate(0%,-40%);
    -webkit-transform:rotate(-90deg) translate(0%,-40%);
    -o-transform:rotate(-90deg) translate(0%,-40%);
    -ms-transform:rotate(-90deg) translate(0%,-40%);
    -webkit-transform-origin:50% 50%;
    -ms-transform-origin:50% 50%;
    transform-origin:50% 50%;
    display:block;
    position:absolute;
    background-color:#fff;
    width:4px;
    height:20px;
    text-align:center;
    top:50%;
    right:0em;
    opacity:0
  }
  .portfolio-wrapper .portfolio-mask,
  .portfolio-wrapper .portfolio-mask>span {
    height:85px
  }
  .portfolio-wrapper .portfolio-mask-wrap {
    position:absolute;
    overflow:hidden;
    left:50%;
    transform:translate(-50%,0%);
    -moz-transform:translate(-50%,0%);
    -webkit-transform:translate(-50%,0%);
    -o-transform:translate(-50%,0%);
    -ms-transform:translate(-50%,0%);
    height:85px;
    transition:all 350ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 350ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 350ms cubic-bezier(.77,0,.175,1)
  }
  .portfolio-wrapper .portfolio-mask {
    position:absolute;
    overflow:hidden;
    width:100%;
    height:85px;
    transform:translateX(0%);
    -moz-transform:translateX(0%);
    -webkit-transform:translateX(0%);
    -o-transform:translateX(0%);
    -ms-transform:translateX(0%);
    transition:all 400ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 400ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 400ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 400ms cubic-bezier(.77,0,.175,1)
  }
  .portfolio-wrapper .portfolio-mask>span {
    position:absolute;
    color:#fff;
    transform:translateX(0%);
    -moz-transform:translateX(0%);
    -webkit-transform:translateX(0%);
    -o-transform:translateX(0%);
    -ms-transform:translateX(0%);
    transition:all 400ms cubic-bezier(.77,0,.175,1);
    -webkit-transition:all 400ms cubic-bezier(.77,0,.175,1);
    -moz-transition:all 400ms cubic-bezier(.77,0,.175,1);
    -o-transition:all 400ms cubic-bezier(.77,0,.175,1);
    display:inline-block;
    font-weight:800
  }
  .portfolio-wrapper .portfolio {
    overflow:hidden
  }
  .portfolio-wrapper .portfolio.entered {
    overflow:visible
  }
  .portfolio-wrapper .portfolio.entered .project-label .portfolio-mask {
    transform:translateX(0%);
    -moz-transform:translateX(0%);
    -webkit-transform:translateX(0%);
    -o-transform:translateX(0%);
    -ms-transform:translateX(0%)
  }
  .portfolio-wrapper .portfolio.entered .project-label .portfolio-mask>span {
    transform:translateX(0%);
    -moz-transform:translateX(0%);
    -webkit-transform:translateX(0%);
    -o-transform:translateX(0%);
    -ms-transform:translateX(0%)
  }
  .portfolio-wrapper .portfolio-item.active a:after,
  .portfolio-wrapper .portfolio-item.active a:before {
    right:-.5em;
    opacity:1
  }
  .portfolio-wrapper .portfolio-item.active a:before {
    transform:rotate(45deg) translate(0%,40%);
    -moz-transform:rotate(45deg) translate(0%,40%);
    -webkit-transform:rotate(45deg) translate(0%,40%);
    -o-transform:rotate(45deg) translate(0%,40%);
    -ms-transform:rotate(45deg) translate(0%,40%)
  }
  .portfolio-wrapper .portfolio-item.active a:after {
    transform:rotate(-45deg) translate(0%,-40%);
    -moz-transform:rotate(-45deg) translate(0%,-40%);
    -webkit-transform:rotate(-45deg) translate(0%,-40%);
    -o-transform:rotate(-45deg) translate(0%,-40%);
    -ms-transform:rotate(-45deg) translate(0%,-40%)
  }
  .portfolio-wrapper .portfolio-item.active .portfolio-item-img.show {
    transition:all 0.55s cubic-bezier(.25,.46,.45,.94);
    -webkit-transition:all 0.55s cubic-bezier(.25,.46,.45,.94);
    -moz-transition:all 0.55s cubic-bezier(.25,.46,.45,.94);
    -o-transition:all 0.55s cubic-bezier(.25,.46,.45,.94);
    transform:translate(-50%,0) scale(1.03);
    -moz-transform:translate(-50%,0) scale(1.03);
    -webkit-transform:translate(-50%,0) scale(1.03);
    -o-transform:translate(-50%,0) scale(1.03);
    -ms-transform:translate(-50%,0) scale(1.03);
    -webkit-transition-delay:0.2s;
    -moz-transition-delay:0.2s;
    -o-transition-delay:0.2s;
    -ms-transition-delay:0.2s;
    transition-delay:0.2s;
    top:0;
    opacity:1
  }
  .portfolio-wrapper .portfolio-item.active .portfolio-mask-wrap {
    overflow:visible
  }
  .portfolio-wrapper.selected .portfolio-item .portfolio-mask {
    transform:translateX(101%);
    -moz-transform:translateX(101%);
    -webkit-transform:translateX(101%);
    -o-transform:translateX(101%);
    -ms-transform:translateX(101%)
  }
  .portfolio-wrapper.selected .portfolio-item .portfolio-mask>span {
    transform:translateX(-101%);
    -moz-transform:translateX(-101%);
    -webkit-transform:translateX(-101%);
    -o-transform:translateX(-101%);
    -ms-transform:translateX(-101%)
  }
  .portfolio-wrapper.selected .portfolio-item .portfolio-item-img {
    transition:all 0.4s cubic-bezier(.25,.46,.45,.94);
    -webkit-transition:all 0.4s cubic-bezier(.25,.46,.45,.94);
    -moz-transition:all 0.4s cubic-bezier(.25,.46,.45,.94);
    -o-transition:all 0.4s cubic-bezier(.25,.46,.45,.94);
    transform:translate(-50%,0) scale(1);
    -moz-transform:translate(-50%,0) scale(1);
    -webkit-transform:translate(-50%,0) scale(1);
    -o-transform:translate(-50%,0) scale(1);
    -ms-transform:translate(-50%,0) scale(1);
    -webkit-transition-delay:0s;
    -moz-transition-delay:0s;
    -o-transition-delay:0s;
    -ms-transition-delay:0s;
    transition-delay:0s;
    top:0;
    opacity:0
  }
  .portfolio-wrapper.selected .portfolio-item.active .portfolio-mask {
    transform:translateX(0%);
    -moz-transform:translateX(0%);
    -webkit-transform:translateX(0%);
    -o-transform:translateX(0%);
    -ms-transform:translateX(0%)
  }
  .portfolio-wrapper.selected .portfolio-item.active .portfolio-mask>span {
    transform:translateX(0%);
    -moz-transform:translateX(0%);
    -webkit-transform:translateX(0%);
    -o-transform:translateX(0%);
    -ms-transform:translateX(0%)
  }
  .portfolio-wrapper.selected .portfolio-item a {
    color:rgba(0,0,0,.2)
  }
  .portfolio-wrapper .portfolio-item-img {
    transition:all 0.2s cubic-bezier(.25,.46,.45,.94);
    -webkit-transition:all 0.2s cubic-bezier(.25,.46,.45,.94);
    -moz-transition:all 0.2s cubic-bezier(.25,.46,.45,.94);
    -o-transition:all 0.2s cubic-bezier(.25,.46,.45,.94);
    transform:translate(-50%,0) scale(1);
    -moz-transform:translate(-50%,0) scale(1);
    -webkit-transform:translate(-50%,0) scale(1);
    -o-transform:translate(-50%,0) scale(1);
    -ms-transform:translate(-50%,0) scale(1);
    -webkit-transition-delay:0s;
    -moz-transition-delay:0s;
    -o-transition-delay:0s;
    -ms-transition-delay:0s;
    transition-delay:0s;
    -webkit-transform-origin:50% 50%;
    -ms-transform-origin:50% 50%;
    transform-origin:50% 50%;
    position:fixed;
    opacity:0;
    line-height:0;
    top:0%;
    left:50%;
    height:100%;
    width:100%;
    z-index:-1
  }
  .portfolio-wrapper .portfolio-item-img img {
    height:100%;
    opacity:.75;
    -o-object-fit:cover;
    object-fit:cover
  }
  .portfolio-wrapper li {
    height:140px
  }
  .portfolio-wrapper .portfolio-mask,
  .portfolio-wrapper .portfolio-mask-wrap,
  .portfolio-wrapper .portfolio-mask>span {
    height:140px
  }
}
@media only screen and (min-width:75em) {
  .portfolio-wrapper {
    width:100%;
    margin:0
  }
  .portfolio-wrapper li {
    height:220px;
    font-size:6.666em
  }
  .portfolio-wrapper a {
    line-height:220px
  }
  .portfolio-wrapper .portfolio-mask,
  .portfolio-wrapper .portfolio-mask-wrap,
  .portfolio-wrapper .portfolio-mask>span {
    height:220px
  }
}
@media only screen and (min-width:1921px) {
  .portfolio-wrapper {
    width:100%;
    margin:0
  }
  .portfolio-wrapper li {
    height:250px
  }
  .portfolio-wrapper .portfolio-mask,
  .portfolio-wrapper .portfolio-mask-wrap,
  .portfolio-wrapper .portfolio-mask>span {
    height:250px
  }
}

@media(max-width: 1199px){
    .project-label h6{font-size: 28px;}
    .portfolio-wrapper .portfolio li a{font-size: 60px; line-height: 220px;}
}

@media(max-width: 1023px){
    .project-label{top: 60px;}
    .project-label h6{font-size: 20px;}
    .portfolio-wrapper .portfolio li a{font-size: 40px;}
}

@media(max-width: 767px){
    .project-label h6{font-size: 16px;}
    .portfolio-wrapper .portfolio li a{font-size: 28px;}
}