/*import fonts*/

@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&display=swap');

@font-face {
    font-family: "Freight-Text-Book";
    src: url("../fonts/Freight-Text-Book.woff") format("woff"); /* Modern Browsers */
}


/*Container*/

@media (min-width: 1200px){
    .container {
        max-width: 1250px;
    }
}
/*H1, H2, H3, H4, H5, H6, OTHER*/

h1{
    font-family: 'Roboto', sans-serif;
    font-weight: 900;
    font-size: 36px;
    color: #fff;
    text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.16) 
}

h2{
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 32px;
}

h4{
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: #2699FB;
}
h5{
    font-family: 'Roboto', sans-serif;
    font-weight: 500;

}
h6{
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 16px;
}



p{
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 14px;
}

.h4-subtitle{
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 14px;
    margin-top: -10px;
    margin-bottom: 20px;
}

.card-title{
    font-family: 'Roboto', sans-serif !important;
    font-weight: 700;
}


.card-text{
    font-family: 'Roboto', sans-serif !important;
    font-weight: 400;
}
/*RESPONSIVE H1, H2, H3, H4, H5, H6*/

@media (min-width: 0) and (max-width: 750px){
    h1 {
        font-size: 26px;
    }

}

/*text color*/

.text-info{
    color: #00D2CF !important;
}

.text-danger{
    color: #F93228 !important;
}

.text-success{
    color: #B6BB00 !important;
}

.text-warning{
    color: #FF8000 !important;  
}


/* Buttons */

.btn{
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 14px;
    padding: .375rem 2rem;
    border-radius: 1rem;
}

.btn-danger{
    background-color: #F93228;
    border-color: #F93228;
}

.btn-success{
    background-color: #B6BB00;
    border-color: #B6BB00;
}

.btn-info{
    background-color: #00D2CF;
    border-color: #00D2CF;
}


/* CSS menu*/

.nav-link, .dropdown-item{
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    font-size: 14px;
}


li.active, a.active{
    color: #2699FB !important;
    text-decoration: underline;
}

.language {
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    font-size: 11px;
}

.language .activate{
    color: #2699FB ;
}

.item-language{
    color: #707070 ;
}

/* Slider Principal*/

 .big-explainer{
     width: 100%;
     height: 270px;
     background-repeat: no-repeat;
     background-size: contain, cover;
     background-position:right, center;
}
    
.detail-title{
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #fff;
    text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.16)   
}

/* Responsive Slider Principal*/

@media (min-width: 0) and (max-width: 880px){
    .big-explainer {
        background-size: cover, cover;
        background-position: 50px, center;
    }
}

    
/* Index.html*/
    
.background-index{
    background-image: url(../img/detail-01.png),  url(../img/background-01.png);
}

.grid-container{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-gap: 10px;
    grid-template-rows: auto auto;
    margin-top: 10px;
}

.grid-container-news{  
    margin-top: 10px;
}


.road-safety, .urban-transport, .regional-integration{
    padding: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    grid-row:1/3 ;
    background-color: #FAFAFA;
}

.news-title-container{
    grid-column: 4 / 7;
}

.background-linkedin{
    grid-column: 4 / 7;
}

.road-safety{
    border-bottom: 5px solid #FF2E23;
}
.urban-transport{
    border-bottom: 5px solid #B6BB00;
}
.regional-integration{
    border-bottom: 5px solid #00D2CF;
}

.grid-container .btn,
.grid-container-news .btn {
    width: 104px !important;
    font-size: 11px;
    padding: 0px !important;
    margin-top: 5px;
}

.paragraph-index{
    font-family: Freight-Text-Book;
    font-size: 12px;
}

.news-title-container{
    display: flex;
    background-color: #FAFAFA;
    height: 115px;
}

.index-title{
    color: #2699FB;
}
.index-subtitle{
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 10px;
}
.news-title-slide a{
    font-family: "Freight-Text-Book";
    font-size: 10px;
    text-decoration: underline;
}

.news-title-slide .paragraph-index{
    margin-bottom: -10px;
    margin-top: -5px;
}

.news-title-slide>div{
    padding: 10px;
}

.news-title-img {
    float: left;
    margin-right: 10px;
}

.point li{
    width: 8px;
    height: 8px;
    border-radius: 50px;
    border: 1px solid #2699FB;
    margin-top: 4px;
    margin-bottom: 4px;
}
.push-spacer {
    flex: 1 1 auto;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
}

