/* ------------------------------------------------------- SwanTek CSS : 01-02-2022 */


/* ------------------------------------------------------- Basic styles */


body
{
background: #4d4f53 url('images/background_engine.jpg') no-repeat fixed center top;
color: #000000;
margin: 0px;
padding: 0px;
}

html, body { height: 100%; margin-bottom: 1px; }        /* Force vertical scroll bar to appear */

body, p, td, ul, li
{
font-family: verdana, arial, sans-serif;
font-size: 13px;
}

div
{
margin: 0px;
padding: 0px;
}

a:link, a:visited
{
color: #0000ff;
text-decoration:none;
}

a:hover, a:active
{
color: #e17000;
text-decoration: none;
}

a.bold
{
font-weight: bold;
}

img
{
margin: 5px;
padding: 0px;
border: 0px;
}


/* ------------------------------------------------------- Layout Divs */


#outer_wrapper
{
margin: 0px;
padding: 0px;
text-align: center;
}

#content_wrapper
{
background-color: #ffffff;
margin: auto;
margin-top: 10px;
padding: 0px;
border-radius: 10px;
width: 950px;
text-align: left;
}

div.front_full
{
margin: 0px;
padding: 10px;
}

#main_left
{
float: left;
margin: 0px;
padding: 0px 10px 10px 10px;
width: 200px;
}

#main_center
{
float: right;
margin: 0px;
padding: 0px 10px 10px 10px;
width: 700px;
}

div.clear_float
{
clear: both;
}


/* ------------------------------------------------------- Title block */


#title_block
{
margin: 0px;
padding: 20px 0px 20px 20px;
}

#title_block, #title_block p, #title_block td, #title_block a
{
color: #338833;
font-family: arial;
font-size: 13px;
font-weight: bold;
}

#title_block div.subtitle
{
margin-left: 20px;
color: #000000;
}

#title_block span.title_phone
{
font-size: 17px;
}


/* ------------------------------------------------------- Search box */


form
{
margin: 0px;
padding: 0px;
}

span.search_label
{
color: #888888;
font-family: arial;
font-size: 14px;
font-weight: bold;
}

input.search_text
{
color: #6666ff;
font-family: arial;
font-size: 11px;
font-weight: bold;
border: 1px solid #aaaaaa;
}

input.search_submit
{
background-color: #ffffff;
color: #888888;
padding: 0px;
font-family: arial;
font-size: 11px;
font-weight: bold;
border: none;
}


/* ------------------------------------------------------- Menu Bar */


#menu_bar
{
margin: 0px;
padding: 10px 10px 30px 100px;
}

#menu_bar ul
{
margin: 0px;
padding: 0px;
list-style-type: none;
}

#menu_bar li
{
float: left;
}

#menu_bar a:link, #menu_bar a:visited
{
background-color: #999999;
color: #ffffff;
margin-right: 5px;
padding: 3px 0px 3px 0px;
width: 120px;
text-align: center;
text-decoration: none;
display: block;
border-radius: 5px;
font-family: arial;
font-size: 14px;
font-weight: bold;
}

#menu_bar a:hover, #menu_bar a:active
{
background-color: #e17000;
}


/* ------------------------------------------------------- Breadcrumbs */


#breadcrumb_bar
{
background-color: #eeeeff;
margin: 10px;
padding: 1px 10px;
border-top: 1px solid #aaaaaa;
border-bottom: 1px solid #aaaaaa;
font-size: 11px;
}

#breadcrumb_bar ul
{
margin: 0px;
padding: 0px;
list-style-type: none;
font-size: 11px;
}

#breadcrumb_bar li
{
padding-left: 20px;
background: url(images/breadcrumb.gif) no-repeat 5px 2px; 
font-size: 11px;
font-weight: bold;
display: inline;
}


/* ------------------------------------------------------- Twitter box */

#twitterbox
{
position: fixed;
top: 10px;
right: 10px;
}


/* ------------------------------------------------------- Status message */


div.status_message
{
margin: 10px 80px;
padding: 10px;
border: 5px solid #ff0000;
border-radius: 10px;
font-size: 16px;
color: #ff0000;
}


/* ------------------------------------------------------- Footer */


#footer_block
{
margin: auto;
padding: 10px 10px 10px 10px;
text-align: center;
width: 950px;
}

#footer_block, #footer_block p, #footer_block td, #footer_block ul, #footer_block li
{
color: #ffffff;
font-family: arial;
font-size: 12px;
font-weight: bold;
}

#footer_block a:link, #footer_block a:visited
{
color: #ffffff;
text-decoration: underline;
}

#footer_block a:hover, #footer_block a:active
{
color: #aaaaaa;
text-decoration: none;
}


/* ------------------------------------------------------- Front Page Styles */


div.front_cat_container   /* Container for the 4 main section boxes */
{
background: #ffffff /* url('images/background_engine.jpg') no-repeat fixed center top */ ;
margin: 30px 0px 30px 0px;
padding: 0px 0px 0px 0px;
}

