@font-face {
  font-family:'opensans';
  src: url(fonts/opensans.otf);
}
@font-face {
  font-family:'bebas';
  src: url(fonts/BebasNeue-Regular.otf);
}
@font-face {
  font-family:'bebaslight';
  src: url(fonts/BebasNeue-Light.otf);
}
@font-face {
  font-family:'slimjim';
  src: url(fonts/SlimJim.ttf);
}


body {font-family:'opensans'; position:relative; width:auto; margin-left:3px; margin-right:5px}
h1,h2,h3,h4,h5,h6{
margin:0px; margin-bottom:10px;
line-height:1.2}
h1.main {font-size:350%;
color: #65d9f0;
background-image: -webkit-linear-gradient(270deg, #65d9f0 22%, #44abeb 42%, #0969ad 77%);
background-clip: text;
   -webkit-background-clip: text;
    text-fill-color: transparent;
   -webkit-text-fill-color: transparent;
    transition:font-size 1s;
vertical-align:top;
padding:0px;
margin:0px;
}
h1.maix {font-size:350%;
color: #45b9f0;
padding:0px;
margin:0px;
border:0px solid #0f0;
transition:font-size 1s;
}
h1.main span, h1.maix span {margin-top:5px; font-size:35%; color:#666; vertical-align:top; display:inline-block}
h1.maix span span {font-size:79%; color:#089; margin:0px;}
h1.maix span span span {font-size:85%; color:#c80; margin:0px;}
h2 {font-size:165%; color:#666; width:90%; transition:font-size 1s}
h4 {font-size:75%; font-weight:normal; color:#666}
h4.sloger, span.sloger {color:#444; font-size:80%; transition:color 1s}
h2 span.menu {width:auto; height:auto; font-size:120%; margin-right:5px; margin-left:10px; position:relative; display:inline-block}
h2 span.menu:hover {display:block}
h2 span.menu a {color:#999; text-decoration: none; transition:color 0.5s; vertical-align:top}
h2 span.menu a:hover {color:#f00; text-shadow:1px 1px 1px #666}
h2 span.menu a+ul {position:relative; height:0em; width:0em; margin:0px; margin-bottom:10px; padding:0px; margin-left:5px; font-size:0pt; display:inline-block; vertical-align:top; overflow:hidden; top:0.5em; transition:height 1s, width 1s, font-size 1s}
a.off {color:#666; font-weight:normal; text-decoration:none}
a.on {color:#00f; font-weight:normal; text-decoration:underline}
a.onr {color:#f00; font-weight:normal; text-decoration:underline}
b.ok {color:green}
b.na {color:red}
b.azul{color:blue}

p.sp {color:#444; text-align:justify; margin-left:20px; margin-right:20px}
p.sp b {color:#000}
div.operativo,div.inpag {border:0px solid red; margin:0px; padding:0px; width:auto; overflow:hidden; height:0px; background-color:#eee; padding-right:0px; text-align:right; position:relative; transition:height 1s; z-index:0}
div.inpag span.reg span.red {color:#04f; text-align:left; display:inline; vertical-align:top; font-size:13pt; position:relative}
div.inpag span.reg span.red span {position:absolute; text-align:center; font-size:9pt; color:#44f; top:1.4em; left:0px; right:0px; height:auto; border:0px solid #999}
div.inpag span.reg a{font-size:14pt; background-color:#eee; text-decoration:none; display:inline-block; padding:4px}
div.inpag span.reg a:hover{font-size:14pt; background-color:#ff0}
div.newbom {background-color:transparent; text-align:left; margin-bottom:20px; overflow-y:hidden; overflow-x:scroll; position:relative;}
div.newbom div.book, div.newbom div.book2{position:absolute; right:0px; top:-0.5em; margin:0.5em; margin-right:1em; font-size:18pt; vertical-align:top; border:0px solid #f66; cursor:pointer}
div.newbom div.book2{opacity:0.3}
div.newbomstart {background-color:transparent; text-align:left; margin-bottom:20px; overflow:hidden; font-size:8pt}
div.operativo {text-align:left; background-color:#fff}
iframe.inpag {border:0px solid green; margin:0px; padding:0px; display:block; width:99%; height:0px;}
div.campo,div.campo1 {border:1px solid #999; border-radius:10px; padding:5px;  display:inline-block; position:relative; color:#088; vertical-align:top; width:31%; overflow:hidden; margin-bottom:2px; visibility:visible}
div.campo1+div.campo{overflow:auto}
span.ok{position:relative; visibility:visible}
div.hidder,span.hidder{position:absolute; visibility:hidden}
div.campo span,div.campo1 span {position:relative; top:-4px; left:10px; font-size:11pt; display:block}

div.campo input[type="text"],div.campo1 input[type="text"],div.campo span+span, div.campo textarea {border:0px solid white; font-size:10pt; color:#444; height:1em; background-color:#eee; padding:3px; border-radius:3px; border:1px solid #ccc; width:95%; position:relative; width:90%}
div.campo textarea {background-color:#fff; height:6em; width:92%; position:relative; display:block}
div.campo span+span{height:auto; width:95%; margin:5px; position:relative; left:-2px; overflow:auto}
div.campo span+span span {font-size:10pt; color:#800; padding:5px; margin-right:10px; display:block;}
div.campo hr~p,div.campo p.nota {margin-bottom:10px; font-size:85%; margin-left:5px}
hr+p.nota{margin:0px; font-size:85%; color:#666; padding:0px;margin-bottom:20px; margin-right:20px; margin-left:40px; text-indent:-30px}
p.nota span.big {font-size:140%}
hr{margin:0px}
table.specs,table.specs0 {font-size:10pt; width:100%; display:inline-block; vertical-align:top; border:0px solid #999; border-radius:10px; position:relative}
table.head {margin:0px; padding:0px; width:100%}
table.head td {margin:0px; padding:0px; vertical-align:top; text-align:left; position:relative}
table.head td+td {margin:0px; padding:0px; vertical-align:top; text-align:right}
table.head td+td span , div.inpag span, div.inpag span.reg {width:25%; font-size:16pt; color:#f08; text-shadow:2px 2px 3px #999; display:inline-block; text-align:center; position:relative; vertical-align:top; padding-top:2px; padding-bottom:5px; border:0px solid #9f9; transition:font-size 1s, width 1s}
table.head td+td span span , div.inpag span span {font-size:10pt; color:#444; display:block; padding:0px; width:auto}
table.head td+td span span+span , div.inpag span span+span {font-size:8pt; color:#96f;padding:0px}


div.inpag span.reg {position:absolute; left:0px; top:0px; bottom:0px; font-size:12pt; padding-left:5px; padding-top:5px; overflow-y:auto; width:70%; border:0px solid #f99; text-align:left; z-index:5}
div.inpag span.shade {position:absolute; left:0px; bottom:-17px; height:10px; width:100%; border:0px solid black; box-shadow:0px -3px 10px #444; display:block; z-index:6}
div.inpag span.reg span.box {position:relative; font-size:8pt; color:#444; padding:10px; padding-left:5px; padding-bottom:0px; padding-right:0px; display:inline-block; border:0px solid #ccc; vertical-align:bottom; margin-top:5px}
div.inpag span.reg span.box input[type="text"]{position:relative; border:1px solid #ccc; border-radius:5px; width:10em; font-family:monospace; font-size:8pt; padding:2px; color:#00f}
div.inpag span.reg span.box span.tit{position:absolute; top:-6px; left:5px; padding:0px;}

div.inpag span.reg p {position:relative}

        span#statremoto {position:relative; display: inline-block; height:200px; overflow:auto; font-size:12px; text-shadow:none; color:black; width:95%}
        span#statremoto b{font-size:120%; cursor:pointer}
        span#statremoto b+i{font-size:95%; color:#808; cursor:pointer}
        span#statremoto b:hover+i , span#statremoto b+i:hover, span#statremoto b:hover {color:#f00; font-weight:bold}

        table.resu {position:relative; border-top:1px solid #666; border-left:1px solid #666; margin:0%; margin-top:10px;}
        table.resu td {border-right:1px solid #444; border-bottom:1px solid #444; text-align:left}
        table.resu td span.a {font-size:110%; color:blue; text-align:left; display:inline; text-shadow:none}
        table.resu td span.b {font-size:110%; color:green; text-align:left; display:inline; text-shadow:none}
        table.resu td span.c {font-size:110%; color:purple; text-align:left; display:inline; text-shadow:none}
        table.resu td b {font-size:110%}


table.head td+td span+span img,table.head td img , div.inpag span+span img, div.inpag span#imagero img{position:relative; height:80px; padding:0px; margin:0px; border-radius:10px; display:inline-block}

div.inpag span#imagero img{height:160px; border-radius:5px}

table.head td img {position:absolute; left:-115px; height:100px; transition: height 1s, width 1s}
table.head td img.perma {height:110px; left:-100px; padding-left:auto; padding-right:auto}
table.head+hr{margin:0px}
table.specs0{border:0px solid #999}
table.specs tr td,table.specs0 tr td {vertical-align:top; border-bottom:1px solid #ccc; position:relative; width:auto}
table.specs tr td.fecha, table.specs0 tr td.fecha {font-size:8pt; color:#080; text-align:right; height:auto}
table.precios{width:100%; position:relative; font-size:10pt}
table.precios td {vertical-align:top}
table.precios td.titulo {color:#448; font-size:18pt}
table.precios table{color:#008; position:relative; width:100%; border:2px solid #444}
table.precios table tr th {color:#008}
table.precios table tr th.idx {color:#8cc; font-size:7pt}
table.precios table tr {background-color:#eee; transition:background-color 1s}
table.precios table tr.editon {background-color:#a5f489; transition:background-color 2s}
table.precios table tr td {background-color:transparent; color:#444; text-align:left; border-bottom:1px solid #999; border-right:1px solid #999; position:relative}
table.precios table tr td span.cclase {border-top:1px solid #999; font-size:8pt; color:#666; margin:1px; margin-top:2px; padding:1.5px; position:relative; left:0px; margin-left: 4px; display:block;}
table.precios table tr.editon td span.cclase {color:#06f}
table.precios table tr td.idx {color:#999; font-size:7pt; text-align:center}
table.precios table tr td.fotero {background-color:#ff9; text-align:center; font-size:7pt; color:#f60; vertical-align:top}
table.precios table tr td.fotero img {display:inline-block; margin:1.5px; border-radius:5px; width:15%; height:auto; border:1px solid #999; transition:width 1s}
table.precios table tr td.fotero img.gde {display:inline-block; margin:1.5px; border-radius:5px; width:90%; height:auto; border:1px solid #999; transition:width 1s}
table.precios table tr td+td+td {color:#844}
table.precios table tr td+td+td+td {color:#484}
table.precios table tr td+td+td+td+td {text-align:right}
table.precios table tr td+td+td+td+td span {color:#000;display:inline-block; border:0px solid #f66; position:relative; margin:2px; padding:0px; left:0px; font-size:10pt}
table.precios table tr td+td+td+td+td span+br+span{color:#00f}
table.precios table tr td+td+td+td+td span+br+span+br+span {color:#f0f}
table.precios table tr td+td+td+td+td span+br+span+br+span+br+span {color:#080; border:1px solid #f66;}

div.campo1 span select, div.campo span input[type="button"] {font-size:8pt; color:#666}
div.camp {width:100%; position:relative; display:inline-block; border:0px solid #ccc; border-radius:20px; vertical-align:top}
div.camp div.fotero, div.campo div.fotero, div.campo2 div.fotero, div.campo2 div.txt {display:inline-block; border: 1px solid #999; border-radius:15px; margin:10px; padding:15px; width:15%; position:relative; overflow:hidden; font-size:90%; transition:width 1s, height 1s}
div.campo span+span table.specs, div.campo span+span table.precios {width:100%}
div.camp div.fotero img {width:100%; position:relative}
div.campo div.fotero img, div.campo2 div.fotero img {width:100%; position:relative}
div.campo div.fotero,div.campo div.txt,div.campo2 div.fotero,div.campo2 div.txt  {width:27%; margin-bottom:10px; vertical-align:top}



@media screen /*telefonos*/
and (min-width:0px) 
and (max-width:480px) {
  div.campo1 {width:95%}
  div.campo {width:95%}
    h1.main, h1.maix{font-size:200%}
    h2{font-size:100%; width:80%}
    h4.sloger,span.sloger {font-size:75%}
    div.camp {width:100%}
    table.specs0{width:100%; margin-left:20px}
    div.camp div.fotero {width:80%; margin:3px}
    table.head td+td span+span img,table.head td img {height:70px; left:-75px}
    table.head td img.perma {height:70px; left:-60px; padding-left:auto; padding-right:auto}
    div.inpag span  {width:40%; font-size:13pt}
    div.inpag span.reg {width:56%}
    div.campo2 div.fotero, div.campo2 div.txt {width:85%}
    
}

@media screen /*Telefonotes*/
and (min-width:480px) 
and (max-width:768px) {
  div.campo1 {width:95%}
  div.campo {width:95%}
    h1.maix,h1.main{font-size:250%}
    h2{font-size:105%; width:80%}
    h4.sloger,span.sloger {font-size:80%}
    div.camp {width:55%}
    table.specs0{width:40%}
    div.camp div.fotero {width:80%}
    div.inpag span  {width:40%; font-size:13pt}
    div.inpag span.reg {width:55%}
    table.head td+td span+span img,table.head td img {height:80px; left:-85px}
    table.head td img.perma {height:80px; left:-70px; padding-left:auto; padding-right:auto}
    div.campo2 div.fotero, div.campo2 div.txt {width:38%}
}

@media screen /*Tablets*/
and (min-width:769px) 
and (max-width:1000px) {
  div.campo1 {width:95%}
  div.campo {width:46.5%}
    h1.main,h1.maix{font-size:300%}
    h2{font-size:110%; width:90%}
    h4.sloger,span.sloger {font-size:85%}
    div.camp {width:55%}
    table.specs0{width:40%}
    div.camp div.fotero {width:35%}
    div.inpag span {width:30%}
    div.inpag span.reg {width:65%}
    table.head td+td span+span img,table.head td img {height:90px; left:-95px}
    table.head td img.perma {height:90px; left:-80px; padding-left:auto; padding-right:auto}
    div.campo2 div.fotero, div.campo2 div.txt {width:38%}
}

@media screen /*Monitores*/
and (min-width:1001px) 
and (max-width:1200px) {
  div.campo1 {width:95%}
  div.campo {width:46.5%}
    h1.main,h1.maix{font-size:350%}
    h4.sloger,span.sloger {font-size:90%}
    h2{font-size:120%; width:90%}
    div.camp {width:65%}
    table.specs0{width:30%}
    div.camp div.fotero {width:25%}
    div.campo2 div.fotero, div.campo2 div.txt {width:27%}
}

@media screen /*Monitores Grandes*/
and (min-width:1201px) {
    div.camp {width:75%}
    h4.sloger,span.sloger {font-size:93%}
    table.specs0{width:22%}
    div.camp div.fotero {width:14%}
}   

 
