/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 9/09/2017, 09:02:29 AM
    Author     : Dr. Carlos
*/

body
{

margin:0;
background: url(../img/dark-wood-panels-1645.jpg);

}
video.fondo2 {
    position: fixed;
    min-width: 100%;
    min-height: 100%;
    top: 50%;
    left: 50%;    
    transform: translateX(-50%)translateY(-50%);    
    z-index: -1;  
}

.jumbotron {
    background-color: #89CFF0 ;
    color:white;
    margin-top: 4em;
}


.panel-heading {
    background-color: #89CFF0 !important;
    color:#2b2b2b !important;
    
}

.panel-body {
    background-color: gainsboro !important;
    color:#2b2b2b !important;
    
}


.navbar{
   background-color: #3B444B !important; 
   margin-top: 0;
}

.navbar-brand:link, .navbar-brand:visited {
   color: #89CFF0  !important; 
}

.navbar-brand:hover, .navbar-brand:active {
   color: yellow !important; 
}

.navbar li a:link, #navbar li a:visited {
   color: white; 
}

.navbar li a:hover, #navbar li a:active {
   color: yellow !important; 
}


/* Empieza  parte de ccs de banner de web´s CHOY */
.banner{
    width: 200px;
    height: 150px;
    display:block;
    
    -webkit-width: 200px;
    -webkit-height: 150px;
    
    -moz-width: 200px;
    -moz-height: 150px;
    
    -ms-width: 200px;
    -ms-height: 150px;
    
    margin: auto;
    -webkit-margin: auto;
    -moz-margin: auto;
    -ms-margin: auto;
    
    background-size: 100% 100%;
    background-color: #2b2b2b ;
    -webkit-background-size: 100% 100%;
    -webkit-background-color: #2b2b2b ;
    -moz-background-size: 100% 100%;
    -moz-background-color: #2b2b2b ;
    -ms-background-size: 100% 100%;
    -ms-background-color: #2b2b2b ;
    
   -webkit-animation: banner 10s infinite; 
   -moz-animation: banner 10s infinite; 
   -ms-animation: banner 10s infinite; 
   animation: banner 10s infinite; 
    
   -webkit-animation-direction: alternate;
   -moz-animation-direction: alternate;
   -ms-animation-direction: alternate;
   animation-direction: alternate;
  
   
}

@-webkit-keyframes banner {
    0%, 22% { 
        background-image: url('../img/banner_sitios/LOGO_de_MARCA_ventas.png');
        opacity: 1;
    }
    23%, 26% {
        opacity: 0.1;
    }
    27%, 48% {
        background-image: url('../img/banner_sitios/LOGO_CON_BIRRETE.gif');
        opacity: 1;
    }
    49%, 52% {
        opacity: 0.1;
    }
    53%, 74% {
        background-image: url('../img/banner_sitios/LOGO_de_MARCA_blog.png');
        opacity: 1;
    }
    75%, 78% {
        opacity: 0.1;
    }
    79%, 100% {
        opacity: 1;
        background-image: url('../img/banner_sitios/MERCADITOvirtualCHOYchico.png');
    }
    
}

@keyframes banner {
    0%, 22% {
        -ms-background-image: url('../img/banner_sitios/LOGO_de_MARCA_ventas.png');
        opacity: 1;
    }
    23%, 26% {
        opacity: 0.1;
    }
    27%, 48% {
        -ms-background-image: url('../img/banner_sitios/LOGO_CON_BIRRETE.gif');
        opacity: 1;
    }
    49%, 52% {
        opacity: 0.1;
    }
    53%, 74% {
        -ms-background-image: url('../img/banner_sitios/LOGO_de_MARCA_blog.png');
        opacity: 1;
    }
    75%, 78% {
        opacity: 0.1;
    }
    79%, 100% {
        opacity: 1;
        -ms-background-image: url('../img/banner_sitios/MERCADITOvirtualCHOYchico.png');
    }
    
}

@-moz-keyframes banner {
    0%, 22% {
        background-image: url('../img/banner_sitios/LOGO_de_MARCA_ventas.png');
        opacity: 1;
    }
    23%, 26% {
        opacity: 0.1;
    }
    27%, 48% {
        background-image: url('../img/banner_sitios/LOGO_CON_BIRRETE.gif');
        opacity: 1;
    }
    49%, 52% {
        opacity: 0.1;
    }
    53%, 74% {
        background-image: url('../img/banner_sitios/LOGO_de_MARCA_blog.png');
        opacity: 1;
    }
    75%, 78% {
        opacity: 0.1;
    }
    79%, 100% {
        opacity: 1;
        background-image: url('../img/banner_sitios/MERCADITOvirtualCHOYchico.png');
    }
    
}

@keyframes banner {
    0%, 22% {
        background-image: url('../img/banner_sitios/LOGO_de_MARCA_ventas.png');
        opacity: 1;
    }
    23%, 26% {
        opacity: 0.1;
    }
    27%, 48% {
        background-image: url('../img/banner_sitios/LOGO_CON_BIRRETE.gif');
        opacity: 1;
    }
    49%, 52% {
        opacity: 0.1;
    }
    53%, 74% {
        background-image: url('../img/banner_sitios/LOGO_de_MARCA_blog.png');
        opacity: 1;
    }
    75%, 78% {
        opacity: 0.1;
    }
    79%, 100% {
        opacity: 1;
        background-image: url('../img/banner_sitios/MERCADITOvirtualCHOYchico.png');
    }
    
}

