/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/* Variables 

$main_color = #881319;

*/
.color-main{
    color:#881319;
}
.color-red{
    color:#dc0000;
}
.color-green{
    color:#019720;
}
.font-big{
    font-size:40px;
    font-weight:700;
}
body{
    font-family: "Roboto";
    font-size: 14px;
    color:#2a2a2a;
}
#page-title h1{
    font-weight:700;
    font-size:30px;
    text-transform:uppercase;
}
#page-title .subtitle{
    font-size:16px;
    text-transform:none;
    font-weight:100;
    font-size:26px;
    margin:0;
    font-family:'Roboto Condensed';
    color:#9d9d9d;
}
#frontpage #page-title .subtitle{
    
}
h2{
    font-weight:700;
    font-size:30px;
    text-transform:uppercase;
    margin-bottom: 0;
}
h3{
    font-weight:700;
    font-size:26px;
    color:#881319;
    text-transform:uppercase;
    font-family:Roboto Condensed;
}
h4{
    font-weight:700;
    font-size:24px;
    color:#881319;
}
h4.footer {
    color: #881319;
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
}
h4.light{ text-transform: uppercase; font-weight: 500;}

#cuenta-con h3{font-weight: 500; font-size: 18px; margin: 5px 0 15px 0;}

a:hover{
    color:#dc0000;
    text-decoration:none;
}
#header{
    max-height:225px;
    background:url(../img/header-background.png) 0 0 repeat-x;
}
#header #logo{
    margin:55px 0 10px;
}
#header > .container > .col-md-10{
    background:url(../img/animalitos.png) 100% 100% no-repeat;
}
#header > .container > .col-md-2{
    z-index:1000;
}

@media (min-width: 767px) {
    #banner-colabora{
        
    }
}

#banner-colabora a{
    display:block;
}
#nav-wrapper{
    background:#f5f5f5;
    border-bottom:2px solid #aaa;
    height:42px;
    max-height:42px;
}
nav#main-menu{
}
nav#main-menu a{
    font-size:17px;
    color:#686868;
    display:block;
    padding:11px 10px;
    text-transform:uppercase;
}
@media (min-width: 767px) {
    nav#main-menu li{
        padding: 0 12px;
    }
    nav#main-menu a{
        padding: 11px 0;
        
    }
}
nav#main-menu a.active{
    border-bottom:8px solid #a91618;
    padding: 12px 10px 0;
    font-weight:700;
}
#language-selector{
    margin-top: 7px;
}
#language-selector ul{
    padding:0;
    width:57px;
    margin:0;
}
#language-selector ul li{
    list-style:none;
    display:inline;
}
.social-share{
    font-size:14px;
    font-weight:300;
}
#frontpage .social-share{
    font-size:20px;
    font-weight:700;
}
#header .social-follow{
    color:#fff;
    margin-right: 20px;
    font-family:Roboto;
    font-size:14px;
    min-width: 135px; /*Carlos*/
}
@media (max-width: 991px) {
    #header .social-follow {
        color:#fff;
    }
}
#main{
    margin-bottom:50px;
}
#social-follow{
    font-size:20px;
    font-weight:700;
}
footer#pre-footer{
    background:#000;
    color:#fff;
    min-height:50px;
    line-height:50px;
}
footer#pre-footer p{
    margin:0;
}
footer#footer{
    background:#881319;
    color:#fff;
    /*padding-bottom:40px;*/
}
footer#footer h4{
    color:#fff;
    text-transform:uppercase;
     margin-bottom: 30px;
}
footer#footer ul{
    list-style:none;
    padding:0;
}
footer#footer h4{font-weight: 500;}
footer#footer a{
    color:#fff;
    font-family:Roboto Condensed;
    /*font-weight:700;*/
    font-size:20px;
}
footer#footer a:hover{
    color:#fff;
    text-decoration:none;
}

#copyright,#copyright a{
    text-align: right;
    font-size: 14px !important;
    font-weight: 100;
    letter-spacing: 1px;}

