* {
  box-sizing: border-box;

}
 
html, body {
    height:100%;
}


a {
  text-decoration: none;
}
/*this controls the main top banner size */
.main-header {
  background: linear-gradient(#ffffff, #f9f2d0);
  border-bottom: 1px solid #f7e9a6;
/*  t r b l*/
  padding: 8px 6px 12px 56px;
  text-align: right;
  color: #FFCC00;
  text-shadow: #fff 4px -1px 1px;
  position: fixed;
  width: 100%;
  top: 0;
  transition: all 0.3s ease;
  font-size: 27px;  
  max-height: 56px;
  max-width: 100%;
  z-index:10001;
}
/*toggle*/
.main-header a {
	position: absolute;
	left: 11px;
	top: 6px;
	color: white;

}

.page-wrap {
  float: right;
  width: 100%;
  max-width: 100%;
  transition: width 0.3s ease;
  	margin-left: auto;
    margin-right: auto;
}

.main-nav {
  position: fixed;
  top: 56px;
  width: 0;
  height: 100%;
  background: #5baeae;
  overflow-y: auto;
  transition: width 0.3s ease;
  z-index:10001;
}

.main-nav:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 3px;
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
  
}
.mainbody {
  background: linear-gradient(to bottom, rgba(0, 153, 134, 255), rgba(0, 119, 104, 255),rgba(0, 153, 134, 255));
  background-attachment: fixed;
}
body {

}
.mwancontainer {
/*  t r b l*/

  padding: 0px 0px 60px 0px;
  margin: 0;
  overflow: hidden;
  background-color: #fff;
/*  border: 1px solid #ffd804;*/
  max-width: 100%;
  width: 100%;
  margin : 0 auto;
  min-height: 100%;
    min-height:100vh;

/*  background: linear-gradient(to bottom, rgba(255, 255, 255, 255), rgba(255, 255, 255, 255), rgba(255, 255, 255, 255), rgba(250, 246, 225, 255.0));*/
}

.mwancontentfooter {
  padding: 3px 3px 3px 3px;
  background: linear-gradient(#f9f2d0, #fff4b6);
  border-radius: 12px;
  max-width: 90%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 2px;
  border: 1px solid #f7e9a6;
  height: 34px;
}

.close-menu {
  display: none;
}

#main-nav:target + .page-wrap .open-menu {
  display: none;
}
#main-nav:target + .page-wrap .close-menu {
  display: block;
}

#main-nav:target {
  width: 32%;
  max-width: 160px;
}

#main-nav:target + .page-wrap {
  width: 100%;

}

#main-nav:target + .page-wrap .main-header {
  width: 100%;
/*  left: 30%;*/
}
<!-- Start Bottom marque section -->

        body {margin:0 0 0px} /* give space 70px on the bottom for panel */
        #panelmwan {
		width:100%;
		max-width: 100%;
		height:58px;
		border-top: #ecece9 1px solid;
		background:#fef9e0; 
		position:fixed;bottom:0;
		padding:2px;box-sizing:border-box;
		text-align:center;
		white-space:nowrap;
		line-height:1.0; 
		z-index:10001;}

    <!-- End Bottom marque section -->
