
/*modal/
/div.modal-visible {	display: flex !important; z-index:99}
*
input.clase_campo {
    padding: 0.5em 1em;
}
/* este es el CSS que se aplica donde tengas el foco en la navecacion por teclado y skiplinks (landmarks) areas*/
/*---------------------------------------------------*/
/*----------------- COLORES CORPORATIVOS -------------
Naranja: 	#d44406
Azul: 		#010066
---------------------------------------------------*/
/*correccion de iconografia materialize a tamaño relativo a la fuente 1em*/
/*
.material-icons {
    font-size: 1em;
}
*/

/*Foto circular*/
.foto-circular {
    width: 9em;
    border-radius: 50%;
}

/*Deshabilitamos iconografia y alis biblioteca*/
li.iconografia,
li.alis {
    display: none;
}

/*ALTA HOTSPOT*/
.onClicExternalUrl {display: none;}

/*Warning en alta de hotspot*/
.borde-darkred {
    border: 1px solid darkred;
    padding: 0.5em;
}
.warning-title {
    background-color: darkred;
    color: white;
    font-size: 2em;
    margin-top: 0.3em;
    padding: 0.2em;
}
.warning-ico{
    color:white;
}
/* Fin Warning en alta de hotspot*/

/*cUSTOM CLASESS INFO*/
.pau-class-toUse-title {
    font-size: 2em;
}

tbody->tr->th,
tbody tr th {
    font-weight: 400;
}
thead->tr->th.th-class,
thead tr th.th-class {
    font-weight: 600;
    color:white;
    background-color: black;
    border: 1px white solid;
    text-align: center;
}
tbody->tr->th.th-class,
tbody tr th.th-class {
    font-weight: 700;
    color:black;
    background-color: white;
    border: 1px black solid;
    text-align: center;
}
tbody {border: 1px #999 solid;}
thead {border: 1px black solid;}

/*Preview*/
th.th-example {
text-align: center;
}
th.th-example img{
    width: 7em;
    height: 7em;
}

/*Agrandamos tamaño del modal alta hotspot*/
div#add_hostspots_table.modal {
    width: 70%;
    max-width: 70%;
    height: 80%;
    max-height: 80%;
    border-radius: 15px;
}
/*fin ALTA HOTSPOT*/
/*cabecera de hotspot con o sin licencia*/

div.nopaulicense {
    /*background: #010066;*/
    background: #0070b8;
    border: #d44406 1px solid;
    border-top: none;
    color: white;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    box-shadow: 3px 3px 8px #333;
    margin-right: 1rem;
    text-align: center;
}
div.nopaulicenseLeft p,
div.nopaulicenseRight p {
    font-size: 1.2em;
}
div.nopaulicenseLeft {
    /*text-align: left;*/
    border-right: dotted 1.5px #d44406;
}


.yespaulicense {
    background: #216b0e;
    border: #010066 1px solid;
    border-top: none;
    color: white;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    box-shadow: 3px 3px 8px #333;
    margin: 0 auto;
    text-align: center;
    position: absolute;
    width: 90%;
}
.yespaulicense p {
  font-size: 1em;
  font-weight: 500;
}
/*FIN-cabecera de hotspot con o sin licencia*/

/*barra de opciones de hotspots*/

.hotspotBarra {
    padding: 1em;
    box-shadow: 3px 8px 9px #333;
    border-radius: 50px;
    height: auto;
    margin-right: 2rem;
}
.hotspotBotonNuevo {
    margin-top: 1em;
    text-align: center;
}
.hotspotBotonNuevo a {
    margin-bottom: 0.5em;
}

/*iconos del listado*/
.adminIcon { max-width:1.5em;}

/*pictogramas del listado de hotspots*/
img.picto-off,
 img.picto-on {
	height: 5em;
	width: 5em;
}
/*img.picto-off {display:block;}*/
img.picto-on  {
	display:none;
}

/*------------------- LISTADO de HotSopots-------*/
/*centramos botones de acciones*/
.td-editar,
.td-duplicar,
.td-borrar {
    text-align: center;
}

/*Ancho columna centrado de Audio y Video*/
th.th-audio,
td.td-audio {
    text-align: center;
	width: 285px;
}
th.th-video,
td.td-video {
    text-align: center;
	width: 140px;
}

th.th-picto,
td.td-picto {
    text-align: center;
	width: 7em;
}

/* ---- maximo ancho de columnnas de Objeto---*/
th.th-objeto,
td.td-objeto {
	max-width: 7.5em;
}
td.td-objeto strong{
	font-weight: bold;
}
/* ---- fin maximo ancho de columnnas---*/

/*------------------- FORMULARIO DE ALTA Y EDICION-------*/

/* --- marcoAudio --*/
div.marcoAudio {
	width: 80px; /*habra que cambiar a em*/
	height: 80px; /*habra que cambiar a em*/
	overflow: hidden;
	border-radius: 50%;
	position: relative;
}