/*
* COUNTER
*/
#counter{
    background:#f4f4f4;
    margin:30px 0;
    padding:20px 0;
}
#counter > div.container{
    padding:0;
}
#counter > div.container > div{
    display:table-cell; 
    vertical-align:middle;
    padding:0;
}
#counter > div.container > div > img{
    float: left;
    margin-right: 10px;
    vertical-align: middle;
}
#counter > div.container > div span{
    vertical-align:middle
}
#counter > div.container div span.number{
    margin-right:5px;   
}
#counter.counter-mini{
    background:none;
    margin:20px 0;
}
#counter.counter-mini > div > img{
    float: left;
    margin:15px 10px 15px 0;
}
#counter.counter-mini p{
    float: left;
    margin: 0;
}
/******
* SOS *
******/
.sos{
    background:#ea000d;
    color:#fff;
    border-radius:5px;
    padding:20px;
    margin:20px 0;
}
.normal{
    border-radius:5px;
    padding:20px;
    margin:20px 0;
    border:1px solid #e4e4e4;
}
.sos h3{
    text-transform:none;
    color:#fff;
    font-size:22px;
    margin:0;
}
.normal h3{
    text-transform:none;
    font-size:22px;
    margin:0 0 20px 0;
}
.button-box{
    margin-bottom:15px;
}
.sos .button-box button{
    width: 90%;
}
#historia {
    padding-bottom:10px;
    border-bottom:1px solid #000;
}
#historia h3{
    text-transform:none;
    margin-top:20px;
}
.social-share{
    margin:20px 0;
}
/*
* NEWS PREVIEW
*/
.node-news-preview{
    border:1px solid #e2e2e2;
    border-radius: 5px;
    padding:10px 0;
    margin-right: 30px;
    margin-bottom:25px;
}
.node-news-preview .field-image{
    margin:10px 0;
}
.node-news-preview.highlight .field-image{
    margin:0;
}
.node-news-preview .field-title{
    padding:0;
}
.node-news-preview.highlight .field-title{
    padding:0 15px;
}
.node-news-preview .field-title h4{
    font-size:18px;
    color:#000;
    margin:6px 0;
}
.node-news-preview.highlight .field-title h4{
    font-size:24px;
    margin:0;
}
.node-news-preview .field-date{
    font-size:12px;
    padding:0;
}
.node-news-preview.highlight .field-date{
    font-size:18px;
    padding:0 15px;
}
.node-news-preview .field-body {
    font-family:Roboto;
}
.node-news-preview .field-body img{
    display:none;
}
/**************
* SIDE BLOCKS *
**************/

.embed-responsive + p{
    margin:20px 0 10px;
    font-family:Roboto;
}
.home-block{
    border-bottom:1px solid #aaa;
    margin: 20px 0;
    padding-bottom: 10px;
}

