/* 
========================================================================
MAIN LAYOUT
========================================================================
*/
html                                    { height:100%; overflow-y:scroll; overflow-x: hidden; overflow:-moz-scrollbars-vertical; }
body									{ background-color: #fff; }
body.main                               { background: #ddd; padding: 0 0 232px 0; }
#container                              { background-color: #fff; max-width: 1080px; margin: 0 auto; min-height: 100%; padding: 0 10px; }
#centre_container                       { display: block; }
/* 
========================================================================
SECTIONS
========================================================================
*/
#header                                 { background-color: #444; }
#header_main                            { background-color: #0685D6; }
#header_main .logo                      { margin: 8px auto 10px auto; }
#pagecontent_pad                        { min-height: 100px; padding: 0 18px 20px 18px; }
#category_heading                       { display: block; padding: 5px; }
#call_online                            { font-size: 14px; display: block; padding: 19px 6px 5px 6px; text-align: center; font-weight: normal; color: #fff; }
#call_online a                          { color: #000; }
.right-off-canvas-toggle                { float: right; }
/* 
========================================================================
CATEGORY NAVIGATION MENU
The primary styles are created by foundation.css. We override some here.
========================================================================
*/
#categorymenu .megamenu                 { display: table; text-align: center; background-color: transparent; width: 100%; max-width: 1180px; margin: 0 auto; height: 34px; line-height: 34px; text-align: left; }
#menubar ul.KartrisMenu                 { margin: 0; }
#categorymenu ul                        { margin: 0 auto; display: table; width: 100%; }
#categorymenu .megamenu li              { display: table-cell; height: 100%; }
#categorymenu .megamenu li a.mm_toplevel
                                        { border-top: solid 1px white; text-align: center; display: block; color: #fff; background: #0685d6 ; text-transform: uppercase; font-size: 13px; font-weight: normal; letter-spacing: 1px; padding: 7px 10px 3px 10px; line-height: 1.02em; height: 34px; }
#categorymenu .megamenu li a.mm_toplevel:hover
                                        { background: #e2e2e2; color: #000; text-shadow: none;  }
#categorymenu .megamenu li a.mm_sublevel
                                        { margin: 3px 3px 4px 0; color: #999; display: inline-flex; width: 24%; align-items: center; }
#categorymenu .megamenu li a.mm_sublevel img.mm_image
                                        { border-radius: 5px; padding: 5px; border: solid 1px #ddd; background-color: #fff; }
#categorymenu .megamenu li a.mm_sublevel:hover
                                        { color: #000; }
#categorymenu .megamenu li a.mm_sublevel:hover img.mm_image
                                        { border: solid 2px #0685d6 !important; background-color: #fff; padding: 3px !important; box-shadow: #0685d6 0 0 5px; }
#categorymenu .megamenu li div.megamenu_tab
                                        { top: 134px; left: calc(50% - 530px); width: 1060px; border: solid 1px #333; padding: 10px 20px 20px 20px; position: absolute; z-index: 1000; background-color: #fff; box-shadow: rgba(0,0,0,0.3) 3px 3px 3px; }
#categorymenu .megamenu li div.megamenu_tab img.mm_image
                                        { display: inline-block; float: left; margin-right: 4px; }
#categorymenu .megamenu li div.megamenu_tab span.mm_text
                                        { height: 50px; float: left; display: inline-block; width: 130px; line-height: 1.1em; font-size: 15px; font-weight: bold; padding: 10px 0 0 5px; }
#categorymenu .megamenu li a.mm_sublevel:hover span.mm_text
                                        { color: #000; }
#categorymenu .megamenu li.selectedmenulink a.mm_toplevel
                                        { background: #e2e2e2; color: #000; text-shadow: none; }

/* special training link */
#categorymenu .megamenu li#traininglinkholder a.mm_toplevel
                                        { color: #ffa626; font-weight: bold;  }
#categorymenu .megamenu li#traininglinkholder a.mm_toplevel:hover
                                        { background: #ffa626; color: #fff; text-shadow: none;  }

/* 
========================================================================
LOGIN STATUS
========================================================================
*/
#loginstatus                            { text-transform: uppercase; font-size: 85%; font-weight: normal; color: #eee; padding: 7px 0 3px 0; }
#loginstatus .logout                    { display: inline-block; position: relative; height: 15px; }
#loginstatus a.icon_logout:hover        { }
#loginstatus strong                     { color: #fff; text-transform: none; font-size: 115%; }
#loginstatus #login_myaccountlink a     { color: #eee; margin: 0 0 0 30px; }
#loginstatus #UC_LoginStatus_lnkLogin   { padding: 2px 8px; text-transform: uppercase; font-size: 11px; font-weight: 700; text-decoration: none; color: #fff; background-color: #0685d6; margin-right: 10px; border-radius: 0; }
#loginstatus #UC_LoginStatus_lnkLogin:hover
                                        { background-color: #f90; }
/* 
========================================================================
SEARCH BOX
========================================================================
*/
#UC_SearchBox_pnlSearchBox              { background-color: #fff; padding: 0; max-height: 33px; }
#searchboxes                            { padding: 0; background-color: #fff; border: solid 1px #fff; }
#section_searchbox                      { margin-top: 13px; padding: 0 0 0 0; background-color: #fff; }
#section_searchbox span                 { padding: 0 0 0 0; }
#section_searchbox input.button         { float: right; background-repeat: no-repeat; background-image: url(Images/icon_search.png); background-position: center right; background-color: #fff; color: #444; font-weight: bold; width: 100%; height: 29px; }
#section_searchbox input.button:hover   { border: none; }
#section_searchbox input[type="text"]   { box-shadow: none !important; height: 30px; background-color: #fff; border: none; border-style: none; color: #333; }
#section_searchbox input[type="text"]:focus
                                        { background-color: #fff; color: #000; }
/* 
========================================================================
OTHER CONTROLS language, currency, etc.
========================================================================
*/
#regionalsettings                       { margin: 0 0 0 0; }
#currencymenu                           { margin: 8px 0 0 0; float: right; text-align: right; display: block; border: none; max-width: 90px; }
#currencymenu select					{ color: #eee; border: none; background-color: #444; font-size: 90%; box-shadow: none;  width: auto; }
#languagemenu                           { float: right; text-align: right; display: block; max-width: 110px; border: none; margin: 0 10px 0 0; }
#recentlyviewed                         { margin-top: 20px; border-top: solid 3px #ddd; padding: 10px 0 20px 0; }
/* 
========================================================================
BASKET SUMMARY
========================================================================
*/
#minibasketholder                       { min-height: 30px; }
#minibasket                             { width: auto; padding: 5px 0 5px 0; }
#minibasket #minibasket_header          { position: absolute; width: 100%; z-index: 1000; background-color: transparent; }
#minibasket h4                          { letter-spacing: 0; white-space: nowrap; height: 21px; float: right; background: none; text-transform: uppercase; font-size: 85%; font-family: Segoe UI, Arial, Helvetica, Sans-Serif; margin: 0 35px 0 0; display: inline-block; color: #fff; text-align: right; z-index: 9992; padding: 3px 0 10px 2px; }
#minibasket h4 strong                   { color: #999; font-weight: bold; }
#minibasket h4 a                        { background-position: -2px -8px; background-image: url(Images/icon_shopping_cart.png); background-repeat: no-repeat; color: #eee; padding: 2px 0 1px 29px; font-weight: bold; }
#minibasket #minibasket_main            { display: none; height: 0px; width: 100%; }
#minibasket:hover #minibasket_main      { background-color: #666; display: block; z-index: 999; text-align: left; height: auto; position: absolute; right: 15px; padding: 40px 8px 8px 8px; margin: -10px 0 0 0; }
#minibasket:hover                       { background-color: #666; z-index: 9998; max-height: 1px; }
#minibasket:hover h4 strong             { color: #eee; }
#minibasket:hover h4 a                  { color: #eee; }
#minibasket #content                    { width: 100%; }
#minibasket #contents #orderinprogress,
#minibasket #contents #basketisempty    { padding: 1px 5px 12px 5px; font-weight: normal; font-size: 95%; color: #ccc; }
#minibasket ul                          { margin: 0; padding: 0; }
#minibasket ul li                       { list-style: none; float: none; clear: both; margin: 0 0 0 0; padding: 2px 0 0 0; }
#minibasket #contents ul #totals        { border-top: solid 1px #eee; padding: 4px 5px 6px 10px; font-weight: normal; text-transform: uppercase; color: #eee; font-size: 80%; text-align: right; }
#minibasket #contents ul #totals span.price
                                        { color: #fff; font-weight: normal; font-size: 120%; }
#minibasket #contents ul #totals span.total
                                        { color: #fff; font-weight: bold; font-size: 140%; }
#minibasket #contents ul #totals #minibasket_whereapplicable
                                        { margin: 10px 0 0 0; font-size: 85%; letter-spacing: 1px; }
#minibasket #contents ul #totals strong { font-weight: bold }
#minibasket #contents ul li a           { font-size: 100%; border-top: solid 1px #eee; color: #eee; padding: 1px 5px 1px 5px; margin: 0 0 1px 0; display: block; }
#minibasket #contents ul li a:hover     { color: #fff; text-decoration: underline; }
#minibasket .button                     { background-color: #999; color: #fff; font-size: 100%; width: 100%; border: none; }
#minibasket .button:hover               { background-color: #ddd; color: #000; }
.compactminibasket a                    { white-space: nowrap; background-position: 1px 1px; background-image: url(Images/icon_shopping_cart.png); background-repeat: no-repeat; color: #333; width: auto; padding: 9px 0 5px 30px; float: right; text-transform: uppercase; font-size: 85%; font-family: Segoe UI, Arial, Helvetica, Sans-Serif; }
#compactbasket_title,
#compactbasket_noofitems,
#compactbasket_totalprice               { color: #fff; }
.compactminibasket a:hover              { text-decoration: underline; }

/* 
========================================================================
FOOTER
========================================================================
*/
#footer                                 { background-color: #444; margin: 0; min-height: 232px; /*change this size depending on the height of the footer image you're using*/ width: 100%; bottom: 0px; }
#footer_inside                          { background-color: #0685D6; height: 100%; min-height: 182px; max-width: 1080px; margin: 0 auto; color: #555; padding: 10px 20px 0 20px; }
#footer a                               { color: #ddd; font-weight: normal; }
#footer #copyright                      { min-height: 40px; font-size: 90%; margin: 0 0 10px 0; color: #fff; padding: 10px 0 0 20px; }
#footer h2                              { color: #fff }
#footer ul                              { margin: 0; text-transform: uppercase; font-size: 90%; padding: 0; list-style-type: none; }
#footer ul li                           { padding: 0 0 8px 0; }
#footer ul li a                         { }
#footer ul li a:hover                   { color: #000; }