/* --------------------------------------------------------
Style Sheet for EAFO

version: 1.0
last modified: 05.10.2018 by Rob Hiensch
author: Mediatastisch
email: info@mediatastisch.studio
website: http://mediatastisch.studio
----------------------------------------------------------*/
body {
    font-family: 'Rubik', sans-serif;
    font-weight: 400;
    width: 100%;
    height: 100%;
}

body, html {
    font-size: 1em;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
}

::-moz-selection {
    background: #FFCB27;
    text-shadow: none;
    color: #ffffff;
}

::selection {
    background: #FFCB27;
    text-shadow: none;
    color: #ffffff;
}

.header-fixed {
    padding-top: 10px;
    padding-bottom: 10px;
    position: fixed;
    top: 0;
    background-color: white;
    z-index: 9;
    margin-top: 110px;
}

.header-fixed-container {
    display: none;
    position: relative;
    padding-right: 0;
    overflow: hidden;
    padding-left: 20.5rem;
}

.header-fixed > thead {
    background: white;
    line-height: 60px;
    border-bottom: 1px solid #E2E3E5;
    border-top: 1px solid #E2E3E5;
}

.header-fixed > thead tr th {
    font-weight: 500;
}

/*
 * Admin header fix
 */
#toolbar-administration+.dialog-off-canvas-main-canvas>.main>header {
    top: 5rem;
}
#toolbar-administration+.dialog-off-canvas-main-canvas>.main .main__menu-aside {
    top: 12.1rem;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers
 */

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/*
 * Main
 */

main.main {

}

h1 {
    font-size: 3rem;
}

h2 {

}

h3 {
    font-weight: 300;
}

h4 {

}

h5 {

}

h6 {

}

h1, h2, h3 h4, h5, h6 {
}

/*
 * Bootstrap custom
 */
.dropdown-toggle.dropdown-toggle--no-arrow::after {
    content: none;
}


/*

/*
 * Body Styles
 */

body.homepage {
    background-color: #EFF0F5;
}

/*
 * Header
 */

header {
    width: 100%;
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
}

.main__header {
    height: 3.75rem;
    background: #ffffff;
    padding: 0 1.3rem;
    position: relative;
}

.main__header__logo {
    height: 2.81rem;
    display: inline-block;
    line-height: 3.1rem;

}

.main__header__logo__link,
.main__header__logo__link:active,
.main__header__logo__link:hover,
.main__header__logo__link:visited {
    display: inline-block;
    text-decoration: none;
}

.main__header__logo__image {
    max-height: 2.81rem;
    display: inline-block;
}

.main__header__logo__text {
    color: #303030;
    font-size: 1.125rem;
    font-weight: 500;
    display: inline-block;
    margin: 0 0;
}

/*
 * Header Menu
 */
.main__header__menu {
    position: absolute;
    right: 0;
    top: 0;
    height: 3.75rem;
}
.main__header__mobile {
    display: none;
}

.main__header__menu__list {
    float: left;
    margin: 0;
    padding: .3rem 0;
    /*line-height: 3.51rem;*/
}

.main__header__menu__list__item {
    float: left;
    list-style: none;
    margin: auto 2rem auto 0;
    position: relative;
    top:0;
    bottom: 0;
    line-height: 30px;
}

.main__header__menu__list__item__link,
.main__header__menu__list__item__link:link,
.main__header__menu__list__item__link:visited {
    display: block;
    height: 100%;
    width: 100%;
    color: #5B5B5B;
    transition: all ease-in-out 0.3s;
    padding: 0.69rem 0;
}

.main__header__menu__list__item__link:active,
.main__header__menu__list__item__link.active,
.main__header__menu__list__item__link:focus,
.main__header__menu__list__item__link:hover {
    text-decoration: none;
    color: #1191D0;
}

.main__header__menu__list__item__link.active {
    text-decoration: none;
    color: #ffffff;
    background-color: #1191D0;
    padding: 0.69rem 1.19rem;
    width: 100%;
    border-radius: 0.25rem;
    transition: all ease-in-out 0.3s;
    position: relative;
}

/*
 * Header Menu Special
 */
.main__header__menu__list__special {
    float: left;
    margin: 0;
    padding: 0;
    line-height: 3.51rem;
}

.main__header__menu__list__special__item {
    float: left;
    list-style: none;
}

.main__header__menu__list__special__item__link,
.main__header__menu__list__special__item__link:link,
.main__header__menu__list__special__item__link:visited {
    height: 100%;
    padding: 0.69rem 1.19rem;
    width: 100%;
    color: #746620;
    background-color: #FFCB27;
    border-radius: 0.25rem;
    margin: auto 0.875rem auto 0;
    transition: all ease-in-out 0.3s;
    position: relative;
}

.main__header__menu__list__special__item__link:active,
.main__header__menu__list__special__item__link.active,
.main__header__menu__list__special__item__link:focus,
.main__header__menu__list__special__item__link:hover {
    text-decoration: none;
    background-color: #FFD85F;
}

.main__header__menu__list__special__item__link--map {
    padding-right: 2.3rem !important;
}

.main__header__menu__list__special__item__link--map:after {
    content: "";
    position: absolute;
    /* display: inline-block; */
    background: url(../images/icon_map.png);
    width: 1.375rem;
    height: 1.23rem;
    top: 0;
    bottom: 0.2rem;
    margin: auto auto auto .23rem;
}

.main__header__menu__list__special__item__link--book {
    padding-right: 2.3rem !important;
}

.main__header__menu__list__special__item__link--book:after {
    content: "";
    position: absolute;
    /* display: inline-block; */
    background: url(../images/icon_book.png);
    width: 1.380625rem;
    height: 0.965625rem;
    top: 0;
    bottom: 0;
    margin: auto auto auto .23rem;
}

/*
 * main heder Filter menu for data pages
 */

.main__header__filter-menu {
    height: 3.18rem;
    background-color: #F2FAFF;
    line-height: 3.18rem;
    padding: 0 1.3rem;
    border-top: 1px solid #E1E1E1;
    border-bottom: 1px solid #E1E1E1;
    box-sizing: content-box;
    position: relative;
}

.main__header__filter-menu__select {
    display: inline-block;
}

.main__header__filter-menu__select__date {
    width: 20rem;
}

.main__header__filter-menu__button {
    position: relative;
    right: 0;
    left: 0;
    background-color: #ffffff;
    -moz-transition: all 0.2s ease-in;
    -o-transition: all 0.2s ease-in;
    -webkit-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in;
    color: #1191D0;
    border: 1px solid #E1E1E1;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    border-radius: 0.25rem;
    padding: 0 2.1rem 0 1.1rem;
    line-height: 2.3rem;
    font-size: 1rem;
}

.main__header__filter-menu__button:after {
    content: "";
    width: 0;
    height: 0;
    border: 7px solid transparent;
    border-color: #E1E1E1 transparent transparent transparent;
    position: absolute;
    top: 16px;
    right: 10px;
}

.main__header__filter-menu__list {
    display: inline-block;
    list-style: none;
    margin: 0;
    padding: 0;
}

.main__header__filter-menu__list__item {
    position: relative;
    padding-left: 0.15rem;
    display: inline-block;
    padding-right: 1.30rem;
    margin: 0 0.5rem;
}

.main__header__filter-menu__list__item__link,
.main__header__filter-menu__list__item__link:link,
.main__header__filter-menu__list__item__link:visited {
    font-size: 0.875rem;
    color: #5B5B5B;
    display: inline-block;
}

.main__header__filter-menu__list__item__link:active,
.main__header__filter-menu__list__item__link.active,
.main__header__filter-menu__list__item__link:focus,
.main__header__filter-menu__list__item__link:hover {
    font-weight: 500;
    text-decoration: none;
}

.main__header__filter-menu__list__item.active .main__header__filter-menu__list__item__link,
.main__header__filter-menu__list__item:active .main__header__filter-menu__list__item__link,
.main__header__filter-menu__list__item:visited .main__header__filter-menu__list__item__link,
.main__header__filter-menu__list__item:hover .main__header__filter-menu__list__item__link {
    color: #1191D0;
}

