﻿/* selector universal */
*{
    margin: 0px;
    padding: 0px;
    /* Apply a natural box layout model to all elements: http://paulirish.com/2012/box-sizing-border-box-ftw/ */
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

header, section, footer, aside, nav, article, figure, figcaption, hgroup{
   display: block
}

body {
    font: 12px Helmet, Freesans, sans-serif;
    text-align: center;
}

h4 {
    font: bold 16px Helmet, Freesans, sans-serif;
    color: #0069ae;
}

.vizq {
	float: left;
	width: 320px;
	height: 160px;

    margin: 10px 10px 10px 50px;
}

.vder {
	float: right;
	width: 320px;
	height: 160px;

    margin: 10px 50px 10px 10px;
}

.vizq div, .vder div {
	float: right;
	width: 170px;
	height: 80px;
	border: 1px solid #000;
    border-radius: 10px 10px 10px 10px;
    margin: 10px 10px 10px 0px;
    padding: 5px;
}

.vizq img, .vder img {
	height: 80px;
	margin: 10px;
}

#detTarifa p {
    border-bottom: 2px solid #0069ae;
    font: bold 12px Helmet, Freesans, sans-serif;
    margin-bottom: 5px;
}

fieldset {
    border: 1px solid #000;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 5px 5px 10px #969696;
    padding: 5px;
    background: #000;
    color: #FFF;
}

input {
    /*border: 1px solid #0069ae;*/
    border-bottom: 1px solid #848484;
    border-right: 1px solid #848484;
    border-radius: 5px;
    padding-left: 1px;
    padding-right: 1px;
    margin-bottom: 3px;
    background: #FFFFFF;
    font-size: 12px;
}

input:-moz-placeholder { color:#a9a9a9; }

select {
    /*border: 1px solid #0069ae;*/
    border-bottom: 1px solid #848484;
    border-right: 1px solid #848484;
    border-radius: 5px;
    padding-left: 1px;
    padding-right: 1px;
}

input[type='radio'], input[type='checkbox'] {
    margin-top:0px;
    margin-bottom:2px;
}

table {
    border: none;
    width: 100%;
    background: none;
    border-collapse: separate;
}

table tr td {
    border: none;
}

table tr td table, table tr td form table, .tableData {
    border-spacing: 10px;
}

table tr td table tr th, table tr td form table tr th, .tableData th {
    border: none;
    border-bottom: 2px solid #0069ae;
    text-align: center;
}

#trCanales:hover {
    background: #7ac3de; /** d9edf7*/
}

#filtro {
    border-spacing: 10px;
}

#filtro tr th {
    border: none;
    border-bottom: 2px solid #0069ae;
    text-align: center;
}

#menuTabla {
    border: 1px solid #000;
    border-right: none;
    border-radius: 5px 5px 5px 5px;
    box-shadow: 5px 5px 10px #969696;
    width: 95%;
    margin:auto;
    border-spacing: 0px;
}

#menuTabla td {
    font: bold 14px Helmet, Freesans, sans-serif;
    border-right: 1px solid #000;
    padding-top: 7px;
    padding-bottom: 7px;
}

.menuElegido {
    background: #595959;
}

.menuElegido a {
    color: #FFF;
}

.menuBasico {
    /*background: #f3f3f3;*/
    background: #d9edf7;
}

#EnviarTipo {
    width: 560px;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 5px 5px 10px #969696;
    margin:10px;
    padding: 10px 30px 10px 30px;
}
.envios {
    border-radius: 10px 10px 10px 10px;
    box-shadow: 5px 5px 10px #969696;
    margin:10px;
    padding: 10px 30px 10px 30px;
}

#EnviarPara {
    width: 270px;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 5px 5px 10px #969696;
    float:left;
    margin:10px;
    padding: 10px 30px 10px 30px;
}

#EnviarTexto {
    width: 270px;
    min-height: 290px;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 5px 5px 10px #969696;
    float:left;
    margin:10px;
    padding: 10px 30px 10px 30px;
}

#EnviarResumen {
    width: 190px;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 5px 5px 10px #969696;
    float:right;
    margin: 10px;
    padding: 10px 10px 10px 20px;
}

