﻿
/* General style specs */

/*  MaasElectro basic colors:

    light blue      #DEEDF6     was: E1F1FC
    dark blue       #0089C6     was: 539EE5
    red             #C53830     was: DD2120
    gray            #C0C0C0     was: 555555     was: C0C0C0
*/

html {
        height: 100%;
        max-height: 100%;
        overflow: hidden;
}

body {
        height: 100%;
        max-height: 100%;
        width: 100%;
        color: #000000;
        background-color: #0089C6;
        filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#DEEDF6, endColorStr=#0089C6);
        margin: 0;
        padding: 0;
        border: none;
        font-family: arial regular, arial, verdana, sans-serif;
        font-size: 10pt;
        text-align: center;
        overflow: hidden;
}

/* Screen partitions */

#container
{        /* height will be set by SetScreenHeight.js */
        width: 963px;
        margin: 24px auto;
           background-color: #FFFFFF;
           overflow: hidden;
}

#header
{       width: 100%;
        height: 108px;
        text-align: left;
        margin: 0px;
        overflow: hidden;
}

.companylogo
{
    border-style: none;
    height: 100px;
    padding-left: 2px;
}

#title
{
        height: 65px;
        padding-left: 12px;
        font-weight: bold;
        font-size: 24pt;
        line-height: 80px;
}

/*
.attentionbox
{       float: right;
        width: 339px;
        height: 60px;
        margin-right: 5px;
        padding: 1px 3px 0px 3px;
        background-color: #DEEDF6;
        border: solid 1px #C53830;
        overflow: hidden;
        text-align: left;
}
*/

.tbllogin
{
    border-collapse: collapse;
    font-size: 8pt;
    float: right;
    width: 347px;
    height: 60px;
    margin-right: 5px;
    background-color: #DEEDF6;
    border: solid 1px #C53830;
    /* overflow: hidden; */
    text-align: left;
    /* display: inline-block; */
}

.tbllogin td
{
    padding: 0px 0px 0px 3px;
}

.txtlogin
{
    height: 10px;
    width: 120px;
    font-size: 8pt;
}

.btnlogin
{
    text-decoration: none;
    border-style: none;
    background-color: #DEEDF6;
    font-size: 8pt;
    color: #0089C6;
    cursor: pointer;
}

.pnlQSearch
{
    width: 600px;
    height: 22px;
    margin-top: 3px;
    margin-right: 5px;
    overflow: hidden;
}
.lblQSearch
{
    font-size: 10pt;
    float: right;
    margin-top: 2px;
    margin-right: 3px;
    color: #0089C6;
}
.txtQSearch
{
        width: 275px;
        float: right;
        height: 18px;
        border: 1px solid #0089C6;
        font-size: 10pt;
        margin-right: 3px;
}
.wmgray
{
    width: 275px;
    float: right;
    height: 18px;
    border: 1px solid #0089C6;
    font-size: 9pt;
    margin-right: 3px;
    padding-left: 2px;
    color: #C0C0C0;
}
.btnQSearch
{
        float: right;
        border: outset 3px #C0C0C0;
        color: #FFFFFF;
        cursor: hand;
}

#subheader
{        width: 100%;
        height: 32px;
        text-align: left;
        padding: 0px;
        overflow: hidden;
}

#subheader_left
{        width: 134px;
        height: 100%;
        float: left;
        margin: 0px;
        padding:  0px 0px 0px 6px;
        overflow: hidden;
}

#subheader_right
{        height: 100%;
        padding: 0px 5px  0px 5px;
        overflow: hidden;
}

#crumblepath
{
    font-size: 8pt;
}

#main
{        /* height will be set by SetScreenHeight.js */
    width: 100%;
        text-align: left;
        overflow: hidden;
        background-color: #FFFFFF; /* was D6F7FF */
}

#main_left
{
    width: 134px;
    height: 100%;
        float: left;
        padding: 0px 0px 0px 4px;
        text-align: left;
        overflow: auto;
        overflow-x: hidden; /* CSS3: accepted by IE8 - just like -ms-overflow-x - plus FF */
}