.main__header__filter-menu__list__item.active,
.main__header__filter-menu__list__item:active,
.main__header__filter-menu__list__item:visited,
.main__header__filter-menu__list__item:hover {
    border-bottom: 1px solid #1191D0;
}

.main__header__filter-menu__list__item:after {

    position: absolute;
    right: 0.4rem;
    top: 0.1rem;
    z-index: 100;
    color: white;
}

.main__header__filter-menu__list__item.overview:after {
    width: 0.8rem;
    height: 0.8rem;
    content: url('../../../themes/eafo/images/icon_overview.gray.svg');

}


.main__header__filter-menu__list__item.overview:hover:after,
.main__header__filter-menu__list__item.overview:visited:after,
.main__header__filter-menu__list__item.overview:active:after,
.main__header__filter-menu__list__item.overview.active:after {
    content: url('../../../themes/eafo/images/icon_overview.blue.svg');
}

.main__header__filter-menu__list__item.biofuels:after {
    width: 0.8rem;
    height: 0.8rem;
    content: url('../../../themes/eafo/images/fuels/biofuel.gray.svg');
}

.main__header__filter-menu__list__item.biofuels:hover:after,
.main__header__filter-menu__list__item.biofuels:visited:after,
.main__header__filter-menu__list__item.biofuels:active:after,
.main__header__filter-menu__list__item.biofuels.active:after {
    content: url('../../../themes/eafo/images/fuels/biofuel.blue.svg');
}

.main__header__filter-menu__list__item.electricity:after {
    width: 0.6rem;
    height: 0.6rem;
    content: url('../../../themes/eafo/images/fuels/electric.gray.svg');
}

.main__header__filter-menu__list__item.electricity:hover:after,
.main__header__filter-menu__list__item.electricity:visited:after,
.main__header__filter-menu__list__item.electricity:active:after,
.main__header__filter-menu__list__item.electricity.active:after {
    content: url('../../../themes/eafo/images/fuels/electric.blue.svg');
}

.main__header__filter-menu__list__item.hydrogen:after {
    width: 0.6rem;
    height: 0.6rem;
    content: url('../../../themes/eafo/images/fuels/hydrogen.gray.svg');
}

.main__header__filter-menu__list__item.hydrogen:hover:after,
.main__header__filter-menu__list__item.hydrogen:visited:after,
.main__header__filter-menu__list__item.hydrogen:active:after,
.main__header__filter-menu__list__item.hydrogen.active:after {
    content: url('../../../themes/eafo/images/fuels/hydrogen.blue.svg');
}

.main__header__filter-menu__list__item.gas:after {
    width: 0.8rem;
    height: 0.8rem;
    right: 0.3rem;
    content: url('../../../themes/eafo/images/fuels/gas.gray.svg');
}

.main__header__filter-menu__list__item.gas:hover:after,
.main__header__filter-menu__list__item.gas:visited:after,
.main__header__filter-menu__list__item.gas:active:after,
.main__header__filter-menu__list__item.gas.active:after {
    content: url('../../../themes/eafo/images/fuels/gas.blue.svg');
}

.main__header__filter-menu__list__item.synthetic:after {
    width: 0.5rem;
    height: 0.5rem;
    content: url('../../../themes/eafo/images/fuels/syntheticfuel.gray.svg');
}

.main__header__filter-menu__list__item.synthetic:hover:after,
.main__header__filter-menu__list__item.synthetic:visited:after,
.main__header__filter-menu__list__item.synthetic:active:after,
.main__header__filter-menu__list__item.synthetic.active:after {
    content: url('../../../themes/eafo/images/fuels/syntheticfuel.blue.svg');
}

.main__header__filter-menu__list__item__link:hover {
    font-weight: 400;
}

.main__header__filter-menu__list__item__link:hover:active,
.main__header__filter-menu__list__item__link:hover.active {
    font-weight: 500 !important;
}

.main__header__filter-menu__list__item__link__delete {
    display: inline-block;
}

.main__header__filter-menu__list__item__link__tag {
    font-size: 0.75rem;
    background-color: #5B5B5B;
    color: #ffffff;
    padding-right: 0.6em;
    padding-left: .6em;
    border-radius: 10rem;
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
    margin-left: 0.2rem;
}

.main__header__filter-menu__list__item__link__tag:empty {
    display: none;
    visibility: hidden;
}

.main__header__filter-menu__list__item__link:active > .main__header__filter-menu__list__item__link__tag,
.main__header__filter-menu__list__item__link.active > .main__header__filter-menu__list__item__link__tag,
.main__header__filter-menu__list__item__link:focus > .main__header__filter-menu__list__item__link__tag,
.main__header__filter-menu__list__item__link:hover > .main__header__filter-menu__list__item__link__tag {
    background-color: #1191D0;
}

.main__header__filter-menu__filters {
    position: absolute;
    top: 0;
    right: 0;
}

.main__header__filter-menu__filters > .main__header__filter-menu__select {
    margin: 0 0.4rem;
}

.main__header__filter-menu__filters__form {
    display: inline-block;
}
.main__header__filter__download__container {
    height: 100%;
    display: inline-block;
    position: relative;
}
.main__header__filter__download__container > .graph-heading__download {
    top: 0.4rem;
    position: relative;
}

.main__header__filter__download__container > .graph-heading__download > .graph-heading__download__svg {
    top: -0.5rem;
    position: relative;
}

/*
 * Country menu selector for data pages
 */

.eafo__dropdown__menu {
    height: 24rem;
    display: none;
    position: absolute;
    width: 100%;
    z-index: 999;
    background: #ffffff;
    border-bottom: 1px solid #E2E3E5;
    padding: 1rem;
}

.eafo__dropdown__menu__title {
    color: #1191D0;
    font-size: 1rem;
    font-weight: 400;
    margin-bottom: 2rem;
}

.eafo__dropdown__menu__country,
.eafo__dropdown__menu__country:link,
.eafo__dropdown__menu__country:visited,
.eafo__dropdown__menu__vehicle,
.eafo__dropdown__menu__vehicle:link,
.eafo__dropdown__menu__vehicle:visited {
    margin-bottom: 2rem;
    display: block;
    color: #5B5B5B;
}

.eafo__dropdown__menu__country:active,
.eafo__dropdown__menu__country.active,
.eafo__dropdown__menu__country:focus,
.eafo__dropdown__menu__country:hover {

}

.eafo__dropdown__menu__country__image {
    position: relative;
    display: inline-block;
    padding-right: 0.7rem;
}

/*
 * menu-aside
 */
.main__menu-aside {
    background: #FAFBFD;
    top: 7.1rem;
    width: 20.5rem;
    border-right: 1px solid #e9eaeb;
    position: fixed;
    bottom: 0;
    left: 0;
    padding: 0;
    color: inherit;
    z-index: 1;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: -webkit-transform .2s ease-in-out;
    transition: -webkit-transform .2s ease-in-out;
    transition: transform .2s ease-in-out;
    transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out;
}

.main__menu-aside__container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    overflow-y: scroll;
}

.menu__aside {
    position: relative;
    height: 100%;
    padding: 0 0;
    overflow: scroll;
}

.menu__aside__list {
    list-style: none;
    padding: 0 0 1rem 0;
    margin: 0;
    font-weight: 300;

}

.menu__aside__list .menu__aside__list {
    padding: 0 0 0 0.3rem !important;
}

.menu__aside__list .menu__aside__list .menu__aside__list {
    padding: 0 0 0 0.3rem !important;
}

.menu__aside__list.sub {
    padding: 0.1rem 0 1rem 0.6rem;
    border-bottom: none;
}

.menu__aside__list__item__header {
    color: #050534;
    font-size: 1rem;
    font-weight: 300;
    margin-bottom: 0.3rem;
    cursor: pointer;
}