#EnviarResumen input {
    width: 140px;
    text-align: right;
}

#EnviarAcciones {
    min-width: 200px;
    margin:20px auto;
    text-align: center;
}

#EnviarEstadisticas {
    width: 770px;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 5px 5px 10px #969696;
    margin:10px;
    padding: 10px 30px 10px 30px;
}

#BEnviarSMS {
    margin: 5px 5px 5px 5px;
    width: 140px;
    padding:5px
}

#BEnviarSMS2 {
    margin: 2px 2px 2px 2px;
    width: 50px;
    padding:0px
}

#imgContacto {
    float:right;
    height:250px;
    padding:20px 70px 10px 10px;
}

#contacto {
    width:560px;
    margin:10px auto 10px 45px;
}

#contacto #map-canvas {
    height:250px;
    width:540px;
    margin:10px 8px 10px 8px;
}

#detcontacto {
    width:550px;
    margin:10px auto 20px 8px;
}

#detcontacto table td {
    margin:auto;
    vertical-align: middle;
}

#detcontacto table td input,#detcontacto table td textarea {
    margin:5px auto;
}

/* clase: . */
.agrupar {
 width: 1024px;
 margin: 15px auto;
 text-align: left;
 border: 1px solid;
}

/* id: # */
#agrupar {
    width: 1024px;
    margin: 15px auto;
    background-image: none; /* url('../img/Back_H2O_321_150.jpg');  */
    background-position: center;

    -moz-border-radius: 20px 10px 30px 50px;
    -webkit-border-radius: 20px 10px 30px 50px;
    border-radius: 20px 10px 30px 50px;

    -moz-box-shadow: rgb(150,150,150) 5px 1px;
    -webkit-box-shadow: rgb(150,150,150) 5px 1px;
    box-shadow: rgb(150,150,150) 5px 5px 1px;
    padding-bottom: 15px;
}


#cabecera {
    background: none;
    padding: 0px;
    height: 110px;
    /*border: 2px solid;*/
    display: block;
}

#cabecera > #figure2 {
    float:left;
    padding-right: 0px;
    width: 300px;
    height: 77px;
    background-image: url('../img/Logo-cabecera-web.png'); /** tdvoip.png*/
    background-size: 300px 77px;
    background-position: left;
}

#cabecera > div {
    float: left;
    height: 5px; /** 105 */
    width: 882px;
    alignment-baseline: central;
    alignment-adjust: central;
    padding-left: 10px;
    text-align: center;
    inline-box-align: initial;
    /*border: 1px red solid;*/
}

#menuv {
    clear: both;
    background: none;
    padding: 1px 1px;
    bottom: 10px;
    alignment-baseline: text-after-edge;
    alignment-adjust: text-after-edge;
    /*width: 500px;*/
}

#seccion {
    border-radius: 10px 10px 10px 10px;
    box-shadow: 5px 5px 10px #969696;
    float: left;
    width: 800px;
    margin-left: 20px;
    display: block;
    text-align: left;
    font: 12px verdana, sans-serif;
    padding: 5px;
}

#columna {
    clear: both;
    float: left;
    width: 180px;
    margin: 2px 0px;
    padding: 10px;
    background: #FFF;
    text-align: left;

    -moz-border-radius: 20px 10px 30px 50px;
    -webkit-border-radius: 20px 10px 30px 50px;
    border-radius: 20px 10px 30px 50px;

    -moz-box-shadow: rgb(150,150,150) 5px 5px;
    -webkit-box-shadow: rgb(150,150,150) 5px 5px;
    box-shadow: rgb(150,150,150) 5px 5px 10px;
}


#menu {
    clear: both;
    background: none;
    padding: 1px 5px;
    /*border: 2px solid;*/
}

#divcol1 {
    width: 100%;
    min-height: 10px;
}

#divcol1 > h2 {
    color: #0069ae;
}

#divcol1 > li > a {
    display: inline-block;
    list-style: none;
    padding: 2px;
    font: bold 11px verdana, sans-serif;
    color: #0069ae;
}