div.marcoAudio img{
	width: 90px;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate( -50%, -50%);
	        transform: translate( -50%, -50%); /* para que quede centrado*/
}

/*-----------------FIN---- antes de javi---------------------*/

.alert-minimalist {
	background-color: rgb(241, 242, 240);
	border-color: rgba(149, 149, 149, 0.3);
	border-radius: 3px;
	color: rgb(149, 149, 149);
	padding: 10px;
}
.alert-minimalist > [data-notify="icon"] {
	height: 50px;
	margin-right: 12px;
}
.alert-minimalist > [data-notify="title"] {
	color: rgb(51, 51, 51);
	display: block;
	font-weight: bold;
	margin-bottom: 5px;
}
.alert-minimalist > [data-notify="message"] {
	font-size: 90%;
    color: black
}

/*----------------TODO ------------*/



.precargador {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    position: fixed;
    background: rgba(255, 255, 255, 0.72);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 999999;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: none;
}

.marcoimg {
    width: 80px;
    height: 80px;
    overflow: hidden;
    border-radius: 50%;
    position: relative;
}

.marcoimg img {
    width: 90px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate( -50%, -50% );
    transform: translate( -50%, -50% );
}

.bcpg-media {
    width: 40px;
    height: 40px;
    border-radius: 50%
}

.bg-animado {
    animation: bganimado 1.4s;
    -webkit-animation: bganimado 1.4s;
}

@keyframes bganimado {
    0% { background: green; }
    100% { background: transparent; }
}

@-webkit-keyframes bganimado {
    0% { background: green; }
    100% { background: transparent; }
}

.pau-media-preview {
    width: 100%;
    margin-top: 7px;
    display: none;
}

.pau-media-preview > * {
    width: 100%;
}

.pau-externals {
    display: none;
}

/**
 * Estilos para la página de configuraciones
 */

.p0  { padding:  0 !important; }
.p10 { padding: 10px !important; }
.p20 { padding: 20px !important; }
.p30 { padding: 30px !important; }
.p40 { padding: 40px !important; }

.pt0  { padding-top:  0 !important; }
.pt10 { padding-top: 10px !important; }
.pt20 { padding-top: 20px !important; }
.pt30 { padding-top: 30px !important; }
.pt40 { padding-top: 40px !important; }

.pb0  { padding-bottom:  0 !important; }
.pb10 { padding-bottom: 10px !important; }
.pb20 { padding-bottom: 20px !important; }
.pb30 { padding-bottom: 30px !important; }
.pb40 { padding-bottom: 40px !important; }

.pl0  { padding-left:  0 !important; }
.pl10 { padding-left: 10px !important; }
.pl20 { padding-left: 20px !important; }
.pl30 { padding-left: 30px !important; }
.pl40 { padding-left: 40px !important; }

.pr0  { padding-right:  0 !important; }
.pr10 { padding-right: 10px !important; }
.pr20 { padding-right: 20px !important; }
.pr30 { padding-right: 30px !important; }
.pr40 { padding-right: 40px !important; }

.m0  { margin:  0 !important; }
.m10 { margin: 10px !important; }
.m20 { margin: 20px !important; }
.m30 { margin: 30px !important; }
.m40 { margin: 40px !important; }

.mt0  { margin-top:  0 !important; }
.mt6  { margin-top:  6px !important; }
.mt8  { margin-top:  8px !important; }
.mt10 { margin-top: 10px !important; }
.mt20 { margin-top: 20px !important; }
.mt30 { margin-top: 30px !important; }
.mt40 { margin-top: 40px !important; }

.mb0  { margin-bottom:  0 !important; }
.mb10 { margin-bottom: 10px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb40 { margin-bottom: 40px !important; }

.ml0  { margin-left:  0 !important; }
.ml10 { margin-left: 10px !important; }
.ml20 { margin-left: 20px !important; }
.ml30 { margin-left: 30px !important; }
.ml40 { margin-left: 40px !important; }

.mr0  { margin-right:  0 !important; }
.mr10 { margin-right: 10px !important; }

.mr20 {margin-right: 20px !important; }

/*Ocultamos mostrar*/
label.mr20 {
    display: none;
}

.mr30 { margin-right: 30px !important; }
.mr40 { margin-right: 40px !important; }


.pau-bg-verde {background: #1eac12;}
.pau-bg-verde:hover {background: #128008;}
.pau-bg-verde:active {background: #128008;}
.pau-bg-verde:focus {background: #128008;}

.dflex { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important;}

.capaSemiTransparente {
    width: 60%;
    background: rgba(0,0,0,0.2);
    position: fixed;
    height: 100px;
    top: 90%;
    margin-left: 15%;
    margin-right: 15%;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
}

.btn-pau {
    border: 0;
    color: white;
    width: auto;
    height: 41px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 14px 0 17px;
    top: 93% !important;
    bottom: 0;
    right: 45%;
    left: auto;
    z-index: 99;
    font-size: 17px;
    cursor: pointer;
    text-align: center;
    position: fixed !important;
    z-index: 9;
}
/*agrupamiento de campos*/
.fieldsGroup {
    border: 1px solid #bbbbbb;
    border-radius: 25px;
    padding: 14px 25px 6px 18px !important;
    width: auto !important;
    font-size: 0.7em;
}
.subleyenda { font-size: 0.7em; }
.btn-pau.pau-bg-azul:hover {
    background: #2c3f45;
}

#pushpin-guardar {
    z-index: 99;
}

fieldset.pauFieldfix {
    border: 1px solid #bbbbbb;
    padding: 14px 25px 6px 18px !important;
    /* width: auto !important; */
}

fieldset.pauFieldfix legend {
    width: auto !important;
    padding: 0 20px;
    margin-bottom: 0;
    font-size: 1.5em;
}

#tableHotspot {
    width: 98%;
    overflow: auto;
}

#tableHotspot thead tr {
    background-color: #0070B8;
    border: 2px solid #d44406;
    color: white;
}

#tableHotspot tbody tr {
    border: 1px solid #d44406;
}

#tableHotspot tbody tr:nth-child( odd ) {
    background-color: white;
}

