body {	box-sizing:border-box;}


.gridd { 		display:grid;  	grid-template-columns: repeat(4, auto);  	grid-auto-rows:auto;  				gap:5px;  		padding:5px;  			Background-color:white; 		 }  
.griddsm { 		display:grid;  	grid-template-columns: repeat(3, auto);  	grid-auto-rows:auto;  				gap:2px;  		padding:2px;  			Background-color:white; 	object-fit:contain;	 }
.griddsm img{  	margin:auto; 	width:400px;  			height:auto;  	cursor:pointer;  	align-items:top;  	object-fit:contain;  	  									}   
.griddld {		display:grid;  	grid-template-columns: repeat(3, auto);  	grid-auto-rows:auto;  				gap:5px;  		padding:5px;  			Background-color:white; 	object-fit:contain;	 }  
.griddld > img{  	margin:auto; 	width:500px;  			height:auto;  	cursor:pointer;  	align-items:top;  	object-fit:contain;  	  									}

.fgridd { display;grid;  				grid-template-columns:auto; 				grid-template-rows:400px 20px 20px; row-gap:2px;	margin:auto;  			background-color:white; 		 }  
.fgridd > p {width:300px; 			 	text-align:center;  						top:0;  							color:blue; 	font-family: "candara"; font-size: 15px;				 }
.fgridd > img {  				margin:auto;  				width:300px;  			height:400px;  	cursor:pointer;  	align-items:top;  	object-fit:contain;   }

div.gallery {border: 1px solid #ff0000;	width:250px;  								margin:10px;  						height: auto;  	padding: 0px;  			float:left;  overflow:hidden;  	 }  
.responsive {   padding: 0 6px;   float: left;   width: 24.99999%;   height:auto;   overflow:hidden; }  
@media only screen and (max-width: 700px) {   
											.responsive {     width: 49.99999%;     margin: 6px 0;     overflow:hidden;   } }
@media only screen and (max-width: 500px) {   
											.responsive {     width: 100%;     overflow:hidden;   } } 
.w3-modal{ 	z-index:1; 	display:none; 	padding-top:1px; 	position:fixed; 	left:0; 	top:0; 	width:100%; 	height:100%; 	overflow:auto; 	background-color:rgba(0,0,0,.7); 	background-color:rgba(250,210,195) 	} 	  
.w3-modal-content{ 	display:grid; 	grid-template-columns: 2fr 10fr 2fr; 	margin-left:auto; 	margin-right:auto; 	background-color:rgba(0,0,0, 0.7); 	position:relative; 	padding:0; 	outline:0; 	width:95%;}
.w3-display-topright{position:absolute;right:0;top:0}

img {  				margin:auto;  				width:300px;  			height:400px;  	cursor:pointer;  	align-items:top;  	object-fit:cover;  	  									}
div.gallery img {   width: 100%;    			height: auto; 																				 		  									}
.thmbn {   			border: 5px solid #93ff00; 	border-radius:10px;   	width:230px; 	height: auto; 		padding: 0px; 		float:left; overflow:hidden; width: 100%; height: auto; }

.kahanieng {text-align:justify;  	margin-left:10px;  	padding:5px;  	font-family:"Georgia";  		font-size:15px;  	color:#ffffff;  	font-weight:bold;  }  
.kahaniguj {text-align:justify;  	margin-right:10px;  padding:5px;  	font-family:"Arial Uncode MS";  font-size:15px;  	color:#ffffff;  	font-weight:bold;  }
div.desc { font-family:Arial Unicode MS; font-size:15px;   padding: 2px; text-align:center; }
h2 { color:#0000ff; text-align:center; font-family:Caudex, sans-serif; }
p  {text-align:center;}

span.btn {  	display:flex;  										justify-content:center; height:70px;	align-items:center;  																				  }
.btn { width: 200px;height: 60px; border-radius:50px; border-color:green; font-size:20px; text-align: center; color:#00ff00; cursor:pointer; position:relative; display:inline-block; margin:auto; } 
button.btnimg1 { background-image: url('blueseabtn.png'); background-repeat: no-repeat; background-position: center; } 
button.btnimg2 { background-image: url('Button hampi btn3.png'); width:200px; height:60px; text-align:center;  background-repeat: no-repeat; background-position: center; } 
button.btnimg3 { background-image: url('sosun.png'); 			 width:200px; height:60px; text-align:center;  background-repeat: no-repeat; background-position: center; } 
.w3-button{ 	border: 2px solid red; 	display:inline-block; 	padding:8px; 	vertical-align:middle; 	overflow:hidden; 	width:30px; 	height:30px; 	color:black; 	background-color:yellow; 	text-align:center; 	cursor:pointer; 	white-space:nowrap}

.flex-container {   	display: inline-flex;   background-color:  #ddfba5 ;   width:1200px;   height:auto; } 
.display-boxp 	{ 		display:flex; margin:auto; height:530px; object-fit:contain; width:100%;            } 
.flex-container > img { width:20%;   	height:auto;   	cursor:pointer;	 }
.wrapper {   			display:flex; 	flex-wrap:wrap; place-content:center; object-fit:contain;	width:100%; height: 310px; align-content:space-between } 
.box {   				border: 1px solid blue; } 
.box img {   			width: 300px;   height: 300px; } 
.boxcover img {   		object-fit: cover; } 
.boxcontain img {   	object-fit: contain; } 
.boxscale-down img {   	object-fit: fill; }
section {				display:flex;align-item:center; justify-content:center;}