/*
RESET
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video,button {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
strong{ font-weight:bold;}
/*============================================================================================================================================*/
/*========================================================= Custom CSS =======================================================================*/
/*============================================================================================================================================*/
@font-face {
font-family: 'AUdimatItalic';
src: url('fonts/audimat-italic-webfont.eot');
src: url('fonts/audimat-italic-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/audimat-italic-webfont.woff') format('woff'),
url('fonts/audimat-italic-webfont.ttf') format('truetype'),
url('fonts/audimat-italic-webfont.svg#AUdimatItalic') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'AUdimatBoldItalic';
src: url('fonts/audimat-bolditalic-webfont.eot');
src: url('fonts/audimat-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/audimat-bolditalic-webfont.woff') format('woff'),
url('fonts/audimat-bolditalic-webfont.ttf') format('truetype'),
url('fonts/audimat-bolditalic-webfont.svg#AUdimatBoldItalic') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'AUdimatRegular';
src: url('fonts/audimat-regular-webfont.eot');
src: url('fonts/audimat-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/audimat-regular-webfont.woff') format('woff'),
url('fonts/audimat-regular-webfont.ttf') format('truetype'),
url('fonts/audimat-regular-webfont.svg#AUdimatRegular') format('svg');
font-weight: normal;
font-style: normal;
}
.audimat-italic{
font-family: 'AUdimatItalic', Arial, Helvetica, sans-serif;
}
.audimat-regular{
font-family: 'AUdimatRegular', Arial, Helvetica, sans-serif;
}
@white: #FFFFFF ;
@light-gray: #CCCCCC;
@black: #000000;
@light_shadow: rgba(0, 0, 0, 0.2);
@purple: #666699;
@rose: #cc6666;
@green: #009966;
@lime: #99cc66;
.hidden{display:none;}
.left{ float: left;}
.right{ float: right;}
.link{ cursor: pointer; }
.nolink {cursor: dafault; pointer-events: none;}
.btn{
width: 58px;
height: 60px;
.link;
}
.light_shadow{
-moz-box-shadow: 0 0 12px @light_shadow;
-webkit-box-shadow: 0 0 12px @light_shadow;
box-shadow: 0 0 12px @light_shadow;
}
root,html,body {
display: block;
margin: 0 ;
background: @light-gray;
.audimat-regular;
}
#loading{
position: absolute;
background: url('images/loading.gif') 0 0 no-repeat transparent;
width: 50px;
height: 50px;
top: 50%;
left: 50%;
margin-top: -25px;
margin-left: -25px;
}
#controller{
position : absolute;
width: 100%;
bottom: 23px;//40px;
#controller-inner{
background: url('images/button_set_bg_wide.png') -25px -11px no-repeat transparent;
width: 415px;
height: 60px;
padding: 8px 10px;
margin: 0 auto;
position:relative;
> div{.left;}
}
}
#imprimir-block{
.hidden;
background: url('images/imprimir_set_bg.png') 0 0 no-repeat transparent;
position:absolute;
bottom: 37px;
left: 154px;
width: 230px;
height: 130px;
margin: 0;
padding: 20px 0 0 0;
font-size: 13px;
.audimat-regular;
color: @black;
p{
margin: 0;
padding: 0;
text-align: center;
}
.print-left, .print-right{
color: @light-gray;
}
.print-left:hover, .print-right:hover{
color: @black;
}
.print-btn-left{
.link;
background: url('images/imprimir_set.png') 0 0 no-repeat transparent;
width: 79px;
height: 75px;
display: inline-block;
margin-right: -18px;
margin-bottom: -30px;
}
.print-btn-right{
.link;
background: url('images/imprimir_set.png') -79px 0 no-repeat transparent;
width: 79px;
height: 75px;
display: inline-block;
margin-bottom: -30px;
}
}
.btn-indo-box{
background: url('images/button_set.png') -350px 0 no-repeat transparent;
.btn;
}
.btn-left{
background: url('images/button_set.png') 0 0 no-repeat transparent;
.btn;
}
.btn-right{
background: url('images/button_set.png') -58px 0 no-repeat transparent;
.btn;
}
.btn-fullscreen{
background: url('images/button_set.png') -116px 0 no-repeat transparent;
.btn;
}
.btn-pdf{
background: url('images/button_set.png') -174px 0 no-repeat transparent;
.btn;
}
.btn-print{
background: url('images/button_set.png') -232px 0 no-repeat transparent;
.btn;
}
.btn-menu{
background: url('images/button_set.png') -290px 0 no-repeat transparent;
.btn;
}
.inactive {
.nolink;
}
#prev{.btn-left; position: absolute; left: 40px; top: 45%;}
#next{.btn-right; position: absolute; right: 40px; top: 45%;}
#catalog-frame{
//background: @white;
//border: 1px solid @black;
//margin: 50px 60px;
position: relative;
margin: 0 auto;
padding: 0;
overflow:hidden;
#catalog{
position: relative;
margin: 0;
padding: 0;
left:0;
width:99999px;
.page-block{
.left;
margin: 0;
padding: 0;
overflow: hidden;
position: relative;
.page{
//.left;
//border: 1px solid @black;
margin: 0;
padding: 0;
display : table-cell;
position:relative;
img{}
.page-img{
cursor: pointer;
cursor: -moz-zoom-in;
cursor: -webkit-zoom-in;
cursor: url("images/ZoomIn.png"), url("images/ZoomIn.cur") , pointer;
}
.page-link{
background: url('images/link.png') no-repeat transparent center;
width: 26px;
height: 26px;
cursor: pointer;
display: block;
padding: 13px;
/* position: absolute;
bottom: 0 ; */
margin: 0 0 -52px;
position: absolute;
right: 10px;
}
.page-link-other{
background: url('images/link.png') no-repeat transparent center;
width: 26px;
height: 26px;
cursor: pointer;
display: block;
padding: 33px 13px 13px 13px;
/* position: absolute;
bottom: 0 ; */
margin: 0 0 -52px;
position: relative;
float: right;
}
.zoom-box{
position: absolute;
top: 0;
width: inherit;
height: inherit;
overflow: hidden;
background: white;
.zoom-img{
position: relative;
cursor: pointer;
cursor: -moz-zoom-in;
cursor: -webkit-zoom-in;
cursor: url("images/ZoomOut.png"), url("images/ZoomOut.cur") , pointer;
}
.zoom-reference{
border: 1px solid rgb(200, 54, 54);
position: absolute;
bottom: 20px;
right: 20px;
width: 60px;
height: 84px;
background: rgb(255, 198, 198);
background: rgba(200, 54, 54, 0.2);
.zoom-pointer{
width: 6px; height: 6px; background: rgb(200, 54, 54); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
position: relative;
}
}
}
}
}
}
}
#menu-frame{
.hidden;
.audimat-italic;
color: @white;
font-size: 16px;
bottom: 25px;
right: -250px;
position: absolute;
.menu-block{
.menu-item{
.light_shadow;
.link;
margin: 3px 0;
padding: 0;
text-align: center;
width: 240px;
height: 50px;
position: relative;
p{margin: 0; padding: 0;}
.menu-hook{
border-left: 10px solid transparent;
left: -10px;
position: absolute;
}
.item-texto{
display:table;
width: 240px;
height: 50px;
span{
display:table-cell;
vertical-align:middle;
}
}
}
.menu-item.level-2{
height: 25px;
.item-texto{
height: 25px;
}
}
}
.menu-block.root-0{
.menu-item{
background-color: @purple;
.menu-hook{
border-top: 48px solid @purple;
}
}
.menu-item:hover{
background-color: @white;
color: @purple;
.menu-hook{
border-top: 48px solid @white;
}
}
}
.menu-block.root-1{
.menu-item{
background-color: @rose;
.menu-hook{
border-top: 48px solid @rose;
}
}
.menu-item:hover{
background-color: @white;
color: @rose;
.menu-hook{
border-top: 48px solid @white;
}
}
}
.menu-block.root-2{
.menu-item{
background-color: @green;
.menu-hook{
border-top: 48px solid @green;
}
}
.menu-item:hover{
background-color: @white;
color: @green;
.menu-hook{
border-top: 48px solid @white;
}
}
}
.menu-block.root-3{
.menu-item{
background-color: @lime;
.menu-hook{
border-top: 48px solid @lime;
}
}
.menu-item{
background-color: @white;
color: @lime;
.menu-hook{
border-top: 48px solid @white;
}
}
}
}
.linksub .submenulinks {
-moz-box-shadow:5px 5px 12px #444444;
-webkit-box-shadow:5px 5px 12px #444444;
box-shadow:5px 5px 12px #444444;
behavior:url(PIE.htc);
display:none;
position:absolute;
right:32px;
top:32px;
width:150px;
background:#dedede;
border:1px solid #414141;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-right-radius:5px;
-webkit-border-bottom-left-radius:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-bottomleft:5px;
border-top-left-radius:5px;
border-top-right-radius:5px;
border-bottom-right-radius:5px;
border-bottom-left-radius:5px;
behavior:url(PIE.htc);
z-index:100;
}
.linksub .submenulinks a {
display:block;
border-top:1px solid #414141;
color:#414141;
text-decoration:none;
padding:3px;
margin:0px !important;
text-align: center;
}
.linksub .submenulinks .cascade {
border-top:0px;
font-weight:bold;
position:relative;
border-top:1px solid #414141;
padding:3px;
cursor:pointer;
}
.linksub .submenulinks .cascade:hover .submenu-2 { display:block; }
.linksub .submenulinks .cascade .submenu-2 {
-moz-box-shadow:5px 5px 12px #444444;
-webkit-box-shadow:5px 5px 12px #444444;
box-shadow:5px 5px 12px #444444;
behavior:url(PIE.htc);
display:none;
position:absolute;
top:0;
right:150px;
width:150px;
font-weight:normal;
background:#dedede;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-right-radius:5px;
-webkit-border-bottom-left-radius:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-bottomleft:5px;
border-top-left-radius:5px;
border-top-right-radius:5px;
border-bottom-right-radius:5px;
border-bottom-left-radius:5px;
behavior:url(PIE.htc);
z-index:100;
}
.linksub:hover .submenulinks { display:block; }
.linksub .submenulinks .first {
border-top:0px;
font-weight:bold;
background:#414141;
color:#dedede !important;
margin:0px !important;
}
.linksub { width:300px; }