/*Banner section css start here*/
/*.banner-wrap.portfolio{background-image: url(../img/portfolio_img/portfolio-banner.png);}*/
/*Banner section css end here*/

/*Featured Projects section css start here*/
.featured-projects-wrap { width: 100%; display: block; position: relative; padding: 0 0 59px 0; }
.featured-projects-wrap h2{margin:0 0 40px 0; text-align: center;}
.featured-slide-info{background-color: #E9F4FD; box-shadow: 5px 5px 50px 0px #0000000D; border-radius: 20px; padding: 30px 30px 0 30px;}
.featured-slide-info.hookSound{background: #EFEFDE;}
.featured-slide-info a{text-decoration: none;}
.featured-slide-info h3{margin: 0; padding: 0 0 10px 0;; color: #3695F1; display: inline-block; width: auto; border-bottom: 1px solid #000000; }
.featured-slide-info .project-detail{display: flex; align-items: flex-end; justify-content: space-between;}
.featured-slide-info .develop-caption{margin: 20px 0 34px 0; width: 50%;}
.featured-slide-info .develop-in{width: 100%;display: flex;align-items: center;justify-content: space-between;flex-wrap: wrap;gap: 15px;max-width: 220px;}
.featured-slide-info .develop-caption span{display: inline-flex;}
.featured-slide-info .develop-caption img{max-width: 42px; height: auto; width: auto; min-width:40px; object-fit: contain;} 
.portfolio-feature-btn{display: inline-flex; width: auto; padding: 48px 0 0 0 ;}
.portfolio-feature-btn .button{background:transparent; color: #000; border-color: #000; padding: 10px 15px;}
.portfolio-feature-btn .button:hover{background: #00649E;border-color: #00649E;color: #fff;}
.featured-slide-info .portfolio-img{display: inline-flex; width: 50%; justify-content: flex-end;}
.featured-slide-info .portfolio-img img{max-width: 100%; width: auto; height: auto;}
.featured-projects-wrap .owl-dots { margin-top: 22px !important; display: inline-flex; justify-content: center; width: 100%; }
.featured-projects-wrap .owl-dots button span{margin: 0px 3px !important; }
.main-title-of-portfolio-wrap span{color: #00649E;}
/*Featured Projects section css end here*/

/*portfolio section css start here*/
.portfolio-main{width: 100%; display: block; position: relative; padding: 0 0 67px 0;}
.loader-wrap { position: absolute; width: 100%; height: 100%; background: #00000047; z-index: 9; border-radius: 6px; overflow: hidden; display: none; left: 0; top: 0;}
.loader-wrap .loader-inner{width: 100%; display: flex; justify-content: center; align-items: center; height: 100%;}
.loader-wrap .loader-inner img{width: 50px; height:50px; object-fit: contain;}
.portfolio-inner { display: flex; align-items: flex-start; justify-content: flex-start; margin: 0 -10px; flex-wrap: wrap;}
.portfolio-inner .portfolio-sidebar { width: 33.33%; padding: 0 10px; position: sticky; top: 140px;}
.portfolio-sidebar .card-wrap { width: 100%; margin: 0 0 20px 0; border-radius: 20px; overflow: hidden;}
.portfolio-sidebar .card-header-item { background: #00649E; border-radius: 20px 20px 0 0; padding: 15px 20px; }
.portfolio-sidebar .card-header-item .h5 { margin: 0; color: #fff; font-weight: 500; }
.portfolio-sidebar .card-body-item { border: 1px solid rgba(0, 0, 0, 0.20); background: #FFF; padding: 20px 20px 26px 20px; border-top: 0; border-radius: 0 0 20px 20px; }
.portfolio-sidebar .card-body-item .form-wrap { width: 100%; display: block; position: relative; }
.portfolio-sidebar .card-body-item .form-control{display: flex; position: relative;}
.portfolio-sidebar .form-control input{ width: 100%; padding: 8px 10px; border: 0; font-weight: 400; color: #383838; line-height: 26px; font-size: 16px; min-height: 44px; border-radius: 5px; background: #ECF4F9; }
.portfolio-sidebar .form-control .search-submit { position: absolute; right: 0; top: 0; background: #e9f4f8; border: 0; background-image: url(../img/blog_img/search-blog.svg); height: 20px; width: 50px; font-size: 0; background-repeat: no-repeat; background-position: right 15px center; background-size: 20px; z-index: 12; cursor: pointer; padding: 0; }
.portfolio-sidebar .form-control .reset-btn-search-form-content-wrap { position: absolute; right: 50px; top: 50%; transform: translateY(-50%); color: #0064b0; font-size: 14px; z-index: 11; cursor: pointer; padding: 4px; }
.portfolio-inner .category-portfolio{background: #F1FAFF; padding: 30px 25px; border-radius: 20px;}
.portfolio-inner .category-portfolio .view{text-align: center;}
.portfolio-inner .category-portfolio li a { display: flex; align-items: center; justify-content: flex-start; width: 100%; gap: 24px; margin: 0 0 25px 0; transition: all .3s ease-in-out; cursor: pointer;}
.portfolio-inner .category-portfolio li:last-child a{margin: 0;}
.portfolio-inner li a .icon-caption { width: 32px; display: inline-flex; }
.portfolio-inner li a .icon-caption img { width: auto !important; object-fit: contain !important; }
.portfolio-inner li a .h6{font-size: 18px; line-height: 24px; color: #000000; font-weight: 500; margin: 0;}
.portfolio-inner li.view{text-align: center;}
.portfolio-inner li a.view-more { text-decoration: none; font-size: 18px; font-style: normal; font-weight: 700; color: #00649E; justify-content: center; width: auto; display: inline-flex;}
.portfolio-inner li a.view-more:hover{color: #000;}
.portfolio-inner .portfolio-content { width: 66.66%; padding: 0 10px; position: relative;}
.portfolio-content h3{border-bottom:1px solid #000000 ; color: #000000; margin: 0; padding:0 0 10px 0;}
.portfolio-content>.h3{margin: 0 0 27px 0;}
.portfolio-content-inner { width: 100%; position: relative; }
.portfolio-items { display: flex; justify-content: space-between; align-items: self-end; width: 100%; gap: 30px; background: url(../img/portfolio_img/booksweeps-bg.png); background-repeat: no-repeat; border-radius: 20px; padding: 30px 30px 0 30px; position: relative; z-index: 1; background-size: cover; margin: 0 0 30px 0;}
.portfolio-items:last-child{margin: 0 0 20px 0;}
/*.portfolio-items:after { content: ""; position: absolute; background-image: url(../img/portfolio_img/booksweeps-vector.png); width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: contain; left: 0; top: 0; z-index: -1; }*/
.portfolio-items .p-content{width: 50%;}
.portfolio-items .p-content h3{width: auto; display: inline-block; margin: 0 0 20px 0;}
.portfolio-items .develop-logo { display: flex; width: 100%; gap: 11px; align-items: flex-start; justify-content: flex-start; margin: 0 0 12px 0;}
.portfolio-items .develop-logo span{width: 33px; height: 33px;}
.portfolio-items .develop-logo span img{width: 100%; height: auto;}
.portfolio-items .portfolio-feature-btn{width: 100%; padding: 20px 0 30px 0;}
.p-image-caption{width: 50%; display: inline-flex; justify-content: flex-end;}
.p-image-caption img{max-width: 100%; width: auto; height: auto;}
.portfolio-items.paralleluniversevr{background-image: url(../img/portfolio_img/paralleluniversevr-bg.png);}
.portfolio-items.reverse .p-content{order: 2;}
.portfolio-items.reverse .p-image-caption{order: 1; justify-content: flex-start;}
.portfolio-items.bodyclub{background-image: url(../img/portfolio_img/bodyclub-bg.png);}
.portfolio-items.wanna-ad{background-image: url(../img/portfolio_img/wanna-ad-bg.png);}
.portfolio-items.mariebergs{background-image: url(../img/portfolio_img/mariebergs-bg.png);}
.ctm-pagination { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 0 0 22px 0; border-bottom:1px solid #C2C2C2; }
.ctm-pagination .count-page{font-size: 18px; color: #474747; margin: 0; padding: 0; font-weight: 700;}
.ctm-pagination ul { display: inline-flex; align-items: center; gap: 20px; }
.ctm-pagination ul li, .ctm-pagination ul li a{display: inline-flex; text-decoration: none; align-items: center;}
.ctm-pagination ul li span, .ctm-pagination ul li .page-numbers{font-size: 18px; color: #474747; font-weight: 700; display: inline-block; margin: 0 10px; cursor: pointer;}
.ctm-pagination ul li span.active, .ctm-pagination ul li .current{width: 47px; height: 47px; display: flex; align-items: center; justify-content: center; color: #fff; background: #0975E1; border-radius: 50px; margin: 0 5px;}
.ctm-pagination ul li a svg { max-height: 16px; max-width: 16px; }
/*portfolio section css end here*/

/*get in touch section css start here*/
.getintouch-wrap{width: 100%; display: block; position: relative; margin: 0 0 67px 0;}
.getintouch-caption{width: 100%; background: #F1FAFF; border: 1px solid #00649E; border-radius:20px; padding: 50px 20px; text-align: center;}
.getintouch-caption h2{margin: 0 0 20px 0;} 
.getintouch-caption p{font-size: 22px; line-height: 26px; color: #383838; margin: 0 0 32px 0; font-weight: 500;}
.button-caption { width: 100%; display: inline-flex; justify-content: center; }
/*get in touch section css end here*/




/*responsive css start here*/
@media only screen and (max-width: 1024px) {
	.featured-slide-info .develop-caption{margin: 20px 0 30px 0;}
	.portfolio-feature-btn{padding: 30px 0 0 0;}
	.portfolio-items .p-content{width: 60%;}
	.portfolio-items .p-image-caption{width: 40%;}
	.what-project .colm-wrap{align-items: start;}
}

@media only screen and (max-width: 991px) {
	.featured-projects-wrap{padding: 0 0 60px 0;}
	.portfolio-inner{gap: 30px;}
	.portfolio-inner .portfolio-sidebar{position: relative; top: 0;}
	.portfolio-inner .portfolio-sidebar, .portfolio-inner .portfolio-content{width: 100%;}
	.portfolio-items .p-content, .portfolio-items .p-image-caption{width: 50%;}
	.getintouch-wrap{margin: 0 0 60px 0;}
	.getintouch-caption p{font-size: 18px; margin: 0 0 20px 0;}
	.portfolio-main{padding: 0 0 60px 0;}
	.featured-projects-wrap h2{margin: 0 0 30px 0;}
	.pf-info{display: grid !important;grid-template-columns: repeat(2, 1fr);}
	.pf-info .pf-info-item:nth-child(even){padding: 0 0 0 0;margin-right: 0;border: none;}
	.what-project-caption .project-devp-inner{flex-direction: column;gap: 20px !important;}
}

@media only screen and (max-width: 767px) {
	.getintouch-caption{padding: 25px 20px;}
	.getintouch-caption h2{margin: 0 0 10px 0;}
	.getintouch-caption p{font-size: 16px; line-height: 24px; margin: 0 0 10px 0;}
	.featured-projects-wrap{padding: 0 0 40px 0;}
	.ctm-pagination .count-page, .ctm-pagination ul li span, .ctm-pagination ul li .page-numbers{font-size: 16px;}
	.ctm-pagination ul li a svg{width: 14px; height: 16px;}
	.ctm-pagination ul li span.active, .ctm-pagination ul li .current{ width: 36px; height: 36px; }
	.portfolio-main{padding: 0 0 40px 0;}
	.getintouch-wrap{margin: 0 0 40px 0;}
	.portfolio-inner li a .h6{font-size: 16px;}
	.portfolio-inner .category-portfolio li a{margin: 0 0 15px 0; gap: 15px;}
	.portfolio-inner li a.view-more{font-size: 16px;}
	.featured-projects-wrap h2{margin: 0 0 15px 0;}
	.ctm-pagination{flex-wrap: wrap; gap: 15px;}
	.ctm-pagination .count-page{width: 100%; text-align: center;}
	.ctm-pagination ul{width: 100%; gap: 15px; justify-content: center; flex-wrap: wrap;}
	.ctm-pagination ul li span, .ctm-pagination ul li .page-numbers{margin:6px;}
	.ctm-pagination ul li span.active{margin:2px;}
	.ctm-pagination ul li{flex-wrap: wrap; justify-content: center;}

}

@media only screen and (max-width: 575px) {
	.pf-info{grid-template-columns: repeat(1, 1fr);}
	.featured-slide-info .project-detail{flex-wrap: wrap;}
	.featured-slide-info .develop-caption, .featured-slide-info .portfolio-img{width: 100%;}
	.featured-slide-info{text-align: center; padding: 20px 20px 0 20px; border-radius: 15px;}
	.featured-slide-info .develop-in{margin: 0 auto;}
	.featured-slide-info .portfolio-img{justify-content: center;}
	.featured-slide-info .develop-caption span{width: 40px; height: 40px; justify-content: center;}
	.featured-slide-info .develop-caption{margin: 20px 0;}
	.portfolio-feature-btn{padding: 15px 0 0 0;}
	.portfolio-inner .category-portfolio { padding: 20px; border-radius: 15px;}
	.portfolio-items { flex-wrap: wrap; gap: 0; padding: 20px 20px 0 20px; border-radius: 15px; background-position: center; overflow: hidden; }
	.portfolio-items .p-content, .portfolio-items .p-image-caption{width: 100%;}
	.portfolio-items.reverse .p-content{order: 1;}
	.portfolio-items.reverse .p-image-caption{order: 2; justify-content: flex-end;}
	.portfolio-sidebar .card-wrap{border-radius: 15px;}
	.portfolio-sidebar .card-header-item{border-radius: 15px 15px 0 0;}
	.portfolio-sidebar .card-body-item{border-radius: 0 0 15px 15px; overflow: hidden;}
}











/*responsive css end here*/