/* Core grid and slider spacing to match theme */
.projects-grid, .project-slider { position: relative; margin: -15px; }
.project-item { float: left; width: 33.3333333333%; display: inline-block; padding: 0 15px; box-sizing: border-box; }

.projects-box { position: relative; display: block; overflow: hidden; }
.projects-box .portfolio-info { width: 270px; position: absolute; bottom: 20px; right: -270px; z-index: 4; opacity: 0; transition: all 0.35s ease; }
.projects-box .portfolio-info .portfolio-info-inner { text-align: left; padding: 30px 30px 10px 30px; box-sizing: border-box; background-color: #0039e4; background-image: linear-gradient(90deg, #0039e4, #04dbf1); border-top-left-radius: 15px; border-bottom-left-radius: 15px; box-shadow: 12px 12px 30px 0px rgba(0, 57, 228, 0.3); }
.projects-box .portfolio-info .portfolio-info-title { color: #fff; font-family: "Red Hat Text", sans-serif; font-size: 20px; font-weight: 500; margin-bottom: 10px; line-height: 1; }
.projects-box .portfolio-info .portfolio-info-title a { color: #fff; }
.projects-box .portfolio-info .portfolio-cates { color: #95e1fa; font-family: "Red Hat Display", sans-serif; font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: 0.5px; }
.projects-box .portfolio-info .portfolio-cates a { color: #95e1fa; }
.projects-box .portfolio-info .portfolio-cates span { display: inline-block; margin: 0 2px; }
.projects-box .portfolio-info .portfolio-cates span:last-child { display: none; }
.projects-box:hover .portfolio-info { right: 0 !important; opacity: 1; }
.projects-box .projects-thumbnail { overflow: hidden; border-radius: 15px; }
.projects-box img { width: 100%; height: auto; display: block; transition: all 0.3s linear; }
.projects-box:hover img { transform: scale(1.05); }

/* Overlay style s2 */
.projects-box .s2 { right: 0; bottom: 0; width: calc(100% - 42px); height: calc(100% - 42px); margin: 21px; background-color: rgba(0, 73, 177, 0.9); display: flex; justify-content: center; align-items: center; border-radius: 15px; transition: all 0.2s linear; }
.projects-box .s2 .portfolio-info-inner { background: none; box-shadow: none; text-align: center; }
.projects-box .s2 .portfolio-info-inner .portfolio-info-title { font-size: 28px; margin-bottom: 12px; }
.projects-box .s2 .portfolio-info-inner .portfolio-cates, .projects-box .s2 .portfolio-info-inner .portfolio-cates a { color: #00c3ff; }

/* Style 2 */
.projects-style-2 .projects-box { overflow: visible; border-bottom: 60px solid transparent; }
.projects-style-2 .projects-box .portfolio-info { opacity: 1; right: 0; left: 0; bottom: -60px; width: 100%; transition: all 0.3s ease; }
.projects-style-2 .projects-box .portfolio-info .portfolio-info-inner { width: calc(100% - 60px); padding: 36px 10px 10px; margin: 0 auto; background: #fff; text-align: center; border-radius: 15px; box-shadow: 8px 8px 30px 0 rgba(42, 67, 113, 0.15); }
.projects-style-2 .projects-box .portfolio-info .portfolio-info-title a { font-family: "Red Hat Display", sans-serif; font-weight: 700; color: #1a1b1e; }
.projects-style-2 .projects-box .portfolio-info .portfolio-cates, .projects-style-2 .projects-box .portfolio-info .portfolio-cates a { color: #00c3ff; letter-spacing: 0; }

/* Style 3 */
.projects-style-3 .projects-box { border-radius: 4px; }
.projects-style-3 .projects-box .portfolio-info { opacity: 1; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-end; background: rgba(24, 24, 24, .15); background-image: linear-gradient(0deg, rgba(19,24,48,.5) 0%, rgba(19,24,48,.4) 24%, rgba(19,24,48,0) 58%); transition: all 0.3s ease; }
.projects-style-3 .projects-box:hover .portfolio-info { background: rgba(20,40,96,0.7); background-image: linear-gradient(0deg, rgba(19,24,48,.4) 0%, rgba(19,24,48,.4) 24%, rgba(19,24,48,0) 58%); }
.projects-style-3 .projects-box .projects-thumbnail { border-radius: 0; }
.projects-style-3 .projects-box .portfolio-info .portfolio-info-inner { padding: 0 10px 10px 40px; background: transparent; border-radius: 0; box-shadow: none; }
.projects-style-3 .projects-box .portfolio-info .portfolio-info-title { font-family: "Red Hat Display", sans-serif; font-size: 24px; font-weight: 700; }
.projects-style-3 .projects-box .portfolio-info .portfolio-cates, .projects-style-3 .projects-box .portfolio-info .portfolio-cates a { color: #fff; font-size: 16px; letter-spacing: 0; }

/* Zikzag layout */
.zikzag-layout .project-item:nth-of-type(2n) { margin-top: -30px; }
.zikzag-layout .slick-list { padding-top: 15px; }

/* Slick arrows basic */
.slick-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 50px; height: 50px; line-height: 50px; text-align: center; border-radius: 50%; background: #fff; color: #142860; border: none; box-shadow: 0 8px 30px rgba(42, 67, 113, 0.15); z-index: 10; cursor: pointer; }
.prev-nav { left: -60px; }
.next-nav { right: -60px; }
.slick-arrow:hover { background: #142860; color: #fff; }

/* Dots */
.slick-dots { position: absolute; left: 0; right: 0; bottom: -20px; }
.slick-dots li button:before { color: #a3aed0; }
.slick-dots li.slick-active button:before { color: #142860; }