* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: Lato, sans-serif;
	text-align: justify;
/*	border: 1px solid red;*/
}

a {
	text-decoration: none;
	color: var(--secondary);
	border-bottom: 2px solid transparent;
	padding-bottom: 3px;
/*	transition: 0.3s;*/
	background: linear-gradient(var(--main) 0 0) var(--p, 0) / var(--p, 0) no-repeat;
	transition: .4s, background-position 0s;
}

a:hover {
	color: var(--third);
	border-bottom: 2px solid var(--third);
	text-shadow: 0.25px 0.25px 0.25px var(--fourth);
	--p: 100%;
}

:root {
	--main: #264653;
	--secondary: #FE7F2D;
	--third: #DFE2E0;
	--fourth:#090F27;
	--fifth: #83959C;
	--white: #fff;
	--black: #000;
}

.container-fluid {
	padding: 0;
/*	margin: 0;*/
}


.line {
	position: relative;
	color: var(--white);
}

.line:after {
	position: absolute;
	content: "";
	top: 5px;
	left: 50%;
	transform: translateX(-50%);
	height: 3px;
	width: 50px;
	border-radius: 3px;
	background-color: var(--secondary);
}


.header {
	height: auto;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 10px;
	color: white !important;
	position: absolute;
	top: 0px;
	z-index: 2;
/*	background-color: #efefef;*/
/*	opacity: 0.3;*/
}

.header::before {
	position: absolute;
	width: 100%;
	height: 100%;
	content: "";
	background-color: #efefef;
	z-index: 0;
	opacity: 0.3;
}


.header .left {
	width: 15%;
}

.header .left a, .footer .footer-box .footer-logo  a {
	border-bottom: 2px solid transparent;
	
}

.header .left a:hover, .footer .footer-box .footer-logo  a:hover {
	border-bottom: 2px solid var(--third);
	padding-bottom: 18px;
}

.header .middle {
	width: 70%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	font-weight: bold;
}

.header .middle a{
	padding: 0 5px;
	color: white;
}


.header .middle ul:hover > .mega-menu{
	display: block;
	z-index: 999;
}

.header .middle ul .mega-menu{
	position: absolute;
	/*top: 70%;
	left: 50%;*/
	transform: translateX(-10%);
	display: none;
	height: auto;
	width: auto;
	padding: 0;
	margin: auto;
	font-size: 14px;
	border-radius: 10px;
	background-color: var(--fourth);
}

.mega-menu .menu-box {
	display: flex;
	flex-direction: column;
	margin: 10px;
	width: 250px;
	overflow: hidden;
}

.mega-menu .menu-box a {
	margin: 10px 0;
	border-left: 2px solid transparent;
}

.mega-menu .menu-box a:hover {
	border-left: 2px solid var(--third);
}
	
.header .right {
/*	width: 15%;*/
	display: flex;
	justify-content: center;
	align-items: center;
}

.header .right i {
	padding: 10 0px;
}


.header .left .logo img {
	width: 100%;
}






/*-------------------------- mob-header --------------------------------*/

.mob-header {
	display: none;
}

.mob-header-top {
	display:flex;
	justify-content: space-between;
	align-items: center;
	border: 0px solid black;
	padding: 10px 5px;
}

.mob-header-top .mob-left {
	width: 40%;
	float: left;
}

.mob-header-top .mob-left .mob-logo{
	width: 100%;
}


.mob-header-top .mob-left .mob-logo img {
	display: block;
	width:95%;
}

.mob-header-top .mob-middle {
	width: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-size: 12px;
}

.mob-header-top .mob-middle i{
	padding-right: 10px;
}


.mob-header-top .mob-right {
	width: 10%;
	display: flex;
	justify-content: flex-end;
}

.mob-header-top i {
	font-size: 16px;
	color: var(--main);
}


.mob-header-top i:hover {
	color: var(--third);

}





.mob-header #nav-list {
	display: flex;
	flex-direction: column;
	background-color: #efefef;
	height: auto;
	align-items: center;
	width: 100%;
}


