Shilpa

css/makeup.css

@@ -0,0 +1,225 @@
+/*********************************PRODUCT MAKEUP PAGE******************************************************/
+@font-face {
+  font-family:calibre;
+  src: url("./font/CalibreLight.otf");
+}
+.makeup-page{
+	font-family: calibre;
+}
+.makeup--IMG{
+	height:60vh;
+	background-image: url(https://images.forestessentialsindia.com/pub/media/makeup/Makeup_collection_category_desktop.jpg);
+	background-size: cover;
+	text-align:center;
+	position:relative;
+	color:#fff;
+}
+
+.makeup--header{
+	position: absolute;
+	z-index: 2;
+	font-size:48px !important;
+	margin: 0;
+	text-transform: uppercase;
+	font-family: 'Calluna';
+	top:50%;
+	left: 50%;
+	font-weight:300;
+	transform: translate(-50% , -50%);
+	text-shadow: 0px 1px 0px #333;
+}
+.makeup_product--wrap{
+	padding:30px;
+}
+.Makeup_product--1{
+	display:flex;
+	height:80vh;
+}
+
+.makeup--vedio{
+	flex-basis:55%;
+	margin-right:15px;
+}
+
+.video-wrap{
+	display:flex;
+	align-items: center;
+	justify-content: center;
+	position:relative;
+}
+
+.video-wrap video{
+	object-fit: cover;
+	position: absolute;
+	top: 0;
+	left: 0;
+	width:100%;
+	height: 100%;
+}
+
+.product-img{
+	margin-right:15px;
+	flex-basis:25%;
+	background: #fbf9f9;
+}
+
+.product-info{
+	font-size:11px;
+	letter-spacing: 3px;
+	padding:15px;
+	font-weight:100;
+	line-height:20px;
+}
+.product-info span{
+	display:block;
+}
+.color-platte{
+	display:flex;
+
+}
+.color-platte span{
+	width:25px;
+	height:25px;
+	border-radius: 50px;
+	margin-right:10px;
+	margin-top:20px;
+	margin-bottom:30px;
+}
+
+.color-indianred{
+	background: indianred;
+}
+.color-indianredDark{
+	background: #bd6564;
+}
+.color-maroon{
+	background: maroon;
+}
+.color-darkmaroon{
+	background:#481403;
+}
+.color-navajowhite{
+	background: navajowhite;
+}
+.color-darkslategray{
+	background: darkslategray;
+}
+
+.color-dimgray{
+		background: dimgray;
+}
+
+.color-black{
+	background: black;
+}
+.color-darkblack{
+	background: #3c2512;
+}
+.color-midnightblue{
+	background: midnightblue;
+}
+
+.color-darksalmon{
+	background:#cc976d;
+}
+
+.color-rosybrown{
+	background: rosybrown;
+}
+.color-peru{
+	background: peru;
+}
+
+.color-sienna{
+	background: sienna;
+}
+/****DISCOVER SECTION************/
+
+.discovermore{
+	display:flex;
+	justify-content:center;
+	padding:2% 5%;
+	letter-spacing:2px;
+	font-size:12px;
+	background: #fbf9f9;
+	margin-top:4%;
+}
+
+.discover--ml{
+	margin-left:30px;
+}
+.discover-text{
+	padding-top:10px;
+}
+
+
+.discover-header{
+	font-size:43px;
+	font-weight: 100;
+	margin: 0;
+	margin-top:20px;
+}
+
+.discover-desciption{
+	font-size:12px;
+	line-height:25px;
+	margin-top: 25px;
+}
+
+@media screen and (max-width:789px){
+	.video-wrap video{
+		display: none;
+	}
+
+	iframe{
+		width:100%;
+		height:300px;
+	}
+
+	.Makeup_product--1{
+		height: auto;
+		flex-direction: column;
+	}
+
+	.discovermore{
+		flex-direction: column;
+	}
+
+	.discover-desciption{
+  	font-size:19px;
+  }
+  .product-img{
+  	margin-bottom:10px;
+  }
+  .discover--ml {
+    margin-left: 0px;
+  }
+
+}
+
+@media screen and (max-width:450px){
+	.video-wrap video{
+		display: none;
+	}
+
+	.Makeup_product--1{
+		height: auto;
+		flex-direction: column;
+	}
+
+	.discovermore{
+		flex-direction: column;
+	}
+	iframe{
+		width:100%;
+		height:200px;
+	}
+
+
+
+
+
+  .discover-desciption{
+  	font-size:15px;
+  }
+}