body {
    min-height: 100%;
    margin: 0;
    background-image:url('images/sky.png');
    padding: 40px;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    font-size: 17px;
}
.wrapper{
    font-size:17px;
   	width:auto;
    background-color: aliceblue; 
	border:10px solid #6188B5;
	box-shadow:20px 40px 30px #2A5570;
    text-align: center;
    padding-right:30px;
    padding-top: 30px;
    padding-bottom: 30px;
    border-radius:50px;	/*rounds the corners of the border*/
   
 }
.flexbox
    {
    height:auto;    /* set height to auto to accommodate box-sizing */
    width:auto;	/* sets the flexbox width */
    }
    
.flexbox li
    {	/* sets the layout of the flexbox list */
	width:auto;
	background-color:#B6C4D9;
	border:5px solid hsla(200,50%,52%,1.00);
	box-shadow:10px 20px 30px gray;
	border-radius:10px;	/*rounds the corners of the border */
	margin-left:3px;
	margin-right:3px;
	margin-bottom:15px;
	padding-left:6px;
	padding-right:6px;
	padding-bottom:3px;
	padding-top:15px;
	list-style-type:none;  /*turns off the bullet points */
    }
	

/* tablet size and bigger */

@media(min-width: 48rem) 
{
    body{
        padding: 100px;
        }
    .wrapper
        {
        align-content: center;
   	    width:auto;
        height:auto;
        }

}