.menu__aside__list__item {
    border-bottom: 1px solid #E2E3E5;
    position: relative;
    margin: 0;
    padding: 1.2rem 0 1.2rem 1.7rem;
    background: #FAFBFD;
    color: #050534;
    font-size: 1rem;
    font-weight: 300;
    overflow: hidden;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;

}

.menu__aside__list__item .menu__aside__list__item {
    border-bottom: 0;
    padding: 0 0.2rem 0 0rem;
}

.menu__aside__list__item.has-sub {
    cursor: pointer;

}

.menu__aside__list__item .menu__aside__list__item.has-sub {
    padding: 0 0.2rem 0 1rem;
}

.menu__aside__list__item__link,
.menu__aside__list__item__link:link,
.menu__aside__list__item__link:visited {
    color: #1191D0;
    padding: 0.4rem 1.1rem;
    display: inline-block;
    position: relative;
    margin-bottom: 0.2rem;
}

.menu__aside__list.sub .menu__aside__list__item__link,
.menu__aside__list.sub .menu__aside__list__item__link:link,
.menu__aside__list.sub .menu__aside__list__item__link:visited {
    color: darkgray;
}

.menu__aside__list__item__link:active,
.menu__aside__list__item__link.active,
.menu__aside__list__item .active .menu__aside__list__item__link,
.menu__aside__list__item__link:focus,
.menu__aside__list__item__link:hover {
    background: #1191D0;
    -webkit-border-radius: 1rem;
    -moz-border-radius: 1rem;
    border-radius: 1rem;
    text-decoration: none;
    color: #ffffff;
}

/* CARET -> Icon for menu */
.caret {
    color: inherit;
    display: inline-block;
    margin-top: 3px;
    /*To place the caret on the right, set: float:right;margin-top:0;*/
    width: 0;
    height: 0;
    position: relative;
}

.caret:after {
    content: '';
    background-image: url(../../../themes/eafo/images/chevron_darkblue.png);
    background-repeat: no-repeat;
    color: black;
    font-weight: bold;
    width: 10px;
    height: 7px;
    display: inline-block;
    left: -0.8125rem;
    position: absolute;
    top: -0.625rem;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.caret.active:after {
    content: " ";
    background-image: url("../../../themes/eafo/images/chevron_darkblue.png");
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);

}

/*
 * Page
 */

.page {
    position: relative;
    padding-top: 8.63rem;
    padding-right: 0;
    padding-left: 0;
    overflow: hidden;
}

.page.page--home {
    padding-top: 3.75rem;
}

.page--data {
    padding-left: 20.5rem;
}

.page--map {
    padding-top: 3.73rem;
}

.page__container {
    position: relative;
    margin: 0 auto;
}

.content {
    min-height: 40rem;
    min-height: calc(100vh - 21.3rem);
}

.content__inner {
    padding: 1.5rem 0;
}

/*
 * Homepage - Content Block White
 */

.homepage__content__white {
    width: 100%;
    background-color: #ffffff;
    border-radius: 0.25rem;
    position: relative;
}


/*
 *  Feedback - Page
 */

.feedback-text {
    position: fixed;
    top: 33%;
    right: 1rem;
    z-index: 9;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    border-radius: 0.4rem;
}

.feedback-text__disclaimer--text {
    writing-mode: tb-rl;
    text-orientation: mixed;
    transform: rotate(-180deg);
    color: #ffffff;
    font-size: 0.75rem;
    font-weight: 400;
    padding: 1rem 0.5rem;
    border-bottom: 1px solid;
}

/*
 * Homepage - slick slider
 */
.eafo__news__slider.slick-dotted.slick-slider {
    margin-bottom: 0;
}

.eafo__news__slider.slick-dotted.slick-slider > .slick-dots {
    bottom: 10px;
}

.eafo__news__slider.slick-dotted.slick-slider > .slick-dots li button::before {
    -webkit-text-fill-color: black;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #eff0f5;
    font-size: 12px;
    opacity: 0.5;
}

.eafo__news__slider.slick-dotted.slick-slider > .slick-dots li.slick-active button:before {
    opacity: 1;
}

/*
 * Homepage - Alternative Fuel station map
 */

.homepage__quick__fuel__station__map {
    background-image: url("../images/europe_map_grey.png");
    background-position: right center;
    background-repeat: no-repeat;
    padding: 4rem 0;
    overflow: hidden;
}

.homepage__quick__fuel__station__map__pole-image {
    height: 100%;
    max-height: 100%;
}

.homepage__quick__fuel__station__map__title {
    width: 25rem;
    font-size: 3rem;
    color: #050534;
    font-weight: 500;
}

.homepage__quick__fuel__station__map__subtitle {
    color: #5B5B5B;
    font-size: 1.625rem;
    font-weight: 400;
}

.homepage__quick__fuel__station__map__button {
    margin-top: 1.5rem;
    display: inline-block;
}

/*
 * Homepage - Page link clear
 */
.homepage__page__link__clear__link,
.homepage__page__link__clear__link:link,
.homepage__page__link__clear__link:visited {
    color: #050534;
    font-size: 1.625rem;
    font-weight: 300;
    display: block;
    width: 100%;
    position: relative;
    text-decoration: none;
}

.homepage__page__link__clear__link:active,
.homepage__page__link__clear__link.active,
.homepage__page__link__clear__link:focus,
.homepage__page__link__clear__link:hover {

}

.homepage__page__link__clear__link__read-more {
    float: right;
    font-size: 0.875rem;
    color: #050534;
    font-weight: 500;
    padding-top: 0.5rem;
    padding-right: .5rem;
    position: relative;
    text-decoration: underline;
}

.homepage__page__link__clear__link__read-more:after {
    content: '';
    width: 1.05rem;
    height: 1.05rem;
    background: url(../images/arrow_yellow.png);
    background-size: cover;
    position: absolute;
    right: -1.6rem;
    top: 0.5rem;
    bottom: 0;
    margin: auto;
    transition: all ease-in-out 0.3s;
}

.homepage__page__link__clear__link:hover .homepage__page__link__clear__link__read-more:after {
    right: -.8rem;
    transition: all ease-in-out 0.3s;
}

/*
 * Homepage - Page Link Background
 */
.homepage__page__link__background {
    color: #ffffff;
}

.homepage__page__link__background__link,
.homepage__page__link__background__link:link,
.homepage__page__link__background__link:visited {
    height: 13.75rem;
    padding: 3.5rem 2rem;
    font-size: 1.625rem;
    font-weight: 300;
    display: block;
    position: relative;
    width: 100%;
    color: #ffffff;
    text-decoration: none !important;
    border-radius: 0.25rem;
    background-size: cover;
}

.homepage__page__link__background__show-more,
.homepage__page__link__background__show-more:link,
.homepage__page__link__background__show-more:visited {
    display: block;
    font-size: 1rem;
    font-weight: 500;
    padding-top: .4rem;
    position: relative;
    width: 6rem;
    color: #ffffff !important;
    text-decoration: underline;
}

.homepage__page__link__background__show-more:after {
    content: '';
    width: 1.05rem;
    height: 1.05rem;
    background: url(../images/arrow_yellow.png);
    background-size: cover;
    position: absolute;
    right: -1.6rem;
    bottom: 0.2rem;
    transition: all ease-in-out 0.3s;
}

.homepage__page__link__background__link:hover .homepage__page__link__background__show-more:after {
    right: -1rem;
    transition: all ease-in-out 0.3s;
}

/*
 * Homepage - News
 */
.homepage__news_article {
    overflow: hidden;
}

.homepage__news_article__link,
.homepage__news_article__link:link,
.homepage__news_article__link:visited {
    height: 17rem;
    padding: 3.5rem 2rem;
    font-size: 1.625rem;
    font-weight: 300;
    display: block;
    position: relative;
    width: 100%;
    color: #ffffff;
    text-decoration: none !important;
    background-size: cover;
    background-position: center;
    border-bottom-left-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
}

