:root{
   --pri_color :#1a76d1;
   --sec_color :#e12454;
   --uni_color :#223a66;
}
body{
	font-family :-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}
.pre_nav{
	background-color:var(--uni_color);
	width : 100%;
	color : #ffffff;
	height : 50px;
	z-index : 100;
}


.first_section{
	width : 100%;
	min-height : 50dvh;
	min-height : 50vh;
	margin-top : -80px;
}

.drug_details_image{
	width : 100%;
}




.second_section_flex{
	display : flex;
	width : 100%;
	margin-top : 50px;
	padding-left : 20px;
}

.drug_image{
	width : 500px;
	height : 500px;
}
.right{
	width : 40%;
}
.stock{
	background-color : var(--uni_color);
	color : #ffffff;
	font-weight : 600;
	border-radius : 50px;
	width : 120px;
	padding-left : 5px;
	text-align : center;
}

.pre_sale_question{
	background-color : var(--uni_color);
	display : flex;
	height : 100px;
	border-radius:3px;
	width : 100%;
	align-items:center;
}
.pre_sale_question_content{
	color :#ffffff;
	font-weight : 600;
	font-size : 1.12rem;
	height : 50px;
	line-height : 1rem;
}

.add_cart{
	width : 150px;
	height : 45px;
	background-color : var(--sec_color);
	border-radius : 50px;
	border : none;
	outline : none;
	color : #ffffff;
	font-weight : 600;
	
}
.add_cart:hover{
	background-color :#ffffff;
	border :solid 3px var(--sec_color);
	outline : none;
	color : var(--sec_color);
	font-weight : 600;
	
}

.second_section h1{
	color : var(--uni_color);
	font-weight : 600;
}

.second_section h2{
	color : var(--uni_color);
	font-weight : 500;
	font-size : 2.5rem;
}

.quantity{
	background-color : lavender;
	border-radius : 50px;
	width : 125px;
	height : 45px;
	display : flex;
	align-items : center;
	justify-content :space-between;
	font-size : 1.18rem;
	padding:0 7.5px;
	float : left;
	margin-right : 20px;
}
.quantity_plus, .quantity_minus{
	background : none;
	border:none;
	outline : none;
}

.modal{

}
.modal-content{
	background-color : #6dbd28;
	height : 65px;
	width : 100%;
}


.modal-body p{
	color : #ffffff;
}

/*****THIRD SECTION*****/
.third_section{
	width : 100%;
	background-color : #f1f1f2;
    padding-top :50px;
    padding-bottom :50px;
}
.third_section_content{
	margin-left : 3%;
	color : var(--uni_color);
	border : solid 2px #3e3e3e33;
	border-radius : 4px;
	width : 80%;
	padding: 30px;
}
.fab{
	font-size : 1.2rem;
}
.second_section .social_media_icons{
	display : flex;
}
.second_section .sm_icon{
	width : 30px;
	height : 30px;
	background-color:#3f51b5;
	margin : 0 5px;
	border-radius : 2px;
	color : #ffffff;
	display : flex;
	align-items : center;
	justify-content : center;
}
.second_section .sm_icon:nth-child(1n){
	background-color : #40c351;
}
.second_section .sm_icon:nth-child(2n){
	background-color : #3f51b5;
}

.second_section .sm_icon:nth-child(3n){
	background-color : #03a9f4;
}
.second_section .sm_icon:nth-child(4n){
	background-color : #f84301;
}
.second_section .sm_icon:nth-child(5n){
	background-color :#0078d4;
}


@media(max-width : 950px){

    .pre_nav{
    	background-color:var(--uni_color);
    	width : 100%;
    	color : #ffffff;
    	height : 50px;
    	z-index : 100;
    }
    
    
    .first_section{
    	width : 100%;
    }
    
    .second_section_flex{
    	display : flex;
    	width : 100%;
    	margin-top : 50px;
    }
    
    .drug_image{
    	/* width : 80%; */
    }
    .right{
    	width : 40%;
    }
    
    .add_cart{
    	width : 150px;
    	height : 45px;
    	background-color : var(--sec_color);
    	border-radius : 50px;
    	border : none;
    	outline : none;
    	color : #ffffff;
    	font-weight : 600;
    	
    }
    
    .second_section h1{
    	color : var(--uni_color);
    	font-weight : 600;
		font-size : 1.75rem
    }
    
    .second_section h2{
    	color : var(--uni_color);
    	font-weight : 500;
    	font-size : 1.5rem;
    }
    
    .quantity{
    	background-color : lavender;
    	border-radius : 50px;
    	width : 125px;
    	height : 45px;
    	display : flex;
    	align-items : center;
    	justify-content :space-between;
    	font-size : 1.18rem;
    	padding:0 7.5px;
    	float : left;
    	margin-right : 20px;
    }
    .quantity_plus, .quantity_minus{
    	background : none;
    	border:none;
    	outline : none;
    }
    
    /*****THIRD SECTION*****/
    .third_section{
    	width : 100%;
    	background-color : #f1f1f2;
        padding-top :50px;
        padding-bottom :50px;
    }
    .third_section_content{
    	margin-left : 3%;
    	color : var(--uni_color);
    	border : solid 2px #3e3e3e33;
    	border-radius : 4px;
    	width : 80%;
    	padding: 30px;
    }
    .fab{
    	font-size : 1.2rem;
    }
    .second_section .social_media_icons{
    	display : flex;
    }
    .second_section .sm_icon{
    	width : 30px;
    	height : 30px;
    	background-color:#3f51b5;
    	margin : 0 5px;
    	border-radius : 2px;
    	color : #ffffff;
    	display : flex;
    	align-items : center;
    	justify-content : center;
    }
    .second_section .sm_icon:nth-child(1n){
    	background-color : #40c351;
    }
    .second_section .sm_icon:nth-child(2n){
    	background-color : #3f51b5;
    }
    
    .second_section .sm_icon:nth-child(3n){
    	background-color : #03a9f4;
    }
    .second_section .sm_icon:nth-child(4n){
    	background-color : #f84301;
    }
    .second_section .sm_icon:nth-child(5n){
    	background-color :#0078d4;
    }	
	
}