.mob-list {
	display: flex; 
	justify-content: center;
	padding: 2px;
	width: 100%;
	font-size: 14px;
	align-items: center;
/*	border-radius: 10px;*/
	margin:0 5px;
}
.mob-list a {
	color: gray;
}
.mob-list:hover {
	background-color: var(--third);
	color: white;
	transition:0.3s;
}








/*------------------ SLIDER ------------------------*/



.slider {
	width: 100%;
	margin-bottom: 30px;
}








/*---------------- INTRO SECTION -------------------*/


.intro {
	text-align: center;
	line-height: 30px;
	color: var(--main);
	margin-bottom: 30px;
}

.intro-head {
	font-size: 27.2px;
	text-transform: uppercase;
	font-weight: 700;
}


.intro-head-2 {
	font-size: 20px;
	text-transform: uppercase;
	font-weight: 700;
}

.lead{
	font-size: 16px;
	font-weight: bold;
}


button {
	padding: 5px 10px;
	font-weight: bold;
	border-radius: 5px;
	border: 2px solid var(--third);
	font-size: 14px;
	background: linear-gradient(var(--main) 0 0) var(--p, 0) / var(--p, 0) no-repeat;
	transition: .4s, background-position 0s;
}

/*.introbtn {
	color: var(--main);
}*/

button:hover, .introbtn:hover {
	color: var(--secondary);
	--p: 100%;
}









/*---------------- INTRO SECTION -------------------*/


.category {
	margin-bottom: 20px;
	height: auto;
	overflow: hidden;
}

.category .category-card {
	height: 530px;
	overflow: hidden;
	transition: 0.5s;
	position: relative;
	display: flex;
	justify-content: center;
}


.category .category-card:hover img:hover{
	transform: scale(1.02);
}

.category .category-card img{
	width: 100%;
	object-fit: cover;
	object-position: center center;
	transition: 0.5s;
}

/*.category .category-card img:hover{
	transform: scale(1.03);
}*/


.category .category-card .category-card-text {
	height: auto;
	width: 90%;
	padding: 0 10px;
	position: absolute;
	bottom: 50px;
	color: var(--white);
	text-align: center;
	background-color: transparent;
}










/*---------------- SECTION-1 -------------------*/



.sec-1 {
	height: auto;
	margin-bottom: 30px;
}

.sec-box {
/*	height: 300px;*/
	color: var(--main);
	vertical-align: middle;
	text-align: center;
	line-height: 30px;
}


.sec-box:nth-child(2) { 
	display: flex;
	justify-content: center;
	align-items: center;
}


.sec-box img{
	width: 100%;
	object-fit: cover;
	object-position: center center;
	margin: auto;
}









/*---------------- SECTION-2 -------------------*/

.sec-2 {
	height: 350px;
	margin-bottom: 30px;
	background-image: url(../media/img-image-05.jpg);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	position: relative;
}

.sec-2-box {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	color: var(--third);
	text-align: center;
	line-height: 30px;
}





/*---------------- SECTION-3 -------------------*/


.sec-3 {
	height: auto;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 30px;
	margin-bottom: 30px;
}

.sec-3 .sec-3-box {
	height: auto;
}

.sec-3 .sec-3-box .sec-3-box-top{
	display: flex;
	justify-content: center;
	overflow: hidden;
}

.sec-3 .sec-3-box .sec-3-box-top img {
	width: 100%;
	object-fit: contain;
	border: 1px solid var(--third);
	transition: 0.4s;
}

.sec-3 .sec-3-box .sec-3-box-top img:hover {
	transform: scale(1.1) ;
}

.sec-3 .sec-3-box:nth-child(2) .sec-3-box-top img {
	transform: scale(1.1);
}

.sec-3 .sec-3-box:nth-child(2) .sec-3-box-top img:hover {
	transform: scale(1.0);

}

.sec-3 .sec-3-box .sec-3-box-bottom {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 10px 0;
	line-height: 28px;
}