.homepage__news_article__link__tag {
    font-size: 0.75rem;
    padding: 0.5rem 0.8rem;
    color: #ffffff;
    display: inline-block;
    -webkit-border-radius: 0.25em;
    -moz-border-radius: 0.25em;
    border-radius: 0.25em 0.25em 0 0;
    background: rgba(5, 5, 52, 0.5);

}

.homepage__news_article__link__title {
    font-size: 2rem;
    font-weight: 500;
}

.homepage__news_article__link__read-more {
    display: block;
    font-size: 1rem;
    font-weight: 500;
    padding-top: .4rem;
    position: relative;
    width: 3rem;
    color: #ffffff !important;
    text-decoration: underline;
}

.homepage__news_article__link__read-more:after {
    content: '';
    width: 1.05rem;
    height: 1.05rem;
    background: url(../images/arrow_yellow.png);
    position: absolute;
    right: -1.6rem;
    bottom: 0.2rem;
    transition: all ease-in-out 0.3s;
}

.homepage__news_article__link:hover .homepage__news_article__link__read-more:after {
    right: -1rem;
    transition: all ease-in-out 0.3s;
}

/*
 * Homepage - Side - Content
 */
.homepage__side__content {
    width: 100%;
    display: block;
    position: relative;
    background-color: #ffffff;
    padding: 2.1875rem 1.375rem;
    -webkit-border-radius: 0.25em;
    -moz-border-radius: 0.25em;
    border-radius: 0.25em;
    color: #050534;
}

.homepage__side__content--yellow {
    background-color: #FFCB27;
}

.homepage__side__title {
    font-size: 1rem;
    color: #050534;
    margin-bottom: 2rem;
}

/*
 * Homepage - Side - Rapport
 */
.homepage__side__rapport {
    height: 22.5rem;
    background-image: url("../images/chart_icon_white.png");
    background-position: right 1.375em bottom;
    background-repeat: no-repeat;
}

.homepage__side__rapport__title {
    font-size: 1rem;
    font-weight: 500;
}

.homepage__side__rapport__paragraph {
    font-size: 1rem;
    color: #746620;
    padding-bottom: 0.1875rem;
    width: 17.125rem;
}

.homepage__side__rapport__view-more,
.homepage__side__rapport__view-more:link,
.homepage__side__rapport__view-more:visited {
    color: #ffffff;
    font-size: 0.875rem;
    position: relative;
    text-decoration: underline;
}

.homepage__side__rapport__view-more:active,
.homepage__side__rapport__view-more.active,
.homepage__side__rapport__view-more:focus,
.homepage__side__rapport__view-more:hover {

}

.homepage__side__rapport__view-more:after {
    content: '';
    width: 1rem;
    height: 1rem;
    background: url(../images/arrow_dark_yellow.png);
    position: absolute;
    right: -2.6rem;
    bottom: 0.1rem;
    transition: all ease-in-out 0.3s;
}

.homepage__side__rapport__view-more:hover:after {
    right: -1.6rem;
}

/*
 * Homepage - Side - Link
 */
.homepage__side__link,
.homepage__side__link:link,
.homepage__side__link:visited {
    color: #050534;
    font-size: 1rem;
    font-weight: 500;
    position: relative;
    display: block;
}

.homepage__side__link:active,
.homepage__side__link.active,
.homepage__side__link:focus,
.homepage__side__link:hover {

}

.homepage__side__link:after {
    content: '';
    width: 1.05rem;
    height: 1.05rem;
    background: url(../images/arrow_yellow.png);
    background-size: cover;
    position: relative;
    left: 1rem;
    bottom: 0;
    transition: all ease-in-out 0.3s;
    display: inline-block;
    top: 0.1rem;
}

.homepage__side__link:hover:after {
    left: 0.3rem;
}

/*
 * Homepage - Side - Knowledge center
 */

.homepage__side__knowledge {
    padding-right: 0;
}

.homepage__side__knowledge__title {
    font-size: 1rem;
    color: #050534;
    margin-bottom: 2rem;

}

.homepage__side__knowledge__list {
    padding: 0;
    margin: 0;
    position: relative;
    list-style: none;
}

.homepage__side__knowledge__list__item {
    border-bottom: 1.2px solid #DBDBDB;
}

.homepage__side__knowledge__list__item__link,
.homepage__side__knowledge__list__item__link:link,
.homepage__side__knowledge__list__item__link:visited {
    font-size: 1rem;
    padding: 0.6875rem 0 0.6875rem 2.25rem;
    color: #050534;
    display: block;
}

.homepage__side__knowledge__list__item__link:active,
.homepage__side__knowledge__list__item__link.active,
.homepage__side__knowledge__list__item__link:focus,
.homepage__side__knowledge__list__item__link:hover {
    color: #050534;
    text-decoration: none;
}

.homepage__side__knowledge__list__item__link:before {

}

.homepage__side__knowledge__list__item__link:after {
    content: "\f105";
    font-family: "Font Awesome 5 Free", sans-serif;
    color: #B9B9B9;
    font-size: 1rem;
    font-weight: 900;
    margin: 0px 0px 0px 10px;
    text-decoration: none;
    position: absolute;
    right: 1rem;
}

.homepage__side__knowledge__list__item:last-child {
    border-bottom: 0;
}

.homepage__side__knowledge__link {
    padding-top: 1rem;
    display: inline-block;
}

/*
    ---- ICONS
 */
.homepage__side__knowledge__list__item__link:before {
    position: absolute;
    left: 0;
}
.homepage__side__knowledge__list__item__link.electricity:before {
    width: 0.6rem;
    height: 0.6rem;
    content: url('../../../themes/eafo/images/fuels/electric.gray.svg');
}

.homepage__side__knowledge__list__item__link.electricity:hover:before,
.homepage__side__knowledge__list__item__link.electricity:visited:before,
.homepage__side__knowledge__list__item__link.electricity:active:before,
.homepage__side__knowledge__list__item__link.electricity.active:before {
    content: url('../../../themes/eafo/images/fuels/electric.svg');
}

.homepage__side__knowledge__list__item__link.hydrogen:before {
    width: 0.6rem;
    height: 0.6rem;
    content: url('../../../themes/eafo/images/fuels/hydrogen.gray.svg');
}

.homepage__side__knowledge__list__item__link.hydrogen:hover:before,
.homepage__side__knowledge__list__item__link.hydrogen:visited:before,
.homepage__side__knowledge__list__item__link.hydrogen:active:before,
.homepage__side__knowledge__list__item__link.hydrogen.active:before {
    content: url('../../../themes/eafo/images/fuels/hydrogen.svg');
}

.homepage__side__knowledge__list__item__link.gas:before {
    width: 0.8rem;
    height: 0.8rem;
    right: 0.3rem;
    content: url('../../../themes/eafo/images/fuels/gas.gray.svg');
}

.homepage__side__knowledge__list__item__link.gas:hover:before,
.homepage__side__knowledge__list__item__link.gas:visited:before,
.homepage__side__knowledge__list__item__link.gas:active:before,
.homepage__side__knowledge__list__item__link.gas.active:before {
    content: url('../../../themes/eafo/images/fuels/gas.svg');
}

.homepage__side__knowledge__list__item__link.lpg:before {
    width: 0.8rem;
    height: 0.8rem;
    right: 0.3rem;
    content: url('../../../themes/eafo/images/fuels/gas.gray.svg');
}

.homepage__side__knowledge__list__item__link.lpg:hover:before,
.homepage__side__knowledge__list__item__link.lpg:visited:before,
.homepage__side__knowledge__list__item__link.lpg:active:before,
.homepage__side__knowledge__list__item__link.lpg.active:before {
    content: url('../../../themes/eafo/images/fuels/lpg.svg');
}

.homepage__side__knowledge__list__item__link.biofuels:before {
    width: 0.8rem;
    height: 0.8rem;
    content: url('../../../themes/eafo/images/fuels/biofuel.gray.svg');
}

