/* Smartphones (landscape) -----------    working 100 %          iphone 14 landscape    */
@media only screen 
and (min-width : 321px) {

.myDiv {
    font-size:12px !important;
    background-color: #F5F5F5;  
	padding: 10px;
	border-radius: 0px 0px 15px 15px;
	border: 2px outset black;
	text-align: center;
	width: 85%;
	box-shadow:  10px 10px 10px rgb(100 100 100);
	margin:0 auto;	
    }
}
 
/* Smartphones (portrait) -----------  working 100 %    iphone 14 portrait */
@media only screen 
and (max-width : 499px) {

.myDiv {
    font-size:10px !important;
    background-color: #F5F5F5 !important; 
	padding: 10px;
	border-radius: 0px 0px 15px 15px;
	border: 2px outset black;
	text-align: center;
	width: 85%;
	box-shadow:  10px 10px 10px rgb(100 100 100);
	margin:0 auto;		 
    }
}
 
/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {

.myDiv {
    font-size:18px !important;
    background-color: #F5F5F5 !important; 
	padding: 10px;
	border-radius: 0px 0px 15px 15px;
	border: 2px outset black;
	text-align: center;
	width: 85%;
	box-shadow:  10px 10px 10px rgb(100 100 100);
	margin:0 auto;		 
    }
}
 
/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {

.myDiv {
    font-size:18px !important;
    background-color: #F5F5F5 !important;  
	padding: 10px;
	border-radius: 0px 0px 15px 15px;
	border: 2px outset black;
	text-align: center;
	width: 85%;
	box-shadow:  10px 10px 10px rgb(100 100 100);
	margin:0 auto;			 
    }
}
 
/* iPads (portrait) -----------       p { font-size: 20px;}    */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {

.myDiv {
    font-size:18px !important;
    background-color: #F5F5F5 !important;
	padding: 10px;
	border-radius: 0px 0px 15px 15px;
	border: 2px outset black;
	text-align: center;
	width: 85%;
	box-shadow:  10px 10px 10px rgb(100 100 100);
	margin:0 auto;			  
    }
}
 
/* Desktops and laptops -----------      working 100%*/
@media only screen 
and (min-width : 1224px) {

.myDiv {
    font-size:22px !important;
    background-color: #F5F5F5 !important; 
	padding: 10px;
	border-radius: 0px 0px 15px 15px;
	border: 2px outset black;
	text-align: center;
	width: 85%;
	box-shadow:  10px 10px 10px rgb(100 100 100);
	margin:0 auto;				
    }
     
}
 
/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {

.myDiv {
    font-size:22px !important;
    background-color: #F5F5F5 !important;  
	padding: 10px;
	border-radius: 0px 0px 15px 15px;
	border: 2px outset black;
	text-align: center;
	width: 85%;
	box-shadow:  10px 10px 10px rgb(100 100 100);
	margin:0 auto;				 
    }
}
 
/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {

}