/*---------------- SECTION-4 -------------------*/


.sec-4 {
	text-align: center;
	margin-bottom: 30px;
	line-height: 24px;
}



/*---------------- SECTION-5 -------------------*/


.sec-5 {
	height: auto;
	text-align: center;
	margin-bottom: 30px;
	line-height: 24px;
}


.sec-5-bottom {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 20px;
}

.sec-5-bottom-box {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}


.sec-5-bottom-box:nth-child(1) {
	width: 25%;
}

.sec-5-bottom-box:nth-child(2) {
	width: 50%;
}

.sec-5-bottom-box:nth-child(3) {
	width: 25%;
}

.sec-5-div {
	padding: 10px 0;
	text-align: left;
	width: 100%;
}

.sec-5-div .sec-5-div-head {
	font-size: 20px;
	font-weight: bold;
	position: relative;
	padding: 10px 0;
}

.sec-5-div .sec-5-div-head::before {
	position: absolute;
	content: "01";
	font-size: 100px;
	font-family: arial;
	color: var(--third);
	z-index: -1;
	top: 40%;
}

.sec-5-div:nth-child(2) .sec-5-div-head::before {
	content: "02";
}

.sec-5-bottom-box:nth-child(3) .sec-5-div:nth-child(1) .sec-5-div-head::before {
	content: "03";
}

.sec-5-bottom-box:nth-child(3) .sec-5-div:nth-child(2) .sec-5-div-head::before {
	content: "04";
}

.sec-5-div .sec-5-div-text {
	padding: 10px 0;
}

.sec-5-div:nth-child(1) {
	margin-bottom: 20px;
}


.center-box {
	height: 500px;
	width: 500px;
	border: 3px solid var(--third);
	border-radius: 50%;
	position: relative;
}

