/**
 * This file is for the CSS that controls how elements
 * are laid out - ie: position, size, margin & padding.
 *
 * styles.css contains the rules that control the 
 * content - ie: what elements *look like* (font,
 * colour, background, etc)
 *
 */

/******************************************************/
/*********************** LAYOUT ***********************/
/******************************************************/

#m2w_wrapper {text-align: left; margin: 0 auto; } 
#m2w_wrapper_inner { width: 993px; margin: 0 auto; } 
#m2w_main { }


/******************************************************/
/*********************** HEADER ***********************/
/******************************************************/

#m2w_header { height: 150px; position: relative; z-index: 99; } 

#m2w_header #m2w_header_headline { position: absolute; left: 280px; top: 40px; width: 319px; height: 20px; } 

#m2w_header #m2w_header_main_logo { height: 47px; width: 241px; position: absolute; top: 27px; left: 20px; }

#m2w_header #about-us-link, #m2w_header #cart-link { display: none; position: absolute; bottom: 5px; } 
#m2w_header #about-us-link { right: 15px; width: 56px; height: 20px; } 
#m2w_header #cart-link { right: 85px; width: 41px; height: 20px; }

#m2w_header #logos { position: absolute; top: 10px; right: 20px; } 
#m2w_header #logos #m2w { margin-bottom: 20px; } 
#m2w_header #logos #yt, #m2w_header #logos #fb { margin-right: 10px; }

#m2w_header #quicklinks { position: absolute; bottom: 40px; width: 100%; text-align: center; } 
#m2w_header #quicklinks ul { display: inline; list-style-type: none; margin: 0; } 
#m2w_header #quicklinks ul li { padding: 0 6px; display: inline; } 

#m2w_header #nav { position: absolute; left: 0px; top: 125px; width: 993px; height: 32px; }
/* #m2w_header #nav #nav_inner { } */

/*********************** SUPERFISH MENU ***********************/

/* keep menu panels from flashing on load.. undone in javascript */
#m2w_header ul.sf-menu ul { display: none; }

/*****/
#sf-container {
	margin: auto;
	padding: 0;
	text-align: center;
}

.sf-left {
	height: 32px;
	width: 10px;
	margin: 0;
	padding: 0;
	background: url(img/menu_first.png) no-repeat;
}

.sf-middle {
	margin: 0;
	padding: 0;
	width: auto;
}

.sf-right {
	height: 32px;
	width: 10px;
	margin: 0;
	padding: 0;
	background: url(img/menu_last.png) no-repeat;
}
/*****/

/* #m2w_header ul.sf-menu { position: absolute; bottom: 3px; left: 0px; width: 995px; height: 32px; margin: 0 auto; } */
#m2w_header ul.sf-menu { position: relative; width: auto; height: 32px; margin: 0; padding: 0; }
#m2w_header ul.sf-menu li { height: 32px; margin: 0 0px 0 0; }
#m2w_header ul.sf-menu ul { width: 454px; top: 40px; }
#m2w_header ul.sf-menu li a { position: relative; height: 10px; padding-left: 16px; padding-right: 16px; }
#m2w_header ul.sf-menu li span.beveled_text { left: 16px; position: absolute; top: 8px; display: block; }
#m2w_header ul.sf-menu li span.unlinked { display: block; height: 10px; position: static; padding: 8px 0; border-bottom: 1px dotted #cccccc; }
#m2w_header ul.sf-menu div { width: 185px; float: left; height: 224px; }
#m2w_header ul.sf-menu div.column.first {height: auto; max-height: 224px; }

#m2w_header ul.sf-menu .parent .leaf span.beveled_text { display: none; }


/*
#m2w_header ul.sf-menu { position: absolute; bottom: 3px; left: 5px; margin: 0; } 
#m2w_header ul.sf-menu ul { z-index: 99; left: 0; width: 170px } 
#m2w_header ul.sf-menu ul ul { z-index: 99; left: 155px; width: 170px; } 
#m2w_header ul.sf-menu li { margin-right: 25px;} 
#m2w_header ul.sf-menu li.last-menu { margin-right: 0px; } 
*/


/* END HEADER */


/******************************************************/
/*********************** SPACER ***********************/
/******************************************************/

/* (blank space between header and content */

#m2w_spacer { height: 30px; } 


/* END SPACER */


/******************************************************/
/*********************** CONTENT **********************/
/******************************************************/

#m2w_main { }
#m2w_main #m2w_panel { width: 186px; float: left; margin-right: 20px; } 
#m2w_main #m2w_content { float: left; width: 787px; }


/* END CONTENT */


/******************************************************/
/*********************** FOOTER ***********************/
/******************************************************/

#m2w_footer { margin-bottom: 50px; margin-top: 20px; position: relative; padding: 20px; } 

#m2w_footer ul { margin-left: 10px; } 
#m2w_footer ul ul { margin-left: 10px; } 
#m2w_footer ul li { float: left; margin-right: 20px; } 
#m2w_footer ul li li { float: none; }