.home-block iframe{max-width: 100%;}
.home-block .btn{font-weight: 500; font-size: 18px;}
a.btn.btn-primary.donaciones-teaming, a.btn.btn-primary.donaciones-paypal { font-size: 16px; padding: 5px 7px;}
.donaciones-teaming{background: #00a200 !important;}
.donaciones-paypal{background: #009ee1 !important;}
.home-block .logos{display: inline-block; margin-bottom: 10px;}

.colaboradores-alba img{margin: 0 auto;}
.colaboradores-alba:after {
    content: " ";
    border-bottom: 1px solid silver;
    width: 30%;
    display: block;
    margin: 30px auto;
}

.preview-destacadas{margin-bottom: 15px;}

.donacion{    display: block;
    text-align: center;
    box-shadow: 0px 4px 8px 2px #bfbfbf;
    border: 1px solid #bfbfbf;
    padding: 20px;
    width: 100%;}
.donacion h4{font-weight: 500;}
.donacion.teaming h4{color: #00a200 !important;}
.donacion.paypal h4{color: #009ee1 !important;}
/*********
* SLIDES *
*********/
.slides-carousel{
    position:relative;
    margin-bottom:30px;
}
/* FRONTPAGE */
#frontpage #slides-wrapper{
    background:#881319;
    border-bottom:2px solid #aaa;
    margin-bottom: 50px;
}
#frontpage #slides-wrapper .special-container{
    width:1350px;
}
#slides {
    display:none;
}

#frontpage #slides {
    display:none;
    position:relative;
    padding:0 90px;
    overflow:normal;
}
.slidesjs-next {
    position:absolute;
    right:30px;
    top:210px;
    z-index:1000;
}
.slidesjs-previous {
    position:absolute;
    top:210px;
    display:block;
    left:30px;
    z-index:1000;
}
#frontpage #slides .slidesjs-next {
    position:absolute;
    right:0;
    top:40%;
}
#frontpage #slides .slidesjs-previous {
    position:absolute;
    top:40%;
    display:block;
    left:0;
}
.slidesjs-pagination{
    margin-top:20px;
}
#frontpage .slidesjs-pagination {
    float: right;
    list-style: outside none none;
    margin: 6px 0 0;
    position:absolute;
    left: 43%;
}
#frontpage .slidesjs-pagination li {
    float: left;
    margin: 0 1px;
}
#frontpage .slidesjs-pagination li a {
    background-image: url("../img/pagination.png");
    background-position: 0 0;
    display: block;
    float: left;
    height: 0;
    overflow: hidden;
    padding-top: 16px;
    width: 18px;
}
.slidesjs-pagination {
    height: 75px;
    overflow: hidden;
    padding: 0;
    overflow: hidden;
}
.slidesjs-pagination li{
    float:left;
    list-style:none;
    margin-right:10px;
}
.slidesjs-pagination li:nth-child(5){
    margin-right:0;
}
.slidesjs-pagination li a img{
    max-width:100px;
}
.thumb-scroll{
    position:absolute;
    right: 20px;
}
.thumb-scroll i{
    color:#888;
}
.thumb-scroll-up{
    top: 440px;
}
.thumb-scroll-down{
    top: 500px;
}
#frontpage .slidesjs-pagination li a.active, .slidesjs-pagination li a.active:hover {
    background-position: 0 -18px;
}
#frontpage .slidesjs-pagination li a:hover {
    background-position: 0 -18px;
}
.slide-text-wrapper{
    padding:0 20px;
}
.slide-text{
    background:#fff;
    box-shadow: 0px 0px 8px 4px rgba(0,0,0,0.75);
    min-height:420px;
    padding:20px;
}
.slide-text h2{
    font-size:38px; 
}
.slide-text p{
    font-size:16px;
}
.slide-text button{
    margin-top:50px;
    padding:10px 70px;
}
.slidesjs-control{
    background:#000;
}

/********
* Forms *
********/
input[type="text"], input[type="email"], input[type="tel"], input[type="number"]{
    background:#f4f4f4;
    border:1px solid #aaa;
    border-radius:3px;
    padding:5px;
    width:100%;
}

/**********
* Youtube *
**********/
.youtube-container { 
    display: block; 
    margin: 0;
    width: 100%; 
}
.youtube-player { 
    display: block; 
    width: 100%; /* assuming that the video has a 16:9 ratio */ 
    padding-bottom: 67.25%; 
    overflow: hidden; 
    position: relative; 
    width: 100%; 
    height: 100%; 
    cursor: hand; 
    cursor: pointer; 
    display: block; 
}
img.youtube-thumb { 
    bottom: 0; 
    display: block; 
    left: 0; 
    margin: auto; 
    max-width: 100%; 
    width: 100%; 
    position: absolute; 
    right: 0; 
    top: 0; 
    height: auto 
}

div.play-button {
    height: 72px; 
    width: 72px; 
    left: 50%; 
    top: 50%; 
    margin-left: -36px; 
    margin-top: -36px; 
    position: absolute; 
    background: url("../img/play-button.png") no-repeat; 
}

#youtube-iframe { 
    width: 100%; 
    height: 100%; 
    position: absolute; 
    top: 0; 
    left: 0; 
}

/***********
* BUSCADOR *
***********/
#buscador{
    margin-top:30px;
}

/******************
* MASCOTA PREVIEW *
******************/
.nodo-mascota-preview{
    margin-bottom:40px;
    min-width:264px;
}