.point{
    height: 100%;
    cursor: pointer;
}

.point .active{
    background-color: #2699FB;
}

.background-linkedin {
    background-image: url(../img/linkedin.png), url(../img/fondo-linkedin.jpg);
    width: 100%;
    height: 71px;
    background-repeat: no-repeat, repeat;
    background-size: contain, cover;
    background-position: right, center;
    margin-top: 15px;
}
.latest-linkedin {
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 10px;
    color: #fff;
}
.title-linkedin {
    color: #fff;
    margin-bottom: -8px;
}
.linkedin a {
    font-family: "Freight-Text-Book";
    font-size: 10px;
    text-decoration: underline;
    color: #fff;
}
.linkedin {
    margin-left: 20px;
    margin-top: 8px;
}

.carousel {
    width: 100%;
}
.carousel-inner {
    padding-right: 22px;
}
.carousel-indicators.point {
    left: auto;
    bottom: auto;
    top: 0;
    transform: rotate(90deg);
    margin: 0 31px 0 0;
}

/*RESPONSIVE INDEX*/


@media (min-width: 0) and (max-width: 1200px){

    .road-safety{
        grid-column:  1 / span 2;
        grid-row: 1 / span 1;
    }
    .urban-transport{
        grid-column:  3 / span 2;
        grid-row: 1 / span 1;
    }
    .regional-integration{
        grid-column:  5 / span 2;
        grid-row: 1 / span 1;
    }
    .news-title, .news-title-container, .register-home, .background-linkedin{
        grid-column: 1 / 7;
        rid-row: 1 / span 1;
    }
}

@media (min-width: 0) and (max-width: 600px){

    .road-safety{
        grid-column:  1 / span 6;
    }
    .urban-transport{
        grid-column:  1 / span 6;
        grid-row: 2 / span 1;
    }
    .regional-integration{
        grid-column:  1 / span 6;
        grid-row: 3 / span 1;
    }
}




/*who-we-are.html*/

.background-wo-we-are{
    background-image: url(../img/detail-08.png),  url(../img/background-01.png);
}


.box-download{
    background-color: rgba(38, 153, 251,0.8);
    height: 305px;
    width: 342px;
    margin-top: -140px;
    margin-left: 120px;
    position: relative;
        margin-bottom: 40px;
}
.box-download h2{
    color: #fff;
}
.box-download span{
    font-weight: 700;
}
.box-download>div{
    padding: 25px;
}
.box-download img{
    width: 180px;
    margin-top: 10px;
}

.background-full{
    height: 268px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.bg-wo-we-are{
    background-image: url(../img/stories04.png);
}

.info-background-full{
    margin-top: -50px;
    background-color: #fff;
    box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.16);
}

/*RESPONSIVE who-we-are.html*/

@media (max-width: 1060px) and (min-width: 0){
    .box-download {
        margin-left: 0;
    }
}

@media (max-width: 990px) and (min-width: 0){
    .box-download {
        width: 100%;
    }
}

@media (max-width: 880px) and (min-width: 0){
    .background-wo-we-are {
        background-size: cover, cover;
        background-position: 250px, center !important;
    }
}

@media (max-width: 882px) and (min-width: 0){
    .background-wo-we-are {
        background-size: cover, cover;
        background-position: 320px, center !important;
    }
}



/*regional-integration.html*/


.background-regional-integration{
    background-image: url(../img/detail-02.png), url(../img/background-02.png);
}

.bg-regional-integration{
    background-image: url(../img/stories01.jpg);
}

.info-latest{
    background-color: #fff;
    padding: 30px;
}


.info-bl-regional{
    border-left: 5px solid #00D2CF;
}

.info-bt-regional{
    border-top: 5px solid #00D2CF;
}


.info-latest img{
    height: 40px;
}

.card-h .card-title{
    font-size: 16px;   
}

.card-h .card-text{
    font-size: 12px;   
}

.card-h .btn{
    font-size: 10px;   
}

.card-h{
    padding: 1.50rem;
}

.card-img, .card-img-top{
    border-radius: 0;
}

.card-post-location{
    font-size: 10px;
    padding: 10px;
    background-color: #fff;
    position: absolute;
    top: -20px;
    z-index: 1;
    left: 40px;
    box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.16);
}

