#page{
	width:50%; 
	border:2px solid white; 
	margin:auto;
	background-color:white;
	border-radius:10px;
	margin-bottom:10px;
	
}
#menubox{
	float: left;
    width: 24%;
}
#menubar{
	display:none;
}
.box{
	width:96%; 
	border:2px solid #033603;
	height:237px;
	margin:10px; 
	background-color:#033603;
	border-radius:10px;
}
#text{
	width:50%;
	margin:auto;
	color:#11b1f3;
	font-size: 27px;
    margin-bottom: -10px;
	font-family: -webkit-pictograph;
}
#menu{
    float: right;
    background-color: white;
    text-align: center;
    border-radius: 10px;
    padding-left: 15px;
	
}
li{
   padding: 10px;
    text-align: left;
    list-style: none;
    margin-left: -15px;
    color: #11b1f3;
    font-family: sans-serif;
}

li:hover{
	background-color:#CD22A2;
	border-radius:10px;
	color:white;
}
a{
	text-decoration:none;
}


    /* Mobile
        Extra small devices (phones, 400px and down) */
    @media only screen and (max-width: 400px) {
     
    }
 
    /* Devices (phones, 400px and down till 600) */
   @media only screen and (min-width: 500px) and (max-width: 800px){

		#page{
			width:85%;
		}
		#menubox{
			display:none;
			width: 36%;
			position: absolute;
			top: 194px;
			left: 3%;
	    }
		#menu{
		   background-color: #eaf3f9;
		}
		#menubar{
		  display:block;
		  float:left;
		  padding:7px;
		}
		#text{
			margin-left:10%;
		}
	}
   
    /* Desktop
        Medium devices (landscape tablets, 768px and up) */
    @media only screen and (min-width: 300px) and (max-width: 499px){

		#page{
			width:85%;
		}
		#menubox{
			display:none;
			width: 58%;
			position: absolute;
			top: 194px;
			left: 2%;
		}
        #menu{
		   background-color: #eaf3f9;
	    }
	    #menubar{
		  display:block;
		  float:left;
		  padding:7px;
	    }
		#text{
			margin-left:10%;
			width:70%;
		}
		.box{
			 margin: 5px;
             height: 150px;
		}
     
    }
   
    /* Large devices (laptops/desktops, 992px and up) */
    @media only screen and (min-width: 992px) {
       
    }

    /* Extra large devices (large laptops and desktops, 1200px and up) */
    @media only screen and (min-width: 1200px) {
		#menu{
		
		}
         
    }