/* PRINCIPALES */
html, body {
	margin: 0px;
	text-align: center;
	padding: 0px;
	background-color: #FFF;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 14px; color:#000;
	background: url(./images/wallpaper.jpg) no-repeat center center fixed; 
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;

}

i {vertical-align:middle;}

.main-workspace { padding: 20px; }

.div_redondo { margin:0 auto; -moz-border-radius:5px; -webkit-border-radius:5px; -khtml-border-radius:5px; border-radius: 5px; }

.divimg_atras {
	position: relative;
	width: 100%; /* for IE 6 */
}
superpos {
	position: absolute;
	width: 100%;
}


#accordion *{
background-color: transparent !important; border:none !important;
}
#accordion h3{
font-size: 20px !important; font-family: "Roboto Condensed";color:#FFF !important; 
}

.slider{
	background: url(./images/css_trans_2.png); background-repeat:repeat;
    color: white; z-index: 5000; width: 350px;
}
.slider-tit-big{
    font-family: "Oswald";font-size:30px; font-weight:900; color: white; 
}
.slider-tit-light{
    font-family: "Oswald";font-size:30px; font-weight:300; color: white; 
}
.slider-menu{ border-bottom:#CCC 1px dotted;}

.slider-link{
    font-family: "Oswald";font-size:20px; font-weight:300; color: white; 
}
.slider-link:hover{
    color: #CCC; padding-left: 10px;
}



/* FONDOS */
.fondo_encabezado {	background-color:#333; }
.fondo_pie {	background-color:#333; }



/* ENLACES */
a {cursor:pointer !important; text-decoration: none !important;}
.links-black {font-size: 14px; color: #333; font-family: "Oswald";}
.links-black:hover {font-size: 14px; color: #000; font-family: "Oswald";}
.links-black:active {font-size: 14px; color: #000; font-family: "Oswald";}
.links-green {font-size: 14px; color: #9EC545; font-family: "Oswald";}
.links-green:hover {font-size: 14px; color: #9EC545; font-family: "Oswald";}
.links-green:active {font-size: 14px; color: #9EC545; font-family: "Oswald";}
.links-td {font-size: 14px; color: #FFF; font-family: "Oswald";}
.links-td:hover {font-size: 14px; color: #000; font-family: "Oswald";}
.links-td-menu {font-size: 14px; color: #999; font-family: "Oswald";}
.links-td-menu:hover {font-size: 14px; color: #000; font-family: "Oswald";}
.links-menu-bar {font-size: 20px; color: #FFF; font-family: "Oswald";}
.links-menu-bar:hover {font-size: 20px; color: #CCC; font-family: "Oswald";}


/* BOTONES ENLACES */
.bt-status-ok {
	font-size: 14px; color: #FFF; font-family: "Oswald"; line-height:15px;
	padding: 10px;
	background-color: #9EC545;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	-khtml-border-radius:10px;
	border-radius: 10px;
}

/* ENCABEZADOS */
.recuadro_encabezado {
	font-size: 16px; font-style: normal; color: #fff; font-family: "Oswald"; padding: 10px;
	background-color:#9EC545;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-khtml-border-radius:5px;
	border-radius: 5px;
}
.recuadro_encabezado_critico {
	font-size: 16px; font-style: normal; color: #fff; font-family: "Oswald"; padding: 10px;
	background-color:#900;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-khtml-border-radius:5px;
	border-radius: 5px;
}

/* TABLAS */
.table-border { border: 1px solid #ccc; background-color:#FFF; border-radius: 10px;}
.table-td-border {  border: 1px solid #ccc !important; border-radius: 10px; }
.table-td-hover:hover { background-color:#EAEAEA; }
.table-header-gris {  border-top: 1px solid #ccc !important; border-bottom: 1px solid #ccc !important; background-color:#EAEAEA; font-size: 16px; font-style: normal; color: #000; font-family: "Oswald"; padding-left: 10px;}

.cards-td {
	border: 1px solid #CCC !important;
	margin:5px; 
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-khtml-border-radius:5px;
	border-radius: 5px; background-color: #FFF;

}
.cards-td-personal:hover { border: 1px solid #000; background-color:#EAEAEA;}
.cards-td-nombres {font-size: 16px; color: #000; font-family: "Oswald";}
.cards-td-valor {font-size: 16px; color: #000; font-family: "Oswald";}
.cards-td-icons {font-size: 14px; color: #333; border-bottom: 1px dotted #999 !important;}
.cards-td-items {font-size: 12px; color: #333; border-bottom: 1px dotted #999 !important;}

.data-table-th {font-size: 14px !important; color: #000; font-family: "Oswald"; font-weight:normal !important;}
.data-table-th i{font-size: 20px !important; color: #000; font-weight:normal !important;}
.data-table-tit {font-size: 12px !important; font-family: "Oswald"; color: #000; font-weight:normal !important;}
.data-table-textos {font-size: 12px !important; color: #000; font-weight:normal !important;}
.data-table-textos-min {font-size: 10px !important; color: #000; font-weight:normal !important;}

/* PRODUCTOS */
.productos-nombre {font-size: 28px; color: #333; font-family: "Oswald"; }
.productos-subtitulos {font-size: 22px; color: #333;font-family: "Oswald";}
.productos-subtitulos-med {font-size: 18px; color: #333;font-family: "Oswald";}
.productos-subtitulos-min {font-size: 14px; color: #333;font-family: "Oswald";}
.productos-textos {font-size: 16px; color: #000; font-weight: normal;}
.productos-textos-min {font-size: 11px; color: #000; font-weight: normal;}
.productos-slogan {font-size: 22px; color: #333;font-family: "Raleway"; }
.productos-slogan-med {font-size: 18px; color: #333;font-family: "Raleway"; }
.productos-slogan-min {font-size: 12px; color: #333;font-family: "Raleway"; }
.productos-precio {font-size: 44px; color: #000;font-family: "Abel";}
.productos-precio-med {font-size: 20px; color: #000;font-family: "Abel";}
.productos-precio-min {font-size: 14px; color: #000;font-family: "Abel";}
.productos-calif {font-size: 64px; color: #000;font-family: "Abel";}
.productos-calif-med {font-size: 32px; color: #000;font-family: "Abel";}
.productos-calif-min {font-size: 20px; color: #000;font-family: "Abel";}


/* IMAGENES */
img { vertical-align: middle; }
.img-full { width: 100%; height:auto; }
.img-circle { border-radius:50%; overflow:hidden; }
.img-grayscale { filter: grayscale(1); opacity: 0.5; }
.img-div-resize {  margin:0px auto; text-align:center; overflow: hidden; width: 100%;}
.img-div-resize img { max-width:100%; vertical-align:middle;}

/* TEXTOS */
.main-titulos {font-size: 38px; color: #333; font-family: "Oswald"; }
.main-subtitulos {font-size: 28px; color: #333;font-family: "Oswald";}
.main-subtitulos-med {font-size: 22px; color: #333;font-family: "Oswald";}
.main-subtitulos-min {font-size: 16px; color: #333;font-family: "Oswald";}
.main-subtitulos-shadow {font-size: 24px; color: #FFF;font-family: "Oswald"; text-shadow: 2px 2px #000;}

.main-textos {font-size: 14px; color: #000; font-weight: normal;}
.main-textos-min {font-size: 11px; color: #000; font-weight: normal;}
.main-textos-help {font-size: 12px; color: #000; font-weight: normal;}
.main-slogan {font-size: 28px; color: #333;font-family: "Raleway"; }
.main-slogan-med {font-size: 22px; color: #333;font-family: "Raleway"; }
.main-slogan-min {font-size: 16px; color: #333;font-family: "Raleway"; }

.main-results-b {font-size: 16px; color: #FFF;font-family: "Raleway"; }
.main-results-b-min {font-size: 12px; color: #FFF;font-family: "Raleway"; }

.main-result-ok {font-size: 10px; color: #060;}
.main-result-error {font-size: 10px; color: #F00; }

.main-valor-big {font-size: 28px; color:#093;font-family: "Oswald";}
.main-valor-med {font-size: 22px; color:#093;font-family: "Oswald";}
.main-valor-min {font-size: 16px; color:#093;font-family: "Oswald";}

.main-textos-3cols {
	-webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;
}


/* TEXTURAS FONDOS */
.textura_trans {background: url(./images/css_trans.png); background-repeat:repeat;}
.textura_maintrans0 {background: url(./images/css_trans_0.png); background-repeat:repeat;}
.textura_maintrans1 {background: url(./images/css_trans_1.png); background-repeat:repeat;}
.textura_maintrans2 {background: url(./images/css_trans_2.png); background-repeat:repeat;}
.textura_maintrans3 {background: url(./images/css_trans_3.png); background-repeat:repeat;}


.tienda-cards-td {
	margin:0 auto; 
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-khtml-border-radius:5px;
	border-radius: 5px; background-color: #FFF;
	border: 1px solid #CCC;

}
.tienda-cards-td:hover { border: 1px solid #CCC; background-color: #EAEAEA;}
.tienda-cards-nombres {font-size: 12px; color: #000; font-family: "Raleway";}
.tienda-cards-valor {font-size: 16px; color: #000; font-family: "Oswald";}
.tienda-cards-precio {font-size: 16px; color: #000; font-family: "Oswald";}
.tienda-cards-precio-dash {font-size: 16px; color: #000; font-family: "Oswald"; border-bottom: 1px dotted #CCCCCC;}
.tienda-cards-icons {font-size: 16px; color: #000; border-bottom: 1px dotted #CCCCCC;}
.tienda-cards-items {font-size: 11px; color: #666; border-bottom: 1px dotted #CCCCCC;}
.tienda-cards-links {font-size: 14px; color: #000; font-family: "Oswald";}
.tienda-cards-links:hover {font-size: 14px; color: #F90; font-family: "Oswald";}

.tienda-div {
	border: 2px #CCC solid;
	background-color:#FFF;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-khtml-border-radius:5px;
	border-radius: 5px;
}
.tienda-status {
	font-size: 15px; color: #000; font-family: "Oswald";
	background-color:#EAEAEA;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-khtml-border-radius:5px;
	border-radius: 5px;
	padding: 10px;
}


.tienda-titulos {font-size: 14px; color: #000; font-family: "Oswald";}
.tienda-topic {font-size: 18px; color: #000; font-family: "Oswald";}
.tienda-textos {font-size: 16px; color: #000; font-family: "Oswald";}
.tienda-textos-min {font-size: 11px; color: #000; }
.tienda-links {font-size: 14px; color: #CCC; font-family: "Oswald";}


/* FORMULARIOS */

.custom-form input, select, textarea { 
	outline:none !important;
	border:1px solid #CCC;
    background-color: transparent !important;
    padding:10px;
    color: #000;
    font-size:14px !important;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-khtml-border-radius:5px;
	border-radius: 5px;
	resize: none; width:90% !important;
}

.custom-form select{ 
    font-size:12px !important;
}

.custom-form input:focus { color:#000; }
.custom-form button {
    outline:0;
	color:#fff;
    border:0px solid #666;
    background-color: #9EC545;
    padding:8px; font-family: "Oswald"; font-size: 14px; cursor: pointer;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-khtml-border-radius:5px;
	border-radius: 5px;

}
.custom-form button:hover { color:#000;}
::placeholder { color: #CCC; opacity: 1; }
:-ms-input-placeholder { color: #CCC; }
::-ms-input-placeholder { color: #CCC; }
.custom-form-item {font-size: 14px; color: #333;font-family: "Raleway";}


/* The Overlay PARA COLOCAR NOTIFICACION DE OPERACIONES(background) */
.overlay-notif {
    /* Height & width depends on how you want to reveal the overlay (see JS below) */    
    height: 100%;
    width: 100%;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    background-color: rgb(0,0,0); /* Black fallback color */
    background-color: rgba(0,0,0, 0.8); /* Black w/opacity */
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}

/* Position the content inside the overlay */
.overlay-notif-content {
    position: relative;
    top: 45%; /* 25% from the top */
    width: 100%; /* 100% width */
    text-align: center; /* Centered text/links */
    margin-top: 30px; /* 30px top margin to avoid conflict with the close button on smaller screens */
	font-size: 16px; color: #FFF;font-family: "Raleway";
}

/* The navigation links inside the overlay */
.overlay-notif a {
    padding: 8px;
    text-decoration: none;
    font-size: 36px;
    color: #818181;
    display: block; /* Display block instead of inline */
    transition: 0.3s; /* Transition effects on hover (color) */
}

/* When you mouse over the navigation links, change their color */
.overlay-notif a:hover, .overlay-notif a:focus {
    color: #f1f1f1;
}

/* Position the close button (top right corner) */
.overlay-notif .closebtn {
    position: absolute;
    top: 20px;
    right: 45px;
    font-size: 60px;
}

/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
@media screen and (max-height: 450px) {
    .overlay-notif a {font-size: 20px}
    .overlay-notif .closebtn {
        font-size: 40px;
        top: 15px;
        right: 35px;
    }
}

/*ANIMACIONES*/
.anim-popout {
    animation: popout 1s ease;
    -webkit-animation: popout 1s ease;
}
@keyframes popout {
    from{transform:scale(0)}
    to{transform:scale(1)}
}
@-webkit-keyframes popout {
    from{-webkit-transform:scale(0)}
    to{-webkit-transform:scale(1)}
}

.anim-pulse-button {

  position: relative;
  border: none;
  box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
  border-radius: 50%;
  cursor: pointer;
  -webkit-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -moz-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -ms-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
}
.anim-pulse-button:hover 
{
  -webkit-animation: none;-moz-animation: none;-ms-animation: none;animation: none;
}

@-webkit-keyframes pulse {to {box-shadow: 0 0 0 15px rgba(255, 255, 255, 0);}}
@-moz-keyframes pulse {to {box-shadow: 0 0 0 15px rgba(255, 255, 255, 0);}}
@-ms-keyframes pulse {to {box-shadow: 0 0 0 15px rgba(255, 255, 255, 0);}}
@keyframes pulse {to {box-shadow: 0 0 0 15px rgba(255, 255, 255, 0);}}

.anim-fadein {
   -webkit-animation-name: fadeIn;
   animation-name: fadeIn;
   -webkit-animation-duration: 5s;
   animation-duration: 5s;

}
@keyframes fadeIn {
   0% {opacity: 0;}
   100% {opacity: 1;}
}