/*** THIS IS THE CSS FOR THE NEW FOOTER ***/
#tagline {width: 100%;

background: #272727; /* Old browsers */
background: -moz-linear-gradient(top, #272727 0%, #303030 52%, #272727 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#272727), color-stop(52%,#303030), color-stop(100%,#272727)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #272727 0%,#303030 52%,#272727 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #272727 0%,#303030 52%,#272727 100%); /* Opera11.10+ */
background: -ms-linear-gradient(top, #272727 0%,#303030 52%,#272727 100%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#272727', endColorstr='#272727',GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, #272727 0%,#303030 52%,#272727 100%); /* W3C */}

#tagline_inner {width: 993px; margin: 0 auto; padding: 10px 0; text-align: center;
color: white; font-weight: bold; text-transform: uppercase; font-family: Arial;
font-size: 24px; line-height: normal; letter-spacing: 5px;}

#footer {width: 100%; background-color: #f9f9f9; margin-top: 50px;}
#footer a {text-decoration: underline;}
#footer a.clean {text-decoration: none}
#footer .red {color: #e4092d;}
#footer .blue {color: #00b5ef;}
#footer .green {color: #8eb607;}

#footer_inner {width: 993px; margin: 0 auto; background-color: white;}
#footer table {border-collapse: collapse;}
#footer td {padding: 10px 25px 10px; width: 281px;
border-left: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0;}
#footer ul {list-style: none; margin-left: 0;}
#footer table a {font-weight: bold;}
#footer li a {text-decoration: underline; line-height: 24px;}
#footer .footer_logo {display: table-cell; height: 110px; width: 280px; text-align: center;
vertical-align: bottom;}
#footer .video_thumb {float: right; margin-left: 10px;}

#footer table li:before {content: "• "; color: #616161;}

#footer .footer_social_media_links {text-align: right; position: relative; top: -22px; float: right}
#footer .footer_social_media_links a {margin-left: 2px;}

#footer .divider {height: 1px; background-color: #e0e0e0;}

#footer .row, #footer .copyright {color: #616161; clear: both; font-family: arial, verdana, helvetica, sans-serif; text-align: center; padding: 7px 0; font-size: 10px;}
#footer .row a {color: #616161;}
#footer .copyright {font-size: 11px;}
#footer .row strong {color: black;}
/* END FOOTER */


/******************************************************/
/********************** CONTENT ***********************/
/******************************************************/

/* MODULE BOX */

.box { padding-top: 39px; } 

.box .box_content { padding: 10px 20px; margin-bottom: 20px; } 

.box .box_header { line-height: 39px; position: relative; margin: 0; } 
.box .box_header li { list-style: none; height: 39px; } 
.box .box_header .box_left, .box .box_header .box_right { width: 5px; } 
.box .box_header .box_left, .box .box_header .box_right, .box .box_header .box_title { position: absolute; } 
.box .box_header .box_left { left: 0px; top: -39px; } 
.box .box_header .box_right { right: 0px; top: -39px; } 
.box .box_header .box_title { left: 5px; right: 5px; top: -39px; padding-left: 15px; }


/* HEADERLESS MODULE BOX */

.box_no_header { padding-top: 4px; margin-bottom: 12px; position: relative; } 

.box_no_header .box_content { } 

.box_no_header .box_header, .box_no_header .box_footer, .box_no_header .box_header .box_left, .box_no_header .box_header .box_right, .box_no_header .box_header .box_middle, .box_no_header .box_footer .box_left, .box_no_header .box_footer .box_right, .box_no_header .box_footer .box_middle { position: absolute; z-index: 0; }
.box_no_header .box_header .box_left, .box_no_header .box_header .box_right, .box_no_header .box_footer .box_left, .box_no_header .box_footer .box_right { width: 4px; } 

.box_no_header .box_header, .box_no_header .box_footer { margin: 0px; width: 100%; } 
.box_no_header .box_header li, .box_no_header .box_footer li { list-style: none; height: 4px; } 

.box_no_header .box_header .box_middle, .box_no_header .box_header .box_left, .box_no_header .box_header .box_right { top: 4px; } 
.box_no_header .box_header { top: -4px; } 

.box_no_footer .box_footer .box_middle, .box_no_footer .box_footer .box_left, .box_no_footer .box_footer .box_right { bottom: 0px; } 
.box_no_header .box_footer { bottom: 0px; } 

.box_no_header .box_header .box_left { left: 0px; } 
.box_no_header .box_header .box_right { right: 0px; } 
.box_no_header .box_header .box_middle { left: 4px; right: 4px; } 

.box_no_header .box_footer .box_left { left: 0px; } 
.box_no_header .box_footer .box_right { right: 0px; } 
.box_no_header .box_footer .box_middle { left: 4px; right: 4px; }



/***********************BUTTONS**************************/

.themed-button {list-style-type:none;margin:0;}
.themed-button li {float:left;height:19px;}
.themed-button .themed-button-centre {line-height:19px;}
.themed-button .themed-button-left, .themed-button .themed-button-right {width:10px;}