/* Termina  parte de ccs de banner de web´s CHOY */


table .primera_fila{
	font-size:1.5em;
	text-decoration:underline;
        background-color:#3B444B;
        text-align: center;
        color:whitesmoke;
}
table .prim_fil_vid{
	font-size:1.5em;
	text-decoration:underline;
        background-color:#3B444B;
        text-align: center;
        color:whitesmoke;
}

table .datos{
	border:0;
        font-size:1.3em;
        background-color: #6E7F80;
        text-align: center;
        color:yellow;
}

table .prim_filaizq{
	font-size:1.5em;
	text-decoration:underline;
        background-color:#3B444B;
        text-align: left;
        color:whitesmoke;
}

table .sin{
	border:0;
}

table .datosjustify{
	border:0;
        font-size:1.3em;
        background-color: #6E7F80;
        text-align: justify;
        color:yellow;
}
table .datosizq{
	border:0;
        font-size:1.3em;
        background-color: #6E7F80;
        text-align: left;
        color:yellow;
}
div .datoscentro{
	
        text-align: center !important;
        
}
h4.Letra {
   font-family: Tourney;
}

h3.colorAMARILLO
{
	color:yellow  !important;
}


h2.colorAMARILLOmasFONDO
{
	color:yellow  !important;
        background-color: #3B444B;
}
a.colorAMARILLOmasFONDO
{
	color:yellow  !important;
        background-color: #3B444B !important; 
}

a.colorREDmasFONDO
{
	color:red  !important;
        background-color: #3B444B !important; 
}
a.colorAMARILLOmasFONDOletragrande
{
	color:yellow  !important;
        background-color: #3B444B !important;
        text-align: center !important;
        font-size:2.3em !important;
}
a.azul_grande
{
	color:blueviolet  !important;
        text-align: center !important;
        font-size:1.4em !important;
}
strong.letrachica
{
	font-size:0.8em !important;
}

.zoom{
        /* Aumentamos la anchura y altura durante 2 segundos */
        transition: width 3s, height 3s, transform 3s;
        -moz-transition: width 3s, height 3s, -moz-transform 3s;
        -webkit-transition: width 3s, height 3s, -webkit-transform 3s;
        -o-transition: width 3s, height 3s,-o-transform 3s;
    }
.zoom:hover{
        /* tranformamos el elemento al pasar el mouse por encima al doble de
           su tamaño con scale(2). */
        transform : scale(3);
        -moz-transform : scale(3);      /* Firefox */
        -webkit-transform : scale(3);   /* Chrome - Safari */
        -o-transform : scale(3);        /* Opera */
    }
.zoom2{
        /* Aumentamos la anchura y altura durante 2 segundos */
        transition: width 3s, height 3s, transform 3s;
        -moz-transition: width 3s, height 3s, -moz-transform 3s;
        -webkit-transition: width 3s, height 3s, -webkit-transform 3s;
        -o-transition: width 3s, height 3s,-o-transform 3s;
    }    
    
    
.zoom2:active{
        /* tranformamos el elemento al pasar el mouse por encima al doble de
           su tamaño con scale(2). */
        transition: 0.1s;
        transform : scale(3);
        -moz-transform : scale(3);      /* Firefox */
        -webkit-transform : scale(3);   /* Chrome - Safari */
        -o-transform : scale(3);        /* Opera */
        animation-duration: 10s;
        
    }

@media only screen and (min-width: 320px) and (max-width: 700px)
{
    body {  zoom: 65%;} 
    table .prim_fil_vid {color:yellow; zoom: 40%;}
    table .primera_fila {color:yellow; zoom: 50%;}
    table .primera_filaizq {color:yellow; zoom: 50%;}
    
    table .datos {color:yellow; zoom: 50%;}
    table .datosjustify {color:yellow; zoom: 50%;}
    table .datosizq {color:yellow; zoom: 50%;}
    #mensajeZOOMboton { zoom: 50% !important;}
    #video_mostrar { zoom: 50% !important;}
    #mensajesZOOM { zoom: 65% !important;}
}


@media only screen and (min-width: 701px) and (max-width: 980px)

{
    body {  zoom: 75%;} 
    table .prim_fil_vid {color:whitesmoke; zoom: 50%;}
    table .primera_fila {color:whitesmoke; zoom: 60%;}
    table .primera_filaizq {color:whitesmoke; zoom: 60%;}
    
    table .datos {color:whitesmoke; zoom: 60%;}
    table .datosjustify {color:whitesmoke; zoom: 60%;}
    table .datosizq {color:whitesmoke; zoom: 60%;}
    #video_mostrar { zoom: 65% !important;}
    #mensajesZOOM { zoom: 70% !important;}
}

@media only screen and (min-width: 981px) and (max-width: 1020px)

{
    body {  zoom: 100%;} 
    table .prim_fil_vid {color:whitesmoke; zoom: 70%;}
    table .primera_fila {color:whitesmoke; zoom: 80%;}
    table .primera_filaizq {color:whitesmoke; zoom: 80%;}
    
    table .datos {color:whitesmoke; zoom: 80%;}
    table .datosjustify {color:whitesmoke; zoom: 80%;}
    table .datosizq {color:whitesmoke; zoom: 80%;}
    #video_mostrar { zoom: 90% !important;}
    #mensajesZOOM { zoom: 90% !important;}
}