@media(max-width:825px){

    .pre_nav{
    	background-color:var(--uni_color);
    	width : 100%;
    	color : #ffffff;
    	height : 50px;
    	z-index : 100;
    }
    
    
    .first_section{
    	width : 100%;
    }
    
    .second_section_flex{
    	display : flex;
    	width : 100%;
    	margin-top : 50px;
    }
    
    .drug_image{
    	/* width : 80%; */
    }
    .right{
    	width : 40%;
    }
    .pre_sale_question{
        background-color : var(--uni_color);
        border-radius:3px;
        width : 100%;
        align-items:center;
    }
    .pre_sale_question_content{
    	color :#ffffff;
    	font-weight : 600;
    	font-size : 1rem;
    }    
    .add_cart{
    	width : 150px;
    	height : 45px;
    	background-color : var(--sec_color);
    	border-radius : 50px;
    	border : none;
    	outline : none;
    	color : #ffffff;
    	font-weight : 600;
		margin-top : 15px;
    	
    }
    
    .second_section h1{
    	color : var(--uni_color);
    	font-weight : 600;
		font-size : 1.35rem
    }
    
    .second_section h2{
    	color : var(--uni_color);
    	font-weight : 500;
    	font-size : 1.5rem;
    }
    
    .quantity{
    	background-color : lavender;
    	border-radius : 50px;
    	width : 150px;
    	height : 45px;
    	display : flex;
    	align-items : center;
    	justify-content :space-between;
    	font-size : 1.18rem;
    	padding:0 7.5px;
    	float : left;
    	margin-right : 20px;
    }
    .quantity_plus, .quantity_minus{
    	background : none;
    	border:none;
    	outline : none;
    }
    
    /*****THIRD SECTION*****/
    .third_section{
    	width : 100%;
    	background-color : #f1f1f2;
        padding-top :50px;
        padding-bottom :50px;
    }
    .third_section_content{
    	margin-left : 3%;
    	color : var(--uni_color);
    	border : solid 2px #3e3e3e33;
    	border-radius : 4px;
    	width : 80%;
    	padding: 30px;
    }
    .fab{
    	font-size : 1.2rem;
    }
    .second_section .social_media_icons{
    	display : flex;
    }
    .second_section .sm_icon{
    	width : 30px;
    	height : 30px;
    	background-color:#3f51b5;
    	margin : 0 5px;
    	border-radius : 2px;
    	color : #ffffff;
    	display : flex;
    	align-items : center;
    	justify-content : center;
    }
    .second_section .sm_icon:nth-child(1n){
    	background-color : #40c351;
    }
    .second_section .sm_icon:nth-child(2n){
    	background-color : #3f51b5;
    }
    
    .second_section .sm_icon:nth-child(3n){
    	background-color : #03a9f4;
    }
    .second_section .sm_icon:nth-child(4n){
    	background-color : #f84301;
    }
    .second_section .sm_icon:nth-child(5n){
    	background-color :#0078d4;
    }	
	
}




