/***********************************************/
/* emx_nav_right.css — AudioStereo (optimizat) */
/***********************************************/

/* HTML tag styles */
body {
    font-family: Arial, sans-serif;
    color: #333;
    line-height: 1.166;
    margin: 0;
    padding: 0;
    background: #ccc url(/bg_grad.jpg) fixed;
    font-weight: normal;
}

/* Links */
a:link,
a:visited {
    color: #005FA9;
    text-decoration: none;
}

/* Headings */
h1 {
    font-family: 'Arial Black', Gadget, sans-serif;
    font-size: 1rem;
    font-weight: normal;
    color: #555;
    text-align: left;
    text-shadow: 0.5px 0.5px #888;
    margin: 0;
    padding: 0;
}

h2 {
    font: bold 114% Arial, sans-serif;
    color: #006699;
    margin: 0;
    padding: 0;
}

h3 {
    font: bold 100% Arial, sans-serif;
    color: #334d55;
    margin: 0;
    padding: 0;
}

h3.model-link {
    font-size: 1.1em;
    font-weight: normal;
    margin: 0.4em 0 0.6em;
    color: #333;
}

h4,
h5 {
    font: 100% Arial, sans-serif;
    margin: 0;
    padding: 0;
}

h4 { color: #333; }
h5 { color: #334d55; }

/* Lists */
ul { list-style-type: square; }
ul ul { list-style-type: disc; }
ul ul ul { list-style-type: none; }

/* Forms */
form {
    margin: 0;
    padding: 0;
}

label {
    font: bold 1em Arial, sans-serif;
    color: #334d55;
}

input {
    font-family: Arial, sans-serif;
}

/* Layout */
#pagecell1 {
    position: absolute;
    top: 85px;
    left: 2%;
    right: 2%;
    width: 96%;
    background-color: #fff;
}

#tl {
    position: absolute;
    top: -1px;
    left: -1px;
    margin: 0;
    padding: 0;
    z-index: 100;
}

#tr {
    position: absolute;
    top: -1px;
    right: -1px;
    margin: 0;
    padding: 0;
    z-index: 100;
    height: 6px;
    width: 6px;
}

#masthead {
    position: absolute;
    top: 0;
    left: 2%;
    right: 2%;
    width: 96%;
}

/* Page Navigation */
#pageNav {
    float: right;
    width: 178px;
    padding: 0;
    background-color: #F5f7f7;
    border-left: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    font: small Verdana, sans-serif;
}

#content {
    padding: 0 10px 0 0;
    margin: 0 178px 0 0;
    border-right: 1px solid #ccd2d2;
}

/* Component Divs */
#siteName {
    margin: 0;
    padding: 16px 0 8px 0;
    color: #fff;
    font-weight: normal;
}

/* Utility */
#utility {
    font: 75% Verdana, sans-serif;
    position: absolute;
    top: 16px;
    right: 0;
    color: #919999;
}

#utility a { color: #fff; }

#utility a:hover {
    text-decoration: underline;
}

/* Typewriter */
.typewriter {
    font-family: Consolas, monospace;
    font-size: 0.9em;
    white-space: normal;
}

/* Page Name */
#pageName {
    padding: 0 0 14px 10px;
    margin: 0;
    border-bottom: 1px solid #ccd2d2;
}

#pageName h2 {
    font: bold 175% Arial, sans-serif;
    color: #000;
    margin: 0;
    padding: 0;
}

#pageName img {
    position: absolute;
    top: 0;
    right: 3px;
    padding: 0;
    margin: 0;
}

#AudioStereo_logo {
    display: block;
    width: 95%;
    max-width: 169px;
    height: auto;
    object-fit: contain;
    float: right;
    transform: translate(-7px, 2px);
}

/* Global Nav */
#globalNav {
    position: relative;
    width: 100%;
    height: 32px;
    color: #ccc;
    padding: 0;
    margin: 0;
    background-image: url(/glbnav_background.gif);
}

#globalNav img { margin-bottom: -4px; }

#gnl {
    position: absolute;
    top: 0;
    left: 0;
}

#gnr {
    position: absolute;
    top: 0;
    right: 0;
}

#globalLink {
    position: absolute;
    top: 7px;
    height: 22px;
    padding: 0;
    margin: 0;
    left: 5px;
    z-index: 100;
    width: 872px;
}

a.glink,
a.glink:visited {
    font-size: small;
    color: #000;
    font-weight: bold;
    margin: 0;
    padding: 2px 5px 4px 5px;
    border-right: 1px solid #8FB8BC;
}

a.glink:hover {
    background-image: url(/glblnav_selected.gif);
    text-decoration: none;
}

.skipLinks { display: none; }

/* Search */
#search {
    position: absolute;
    top: 5px;
    right: 10px;
    z-index: 101;
}

#search input {
    font-size: 70%;
    margin: 0 0 0 10px;
}

#search a:link,
#search a:visited {
    font-size: 80%;
    font-weight: bold;
}

#search a:hover { margin: 0; }

/* Breadcrumb */
#breadCrumb {
    padding: 5px 0 5px 10px;
    font: small Verdana, sans-serif;
    color: #AAA;
    line-height: 1.2 !important;
    height: 1.2em !important;
    display: block !important;
}

#breadCrumb a,
#breadCrumb a:hover {
    color: #AAA;
    line-height: 1.2 !important;
    display: inline-block !important;
}

#breadCrumb a:hover {
    color: #005FA9;
    text-decoration: underline;
}