.nodo-mascota-preview .field-image{
    border-radius:5px;
    overflow:hidden;
    margin-bottom:5px;
    position:relative;
    background: #F5F5F5;
}
.nodo-mascota-preview .field-image img{
    height: 256px;
    min-width: 262px;
}
.nodo-mascota-preview.danger .field-image img{
    background: #e9000c none repeat scroll 0 0;
    padding: 5px;
    width: 100%;
}
.nodo-mascota-preview.danger .field-image .img-wrapper::after{
    content:url('../img/sos.png');
    position:absolute;
    top:5px;
    right:5px;
}
.img-wrapper{
    width:263px;
    position: relative;
    height:255px;
    margin: 0 auto;
    overflow:hidden;
}
.nodo-mascota-preview.reservado .field-image img{
    background:#5f5f5f;
    padding:5px;
}
.nodo-mascota-preview.reservado .field-image::after{
    content:url('../img/reservado.png');
    position:absolute;
    top:5px;
    right:5px;
}
.nodo-mascota-preview .field-nombre{
    font-size:22px;
    text-transform:uppercase;
}
.nodo-mascota-preview .field-sexo{
    font-size:18px;
}
@media (max-width:1199px) and (min-width:992px) {
    .nodo-mascota-preview {
        margin-bottom: 40px;
        min-width: 227px;
    }
    .img-wrapper {
        height: 235px;
        overflow: hidden;
        position: relative;
        width: 230px;
    }
    .nodo-mascota-preview .field-image img {
        height: 235px;
        min-width: 227px;
        max-width: 227px;
    }
}​
.cloak{
    display:none;
}
.texto-ocultado{
    display:none;
}
.textB, .textA{
    display:none;
}
.show-more .textA{
    display:block;
}
.show-less .textB{
    display:block;
}
#show-more-button{
    margin:20px 0 0;
}
#actualizaciones .panel-heading{
    position:relative;
    cursor:pointer;
}
#actualizaciones .panel-title span.date-update{
    color: #9c9c9c;
    float: left;
    font-style: italic;
    font-weight: 100;
    margin-right: 20px;
}
#actualizaciones .panel-title a{
    font-weight:normal;
    text-decoration:none;
    display:block;
}
#actualizaciones .panel-title span.glyphicon {
    position: absolute;
    right: 10px;
    top: 10px;
}
#main{
    margin-top:20px;
}
#busca-animales #main{
    margin-top:0;
}
#datos-ficha{
    margin-top:20px;
    
}
#datos-ficha p{
    font-size:18px;
    font-family:Roboto Condensed;
}
#contact-form .btn-black{
    font-size: 17px;
    margin-top: 18px;
    padding: 6px 16px;
    width: 150px;
}
sub{
    color:#939393;
}
.colabora .heart-big{
    margin-left:20px;
}
.top-offset{
    margin-top:-60px;
}
.image-bg-fluid-colabora{
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgba(0, 0, 0, 0);
    background-image: url("../img/header-colabora.jpg");
    background-origin: padding-box;
    background-repeat: no-repeat;
    background-size:cover;
    height:280px;
}
.control-label{
    font-weight:300;
    font-size: 16px;
}
h2.form-title{
     background: #ac140f none repeat scroll 0 0;
    color: #fff;
    font-family: "Roboto";
    font-size: 26px;
    font-weight: 300;
    margin-bottom: 30px;
    margin-top: 0;
    padding: 20px;
    text-transform: none;
}
.banner-home{
    margin-top:30px;
}
#pre-footer{
    margin-top:30px;
}
#slides-images{
    display:none;
}
#slides-images .slidesjs-slide{
    text-align: center;
}
#slides-images .slidesjs-container{
    background:#000;
}
#slides-images .slidesjs-slide img {
    background:#000;
}
#image-galery img.fix-by-width {
    max-width:635px;
    height:auto !important;
}
#image-galery img {
    text-align:center;
}
#image-galery img.fix-by-height {
    max-height:425px;
    width:auto !important;
}


/** Galería de fotos */
#galeria-fotos {
 
}
#galeria-fotos .field-title {
    line-height:16px;
    height:16px;
}
#galeria-fotos .foto{
    text-align: center;
    margin-bottom:20px;
    min-height: 263px;
}
#galeria-fotos img {
    
}
#galeria-fotos img.fix-by-width {
    max-width:263px;
    height:auto !important;
}
#galeria-fotos img.fix-by-height {
    max-height:263px;
    width:auto !important;
}