.flag
{
    width: 25px;
    height: 25px;
    float: left;
    margin-right: 4px;
}

.flagr
{
    width: 20px;
    height: 20px;
    float: right;
    margin-right: 4px;
}

.menuitem
{
     display: block;
}

#main_right
{        width: 798px;
    height: 98%;
        text-align: left;
        padding: 5px 20px  5px 5px;
        margin: 0;
    overflow: auto;
    overflow-x: hidden; /* CSS3: accepted by IE8 - just like -ms-overflow-x - plus FF */
}


.pnlPop
{
    width: 370px;
    border: solid 2px #0089C6;
    background-color: #DEEDF6;
    color: #000000;
    text-align: center;
    padding: 5px;
}

.popupbackground
{
    background-color: #DEEDF6;
    -ms-filter: "progidDXImageTransform.Microsoft.Alpha(opacity40)";  /* for IE8 (must stay on top)*/
        filter: alpha(opacity=40);                                          /* for IE<8 */
        -khtml-opacity: 0.4;                                                /* for Safari old */
    -moz-opacity: 0.4;                                                  /* for Netscape & Mozilla */
        opacity: 0.4
}

.titlePop
{
    font-weight: bold;
}

/* content styles */

h1 {font-size:28pt;}
h2 {font-size:16pt;}
h3 {font-size:12pt; color: #C53830;}

/* submenu items 3-per-row in main_right*/
.tblTabs { width: 97%;}
.tblTabs tr { width: 100%;}
.tblTabs td { width: 33%; border-style: none;}
.tblTab { width: 180px; height: 155px; float: right; text-align:center; border-collapse: collapse; border: 1px solid #0089C6; margin-top: 10px; margin-bottom: 20px; background-color: #FFFFFF;}
.tdTabTop { height: 35px; background-color: #DEEDF6; color: #0089C6; font-weight: bold; overflow: hidden; vertical-align: middle; padding: 2px;}
.tdTabTop a { text-decoration: none; color: #0089C6; font-weight: bold; overflow: hidden; vertical-align: middle;}
/* .tdTabTop a : adding height:35px; width:100%; display:block overrides the vertical-align:middle, so don't do that */
/* the result being a smaller clickable area in the top cell - the bottom cell however is fully clickable... */
.tdTabBot { height: 120px;}
.tdTabBot a { height:120px; width:100%; display: block;}
.tdTabBot a img { border-style:none;}

/* market pictures on home page */
.tblTabs6 { width: 97%; border-style: none; border-collapse: collapse;}
.tblTabs6 tr { width: 100%;}
.tblTabs6 td { width: 16%; border-style: none;}

.tblTab6 { width: 128px; height: 120px; float: right; text-align:center; border-collapse: collapse; border: 1px solid #0089C6; margin-top: 10px; margin-bottom: 20px; background-color: #FFFFFF;}
.tdTabTop6 { height: 35px; background-color: #DEEDF6;}
.tdTabTop6 a { text-decoration: none; color: #0089C6; font-weight: bold; overflow: hidden; vertical-align: middle;}
/* .tdTabTop6 a : adding height:35px; width:100%; display:block overrides the vertical-align:middle, so don't do that */
/* the result being a smaller clickable area in the top cell - the bottom cell however is fully clickable... */
.tdTabBot6 { height: 85px;}
.tdTabBot6 a { height:85px; width:100%; display: block;}
.tdTabBot6 a img { border-style:none;}

/* pricemenu items */
.tblprcs { width: 97%;}
.tblprcs tr { width: 100%;}
.tblprcs td { border-style: none;}
.tdprcTop { height: 25px; background-color: #DEEDF6; color: #0089C6; font-weight: bold; overflow: hidden; vertical-align: middle; padding: 2px;}
.tdprcTop a { text-decoration: none; color: #0089C6; font-weight: bold; overflow: hidden; vertical-align: middle;}

/* product pictures inside short product descriptions */
a.prodpic:hover {text-decoration:none; background-color:#DEEDF6; color:#000; position:relative; z-index:500;}
a.prodpic img.large {position:absolute; left:-9998px;}
a.prodpic:hover .large {top:-65px; left:100px; border:8px solid #DEEDF6;}

.lblue
{
        background-color: #DEEDF6;
        border: #0089C6 1px solid;
}

.bblue
{
        border: #0089C6 1px solid;
}

.divOrder
{   /* used in MEOE1 */
        background-color: #FFFFFF; /* was: D6F7FF */
        width: 99%;   /* was: 100% */
        height: 52px;
        border: solid 1px #0089C6;
        padding: 3px 3px 3px 3px;
        margin-top: 2px;
        margin-bottom: 4px;
}

.divOrder2
{   /* used in MEOrder1 */
        background-color: #FFFFFF; /* was: D6F7FF */
        width: 99%;   /* was: 100% */
        /* height: 125px;*/ /* removed to give divOrderB (below) ample space */
        border: solid 1px #0089C6;
        padding: 3px 3px 3px 3px;
        margin-top: 2px;
        margin-bottom: 4px;
}

.divOrderB
{   /* used in MEOrder1 */
        background-color: #FFFFFF;
        width: 100%;
        height: 52px;
}

.btnOrder
{
    border: outset 5px #C0C0C0;
    background-color: #ffffff;
        height: 28px;
        margin-top: 6px;
        margin-left: 5px;
        cursor: hand;
}

.meoelbl
{
    float: left;
}

.hidden
{
        display: none;
}

.meoetxt
{
        background-color: #ffffff;
        border: #0089C6 1px solid;
        height: 16px;
        width: 97%;
}

.meoetxtm
{
        background-color: #ffffff;
        border: #0089C6 1px solid;
}

.meoebtn
{
        border: outset 5px #C0C0C0;
        background-color: #3700FF;
        color: #ffffff;
        width: 56px;
        height: 40px;
        white-space:normal;
        margin: 3px;
        cursor: hand;
        text-align: center;
        padding: 1px;
        font-size: 8pt;
}

.meoebtndel
{
        border: outset 3px #C0C0C0;
        background-color: #C53830;
        color: #FFFFFF;
        width: 22px;
        height: 22px;
        white-space:normal;
        margin: 11px 0px 2px 4px;
        cursor: hand;
        text-align: center;
        padding: 0px;
        font-size: 10pt;
        font-weight: bold;
}

.inqddl
{
    width: 300px;
    font-size: 8pt;
}

.inqbox
{
    width: 294px;
    height: 11px;
    font-size: 8pt;
    border: solid 1px #0089C6;
}

.meoebtnlow
{
        border: outset 5px #C0C0C0;
        background-color: #0089C6;
        color: #ffffff;
        font-weight: bold;
        width: 120px;
        height: 28px;
        white-space: normal;
        text-align: center;
        cursor: hand;
}

.lblO2
{
    float: right;
    margin-top: 14px;
}

.pageptr a
{
    text-decoration: none;
}


.meddlul{list-style-type: none; margin-left: 0px; padding: 0; margin-bottom: 0px;}
.meddlsp{display: inline-block; width: 150px;}
.meddllbl{font-size: 11px;}
.meddl{font-size: 11px; width: 200px; background-color: #C0C0C0; color: #000000;}

table.Order
{

        border-collapse: separate;
}

.metxt
{
        background-color: #ffffff;
        BORDER: #0089C6 1px solid;
}

table.metbl1
{
        width: 100%;
        border: 1px solid #DEEDF6;
}
td.metbl1
{
        border: 1px solid #DEEDF6;
}

/* Print specs */

@media print {
    #container {
        overflow: visible;
    }

    #header, #subheader, #main_left {
            display: none;
            }

    #main_right {
        overflow: visible;
            }

    #plcCont {
            overflow: visible;
            background: #FFFFFF;
            margin: 0px;
            border: 0px;
            padding: 0px;
    }

    a {
        text-decoration: none;
        color: #000000;
    }

    img {
        display: none;
    }
}