#tableHotspot tbody tr:nth-child( even ) {
    background-color: #eeeeee;
}

/*
 * Estilos Tabs Setting
 */

ul#pauSettingTabs {
    background-color: transparent !important;
    position: relative;
    top: 1px;
}

ul#pauSettingTabs .tab {
    margin-left: 7px;
}

ul#pauSettingTabs .tab a {
    background-color: #dbdbdb;
    color: #4f4f4f;
    border: 1px solid #c4c4c4;
    font-weight: bold;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

ul#pauSettingTabs .tab a:hover, ul#pauSettingTabs .tab a.active {
    background-color: white;
    color: #4f4f4f;
    border-bottom: none;
}

a:focus {
    -webkit-box-shadow: none;
            box-shadow: none;
}

.tabs .tab a:focus, .tabs .tab a:focus.active {
    background-color: rgba(246,178,181,0.2);
    outline: none;
}

li.indicator {
    display: none !important;
}

.pauContentSettings {
    background-color: white;
    border-top: 1px solid #c4c4c4;
    padding-top: 17px !important;
}

.pauContentSettings span {
    color: #585858;
}

.pauSelHost ul {
    position: relative !important;
    top: 0 !important;
}

.pauCard {
    padding: 0;
    border: 0;
    border-top: 4px solid;
}

.pauCard .card-title {
    font-weight: bold;
    margin-bottom: 24px !important;
    font-size: 27px;
}

.pauCard .card-price {
    display: block;
    text-align: center;
    font-size: 38px;
    margin-bottom: 30px;
    font-weight: bold;
}

.pauCard .card-action > *:hover {
    color: black !important;
}

.pauCard .card-content {
    padding-bottom: 6px;
}

.pauCard .card-content ul li {
    font-size: 20px;
    margin-bottom: 13px;
}

.bcp1 { border-color: #d44406 !important; }
.bcp2 { border-color: #0070B8 !important; }

.colorp1 { color: #d44406 !important;}
.colorp2 { color: #0070B8 !important;}

.pau-alert {
    position: relative;
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
}

.pau-alert-success {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

.pau-alert-primary {
    color: #004085;
    background-color: #cce5ff;
    border-color: #b8daff;
}

.pau-alert-secondary {
    color: #383d41;
    background-color: #e2e3e5;
    border-color: #d6d8db;
}

.pau-alert-info {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb;
}

.pau-alert-warning {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
}

.pau-alert-danger {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}

#pau-wrapper-license {
    display: none;
}

/**
 * Pau Admin Page Title
 */

.pauAdminPageTitle {
    padding: 18px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    border-bottom: 1px solid rgba(194, 194, 194, 0.74);
    margin-bottom: 18px;
    margin-right: 2rem;
}

.pauAdminPageTitle img {
    width: 80px;
    margin-right: 6px;
}

.pauAdminPageTitle span {
    font-size: 30px;
}

/**
 * Pau Admin Descriptioon Page
 */

/*Sub-Titulos decorados*/
.abouTitle {
    padding: 0em calc( .5em + 0em );
    font-weight: 500;
    color: #010066;
    font-size: 2em;
}
h3.abouTitle {
    margin-left: 1.5em;
    font-size: 1.8em;
    font-weight: 400;
}
.barra {
    background: #d44406;
    bottom: 0;
    content: "";
    display: block;
    height: 7px;
    position: relative;
    width: 180px;
    margin-left: 1em;
}
.barra3 { margin-left: 3em; }

/*titulos de pagina h1*/
.pauAdminTitleH1 {
  font-size: 3rem;
  font-weight: 600;
}

 /*textos de descripcion*/
.descriptionPage p { font-size: 1.2em; }

.msgPrecargador {
    max-width: 900px;
}