#divcol2 {
    width: 100%;
    min-height: 10px;
    padding-top: 2px;
    padding-bottom: 5px;
    /*background: #FFF;*/
    color: black;
    /**/
}

#divcol2 li {
    width: 100%;
    display: inline-block;
    list-style: none;
    /*padding: 2px;*/
    font: bold 10px verdana, sans-serif;
    padding-top: 5px;
    border-bottom: 1px solid;
    border-bottom-color: grey;
}

#divcol2 li > a {
    font: bold 10px verdana, sans-serif;
}

#divcol2 > ul > ul > li {
    width: 120px;
    display: inline-block;
    list-style: none;
    /*padding: 2px;*/
    font: bold 10px verdana, sans-serif;
    padding-top: 5px;
    border-bottom: 1px solid;
    border-bottom-color: grey;
    margin-left:30px;
}

#divcol2 li li a {
    font: bold 10px verdana, sans-serif;
}


#rbuscador {
    background: none repeat scroll 0 0 #FFFFFF;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 5px 5px 10px #969696;
    overflow-x: hidden;
    overflow-y: scroll;
    width: 100%;
    height:266px;
    margin-top: 5px;
    margin-bottom: 5px;
}

#rbuscador li {
    width: 100%;
    display: inline-block;
    list-style: none;
    font: bold 10px verdana, sans-serif;
    padding-top: 2px;
    border-bottom-color: grey;
}

#rbuscador li > a {
    font: bold 10px verdana, sans-serif;
}

#detTarifa {
    background: none repeat scroll 0 0 #FFFFFF;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 5px 5px 10px #969696;
    padding: 5px;
    width: 100%;
    min-height: 60px;
    color: black;
    font: 9px verdana, sans-serif;
}

#desFiltro label {
    font-size: 12px;
}

#desFiltro select,#desFiltro input[type='text'] {
    font-size: 12px;
    margin-top: 8px;
}

#menu li {
    display: inline-block;
    list-style: none;
    padding: 2px;
    font: bold 14px verdana, sans-serif;
}


#columna_pie {
    clear: both;
    text-align: center;
    padding: 20px;
    /*border-top: 2px solid #999999;*/
}

#columna_pie > div {
    float: left;
    width: auto;
    margin: 10px 0px;
    padding: 5px;
    background: none;
    text-align: center;
    alignment-adjust: central;
}

#columna_pie > .divc {
    float: left;
    width: 400px;
    margin: 1px 1px 1px 1px;
    padding: 10px 10px 10px 120px;
    background: none;
    text-align: center;
    border:  0px solid;
    alignment-adjust: central;
    alignment-baseline: central;
}

#columna_pie > .div2 {
    float: right;
    width: auto;
    margin: 10px 0px;
    padding: 5px;
    background: none;
    text-align: center;
    alignment-adjust: central;
    alignment-baseline: central;
}

#pie {
    clear: both;
    text-align: center;
    color: #FFF;
    padding: 10px;
    border-top: 2px solid #000;
    background: rgb(147,136,140); /*#3D3C3C;*/
    -moz-box-shadow: rgb(150,150,150) 5px 1px;
    -webkit-box-shadow: rgb(150,150,150) 5px 1px;
    box-shadow: rgb(150,150,150) 5px 5px 1px;
}

article {
    /*background: #FFFBCC;*/
    border: 1px solid #999999;
    padding: 20px;
    margin-bottom: 15px;
    text-align: left;
}
article footer {
    text-align: right;
}
time {
    color: #999999;
}
figcaption {
    font: italic 14px verdana, sans-serif;
}

/**
-moz- para Firefox.
-webkit- para Safari y Chrome.
-o- para Opera.
-khtml- para Konqueror.
-ms- para Internet Explorer.
-chrome- específico para Google Chrome.
*/