#slides-images .slidesjs-pagination .slidesjs-pagination-item{
    width:100px;
    height:75px;
    overflow:hidden;
    margin-bottom:5px;
}
#slides-images.slides-sos .slidesjs-container{
    border:5px solid #EA000D;
}
#slides-images.slides-reservado .slidesjs-container{
    border:5px solid #5F5F5F;
}
#slides-images.slides-sos .slidesjs-container::after{
    content:url('../img/sos.png');
    position:absolute;
    top:0;
    right:0;
    z-index: 1000;
}
#slides-images.slides-reservado .slidesjs-container::after{
    content:url('../img/reservado.png');
    position:absolute;
    top:0;
    right:0;
    z-index: 1000;
}
.slidesjs-pagination img{
    width:auto;
    background:#000;
}
#main-menu li a:focus{
    background:none;
}
#main-menu li.activo a:focus{
    background:none;
}
#main-menu li.activo a {
    border-bottom: 6px solid #881319;
    padding-bottom: 3px;
}
.breadcrumb {
    margin-bottom: 0;
}
.breadcrumb > li + li::before {
    content: "> ";
}
.breadcrumb > .active {
    color:#eb010e;
}
.breadcrumb > li a, .breadcrumb > li a:focus, .breadcrumb > li a:hover{
    color:#828282;
    text-decoration:none;
}
#contact-form h4{
    text-align:center;
}
.btn-noticias{
    white-space:normal;
}
.dog-canvas > div{text-align: center; margin: 0 auto;}
.dog-canvas .peso > span{
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    position: absolute;
    bottom: 20px;
    left: 40%;
}
.dog-canvas .altura > span{
    color: #ab140f;
    font-size: 26px;
    position: absolute;
    bottom: 20px;
    left: 10px;
}

img{max-width: 100%;}

/*RGPD*/
.primer-rgpd{margin:0 15px !important;}
.primer-rgpd h3.ui-state-active {
    background: #881319;
    border-color: #881319;
}
.primer-rgpd h3{
    outline:none;
    text-transform: none;
}
.primer-rgpd div a{border-bottom: 2px dashed #881319;}
.primer-rgpd.ui-accordion .ui-accordion-content{
    height: 100% !important;
}

/*Campos newsletter*/
.form-field.field-checkbox input + label{display: inline;}
.form-field.field-checkbox{margin-bottom: 5px;}
.form-field.field-checkbox + .form-field.field-checkbox{margin-bottom: 15px;}
.form-field.field-checkbox a label{cursor: help !important;}

@media (max-width: 468px) {
    .dog-canvas .peso > span{color: black; position: relative; left: 0; bottom: 0;}
    .btn-primary, .btn-primary:visited{margin: 5px 0;}
    .social-share span:first-child {display: block;margin-bottom: 5px;}
}
    
.social-share{
    
}
.stButton {
    margin-right: 2px !important;
}
#section-banners a:hover{
    text-decoration:none;
}
#section-banners a:hover h3{
    color:#e9000c;
}
.grey-wrapper{
    padding:20px 0;
}
.grey-wrapper{
    background:#F5F5F5;
}
.breadcrumb{
    background:none;
}
.pane-title , .pane-title:hover, .pane-title:active{
    color:#2a2a2a;
}
.pane-title .glyphicon, .pane-title .glyphicon:hover, .pane-title .glyphicon:active{
    color:#2a2a2a;
}
.img-link, .img-ext-link {
    white-space:nowrap;
    color: #fff;
    display: inline;
    margin-left: 10px;
}
.img-link:hover, .img-link:focus, .img-ext-link:hover, .img-ext-link:focus{
    color:#fff;
}
.lb-data .lb-number, .lb-data .lb-caption {
   display: inline;
   white-space:nowrap;
   margin-right:10px;
}

.categoria-multimedia .carousel-wrapper{
    margin-top:30px;
}
.categoria-multimedia .slidesjs-container {
}
.categoria-multimedia .carousel-wrapper {
}
.categoria-multimedia .slidesjs-pagination{
}
#view-filters .bootstrap-switch-wrapper {
    float:none;
}
.pagination-input {
    padding:0;
}
.pagination-input input {
    width:65px;
    text-align:right;
    display:inline;
}
.pagination-input a.get-previous-page {
    margin-right:20px;
}
.pagination-input a.get-input-page {
    margin-left:20px;
}
.pagination-input a.get-next-page {
    margin-left:10px;
}
.form-field.has-error label{
    color:#ff0000 !important;
}

.alert{
    margin: 15px auto;
    text-align: center;
    max-width: 700px;
}