.homepage__side__knowledge__list__item__link.biofuels:hover:before,
.homepage__side__knowledge__list__item__link.biofuels:visited:before,
.homepage__side__knowledge__list__item__link.biofuels:active:before,
.homepage__side__knowledge__list__item__link.biofuels.active:before {
    content: url('../../../themes/eafo/images/fuels/biofuel.svg');
}

.homepage__side__knowledge__list__item__link.synthetic:before {
    width: 0.5rem;
    height: 0.5rem;
    content: url('../../../themes/eafo/images/fuels/syntheticfuel.gray.svg');
}

.homepage__side__knowledge__list__item__link.synthetic:hover:before,
.homepage__side__knowledge__list__item__link.synthetic:visited:before,
.homepage__side__knowledge__list__item__link.synthetic:active:before,
.homepage__side__knowledge__list__item__link.synthetic.active:before {
    content: url('../../../themes/eafo/images/fuels/syntheticfuel.blue.svg');
}

/*
 * Homepage - Side - News
 */
.homepage__side__news {
    padding-right: 0;
}

.homepage__side__news__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: block;
    position: relative;
}

.homepage__side__news__list__item {
    border-bottom: 1.2px solid #DBDBDB;
    margin: 0;
    padding: 1.375rem 0;
}

.homepage__side__news__list__item:first-child {
    padding-top: 0;
}

.homepage__side__news__list__link,
.homepage__side__news__list__link:link,
.homepage__side__news__list__link:visited {
    font-size: 0.875rem;
    color: #050534;
}

.homepage__side__news__container {
    position: relative;
}

.homepage__side__news__title {
    width: 16.43rem;
    font-size: 0.875rem;
    display: inline-block;
    position: relative;
}

.homepage__side__news__image {
    width: 6.25rem;
    position: absolute;
    top: 0;
    right: 1.375rem;
    height: 100%;
}

.homepage__side__news__link {
    padding-top: 1rem;
    display: inline-block;
}

.homepage__side__rss__title {
    max-width: 16.43rem;
    font-size: 0.875rem;
    display: inline-block;
    position: absolute;
}

.homepage__side__rss__image {
    width: 75px;
    margin-right: 15px;

}

footer {
    border-top: 1px solid #E2E3E5;
    padding: 3.15625rem 0;
    margin-top: 3.3rem;
}

footer:after {
    content: "";
    clear: both;
    display: table;
}

.footer__link,
.footer__link:link,
.footer__link:visited {
    margin: 0 0.7rem;
    color: #050534;
    font-size: 1rem;
    text-decoration: underline;
    font-weight: 500;
}

.footer__link:active,
.footer__link.active,
.footer__link:focus,
.footer__link:hover {

}

.footer__copyright {
    color: #5B5B5B;
    font-size: 1rem;
    font-weight: 300;
}

/*
 * News
 */
.news__overview {
    margin-top: 4rem;
}

.news__overview__categories {

}

.news__category {

}

.news__category__radio {
    display: inline-block;
    margin-left: 1.875rem;
}

/*
 * News - Item
 */
.news__overview__item {
    margin-top: 2em;

}

.news__overview__item__link,
.news__overview__item__link:link,
.news__overview__item__link:visited {
    font-size: 1.625rem;
    height: 22.3rem;
    padding: 3.5rem 2rem;
    font-weight: 300;
    display: block;
    position: relative;
    width: 100%;
    color: #ffffff;
    text-decoration: none !important;
    border-radius: 0.25rem;
    background-size: cover;
}

.news__overview__item__link__tag {
    font-size: 0.75rem;
    padding: 0.5rem 0.8rem;
    color: #ffffff;
    display: inline-block;
    -webkit-border-radius: 0.25em;
    -moz-border-radius: 0.25em;
    border-radius: 0.25em;
    background: rgba(5, 5, 52, 0.5);
}