.center-inner-box-1 {
	height: 75%;
	width: 75%;
	border: 2px solid var(--third);
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.center-inner-box-2 {
	height: 50%;
	width: 50%;
	border: 1px solid var(--third);
	border-radius: 50%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	overflow: hidden;
	background-image: url(../media/img-image-14.webp);
	background-size: 130%, 130%;
}





/*---------------- SECTION-6 -------------------*/


.sec-6 {
	margin-bottom: 30px;
	text-align: center;
}

















/*---------------- SECTION-7 -------------------*/


.sec-7 {
	margin-bottom: 30px;
	text-align: center;
}

.sec-7 .sec-7-box {
	display: flex;
	gap:20px;
	justify-content: center;
	align-items: center;
	text-align: center;
	line-height: 24px;
}

.sec-7 .sec-7-box-inner {
	padding: 10px;
	width: 33.33%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	border: 3px solid transparent;
	transition: 0.3s;
	font-size: 14px;
}
.sec-7 .sec-7-box-inner:hover{
	border-right: 3px solid var(--third);
	border-bottom: 3px solid var(--third);
	border-radius: 10px;
}


.sec-7 .sec-7-box-inner .clipart {
	height: 100px;
	width: 100px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.sec-7 .sec-7-box-inner .clipart img {
	width: 90px;
	height: 90px;
	object-fit: cover;
}











/*---------------- FAQS SECTION -------------------*/



.faqs {
	height: auto;
	margin-bottom: 30px;
	text-align: center;
}

.faq-item {
	background-color: var(--fourth);
	border-radius: 10px;
	padding: 10px 20px;
	margin-bottom: 3px;
}

.faq-link {
	color: var(--third);
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 10px 20px;
}

.faq-link:hover {
	border-radius: 10px;
	color: var(--white);
}

.faq-link i{
	color: var(--secondary);
	padding: 10px
}


.faq-link .fa-minus {
	display: none;
}

.faq-link .fa-plus{}


.answer {
	max-height: 0px;
	overflow: hidden;
	position: relative;
	background-color: var(--fifth);
	transition: max-height 0.5s;
}


.answer::before {
	content: "";
	position: absolute;
	width: 3px;
	height: 60%;
	background-color: var(--third);
	top: 50%;
	left: 10px;
	transform: translateY(-50%);
}

.answer p{
	color: var(--main);
	text-align: justify;
	padding: 10px 20px;
}


.faq-item:target .answer {
	height: auto;
	max-height: 200px;
}


.faq-item:target .faq-link .fa-plus {
	display: none;
}

.faq-item:target .faq-link .fa-minus {
	display: block;
}





/*---------------- SECTION-8 -------------------*/

.sec-8 {
	margin-bottom: 30px;
	text-align: center;
	line-height: 30px;
}

.certificate {
	margin-bottom:30px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.certificate-box {
	width: 25%;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 5px 0;
}

.certificate .certificate-box img {
	width: 100px;
}







/*---------------- FOOTER -------------------*/


.footer-main {
	background-color: var(--fourth);
}


.footer {
	display: flex;
	gap: 10px;
	padding: 10px 0;
}

.footer .footer-box {
	width: 25%;
	height: auto;
	padding: 10px;
	color: var(--fifth);
	text-align: center;
}

.footer .footer-box .footer-heading {
	color:var(--white);
	font-size: 18px;
	font-weight: 600;
	text-transform: uppercase;
}

.footer .footer-box .footer-link {
	display: flex;
	justify-content: space-between;
}

.footer .footer-box:nth-child(2) .footer-link {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.footer .footer-box:nth-child(3) .footer-link {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.footer .footer-box .footer-link .footer-list{
	padding: 5px 10px;
	border-right: 2px solid var(--third);
	margin-bottom: 10px;
	border-radius: 5px;
}

.footer .footer-box .footer-logo {
	width: 100%;
	margin-bottom: 10px;
	padding: 10px 0;
}

.footer .footer-box .footer-logo img {
	width: 100%;
}


.footer .footer-box .social-links{
	padding: 10px;
}

.footer .footer-box .social-links i{
	margin:0 10px;
}




/*---------------- END FOOTER -------------------*/

.end-footer {
	background-color: var(--black);
	height: auto;
	padding: 20px 0;
	text-align: center;
	color: var(--white);
}













/*---------------- CONTACT -------------------*/


.contact-main {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 20px;
	margin-bottom: 30px;

}

.contact-main .contact-box {
	height: auto;
}


.contact-main .contact-box-top {
	text-align: center;
	font-size: 24px;
	padding: 10px;
	background-color: var(--fourth);
	color:var(--third);
}


.contact-main .contact-box-bottom .bottom-box {
	display: flex;
	padding: 10px
} 

.contact-main .contact-box-bottom .bottom-box .bottom-b-i {
	width: 20%;
	padding: 10px;
}

.contact-main .contact-box-bottom .bottom-box .bottom-b-i i {
	color: var(--secondary);
	font-size: 50px;

}

.contact-main .contact-box-bottom .bottom-box .bottom-b-t {
	font-size: 22px;
}
.contact-main .contact-box-bottom .bottom-box .bottom-b-t.b-t-1 a{
	padding: 10px 15px;
	display: inline-block;
	text-decoration: none;
}


.form {
	color: var(--fifth);
	font-size: 14px;
	line-height: 20px;
}

form .form-group {
	padding: 10px 0;
}

form .form-btn {
	display: flex;
	justify-content: center;
	align-items: center;
}

form .btn {
	width: 100px;
	padding: 5px 0;
	border: 2px solid var(--fifth);
	border-radius: 25px;
	color: var(--black);
	transition: 0.5s;
	margin: 0 10px;
}

form .btn:hover {
	border: 2px solid var(--fifth);
	color: var(--white);
	border-radius: 50px;
}


.map {
	height: 300px;
	margin-bottom: 30px;
}


.map iframe{
	height: 100%;
	width: 100%;
}




/*---------------- OUR SERVICES -------------------*/


.common {
	margin-bottom: 30px;
}

.common .service-card {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 20px;
}

.common .service-card:nth-child(even) {
	flex-direction: row-reverse;
}

.common .service-card .service-card-sec {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 50%;
	height: auto;
	text-align: center;
	position: relative;
	line-height: 30px;
	overflow: hidden;
	margin-bottom: 10px;
}

.common .service-card .service-card-sec:nth-child(1) {
	padding: 30px 0;
}

.common .service-card .service-card-sec img {
	width: 100%;
	object-fit: cover;
	object-position: center center;
	transition: 0.3s;
	filter: grayscale(70%);
}

.common .service-card:hover .service-card-sec img {
	transform: scale(1.02);
	filter: grayscale(0%);
} 


.common .service-card .service-card-sec::before {
	content: "Sheer Fabric";
	font-size: 70px;
	font-style: italic;
	font-weight: 700;
	color: var(--third);
	line-height: 1;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: -1;
}









/*---------------- FABRIC PRINTING -------------------*/









/*---------------- ABOUT US -------------------*/





.top-image {
	height: auto;
	margin-bottom: 30px;
	width: 100%;
	height: 300px;
	overflow: hidden;
	position: relative;
}

.top-image .intro-head {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: var(--white);
}

.top-image img {
	width: 100%;
	object-fit: cover;
	transition: 0.3s;
	transform: scale(1.02);
}

.top-image img:hover {
	transform: scale(1.0);
}


.about-main {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 30px;
}

.about-box:nth-child(1) {
	width: 20%;
	overflow: hidden;
}

.about-box:nth-child(1) img{
	width: 100%;
	transition: 0.3s;
}

.about-box:nth-child(1) img:hover{
	transform: scale(1.1);
}

.about-box:nth-child(2) {
	width: 80%;
	padding: 10px 20px;
	text-align: justify;
}







/*---------------- VISION -------------------*/



.vision {
	height: 400px;
	width: 100%;
	background-image: url(../media/img-image-13.jpg);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	margin-bottom: 30px;
	text-align: center;
	position: relative;
	color: var(--third);
}

.vision-inner {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 80%;
	background-color: var(--main);
	padding: 20px;
	line-height: 30px;
	opacity: 0.7;
}









/*---------------- CUSTOMIZATION -------------------*/




.customization {
	margin-bottom: 30px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-gap: 20px;
}


.customization .customization-card {
	height: 300px;
	width: 300px;
	position: relative;
	border-radius: 10px;
	overflow: hidden;
}

.customization .customization-card:hover img{
	transform: scale(1.0);
}

.customization .customization-image img{
	width: 100%;
	transform: scale(1.02);
	transition: 0.3s;
} 

.customization .customization-text {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 30px;
	color: var(--white);
	text-transform: uppercase;
	text-align: center;
}















/*---------------- PORTFOLIO -------------------*/




.portfolio {
	margin-bottom: 30px;
	display: grid;
	grid-gap: 30px;
	grid-template-columns: repeat(3, 1fr);
}

.portfolio .portfolio-card {
	height: 350px;
	position: relative;
	overflow: hidden;
	border: 3px solid var(--third);
	transition: 0.3s;
}

.portfolio .portfolio-card:hover {
	border-radius: 25px 0;
	border: 3px solid var(--main);
}

.portfolio .portfolio-card img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}


.portfolio .portfolio-card::after {
	content: "Sheer Fabric";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-45deg);
	opacity: 0.5;
	font-size: 50px;
	font-weight: bold;
}



.prc-card {
	border:0px solid red;
	margin-bottom: 30px;
	padding:30px 15px;
	background-color: var(--main);
	position: relative;
	height: calc(100% - 30px);
}
.prc-card h3 {
	border: 0px solid red;
	margin-bottom: 20px;
}
.prc-card h3 a {
	font-size: 22px;
	margin:0;
}
.prc-card .subcat {
	background-color: var(--fifth);
	padding: 20px 20px;
/*	position: relative;*/
	height: calc(100% - 40px);
}
.prc-card h4 {
	margin: 0;
}
.prc-card h4 a {
	font-size: 18px;
	margin:0;
	color: white;
}