CSS help! need help in moving my navigation bar?

here’s the link:
https://sapatero.com/shop/?page_id=3&cate…

I wanted to move the navigation bar(pinkish) down just above the white area for the body but i just can’t seem to find what to tweak. I’m kinda new in CSS.

here’s the CSS code:

/*
Theme Name: Crafty Cart
Version: 1.0.7
Author: Billion Studio
Author URI: https://www.billionstudio.com/
Tags: two columns, e-commerce, shop, cart, widgets, gravatars
Description: A Retro Shop Theme designed for the WP e-Commerce Plugin
Licence: This theme is released under the terms of the GPL Version 2 Licence.
*/

@import url(‘./style-reset.css’);
@import url(‘./style-common.css’);

/* Default fonts and colors
======================================… */
body,h1,h2,h3,h4,h5,h6,p,ul,ol,dl,inpu… {
color: #375362;
font-family: “Verdana”, “Lucida Fax”, “Lucida Grande”, “Lucida Sans Unicode”, Arial, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
color: #666;
font-family: “Century Schoolbook”, “Century”, Georgia, “Times New Roman”, serif;
font-weight: normal;
}

/* LAYOUT
======================================… */
body {
font-size: 70%;
line-height: 150%;
background: url(‘images/bg-page.png’) repeat-x left top;
background-color: #FCF1D3;
}

div#page {
width: 820px;
margin: 0 auto;
}

div.container {
width: 820px;
margin: 0 auto;
height: 100%;
overflow: auto;
}

div.small {
width: 220px;
float: left;
}

div.large {
width: 600px;
float: right;
}

div.full {
width: 100%;
float: left;
}

#content div.container.body .large {
background-color: #fff;
padding-top: 16px;
padding-bottom: 20px;
}

/* HEADER
======================================… */
#header {
width: 100%;
margin: 0 auto;
}

#header .container {
padding: 25px 0 40px;
background: url(‘images/logo.png’) no-repeat 3px bottom;
}

#header h1,
#header h4 {
text-transform: none;
}

#header h1,
#header h4,
#header h1 a {
color: #666;
}

#header h1 {
display: block;
font-weight: normal;
float: left;
padding: 0 20px 1px 0;
margin: 0 12px 0 0;
width: 200px;
text-align: left;
}
#header h1:first-line {
font-weight: bold;
}
#header h1 a,
#header h1 a:visited {
display: block;
padding-left: 30px;
color: #4D3F44;
text-decoration: none;
width: auto;
}

#header h4 {
font-size: 120%;
float: right;
letter-spacing: 1px;
padding: 0;
line-height: 100%;
text-transform: uppercase;
}

/* SUB HEADER
======================================… */
#sub-header {
clear: both;
width: 100%;
margin: 0 auto;
background-color: #DA424E;
}
#sub-header ul {
padding: 6px 70px 6px 12px;
height: 100%;
overflow: auto;
color: #fff;
font-weight: bold;
}
#sub-header ul li {
display: block;
float: left;
white-space: nowrap;
padding: 0;
}
#sub-header ul li.first {
border-left: 0;
}
#sub-header ul li a {
color: #ddd;
display: block;
line-height: 100%;
float: left;
padding: 5px 10px 5px;
}
#sub-header ul li a:hover {
color: #fff;
text-decoration: none;
}
#sub-header ul li.current-cat a {
color: #fff;
text-shadow: none;
}
#sub-header ul li ul {
display: none;
}

/* MAIN NAVIGATION
======================================… */
#navigation {
clear: both;
width: 100%;
margin: 0 auto;
background: url(‘images/bg-nav.png’) no-repeat left top;
}
#navigation .container {
position: relative;
height: 144px;
overflow: visible;
}
#nav {
position: relative;
float: right;
height: 42px;
margin: 0;
padding: 0;
list-style-type: none;
z-index: 100;
background: transparent url(images/nav-bg.gif) repeat-x left top;
background-color: #DB4650;
text-align: right;
line-height: 175%;

}
#nav li {
position: relative;
float: left;
height: 42px;
font-size: 100%;
}
#nav li.last-page-item a {
background-image: none;
}
#nav li a {
display: block;
float: left;
background: url(images/nav-separator.gif) no-repeat right top;
padding: 11px 12px 10px;
color: #fff;
font-weight: normal;
text-decoration: none;
white-space: nowrap;
text-align: left;
}
#nav li a:hover,
#nav ul li a:hover,
#nav li.current_page_item a,
#nav li.current_page_parent a {
color: #FFD3D4;
}

#nav li ul {
position: absolute;
visibility: hidden;
float: none;
top: 144px;
left: 0px;
width: 150px;
margin: 0;
padding: 5px 10px 6px 10px;
z-index: 10000;
border: 1px solid #C0ACB2;
border-bottom-width: 2px;
border-bottom-color: #AF9DA3;
border-top: 0;
background-color: #fff;
opacity: 0.97;
}

#nav li:hover ul,
#nav li.iehover ul {
visibility: visible;
}
#nav ul li{
display: block;
float: left;
clear: both;
margin: 0;
padding: 0;
width: 100%;
height: auto;
font-size: 100%;
line-height: 100%;
overflow: hidden;
white-space: normal;
border-bottom: 1px dotted #E1DAB7;
}
#nav ul li:last-child {
border-bottom: 0;
}
#nav