@media (max-width: 1200px) and (min-width: 992px){
    .card-h{
        padding: 0.75rem;
    }
}

@media (max-width: 992px) and (min-width: 768px){
    .card-h{
        padding: 1.25rem;
    }
}

@media (max-width: 768px) and (min-width: 0px){
    .card-h{
        padding: 0.75rem;
    }
}


@media (max-width: 882px) and (min-width: 0){
    .background-regional-integration {
        background-size: cover, cover;
        background-position: 350px, center !important;
    }
}


/*road-safety.html*/

.background-road-safet{
    background-image: url(../img/detail-04.png), url(../img/background-04.jpg);
}

.bg-road-safet{
    background-image: url(../img/stories03.jpg);
}

.info-bl-road{
    border-left: 5px solid #F93228 ;
}

.info-bt-road{
    border-top: 5px solid #F93228 ;
}


/*urban-transport-and-mobility.html*/


.background-urban-transport{
    background-image: url(../img/detail-03.png), url(../img/background-03.png);
}


.bg-urban-transport{
    background-image: url(../img/stories02.jpg);
}

.info-bl-urban-transport{
    border-left: 5px solid #B6BB00  ;
}

.info-bt-urban-transport{
    border-top: 5px solid #B6BB00  ;
}


@media (max-width: 882px) and (min-width: 0){
    .background-urban-transport {
        background-size: cover, cover;
        background-position: 350px, center !important;
    }
}


/*donors-and-partners.html*/

.bg-donors-partners{
    background-image: url(../img/we-work-background.jpg);
}

/*member-countries.html*/

.background-member-countries{
    background-image: url(../img/detail-05.png), url(../img/background-01.png);
}

@media (max-width: 882px) and (min-width: 0){
    .background-member-countries{
        background-size: cover, cover;
        background-position: 350px, center !important;
    }
}


/*our-team.html*/

.background-team{
    background-image: url(../img/detail-010.png), url(../img/background-01.png);
}

.team-bb-info{
    border-bottom: 5px solid #00D2CF;
}


.team-bb-danger{
    border-bottom: 5px solid #F93228;
}

.team-bb-success{
    border-bottom: 5px solid #B6BB00;
}

.team-bb-warning{
    border-bottom: 5px solid #FF8000;
}

.team-bb-primary{
    border-bottom: 5px solid #2699FB;
}

@media (max-width: 882px) and (min-width: 0){
    .background-team{
        background-size: contain, cover;
        background-position: 350px, center !important;
    }
}

/*inside-news.html*/

.inside-new{
    width: 100%;
    border-bottom: 8px solid #00D2CF;
}

/*publications.html*/

.background-publication{
    background-image: url(../img/detail-06.png), url(../img/background-01.png);
}

.badge-danger{
    background-color: #F93228;
}

.badge-info{
    background-color: #00D2CF;
}

.badge-success{
    background-color: #B6BB00;
}

.bd-sidebar{
    background-color: #DDEFFF;
    height: 100%;
}

.title-check {
    font-size: 16px;
    color: #232020;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    margin-top: 40px;
    margin-bottom: 20px;
}
.form-check-label {
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 14px;
}

@media (min-width: 0) and (max-width: 991px){
    .bd-sidebar{
        background-color: #fff;
    }
}


@media (min-width: 991px) and (max-width: 4000px){
    .bd-links{
        display: block !important;
    }
    
}

/*events.html*/

.background-events{
    background-image: url(../img/detail-010.png), url(../img/background-01.png);
}

/*Optimización*/

.img-object{
    height: 100%;
    object-fit: cover;
}

/*FOOTER*/

.footer{
    background-color: #232323;
}

.footer h6, .footer p, .footer a{
    color: #fff;
}

.footer .btn{
    border-radius: 5px;
}
.rel_newsbloktitle {
   display:none;
}
.fx-cards {
    height: 100%;
    min-height: 100%;
    position: relative;
    padding-bottom: 50px; 
}
.fx-cards_btn {
    bottom: 30px;
    position: absolute;
    left: 20px;  
} 

.rel_newsbloktitle h2 {
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    font-size: 1.25rem;
}

@media (min-width: 0) and (max-width: 991px){
    .logos img{
        padding-left: 20px;
        margin-bottom: 50px;
        padding-right: 20px;
    }
}