a {color: black;}
a:hover {color: #69f;}

/* Custom text-selection colors (remove any text shadows: http://twitter.com/miketaylr/status/12228805301) */
::-moz-selection {background: #fcd700; color: #fff; text-shadow: none;}
::selection     {background: #fcd700; color: #fff; text-shadow: none;}

/*        j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700; text-decoration: none;}

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}

/* Mozilla dosen't style place holders by default */
textarea:-moz-placeholder { color:#a9a9a9; }


/* Print styles! -------------------------------------------------------------------------------*/
@media print {

}


/* Media queries! -------------------------------------------------------------------------------*/
@media screen and (max-width: 480px) {
}

.chromeframe {position: absolute; top: 0;}

/** -------------------------------------------------------------------------------------------------------- */

#inpNombre {
    width: 526px;
}

.map_canvas {
    width: 300px;
    height: 300px;

    float: left;
    text-align: center;
  	border: 1px solid #000;
    border-radius: 10px 10px 10px 10px;
    margin: 10px 10px 10px 10px;
    padding: 5px;

}

.thumb {
    height: 75px;
    border: 1px solid #000;
    margin: 10px 5px 0 0;
}

/** ******************************************************************************************************* */

#div-1 {
    background-color: white;
    width: 960px;
    height: auto; /* 400px;*/
    border:1px solid;
}

#div-imgsuperior {
    text-align: center;
    top: 0;
    width: 100%;
    max-width: 400px;
    max-height: 100px;
}

#div-imgsuperior .canvasimgsup {
    max-height: 100px;
    max-width: 400px;
}

#div-txt-logo {
    text-align: justify;
    text-justify: distribute;
    top: 5px;
    left: 0px;
    font-size: 9px;
    font-weight: bold;
    width:100%; /* 390px;*/

}

#div-txt-logo .img {
    height: auto !important;
    width: auto !important;
    max-width: 640px !important;
    text-align: center;
}

#div-txt-logo .canvastlogo {
    text-align: center;
}

#div-txtpromo {
    clear: both;
    display: inline-block;
    padding-top: 5px;
    padding-bottom: 10px;
    text-align: justify;
    text-justify: distribute;
    width: 100%;
    height: 50px;
    font-size: 9px;
}

#div-txtpromo .img {
    height: auto !important;
    width: auto !important;
    max-width: 640px !important;
}


#div-dosimgsamp {
    display: inline-block;
    width: 100%;
    padding-top: 5px;
    max-height: 100px;
}

#div-sup {
    /*clear: both;*/
    float: left;
    text-align: right;
    top: 200px;
    right: 5px;
    width: 100px;
    height: 100px;
}

#div-sup .canvassup {
}

#div-inf {
    text-align: left;
    float: right;
    top: 200px;
    left: 1px;
    width: 100px;
    height: 100px;
}

#div-sup .canvasinf {
}

#div-txtpromo2 {
    clear: both;
    display: inline-block;
    padding-top: 5px;
    padding-bottom: 10px;
    text-align: justify;
    text-justify: distribute;
    width: 100%;
    /*height: 50px;*/
    font-size: 9px;
}


#div-botonera {
    text-align: center;
    top: 300px;
    left: 0;
    width: 400px;
    height: 87px;
}

#div-botonera #div-boton1 {
    float: left;
    text-align: center;
    padding-top: 10px;
    width: 200px;
    height: 43px;
}

#div-botonera #div-boton2 {
    float: right;
    padding-top: 10px;
    text-align: center;
    width: 200px;
    height: 43px;
}


#div-botonera #div-boton3 {
    float: left;
    padding-top: 10px;
    text-align: center;
    width: 200px;
    height: 44px;
}

#div-botonera #div-boton4 {
    float: right;
    padding-top: 10px;
    text-align: center;
    width: 200px;
    height: 44px;
}

#mask {
    position: absolute;
    z-index: 9000;
    background-color: #000;
    display: none;
}

#boxes .window {
    position: absolute;
    width: 960px;
    height: 500px;
    display: none;
    z-index: 9999;
    padding: 20px;
}

/* Customize your modal window here, you can add background image too */
#boxes #dialog {
    width: 960px;
    height: 500px;
}


.paginate_button{
    margin: 10px 20px 10px 20px;
}

.paginate_button previous {
    margin: 10px 20px 10px 20px;
}

.paginate_button next{
    margin: 10px 20px 10px 20px;
}

.paginate_button firts{
    margin: 10px 20px 10px 20px;
}

.paginate_button last{
    margin: 10px 20px 10px 20px;
}