.news__overview__item__link__title {
    font-size: 3rem;
    font-weight: 500;
    width: 80%;
    max-height: 70%;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.news__overview__item--small .news__overview__item__link__title {
    font-size: 2rem;
    -webkit-line-clamp: 4;
}

.news__overview__item__link__read-more {
    display: block;
    font-size: 1rem;
    font-weight: 500;
    padding-top: .4rem;
    position: relative;
    color: #ffffff !important;
    text-decoration: underline;
}

.news__overview__item__link__read-more:after {
    content: '';
    width: 1.05rem;
    height: 1.05rem;
    background: url(../images/arrow_yellow.png);
    background-size: cover;
    position: relative;
    left: 1rem;
    top: 0.1rem;
    transition: all ease-in-out 0.3s;
    display: inline-block;
}

.news__overview__item__link:hover .news__overview__item__link__read-more:after {
    left: 0.3rem;
    transition: all ease-in-out 0.3s;
}

.news__pagination {
    margin-top: 2rem;
}

.news_article__link__tag {
    font-size: 0.75rem;
    padding: 0.5rem 0.8rem;
    color: #ffffff;
    display: inline-block;
    -webkit-border-radius: 0.25em;
    -moz-border-radius: 0.25em;
    border-radius: 0 0.25em 0.25em 0.25em;
    background: rgba(5, 5, 52, 0.5);

}

/*
 * News - Article
 */

.news__article {
    margin-top: 3.75rem;
}

.news__article__image {
    width: 100%;
    height: 31.625rem;
    background-size: cover;
    border-top-left-radius: 0.25rem;
    -moz-border-radius-topleft: 0.25rem;
    border-top-right-radius: 0.25rem;
    -moz-border-radius-topright: 0.25rem;
    position: relative;
}

.news__article__image__copyright {
    font-size: 0.75rem;
    padding: 0.5rem 0.8rem;
    color: #ffffff;
    display: inline-block;
    -webkit-border-radius: 0.25em;
    -moz-border-radius: 0.25em;
    border-radius: 0.25em;
    background: rgba(5, 5, 52, 0.5);
    position: absolute;
    bottom: 1rem;
    right: 1rem;
}

.news__article__image__copyright:before {
    content: 'Credits: ';
    display: inline-block;
    position: relative;
}

.news__article__content-container {
    background: #ffffff;
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    padding-top: 3rem;
}

.news__article__content {
    font-size: 1rem;
    font-weight: 300;
}

.news__article__content h1 {
    font-size: 1.625rem;
    font-weight: 300;
}

.news__article__content h2 {
    font-size: 1.5rem;
    font-weight: 300;
}

.news__article__content h3 {
    font-size: 1.4rem;
    font-weight: 300;
}

.news__article__content h4 {
    font-size: 1.3rem;
    font-weight: 300;
}

.news__article__content h5 {
    font-size: 1.2rem;
    font-weight: 300;
}

.news__article__content h6 {
    font-size: 1rem;
    font-weight: 300;
}

.news__article__content img {
    max-width:100%;
}

.news__article__content p {
    line-height: 1.4rem;
}

.news__article__content table {

}

.news__article__content table tr,
.news__article__content tr {

}

.news__article__content table tr:hover,
.news__article__content tr:hover {

}

.news__article__content table tr td,
.news__article__content td {

}

.news__article__content table tr td:hover,
.news__article__content td:hover {

}

.news__article__content strong {
    font-weight: 500 !important;
}

.news__article__content a:link,
.news__article__content a:visited {

}

.news__article__content a:active,
.news__article__content a.active,
.news__article__content a:focus,
.news__article__content a:hover {

}

.news__article__content ul,
.news__article__content ol {

}

.news__article__content ul li,
.news__article__content ol li {
}

.news__article__content ul li a,
.news__article__content ol li a {

}

/*
 * News Article Footer
 */
.news__article__footer {
    border-top: 1px solid #DBDBDB;
    width: 100%;
    display: block;
    position: relative;
    margin-top: 4.6rem;
}

.news__article__tags {
    position: relative;
    display: inline-block;
    margin: 1.5rem 0;
}

.news__article__tags__title {
    font-weight: 500;
    color: #050534;
    display: inline-block;
}

.news__article__tags__list {
    padding: 0;
    margin: 0;
    display: inline-block;
}

.news__article__tags__list__item {
    padding: 0;
    margin: 0;
    display: inline-block;
}

.news__article__tags__list__item__link:after {
    content: ", ";
    display: inline;
}

.news__article__tags__list__item:last-child .news__article__tags__list__item__link:after {
    content: '';
    display: none;
}

.news__article__tags__list__item__link,
.news__article__tags__list__item__link:link,
.news__article__tags__list__item__link:visited {
    color: #050534;
    font-weight: 300;
}

.news__article__tags__list__item__link:active,
.news__article__tags__list__item__link.active,
.news__article__tags__list__item__link:focus,
.news__article__tags__list__item__link:hover {
    text-decoration: underline;
}

.news__article__next-article {
    float: right;
    display: inline-block;
    margin: 1.5rem 0;
    padding-right: 1rem;
}

.news__article__next-article__link,
.news__article__next-article__link:link,
.news__article__next-article__link:visited {
    color: #050534;
    font-weight: 500;
}

.news__article__next-article__link:after {
    content: '';
    width: 1.05rem;
    height: 1.05rem;
    background: url(../images/arrow_yellow.png);
    background-size: cover;
    position: relative;
    left: 1rem;
    top: 0.1rem;
    transition: all ease-in-out 0.3s;
    display: inline-block;
}

.news__article__next-article__link:hover:after {
    left: 0.5rem;
}

.news__article__previous-article {
    float: left;
    display: inline-block;
    margin: 1.5rem 0;
    padding-right: 1rem;
}

.news__article__previous-article__link,
.news__article__previous-article__link:link,
.news__article__previous-article__link:visited {
    color: #050534;
    font-weight: 500;
}

.news__article__previous-article__link:before {
    content: '';
    width: 1.05rem;
    height: 1.05rem;
    background: url(../images/arrow_yellow.png);
    background-size: cover;
    position: relative;
    right: 1rem;
    top: 0.1rem;
    transition: all ease-in-out 0.3s;
    display: inline-block;
    margin-left: 1rem;
    transform: rotate(180deg);
}

.news__article__previous-article__link:hover:after {
    left: 0.5rem;
}

/*
 * Content - Data Page
*/

/*
 * General styles
 */

.pagination {
    position: relative;
    display: block;
}

.pagination__title {
    color: #050534;
    font-weight: 500;
    font-size: 1rem;
    margin-right: .5rem;
}

.pagination__number,
.pagination__number:link,
.pagination__number:visited {
    display: inline-block;
    padding: 0.5rem;
    color: #050534;
    font-weight: 300;
    font-size: 1rem;

}

.pagination__number:active,
.pagination__number.active,
.pagination__number:focus,
.pagination__number:hover {
    color: #1191D0;
    font-weight: 300;
    font-size: 1rem;
    text-decoration: none;
}

/*
 * Page Data - Content
 */
.graph-heading {
    /*border-bottom: 1px solid #E2E3E5;*/ /* OLD */
    margin-bottom: 0.5rem;
    margin-right: 0.5rem;
    min-height: 3.75rem;
}

.graph-heading:nth-child(2+n) {
    margin-top: 1rem;
}

.graph-heading__description {
    color: #5B5B5B;
    display: block;
    margin: 0 0 0.625rem 0;
    padding: 0;
    font-weight: 500;
}

.graph-heading__title {
    color: #050534;
    display: inline-block;
    font-weight: 300;
    font-size: 1.4rem !important;
}

.graph-heading__updated {
    color: #1191D0;
    font-size: 0.875rem;
    display: inline-block;
    float: right;
    position: relative;
    padding-right: 2.75rem;
}

.graph-heading__updated:after {
    content: ' ';
    display: inline-block;
    background-image: url(../images/icon_info.png);
    width: 1.3125rem;
    height: 1.3125rem;
    position: absolute;
    right: 0;
}
.graph-heading__updated:empty {
    display: none;
}
.graph-heading__updated:empty:after {
    display: none;
}

.graph-heading__tools {
    display: inline-block;
    float: right;
    margin-top:-0.25rem;
}
.graph-heading__tools__filter {
    display: inline-block;
    margin-right: 0.6rem;
    color:#050534;
    font-size:0.875rem;
}
.graph-heading__tools__filter > .filter-template > .select {
    width:11.25rem;
}
.graph-heading__download {
    width: 2.5rem;
    height: 2.5rem;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    border: 1px solid #E1E1E1;
    background: transparent;
    display: inline-block;
    cursor: pointer;
}
.graph-heading__download__svg {
    color:#1191D0;
    width: 1rem;
    height: 1rem;
}

.content__inner {

}

.content__inner h1 {
    font-size: 2.5rem;
}

.content__inner h2 {
    font-size: 2rem;
}

.content__inner h3 {
    font-size: 1.75rem;
}

.content__inner h4 {
    font-size: 1.5rem;
}

.content__inner h5 {
    font-size: 1.25rem;
}

.content__inner h6 {
    font-size: 1rem;
}

.content__inner p {

}

.content__inner table {
    border: none;
}

.content__inner thead tr {
    border-bottom: 1px solid #E2E3E5;
}

.content__inner thead tr th {
    font-weight: 500;
    padding: 1rem 4rem 1rem 0;
    border: none;
}

.content__inner table tr,
.content__inner tr {
    border-bottom: 1px solid #E2E3E5;

}

.content__inner table tr:hover,
.content__inner tr:hover {

}

.content__inner table tr td,
.content__inner td {
    vertical-align: top;
    padding: 1rem 4rem 1rem 0;
    border: none;
}

.content__inner table tr td:hover,
.content__inner td:hover {

}

.content__inner table tr td:first-child,
.content__inner td:first-child {

    min-width: 20%;
}

.content__inner strong {
    font-weight: 500;
    display: block;
}

.content__inner a:link,
.content__inner a:visited {

}

.content__inner a:active,
.content__inner a.active,
.content__inner a:focus,
.content__inner a:hover {

}

.content__inner ul,
.content__inner ol {

}

.content__inner ul li,
.content__inner ol li {
}

.content__inner ul li a,
.content__inner ol li a {

}

/*
 * Page Map
 */

.map-frame {
    height: 97vh;
}

.map-frame__maps {
    height: 100%;
}

.map-menu {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 9;
    background: #ffffff;
    width: 21.6rem;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    border-radius: 0.25rem;
}

.map-menu__search {
    padding: 0.5rem 1rem;
    background-color: #F2FAFF;
}

.map-menu__location_search {
    width: 15.9rem;
    display: inline-block;
}

.map-menu__filter--head {
    color: #050534;
    font-size: 1rem;
    font-weight: 400;
    padding: 1rem 1.5rem;
    border-top: 2px solid #F7F7F7;
    border-bottom: 1px solid #F7F7F7;
}

.map-menu__filter--head__selector {
    font-size: 0.875rem;
    color: #1191D0;
    margin-left: 0.75rem;

}

.map-menu__radio {
    color: #1191D0;
    display: block;
    padding: 0.5rem 1rem 0.5rem 0;
    border-bottom: 1px solid #F7F7F7;
    margin-left: 1rem;
}
.map-menu__radio--disabled {
    text-decoration: line-through;
}


.map-menu__radio:last-child {
    border-bottom: 0;
}

.eafo__map__loading {
    position: absolute;
    display: block;
    width: 5rem;
    height: 5rem;
    background-color: #fff;
    border-radius: 1rem;
    z-index: 10;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    line-height: 5rem;
    box-shadow: 0 0 7px 0px #000;
}

.eafo__map__loading__spinner {
    vertical-align: middle;
    color: #ffcb27;
}

/*
 *  API selectors - Maps
 */

.map-apiselect {
    position: fixed;
    bottom: 10rem;
    left: 1rem;
    z-index: 10;
    background: #F7F7F7;
    width: 21.6rem;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    border-radius: 0.25rem;
}

.map-apiselect--text {
    color: #050534;
    font-size: 0.75rem;
    font-weight: 400;
    padding: 0.5rem 1.5rem;
    background: #F7F7F7;
}

/* CARET -> Icon for map */
.map-caret {
    color: inherit;
    display: inline-block;
    float:right;
    margin-top:1.20rem;
    width: 0;
    height: 0;
    position: relative;
}

.map-caret:after {
    content: '';
    background-image: url(../../../themes/eafo/images/chevron_darkblue.png);
    background-repeat: no-repeat;
    color: black;
    font-weight: bold;
    width: 10px;
    height: 7px;
    display: inline-block;
    left: -0.8125rem;
    position: absolute;
    top: -0.625rem;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.map-caret.active:after {
    content: " ";
    background-image: url("../../../themes/eafo/images/chevron_darkblue.png");
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);

}

/*
 *  Disclaimer Maps - Maps
 */

.map-text {
    position: fixed;
    bottom: 1rem;
    left: 1rem;
    z-index: 9;
    background: #ffffff;
    width: 21.6rem;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    border-radius: 0.25rem;
}

.map-text__disclaimer--text {
    color: #050534;
    font-size: 0.75rem;
    font-weight: 400;
    padding: 1rem 1.5rem;
    border-top: 2px solid #F7F7F7;
    border-bottom: 1px solid #F7F7F7;
}


/*
 * Page Maps - Maps
 */

.gm-style-iw {
    width: 25rem !important;
    top: 15px !important;
    left: 0 !important;
    background-color: #fff;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    border-radius: 0.25rem;
}
.gm-ui-hover-effect {
    background: #050534 !important;
    width: 35px !important;
    box-shadow: #050534 0 0 5px !important;
    height: 35px !important;
    border-radius: 100% !important;
    border: 7px solid #050534 !important;
}
.gm-ui-hover-effect > img {
    margin: 4px 6px !important;
    display: none !important;
}
.gm-ui-hover-effect:after {
    content: "x";
    color: #ffffff;
    font-size: 1.5rem;
    display: block;
    position: relative;
    margin: -0.3rem 0 0;
}

.map-frame__info-container {
    max-height: 50rem;
    padding: 1rem 0;
    margin: 0.8rem auto;
    width: 25rem !important;
    font-size: 16px;
}

.map-frame__info__title {
    font-size: 1.6rem;
    color: #050534;
    padding: 0 1rem;
    font-weight: 400;
    margin-bottom: 2rem;
}

.map-frame__info__cost {
    display: block;
    color: #050534;
    font-size: 1em;
    font-weight: 500;
    padding: 0 1em;
    margin-bottom: 0.875em;

}

.map-frame__info__address {
    display: block;
    padding: 0 1em;
    font-weight: 400;

}

.map-frame__info__address__line {
    font-size: 0.875em;
    color: #050534;
    padding: 0.625em 0;
    display: block;
    border-bottom: 1px solid #F7F7F7;
}

.map-frame__info__connectors {
    background: #F7F7F7;
    padding: 1rem;
}

.map-frame__info__connectors__title {
    margin-bottom: 0.875rem;
    font-weight: 400;
    font-size: 0.875rem;
    color: #050534;
    display: block;

}

.map-frame__info__connectors__list {
    padding: 0;
    margin: 0;
    list-style: none;
}

.map-frame__info__connectors__list__item {
    margin: 0.8125rem auto;
}

.map-frame__connector__item__count {
    font-size: 0.75rem;
    background-color: #050534;
    color: #ffffff;
    border-radius: 10rem;
    padding: 0.2rem 0.6em;
}

.map-frame__connector__item__image {
    margin: 0 1rem;

}

.map-frame__connector__item__description {
    font-size: 0.875em;
    color: #1191D0;
}

.map-frame__info__updated {
    display: block;
    font-size: 0.875rem;
    color: #1191D0;
    padding: 0 1rem;
    margin: 0.6875rem auto;
}

.map-frame__info__disclaimer {
    padding: 0 1rem;
    color: #050534;
    display: block;
    font-size: 0.875rem;
    font-weight: 400;
}

/*
 * Page - Country
 */

.page_countries__country {
    max-height: 100rem;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}
.page_countries__country.folded {
    max-height: 3.5rem;
    overflow: hidden;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}
.page_countries__country.folded .graph-heading__title:after {
    content: 'Click to view more information';
    display: inline-block;
    position: absolute;
    font-style: italic;
    font-size: 0.8rem;
    line-height: 1.8rem;
    padding-left: 1rem;
}
.page_countries__country__foldable {
    position: relative;
    padding-left: 1rem;
    cursor: pointer;
    margin-bottom: 2rem;
    border-bottom:1px solid #E2E3E5;
}

.page_countries__country__foldable:before {
    content: '';
    background-image: url('../../../themes/eafo/images/chevron_darkblue.png');
    background-repeat: no-repeat;
    color: black;
    font-weight: bold;
    width: 10px;
    height: 7px;
    display: inline-block;
    left: 0;
    position: absolute;
    top: 0.5rem;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.page_countries__country__foldable.folded:before {
    content: " ";
    background-image: url("../../../themes/eafo/images/chevron_darkblue.png");
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.country__map {
    --position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
}
.country__information {
    position: relative;
    min-height: 23rem;
}

.country__information__content {
    overflow: hidden;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -ms-transition: all 2s;
    -o-transition: all 2s;
    transition: all 2s;
    display: block;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -ms-transition: all 2s;
    -o-transition: all 2s;
    transition: all 2s;
    max-height: 23rem;
}
.country__information__content--full {
    max-height: 100rem;
}

.country__information__content__readmore {

}


.country__statistics-container {
    border-bottom: 1px solid #E2E3E5;
    padding-bottom: 1rem;
    font-size: 1rem;
    margin-bottom: 0.5rem;
}

.country__statistics-container:last-child {
    border: 0;
}

.country__statistics__description {
    display: block;
}

.country__statistics__data {
    display: block;
}

/*
 * Button Yellow
 */

.general__button__yellow,
.general__button__yellow:link,
.general__button__yellow:visited {
    padding: 0.72rem 1.2rem;
    color: #746620;
    background-color: #FFCB27;
    border-radius: 0.25rem;
    transition: all ease-in-out 0.3s;
    outline: 0;
    border: 0;
}

.general__button__yellow:active,
.general__button__yellow.active,
.general__button__yellow:focus,
.general__button__yellow:hover {
    text-decoration: none;
    background-color: #FFD85F;
    outline: 0;
    border: 0;
    border-radius: 0.25rem;
}

.general__dark-blue__Link,
.general__dark-blue__Link:link,
.general__dark-blue__Link:visited {
    font-size: 0.875rem;
    color: #050534;
    position: relative;
    text-decoration: underline;

}

.general__dark-blue__Link:active,
.general__dark-blue__Link.active,
.general__dark-blue__Link:focus,
.general__dark-blue__Link:hover {

}

.general__dark-blue__Link:after {
    content: "\f105";
    font-family: "Font Awesome 5 Free", sans-serif;
    color: #FFCB27;
    font-size: 1rem;
    font-weight: 900;
    margin: 0px 0px 0px 10px;
    text-decoration: none;
    position: absolute;
    right: -2rem;
    transition: all ease-in-out 0.3s;

}

.general__dark-blue__Link:hover:after {
    right: -1rem;
    transition: all ease-in-out 0.3s;
}

/*
 * fuel-incentives
 */

.fuel-incentives-clone {
    display: none;
}

/*
 * Form and input fields
 */
form {

}

input {
    outline: 0;
    padding: 0.75rem 1.375rem;
    font-size: 0.875rem;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    border-radius: 0.25rem;
    -webkit-box-shadow: 0;
    -moz-box-shadow: 0;
    box-shadow: 0;
}

::-webkit-input-placeholder {
    color: #050534 !important;
}

::-moz-placeholder {
    color: #050534 !important;

}

::-ms-placeholder {
    color: #050534 !important;

}

::placeholder {
    color: #050534 !important;

}

input[type=text] {
    border: 1px solid #E1E1E1;
    color: #050534;
}

input[type=email] {
    border: 1px solid #E1E1E1;
    width: 75%;
    color: #050534;
}

input[type=submit] {
    color: #746620;
    background-color: #FFCB27;
    border: 0;
}

select {
    border: 1px solid #E1E1E1;
    color: #050534;
}

.radio-container {
    position: relative;
    padding-left: 1.6rem;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.radio-container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom radio button */
.radio-container__checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 1.2em;
    width: 1.2em;
    background-color: #ffffff;
    border: 1px solid #E2E3E5;
    border-radius: 50%;
    bottom: 0;
    margin: auto;
}

/* On mouse-over, add a grey background color */
.radio-container:hover input ~ .radio-container__checkmark {
    background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.radio-container input:checked ~ .radio-container__checkmark {
    background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.radio-container__checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.radio-container input:checked ~ .radio-container__checkmark:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.radio-container .radio-container__checkmark:after {
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: white;
    margin: auto;
    position: absolute;
}

.select-hidden {
    display: none;
    visibility: hidden;
    padding-right: 10px;
}

.select {
    cursor: pointer;
    display: inline-block;
    position: relative;
    font-size: 1rem;
    color: #fff;
}

.select-styled {
    position: relative;
    right: 0;
    left: 0;
    background-color: #ffffff;
    -moz-transition: all 0.2s ease-in;
    -o-transition: all 0.2s ease-in;
    -webkit-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in;
    color: #1191D0;
    border: 1px solid #E1E1E1;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    border-radius: 0.25rem;
    line-height: 2.3rem;
    font-size: 1rem;
    padding: 0 2.1rem 0 1.1rem;

}

.select-styled:after {
    content: "";
    width: 0;
    height: 0;
    border: 7px solid transparent;
    border-color: #E1E1E1 transparent transparent transparent;
    position: absolute;
    top: 9px;
    right: 10px;
    bottom: 0;
    margin: auto 0;
}

.select-styled:hover {
    background-color: #E1E1E1;
}

.select-styled:active, .select-styled.active {
    background-color: #E1E1E1;
}

.select-styled:active:after, .select-styled.active:after {
    top: 9px;
    border-color: transparent transparent #fff transparent;
}

.select-options {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    z-index: 1040;
    margin: 0;
    padding: 0;
    list-style: none;
    background-color: #ffffff;
    color: #1191D0;
    max-height: 20rem;
    overflow: scroll;
    overflow-x: hidden;
    -webkit-box-shadow: 0px 0px 23px 10px rgba(225,225,225,1);
    -moz-box-shadow: 0px 0px 23px 10px rgba(225,225,225,1);
    box-shadow: 0px 0px 23px 10px rgba(225,225,225,1);
}

.select-options li {
    margin: 0;
    padding: 0.1rem 0;

    text-indent: 15px;
    border-top: 1px solid #E1E1E1;
    -moz-transition: all 0.15s ease-in;
    -o-transition: all 0.15s ease-in;
    -webkit-transition: all 0.15s ease-in;
    transition: all 0.15s ease-in;
}

.select-options li:hover {
    color: #1191D0;
    background: #fff;
}

.select-options li[rel="hide"] {
    display: none;
}
/***
 * Custom select selectors styles
 */

#ddlFuelFilter {
    min-width:8.5rem;
}
#ddlYearFilter {
    min-width: 10rem;
}
/*
 * Country menu
 */
.country__menu {
    display: none;
}

.country-item:hover + .country__menu {
    display: block !important;
}
/*
* Fleet dropdown
 */
.fleet__menu {
    display: none;
}

.fleet-item:hover + .fleet__menu {
    display: block !important;
}
/*
 * Knowledge page
 */

section.knowledge_center {

}

section.knowledge_center_block {
    background-color: #ffffff;
    padding: 2rem;
}

.knowledge_center__instruction {
    margin: 1rem 0;
    display: block;
}

.knowledge__window {
    margin: 1rem;
    box-shadow: 0 0 17px 0 #b1b1b1;
    border-radius: 0.25rem;
    position: relative;
    display: block;
    background-color: rgba(255, 255, 255, 1);
    height: 10.25rem;
    border-right: 1px solid #EFF0F5;
    border-bottom: 1px solid #EFF0F5;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.knowledge__window,
.knowledge__window:link,
.knowledge__window:visited {

}

.knowledge__window:active,
.knowledge__window.active,
.knowledge__window:focus,
.knowledge__window:hover {
    background-color: rgba(255, 255, 255, 0.5);

}

.knowledge__window:active .knowledge__window__text,
.knowledge__window.active .knowledge__window__text,
.knowledge__window:focus .knowledge__window__text,
.knowledge__window:hover .knowledge__window__text {
    color: #1191D0;

}

.knowledge__window__container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.knowledge__window__image {
    display: block;
    margin: 0 auto 1rem auto;
}

.knowledge__window__text {
    display: block;
    text-align: center;
    color: #050534;
    font-size: 1rem;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.knowledge_center__faq {

}

.knowledge_center__faq__title {
    margin: 1rem 0 0 0;
}

.knowledge_center__faq__container {
    display: block;
    position: relative;
    width: 100%;
    background: #ffffff;
}

.knowledge_center__faq__item__container {
    position: relative;
    display: block;
    width: 100%;
    min-height: 4.25rem;
    background: #ffffff;
    border-bottom: 1px solid #EFF0F5;
    cursor: pointer;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.knowledge_center__faq__item__container:hover {
    background-color: rgba(239, 240, 245, 0.5);

}

.knowledge_center__faq__item__title {
    color: #050534;
    font-size: 1rem;
    font-weight: 500;
    line-height: 4.25rem;
    padding-left: 4rem;
    display: block;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}

.knowledge_center__faq__item__title--active {
    color: #1191D0;
}

.knowledge_center__faq__item__title:before {
    content: '';
    background-image: url('../../../themes/eafo/images/chevron_darkblue.png');
    background-repeat: no-repeat;
    color: black;
    font-weight: bold;
    width: 10px;
    height: 7px;
    display: inline-block;
    left: 1.5rem;
    position: absolute;
    top: 1.8rem;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.knowledge_center__faq__item__title.knowledge_center__faq__item__title--active:before {
    content: " ";
    background-image: url("../../../themes/eafo/images/chevron_darkblue.png");
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.knowledge_center__faq__item__title:before {
    /*TODO: add image here and rotate on hover*/
}

.knowledge_center__faq__item__description {
    font-size: 1rem;
    color: #050534;
    font-weight: 300;
    display: none;
    padding: 0 4rem;
}
/*
 * 404 / Four o Four Page
 */
.fourofour__container {
    height: 70vh;
}

.fourofour__container__content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.fourofour__container__content h1 {
    font-size: 15rem;
    text-align: center;
    font-weight: 300;
}

.fourofour__container__content h2 {
    font-size: 6rem;
    text-align: center;
    font-weight: 200;
}

.fourofour__container__content p {
    text-align: center;
    margin-top: 2rem;
}
.fourofour__container__content p:first-letter {
}
.fourofour__container__content p a {
    text-transform: uppercase;
}

#eafo__fuel__station__map__alert {
    position: fixed;
    left: 50%;
    z-index: 10000;
    transform: translateX(-50%);
    margin-top: 1rem;
}

/*Procurement*/
.procurement__block table {
    border: none;
}

.procurement__block table tr th {
    font-weight: bold;
}

.procurement__block table tr th,
.procurement__block table tr td {
    border: none;
}

/*content table styling*/
.text-align-center {
    text-align: center!important;
}

.text-align-right {
    text-align: right!important;
}



@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important; /* Black prints faster */
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */
    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre {
        white-space: pre-wrap !important;
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    /*
     * Printing Tables:
     * http://css-discuss.incutio.com/wiki/Printing_Tables
     */
    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}
.filter-label {
}