div.front_cat_section   /* Box for each of the 4 main sections */
{
float: left;
/* opacity: 0.85;
filter: alpha(opacity=85); */  /* For IE8 and earlier */
margin: 40px 15px 50px 15px;
padding: 10px;
width: 180px;
height: 320px;
color: #444444;
font-family: arial;
font-size: 18px;
letter-spacing: -1px;
overflow: hidden;
}

div.front_cat_section:hover   /* Make the section box move and change opacity slightly when mouse hovers */
{
/* opacity: 0.95;
filter: alpha(opacity=95); */  /* For IE8 and earlier */
position: relative;
top: -3px;
}

div.front_cat_section_head   /* The headline in the main section boxes */
{
margin: 0px 0px 20px 0px;
padding: 0px;
color: #000000;
font-family: arial;
font-size: 32px;
font-weight: bold;
letter-spacing: -1px;
}

div.section_100
{
background-color: #8bc53e;
}

div.section_200
{
background-color: #13b5ea;
}

div.section_300
{
background-color: #cab677;
}

div.section_400
{
background-color: #edb111;
}

div.frontbanner
{
margin: 0px 0px 20px 0px;
padding: 0px 0px 0px 0px;
font-family: helvetica,arial;
font-weight: 200;
font-size: 40px;
letter-spacing: -1px;
text-align: left;
}

div.frontbannersub
{
margin: 20px 0px 0px 0px;
padding: 0px 0px 0px 0px;
font-family: helvetica,arial;
font-weight: 200;
font-size: 20px;
letter-spacing: -1px;
text-align: left;
}

div.frontbannertext
{
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
font-family: helvetica,arial;
font-weight: 200;
font-size: 16px;
xxxletter-spacing: -1px;
text-align: left;
}

div.frontheadline
{
margin: 0px 0px 8px 0px;
padding: 0px 4px 0px 4px;
border-bottom: 2px solid #e17000;
font-family: arial;
font-size: 32px;
letter-spacing: -1px;
}

div.frontheadlinesub
{
margin: 0px 0px 20px 0px;
padding: 0px 4px 0px 4px;
color: #999999;
font-family: arial;
font-size: 20px;
font-weight: bold;
letter-spacing: -1px;
}


/* ------------------------------------------------------- Catalogue */


table.cat_index
{
width: 800px;
}

table.cat_product
{
width: 800px;
}

div.cat_index_title, div.cat_product_title
{
margin: 20px 0px 20px 0px;
border-bottom: 4px solid #e17000;
font-family: arial;
font-size: 60px;
letter-spacing: -3px
}

div.cat_index_category_title
{
color: #4444ff;
font-family: arial;
font-size: 20px;
font-weight: bold;
}

div.cat_index_description
{
margin: 40px 60px 40px 60px;
color: #999999;
font-family: arial;
font-size: 18px;
font-weight: bold;
}

div.cat_product_subtitle
{
margin-bottom: 40px;
color: #999999;
font-family: arial;
font-size: 22px;
font-weight: bold;
letter-spacing: -1px
}

div.cat_product_head         /* Paragraph headings in product descriptions */
{
margin: 10px 0px -8px 0px;
color: #e17000;
font-family: arial;
font-size: 18px;
font-weight: bold;
}


/* ------------------------------------------------------- Catalogue boxed version */


div.prod_box_container
{
margin: 12px;
padding: 0px;
overflow: auto;
}

div.prod_box
{
float: left;
background-color: #dddddd;
margin: 7px;
padding: 5px;
border-top: 4px solid #e17000;
border-radius: 0px 0px 10px 10px;
width: 155px;
height: 120px;
overflow: hidden;
}

div.prod_box:hover
{
background-color: #e8e8e8;
}

div.prod_box img
{
float: right;
background-color: #ffffff;
margin: 2px;
padding: 2px;
border: 1px solid #aaaaaa;
max-height: 80px;
max-width: 60px;
}

div.prod_box_title
{
color: #4444ff;
font-family: arial;
font-size: 16px;
font-weight: bold;
}

div.prod_box_subtitle
{
color: #000000;
font-size: 11px;
}


/* ------------------------------------------------------- Alterations for narrower screens */


@media only screen and (max-width: 1400px)
{

#twitterbox
{
display: none
}


}

/* ------------------------------------------------------- Alterations for printing */


@media only print
{


body, p, td, ul, li
{
font-size: 10px;
}

body
{
background: #ffffff;
}

html, body { height: auto; margin-bottom: 0px; }        /* Cancel force vertical scroll bar to appear */

#content_wrapper
{
width: auto;
}

#main_center
{
width: auto;
}

form
{
display: none;
}

#twitterbox
{
display: none
}

#menu_bar
{
display: none;
}

#footer_block
{
border-top: 3px dotted #888888;
width: auto;
}

#footer_block, #footer_block p, #footer_block td, #footer_block ul, #footer_block li
{
font-size: 9px;
}

table.cat_index, table.cat_product
{
width: auto;
}


}