﻿
.headerContent {
    width: 98%;
    padding: 0px 2%;
    margin: 0px;
}
.bodyContent {
    position: absolute;
    top: 79px;
    bottom: 30px;
    width: 96%;
    left: 2%;
    right: 2%;
    background-color: White;
    padding: 0px;
    margin-top: 3px;
    border-top: 4px solid black;
}
.footerContent {
    clear: both; 
    position: fixed; 
    width: 96%; 
    height: 30px; 
    bottom: 0; 
    left: 2%;
    right: 2%;
    background: black;
    color: White;
    margin: 0px;
    padding: 0px;
    text-align: right;
    padding-right: 5px;
    font-size: smaller;
}

.brand, .divBrand .navigation .divNavigation { 
    flex: 1 100%; 
    border-bottom: 3px solid black; 
}
.divBrandRibbon { 
    background-color: #919191;
    padding-bottom: 10px; 
    height: 79px;
    top:0px;
}
.switchBrand {
    display: block; 
    border-width: 1px 0px 1px 2px;
    border-radius: 7px 0px 0px 7px; 
    padding: 0px 0px 4px 0; 
    box-shadow: -3px 3px 1px #3E3E3E;
    border-right: 1px solid White;
    width: 30px;
    opacity: 0.4;
    filter: alpha(opacity=40); /* msie */
    background-color: #3E3E3E;
    -webkit-filter:grayscale(75%);
    z-index:1;
}
.switchBrand:hover {
    cursor:pointer;
    opacity: 1;
    filter: alpha(opacity=100); /* msie */
    background-color:transparent;
}
.imgSelected {
    opacity: 1.0;
    filter: alpha(opacity=100); /* msie */
    -webkit-filter:grayscale(0%);
    background-color:transparent;
    z-index:30;
}
.divNavigation {
    flex-align: flex-end;
    justify-content: flex-end;
    flex-grow: 3;
    border-bottom: 3px solid black; 
}
#chosenBrand {
    width: 300px;
    min-width: 300px;
    max-width: 300px;
}
.navList {
    bottom:0px;
    right:0px;
}
.navList:hover ul {
    display:block;
}
.navList > li {
    list-style:none;
    float:right;
    padding: 2px 15px 2px 0px;
    margin: 0px;
}
.navList li a { 
    text-decoration:none; 
    color: Black;
}
.navList li a:hover { 
    color: #00CCFF; 
}
.divNav { align-self: flex-end; }

.subMenu {
    position:absolute;
    z-index:500;
    background-color:#bfbfbf;
    text-indent:0px;
    border-radius: 0 0px 3px 3px;
    padding:10px;
    box-shadow: rgba(0,0,0,.25) 2px 2px 1px;
}
.subMenu > li {
    list-style:none;
    position:relative;
    text-indent:0px;
    font-size:smaller;
    text-decoration:none;
}


/* Medium screens */
@media all and (min-width: 600px) {
    .navigation {
        -webkit-box-orient: horizontal;
        -moz-box-orient: horizontal;     
        -ms-flex-direction: row;
        -webkit-flex-direction: row;
        flex-direction: row;   
    }
    .searchBox { 
        flex: 2 auto; 
    }
    .navList { flex: 3 auto; }       
}
      
/* Large screens */
@media all and (min-width: 970px) {
    .brand { 
        flex: 1 0px; 
        order: 1; 
    }
    .navigation { 
        flex: 1 0 auto;
        -webkit-box-orient: vertical;
        -moz-box-orient: vertical;     
        -ms-flex-direction: column;
        -webkit-flex-direction: column;
        flex-direction: column;           
    }
}


 