/* Feature */
.feature {
    padding: 0 0 10px 10px;
    font-size: 80%;
    min-height: 200px;
}

html > body .feature {
    height: auto;
    text-align: justify;
}

.feature h3 {
    font: bold 175% Arial, sans-serif;
    color: #000;
    padding: 30px 0 5px 0;
}

.feature img {
    float: none;
    padding: 0;
    text-align: justify;
}

/* Story */
.story {
    padding: 10px 0 0 10px;
    font-size: small;
    color: #666;
}

.story h3 {
    font: bold 125% Arial, sans-serif;
    color: #000;
}

.story p {
    padding: 0 0 10px 0;
}

.story a.capsule {
    font: bold 1em Arial, sans-serif;
    color: #005FA9;
    display: block;
    padding-bottom: 5px;
}

.story a.capsule:hover {
    text-decoration: underline;
}

td.storyLeft { padding-right: 12px; }

/* Site Info */
#siteInfo {
    clear: both;
    border-top: 1px solid #ccc;
    font-size: small;
    color: #ccc;
    padding: 10px;
    margin-top: 0;
}

#siteInfo img {
    padding: 4px 4px 4px 0;
    vertical-align: middle;
}

/* Section Links */
#sectionLinks {
    margin: 0;
    padding: 0;
    text-align: left;
}

#sectionLinks h3 {
    padding: 10px 0 2px 10px;
    border-bottom: 1px solid #ccc;
}

#sectionLinks a:link,
#sectionLinks a:visited {
    display: block;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #ccc;
    background-image: url(/bg_nav.jpg);
    font-weight: bold;
    padding: 3px 0 3px 10px;
    color: #21536A;
}

#sectionLinks a:hover {
    border-top: 1px solid #ccc;
    background-color: #DDEEFF;
    background-image: url(/glblnav_selected.gif);
    text-decoration: none;
    background-position: center;
}

/* Related Links */
.relatedLinks {
    margin: 0;
    padding: 0 0 10px 10px;
    border-bottom: 1px solid #ccc;
}

.relatedLinks h3 {
    padding: 10px 0 2px 0;
    text-align: left;
}

.relatedLinks a {
    display: block;
    text-align: left;
}

/* Advert */
#advert { padding: 19px; }

#advert img { display: block; }

/* Price highlight */
#product_price_red {
    color: #F00;
    font-weight: bold;
    font-size: large;
    font-family: Georgia, "Times New Roman", Times, serif;
}

/* ========================================================= */
/* RESPONSIVE UPGRADE LAYER — AudioStereo 2026 (FIXED)       */
/* ========================================================= */

@media(max-width:1024px){
body,#pagecell1,#content,.feature,.story{
    width:100%!important;
    margin:0 auto!important;
    padding:0;
}
#AudioStereo_logo{
    width:95px!important;
    height:auto!important;
    float:none!important;
    display:block!important;
    margin:32px auto 10px auto!important;
    transform:none!important;
    padding-right:5px!important;
}
#pageNav{
    float:none!important;
    width:100%!important;
    text-align:center!important;
    margin:0 auto!important;
    padding:10px 0!important;
    border-left:none!important;
    border-bottom:1px solid #ccc!important;
    padding-right:5px!important;
}
#pageNav img{
    display:block!important;
    margin:10px auto!important;
}
#pageNav h3,#pageNav a{
    display:block!important;
    text-align:center!important;
    margin:6px auto!important;
    font-size:.85rem!important;
}
#globalLink{
    position:static!important;
    width:100%!important;
    margin:0!important;
    padding:6px 0!important;
    text-align:left!important;
    float:none!important;
    display:block!important;
    box-sizing:border-box!important;
    padding-left:10px!important;
}
#globalLink a.glink{
    font-size:.80rem!important;
    line-height:1.2rem!important;
    display:inline-block!important;
    padding:0 5px 0 0!important;
    border-right:1px solid #ccc!important;
}
#globalLink a.glink:last-child{
    border-right:none!important;
}
#breadCrumb{
    font-size:.72rem!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    direction:rtl!important;
    unicode-bidi:plaintext!important;
    text-align:left!important;
    float:none!important;
    display:block!important;
    margin:0 auto!important;
    padding:10px!important;
    height:auto!important;
}
#breadCrumb a,#breadCrumb a:hover{
    display:inline-block!important;
}
#pageName h1{
    font-size:.97rem!important;
    line-height:1.22!important;
    margin:6px 0 4px 0!important;
}
.feature h2,#content h2{
    font-size:.8rem!important;
    text-align:center!important;
    margin:10px auto!important;
}
.feature table{
    width:90%!important;
    margin-left:auto!important;
    margin-right:auto!important;
    display:block!important;
    table-layout:fixed!important;
}
table{
    width:100%!important;
    display:block!important;
    table-layout:fixed!important;
}
.feature td,.feature table td,.feature table table td{
    text-align:inherit!important;
    white-space:normal!important;
    word-wrap:break-word!important;
}
.feature table img,.feature table table img,table img{
    display:inline!important;
    margin:0!important;
    max-width:100%!important;
    height:auto!important;
}
img[src*="brand"],img[src*="brands"],img[src*="special"],img[src*="cinemagia"]{
    display:block!important;
    margin:10px auto!important;
}
#content p,#content li,#content td p,#content td li,
.feature p,.feature li,.feature td p,.feature td li,
.story p,.story li{
    text-align:left!important;
}
}