Shop Website Help

Need #main and #sidebar divs to fill parent (#container)

HTML

<body>
<div id="container">
    <div id="top">
    </div>
    <nav>
	
        <ul>
            <li class="start selected"><a href="index.html">HOME</a></li>
                <li class=""><a href="#">MEN</a></li>
            <li><a href="#">WOMEN</a></li>
            <li><a href="#">PAST ADS</a></li>
            <li><a href="#">SALES</a></li>
            <li><a href="#">SHOWS</a></li>
            <li><a href="#">NEWS</a></li>
            <li class="end"><a href="#">CONTACT</a></li>
        </ul>

    </nav>
    <div id="main">
    	<article>
			<h1>Welcome</h1>
            <br>
            <div align="center">
            </div>
            <br>
            <p>Proin a risus id diam feugiat pulvinar blandit a lorem. In nec nibh eros. Morbi vitae quam sit amet quam euismod posuere ullamcorper a velit. Nullam blandit nulla lectus, sit amet gravida eros rhoncus id. Duis at efficitur nisi, sit amet aliquet leo. Nam dolor enim, malesuada non sollicitudin eget, tempus ut nisi. Cras tellus tellus, volutpat nec nibh non, aliquet malesuada eros. Aenean placerat feugiat dolor at egestas. Aenean vulputate sapien eu erat semper tincidunt. Morbi sodales sit amet dolor vitae malesuada. Quisque vel dolor vel massa sollicitudin finibus. Nullam pharetra interdum nisi nec viverra. Aliquam in dolor efficitur, volutpat lorem ac, sodales erat. Donec id rhoncus quam.</p>

            <p>Nam laoreet sodales condimentum. Aliquam velit nunc, volutpat quis erat a, imperdiet vehicula eros. Suspendisse potenti. Phasellus diam libero, hendrerit nec mauris ac, sodales scelerisque eros. Aliquam luctus neque sed turpis tristique, in feugiat velit ultricies. Phasellus efficitur, velit eget lacinia accumsan, ipsum lacus posuere ipsum, quis elementum augue augue quis risus. Duis laoreet, turpis vel consequat tempor, tortor odio mollis orci, nec ultrices ex sem eu erat. Cras faucibus, libero sit amet viverra ultrices, elit enim imperdiet dui, ut blandit urna leo eu turpis. Quisque feugiat imperdiet...

CSS

* { margin: 0; padding: 0 }
html { height: 100%; }
body {
  position: relative;
  min-height: 100%; /* to fill screen 100% even with less content */
  height: 100%; /* to allocate only 100% height */
	background-color: #460000;
	margin:0;
	padding:0;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #fff;
	font-weight: 300;
}

#container {
  height: 100%;
	overflow: auto;
	width: 72%;
	margin: 0 auto;
	background-color:#460000;
	border-left: #ECA845 solid 8px;
	border-right: #ECA845 solid 8px;
	border-bottom: #ECA845 solid 8px;
	-webkit-box-shadow: 0px 0px 29px 14px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 29px 14px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 29px 14px rgba(0,0,0,0.75);
}
#container::-webkit-scrollbar {
 display: none;
}

body::-webkit-scrollbar {
 display: none;
}

@font-face {
    font-family: huntson;
    src: url(fonts/huntson.ttf);
}

img {
	max-width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
}

#top {
  top: 0;
	background-color: #ECA845;
	text-align:center;
	height: 505px
}

#main {
  font-size: .75em;
	background: url(image/rightt.png) repeat-y right;
	background-color: #1281A6;
  min-height: calc(100% - 505px); 
  height: auto;
	float: left;
	width: 75%;
}

#sidebar {
    background-color: #498A21;
    min-height: calc(100% - 505px);
    height: auto;
    float: left;
    width: 25%;
}

#sidebar h4 {
	font-family: huntson;
	font-size: 2.75em;
	color: #000;
	padding: 20px 0px;
	letter-spacing: -0.5px;
	text-align: center;
	border-bottom: #470C0E solid 4px;
}

#sidebar ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#sidebar ul li {
	margin-bottom: 20px;
	line-height: 1.9em;
	padding: 10px;
}

#sidebar ul li.bg {
	background-color: #333;
}


#sidebar li ul {
    list-style: none outside none;
    margin: 0px;
}

#sidebar li ul li {
	display: block;
	border-top: none;
	padding: 7px 2px;
	margin: 0;
	line-height: 1.5em;
	font-size: 0.85em;
}

#sidebar ul.blocklist {
	border-top: 1px solid #333;
}

#sidebar ul.blocklist...