@media(max-width : 750px){

    .pre_nav{
    	background-color:var(--uni_color);
    	width : 100%;
    	color : #ffffff;
    	height : 50px;
    	z-index : 100;
    }
    
    
    .first_section{
    	width : 100%;
    }
   .drug_details_image{
	   margin-top : 100px;
   }
    .second_section_flex{
    	display : block;
    	width : 100%;
    	margin-top : 50px;
    	margin-bottom : 50px;
		padding-left : 20px;
    }
    
    .drug_image{
    	/* width : 300px; */
	    /* height : 300px; */
    }
    .right{
    	width :80%;
    }
	.left{
		width :80%;
	}
    
    .add_cart{
    	width : 150px;
    	height : 45px;
    	background-color : var(--sec_color);
    	border-radius : 50px;
    	border : none;
    	outline : none;
    	color : #ffffff;
    	font-weight : 600;
		margin-top : 0;
    	
    }
    
    .second_section h1{
    	color : var(--uni_color);
    	font-weight : 600;
		font-size : 1.5rem
    }
    
    .second_section h2{
    	color : var(--uni_color);
    	font-weight : 500;
    	font-size : 1.5rem;
    }
    
    .quantity{
    	background-color : lavender;
    	border-radius : 50px;
    	width : 150px;
    	height : 45px;
    	display : flex;
    	align-items : center;
    	justify-content :space-between;
    	font-size : 1.18rem;
    	padding:0 7.5px;
    	float : left;
    	margin-right : 20px;
    }
    .quantity_plus, .quantity_minus{
    	background : none;
    	border:none;
    	outline : none;
    }
    
    /*****THIRD SECTION*****/
    .third_section{
    	width : 100%;
    	background-color : #f1f1f2;
        padding-top :50px;
        padding-bottom :50px;
    }
    .third_section_content{
    	margin-left : 3%;
    	color : var(--uni_color);
    	border : solid 2px #3e3e3e33;
    	border-radius : 4px;
    	width : 90%;
    	padding: 30px;
    }
	.third_section_content h3{
		font-size : 1.2rem;
	}
    .fab{
    	font-size : 1.2rem;
    }
    .social_media_icons{
    	display : flex;
    }
    .second_section .sm_icon{
    	width : 30px;
    	height : 30px;
    	background-color:#3f51b5;
    	margin : 0 5px;
    	border-radius : 2px;
    	color : #ffffff;
    	display : flex;
    	align-items : center;
    	justify-content : center;
    }
    .second_section .sm_icon:nth-child(1n){
    	background-color : #40c351;
    }
    .second_section .sm_icon:nth-child(2n){
    	background-color : #3f51b5;
    }
    
    .second_section .sm_icon:nth-child(3n){
    	background-color : #03a9f4;
    }
    .second_section .sm_icon:nth-child(4n){
    	background-color : #f84301;
    }
    .second_section .sm_icon:nth-child(5n){
    	background-color :#0078d4;
    }	
	
}



@media(max-width : 375px){

    .pre_nav{
    	background-color:var(--uni_color);
    	width : 100%;
    	color : #ffffff;
    	height : 50px;
    	z-index : 100;
    }
    
    
    .first_section{
    	width : 100%;
    }
   
    .second_section_flex{
    	display : block;
    	width : 100%;
    	margin-top : 50px;
    	margin-bottom : 50px;
		padding-left : 20px;
    }
    
    .drug_image{
    	/* width : 300px; */
	    /* height : 300px; */
    }
    .right{
    	width :80%;
    }
	.left{
		width :80%;
	}
    
    .add_cart{
    	width : 150px;
    	height : 45px;
    	background-color : var(--sec_color);
    	border-radius : 50px;
    	border : none;
    	outline : none;
    	color : #ffffff;
    	font-weight : 600;
		margin-top : 0;
    	
    }
	.mobile_add_cart{
		margin-top : 5px;
	}
    
    .second_section h1{
    	color : var(--uni_color);
    	font-weight : 600;
		font-size : 1.5rem
    }
    
    .second_section h2{
    	color : var(--uni_color);
    	font-weight : 500;
    	font-size : 1.5rem;
    }
    
    .quantity{
    	background-color : lavender;
    	border-radius : 50px;
    	width : 150px;
    	height : 45px;
    	display : flex;
    	align-items : center;
    	justify-content :space-between;
    	font-size : 1.18rem;
    	padding:0 7.5px;
    	float : left;
    	margin-right : 20px;
    }
    .quantity_plus, .quantity_minus{
    	background : none;
    	border:none;
    	outline : none;
    }
    
    /*****THIRD SECTION*****/
    .third_section{
    	width : 100%;
    	background-color : #f1f1f2;
        padding-top :50px;
        padding-bottom :50px;
    }
    .third_section_content{
    	margin-left : 3%;
    	color : var(--uni_color);
    	border : solid 2px #3e3e3e33;
    	border-radius : 4px;
    	width : 90%;
    	padding: 30px;
    }
	.third_section_content h3{
		font-size : 1.2rem;
	}
    .fab{
    	font-size : 1.2rem;
    }
    .social_media_icons{
    	display : flex;
    }
    .second_section .sm_icon{
    	width : 30px;
    	height : 30px;
    	background-color:#3f51b5;
    	margin : 0 5px;
    	border-radius : 2px;
    	color : #ffffff;
    	display : flex;
    	align-items : center;
    	justify-content : center;
    }
    .second_section .sm_icon:nth-child(1n){
    	background-color : #40c351;
    }
    .second_section .sm_icon:nth-child(2n){
    	background-color : #3f51b5;
    }
    
    .second_section .sm_icon:nth-child(3n){
    	background-color : #03a9f4;
    }
    .second_section .sm_icon:nth-child(4n){
    	background-color : #f84301;
    }
    .second_section .sm_icon:nth-child(5n){
    	background-color :#0078d4;
    }	
	
}