/*
Theme URI: https://www.veenstrabuitenpost.nl/
Description: Website voor Veenstra Buitenpost
Author: Custard On & Offline Communicatie
Author URI: https://www.custard.nl
Version: 2.0

Nieuwe "Rood" is Aqua :  #039fb9 - rgba(3,159,185,0.5);
Kleur Texaco Zwart    : #000000 - rgba(0,0,0,0.5);
Kleur Texaco Blauw    : #064061 - rgba(6,64,97,0.5);
Kleur Licht grijs    : #f2f2f2 - rgba(242,242,242,0.5);
*/
@font-face { font-family: 'TexacoVeenstra';src: url('/webfonts/Texaco-Medium.eot');src: url('/webfonts/Texaco-Medium.eot?#iefix') format('embedded-opentype'),url('/webfonts/Texaco-Medium.woff2') format('woff2'),url('/webfonts/Texaco-Medium.woff') format('woff'),url('/webfonts/Texaco-Medium.ttf') format('truetype'),url('/webfonts/Texaco-Medium.svg#Texaco-Medium') format('svg');font-weight: 500;font-style: normal;font-display: swap; }
@font-face { font-family: 'TexacoVeenstra';src: url('/webfonts/Texaco-Light.eot');src: url('/webfonts/Texaco-Light.eot?#iefix') format('embedded-opentype'),url('/webfonts/Texaco-Light.woff2') format('woff2'),url('/webfonts/Texaco-Light.woff') format('woff'),url('/webfonts/Texaco-Light.ttf') format('truetype'),url('/webfonts/Texaco-Light.svg#Texaco-Light') format('svg');font-weight: 300;font-style: normal;font-display: swap; }
@font-face { font-family: 'TexacoVeenstra';src: url('/webfonts/Texaco-Bold.eot');src: url('/webfonts/Texaco-Bold.eot?#iefix') format('embedded-opentype'),url('/webfonts/Texaco-Bold.woff2') format('woff2'),url('/webfonts/Texaco-Bold.woff') format('woff'),url('/webfonts/Texaco-Bold.ttf') format('truetype'),url('/webfonts/Texaco-Bold.svg#Texaco-Bold') format('svg');font-weight: bold;font-style: normal;font-display: swap; }
@font-face { font-family: 'TexacoVeenstra';src: url('/webfonts/Texaco.eot');src: url('/webfonts/Texaco.eot?#iefix') format('embedded-opentype'),url('/webfonts/Texaco.woff2') format('woff2'),url('/webfonts/Texaco.woff') format('woff'),url('/webfonts/Texaco.ttf') format('truetype'),url('/webfonts/Texaco.svg#Texaco') format('svg');font-weight: normal;font-style: normal;font-display: swap; }
@font-face { font-family: 'TexacoVeenstra';src: url('/webfonts/Texaco-Black.eot');src: url('/webfonts/Texaco-Black.eot?#iefix') format('embedded-opentype'),url('/webfonts/Texaco-Black.woff2') format('woff2'),url('/webfonts/Texaco-Black.woff') format('woff'),url('/webfonts/Texaco-Black.ttf') format('truetype'),url('/webfonts/Texaco-Black.svg#Texaco-Black') format('svg');font-weight: 900;font-style: normal;font-display: swap; }
@font-face { font-family: 'TexacoHandwriting';src: url('/webfonts/TexacoHandwriting.eot');src: url('/webfonts/TexacoHandwriting.eot?#iefix') format('embedded-opentype'),url('/webfonts/TexacoHandwriting.woff2') format('woff2'),url('/webfonts/TexacoHandwriting.woff') format('woff'),url('/webfonts/TexacoHandwriting.ttf') format('truetype'),url('/webfonts/TexacoHandwriting.svg#TexacoHandwriting') format('svg');font-weight: normal;font-style: normal;font-display: swap; }

html {
    padding:0;margin:0;
}
body {
    padding:0;margin:0;
    font-family:'TexacoVeenstra', sans-serif;
    font-weight:400;
    font-size:1em;
    color:#4b4b50;
    overflow-x:hidden;
}
body.admin-bar header {
/*     position:fixed; */
    top:32px !important;left:0;
}
#headerOffset {
    display:block;
    width:100%;height:150px;
}
.bar {
    display:block;
    width:60%;height:5px;
    padding:0;margin:0 0 30px 0;
}
.fgColor1 { color:#039fb9; } /* Texaco Rood */
.fgColor2 { color:#000000; } /* Texaco Zwart */
.fgColor3 { color:#064061; } /* Texaco Blauw */
.fgColor4 { color:#f2f2f2; } /* Licht grijs */
.fgColor5 { color:#ffffff; } /* Licht grijs */

.bgColor1 { background:#039fb9; } /* Texaco Rood */
.bgColor2 { background:#000000; } /* Texaco Zwart */
.bgColor3 { background:#064061; } /* Texaco Blauw */
.bgColor4 { background:#f2f2f2; } /* Licht grijs */
.bgColor5 { background:#ffffff; } /* Licht grijs */

.bgColor1:hover,.button.bgColor1:focus { background:#039fb9; } /* Texaco Rood */
.bgColor2:hover,.button.bgColor2:focus { background:#000000; } /* Texaco Zwart */
.bgColor3:hover,.button.bgColor3:focus { background:#064061; } /* Texaco Blauw */
.bgColor4:hover,.button.bgColor4:focus { background:#f2f2f2; } /* Licht grijs */
.bgColor5:hover,.button.bgColor5:focus { background:#ffffff; } /* Licht grijs */

.zegels {
    position:absolute;
    top:-40px;left:40px;
    display:block;
    width:540px;height:384px;
    background-image:url('img/texaco_zegels.png');
}
.upper {
    text-transform:uppercase;
}
.bold {
    font-weight:500;
}
.extraBig {
    padding:60px 0 0 0;
    font-size:4em !important;
    line-height:0.9em;
}
.button {
    border-radius:0;
    background:none !important;
    border:solid 1px #039fb9;
    color:#039fb9;
    padding:15px 20px 10px 20px !important;
    font-size:1.2em;
    text-decoration:none;
    text-transform:uppercase;
    transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
            -moz-transition: all .25s ease-in-out;
                -o-transition: all .25s ease-in-out;
}
.button:hover,
.button:focus {
    background:#039fb9 !important;
    color:#ffffff;
}
.button.small {
    font-size:1.1em;
}

.subNavi ul {
    list-style:none;
    padding:0;margin:0 0 40px 0;
}
.subNavi ul li {
    padding:0;margin:0 0 1px 0;
}
.subNavi ul li a {
    display:block;
    line-height:1em;
    font-weight:500;
    text-transform:uppercase;
    padding:15px 20px 13px 20px;margin:0;
    background:#039fb9;
    color:#ffffff;
    transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
            -moz-transition: all .25s ease-in-out;
                -o-transition: all .25s ease-in-out;
}
.subNavi ul li a:hover {
    background:#000000;
}
.handwriting {
    font-family:'TexacoHandwriting', sans-serif;
    font-size:1.8em;
    line-height:1em;
}
.grid-container {
    padding:0 !important;
}
.fullWidth {
    width:100%;
}
h1,h2,h3,h4,h5,h6 {
    font-family: 'TexacoVeenstra', sans-serif;
    line-height:1em;
    font-weight:900;
    color:#000000;
}
.cell {
    position:relative;
}
.contentPadding {
    padding:40px 60px;
}
.noPaddingLeftRight {
    padding-left:0;
    padding-right:0;
}
.contentPadding h1,
.contentPadding h2 {
    font-size:2.2em;
    margin-bottom:20px;
}
.contentPadding h3 {
    font-size:1.3em;
    text-transform:uppercase;
}
.contentPadding p {
    margin-bottom:20px;
}
.contentPadding p.intro {
    font-size:1.3em;
    margin-bottom:40px;
}
.contentPadding img {
    width:100% !important;
}
.contentPaddingSmall {
    padding:40px 20px;
}
.contentPaddingSmall h1,
.contentPaddingSmall h2 {
    font-size:2.2em;
}
.contentPadding ul {
    list-style:none;
    padding:0 0 30px 5px;margin:0;
}
.contentPadding ul li {
    position:relative;
    padding:0;margin:0 0 5px 0;
}
.contentPadding ul li a {
    padding:0;margin:0;
}
.contentPadding a:hover,
.contentPadding a:focus,
.contentPadding ul li a:hover {
    opacity:0.7;
}
.contentPadding ul li:before {
    content: '\b7\a0';
    position:absolute;
    right:100%;
}
.contentPadding ul.checked {
    list-style:none;
}
.contentPadding ul.checked li {
    padding:0 0 0 30px;margin:0 0 10px 0;
    background-image:url('img/icon_check.svg');
    background-repeat:no-repeat;
    background-size:24px 18px;
}
.contentPadding ul li:before {
    content: '';
    position:relative;
}
.extraTopBottomPadding {
    padding-top:40px;
    padding-bottom:40px;
}
.extraTopBottomMargin {
    margin-top:40px;
    margin-bottom:40px;
}
.extraTopBottomMarginBig {
    margin-top:80px;
    margin-bottom:80px;
}
.trialerItem {
    position:relative;
}
.trialerItem .stripe {
    position:absolute;
    left:0;top:-16px;
    display:block;
    width:300px;height:6px;
    background:#000000;
    z-index:90;
}
.trialerItem .description {
    background-color:#f0f0f0;
    min-height:330px;
}
.trialerItem .description h2 {
    text-transform:uppercase;
    color:#039fb9;
    font-size:1.9em;
    margin-bottom:0;
}
.trialerItem .description h3 {
    text-transform:none;
    font-weight:500;
    line-height:1.1em;
}
.trialerItem .description .priceItem h2 {
    text-transform:uppercase;
    font-size:1.6em;
    color:#000000;
}

.trialerItem .description .priceItem h5 {
    text-transform:uppercase;
    font-size:0.8em;
}
.trialerItem .trailerImage {
    width:800px;
    position:absolute;
    right:0;top:20px;
    z-index:2;
}
.trialerItem .legenda {
    padding:20px 0 0 0;
    font-size:0.85em;
}
.trailer {
    margin-bottom:40px;
}
button.closeMenu
{
    position:absolute;
    top:0px;right:0;
    display:block;
    width:100%;height:45px;
    background-color:#000000;
    background-image:url('img/icon_close_mobile.svg');
    background-size:18px 18px;
    background-position:center right 15px;
    background-repeat:no-repeat;
    padding:0;margin:0;
    font-size:2em;
    line-height:0em;
    text-align:right;
    color:#ffffff;
    outline:0 !important;
    z-index:1200;
}
button.openMenu
{
    position:absolute;
    width:60px;height:60px;
    top:50px;right:20px;
    background-image:url('img/icon_open_mobile.svg');
    background-size:32px 32px;
    background-position:center center;
    background-repeat:no-repeat;
    z-index:2000;
    transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
            -moz-transition: all .25s ease-in-out;
                -o-transition: all .25s ease-in-out;
    z-index:1100;
}
button.openMenu:hover {
    opacity:0.5;
}
#offCanvas {
    padding-top:45px;
    background:#039fb9;
    outline:0 !important;
    z-index:2000;
}
#offCanvas ul {
    list-style:none;
    padding:0;margin:0;
    font-weight:400;
}
#offCanvas ul li {
    padding:0;margin:0;
}
#offCanvas ul li a {
    display:block;
    padding:20px 20px 16px 20px;margin:0;
    font-size:1.2em;
    line-height:1em;
    font-weight:500;
    text-transform:uppercase;
    color:#ffffff;
    border-bottom:solid 1px rgba(255,255,255,0.2);
    text-decoration:none;
    transition: all 0.25s linear;
}
#offCanvas ul li a:hover {
    background:rgba(255,255,255,0.2);
}
#offCanvas ul li ul {
    margin-top:0px;
}
#offCanvas ul li ul li a {
    display:block;
    padding:13px 0px 11px 20px;margin:0;
    font-size:0.8em;
    font-weight:normal;
    text-transform:none;
    color:#ffffff;
    background:none;
    text-transform:none;
}
#offCanvas ul li ul li a:hover {
    background:rgba(220,235,250,0.15);
}
header {
    position:fixed;
    top:0;left:0;
    width:100%;height:130px;
    padding:0;margin:0;
    background-image:url('img/bg_header.png');
    background-repeat:repeat-x;
    z-index:100;
}
#headerHolder {
    width:100%;height:130px;
    padding:0;margin:0;
    background-image:url('img/bg_header_left.png');
    background-repeat:no-repeat;
    background-position:center top;
    transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
            -moz-transition: all .25s ease-in-out;
                -o-transition: all .25s ease-in-out;
}
#logo {
    display:block;
    width:350px;height:75px;
    padding:0;margin:25px 0 0 0;
    transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
            -moz-transition: all .25s ease-in-out;
                -o-transition: all .25s ease-in-out;
}
#logo a {
    display:block;
    width:350px;height:75px;
    padding:0;margin:0;
    background-image:url('img/logo_texaco_veenstra.svg');
    background-image:323px 65px;
    background-repeat:no-repeat;
    background-position:center center;
    text-indent:-9999em;
}
#slider {
    position:relative;
    padding:0;margin:0;
    width:100%;height:800px;
    z-index:1;
}
#slider ul {
    list-style:none;
    padding:0;margin:0;
    width:100%;height:800px;
    overflow:hidden;
}
#slider ul li {
    width:100%;height:800px;
    padding:0;margin:0;
    background-position:top center;
    background-repeat:no-repeat;
}
#sliderInside {
    position:relative;
    padding:0;margin:0;
    width:100%;height:300px;
    z-index:1;
}
#sliderInside ul {
    list-style:none;
    padding:0;margin:0;
    width:100%;height:300px;
    overflow:hidden;
}
#sliderInside ul li {
    width:100%;height:300px;
    padding:0;margin:0;
    background-position:top center;
    background-repeat:no-repeat;
}
#firstContent {
    position:relative;
    margin-top:-260px;
    z-index:2;
}
#firstContent .colorBackground {
    background-color:#ffffff;
}
#firstContent .colorBackground a.linkBlock {
    display:block;
    height:200px;
    padding-top:120px;
    margin-bottom:40px;
    font-size:1.6em;
    text-align:center;
    background-color:#000000;
    color:#ffffff;
    text-transform:uppercase;
}
#firstContent .colorBackground a.linkBlockRed {
    display:block;
    height:200px;
    padding-top:120px;
    margin-bottom:40px;
    font-size:1.6em;
    text-align:center;
    background-color:#039fb9;
    color:#ffffff;
    text-transform:uppercase;
}
.linksBlock {
    margin-top:-80px;
    padding-left:40px;
    padding-right:40px;
}
#firstContent .colorBackground .linksBlock a {
    transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
            -moz-transition: all .25s ease-in-out;
                -o-transition: all .25s ease-in-out;
}
#firstContent .colorBackground .linksBlock a:hover {
    transform: scale(1.1);
}
#firstContent .colorBackground a.linkBlock.tanken {
    background-image:url('img/icon_gas_pump.svg');
    background-repeat:no-repeat;
    background-size:70px 70px;
    background-position:top 35px center;
}
#firstContent .colorBackground a.linkBlock.shoppen {
    background-image:url('img/icon_shopping_basket.svg');
    background-repeat:no-repeat;
    background-size:70px 70px;
    background-position:top 35px center;
}
#firstContent .colorBackground a.linkBlock.koffie {
    background-image:url('img/icon_coffee.svg');
    background-repeat:no-repeat;
    background-size:70px 70px;
    background-position:top 35px center;
}
#firstContent .colorBackground a.linkBlock.aanhanger {
    background-image:url('img/icon_trailer.svg');
    background-repeat:no-repeat;
    background-size:90px 90px;
    background-position:top 25px center;
}
#firstContent .colorBackground a.linkBlock.autowassen {
    background-image:url('img/icon_car_wash.svg');
    background-repeat:no-repeat;
    background-size:70px 70px;
    background-position:top 25px center;
}
#normalNavi {
    position:absolute;
    top:68px;left:450px;
}
#normalNavi ul {
    list-style:none;
    padding:0;margin:0;
    clear:both;
}
#normalNavi ul li {
    position:relative;
    float:left;display:inline;
    padding:0;margin:0 30px 0 0;
}
#normalNavi ul li a {
    display:block;
    height:40px;
    line-height:1em;
    padding:0;margin:0;
    color:#ffffff;
    font-size:2em;
    text-transform:uppercase;
    transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
            -moz-transition: all .25s ease-in-out;
                -o-transition: all .25s ease-in-out;
}
#normalNavi ul li ul {
    display:none;
    position:absolute;
    top:40px;left:-20px;
    list-style:none;
    padding:0;margin:0;
    background:#039fb9;
    clear:both;
}
#normalNavi ul li ul li {
    padding:0;margin:0;
    clear:both;
}
#normalNavi ul li ul li a {
    display:block;
    width:250px;
    padding:15px 20px 0 20px;margin:0;
    font-size:0.8em;
    background:#039fb9;
}
#normalNavi ul li ul li a:hover {
    background:#000000;
    opacity:1;
}
#normalNavi a:hover {
    opacity:0.7;
}
#topNavi {
    position:absolute;
    top:10px;right:20px;
}
#topNavi a {
    color:#ffffff;
    transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
            -moz-transition: all .25s ease-in-out;
                -o-transition: all .25s ease-in-out;
}
#topNavi ul {
    list-style:none;
    padding:0;margin:0;
    clear:both;
}
#topNavi ul li {
    float:left;display:inline;
    padding:0;margin:0 0 0 5px;
}
#topNavi ul li a {
    display:block;
    padding:0;margin:0;
    color:#ffffff;
    font-weight:500;
}
#topNavi a:hover {
    opacity:0.7;
}
#topNavi ul li.trailer a {
    padding:0 0 0 40px;
    font-size:0.7em;
    background-image:url('img/icon_trailer.svg');
    background-repeat:no-repeat;
    background-position:0 -2px;
    background-size:30px 30px;
}
#topNavi ul li.phone a {
    padding:2px 0 0 0;
    font-size:1.1em;
}
#topNavi ul li.facebook a {
    width:32px;height:32px;
    padding:0;margin-top:-4px;
    background-image:url('img/icon_facebook.svg');
    background-repeat:no-repeat;
    background-position:center center;
    background-size:24px 24px;
    text-indent:-9999em;
}
#topNavi ul li.instagram a {
    width:32px;height:32px;
    padding:0;margin-top:-4px;
    background-image:url('img/icon_instagram.svg');
    background-repeat:no-repeat;
    background-position:center center;
    background-size:24px 24px;
    text-indent:-9999em;
}
footer {
    background:#064061;
    padding:20px 0 20px 0;
}
footer ul {
    list-style:none;
    padding:0;margin:0;
}
footer ul li {
    position:relative;
    padding:0;margin:0 0 5px 0;
}
footer a {
    color:#ffffff;
    transition: all .25s ease-in-out;
        -webkit-transition: all .25s ease-in-out;
            -moz-transition: all .25s ease-in-out;
                -o-transition: all .25s ease-in-out;
}
footer ul li a {
    padding:0;margin:0;
    color:#ffffff;
}
footer a:hover,
footer a:focus,
footer ul li a:hover {
    color:#ffffff;
    opacity:0.7;
}
footer ul li:before {
    content: '\b7\a0';
    position:absolute;
    right:100%;
}
@media (min-width: 768px) and (max-width: 991px)
{
    #normalNavi,
    #navi {
        display:none !important;
    }
    #headerHolder {
        width:100%;height:130px;
        background-image:url('img/bg_header_left_mobile.png');
        background-repeat:no-repeat;
        background-position:left -2830px top 45px;
    }
    #logo {
        margin:60px 0 0 20px;
    }
    #logo a {
        display:block;
        width:250px;height:54px;
        background-image:url('img/logo_texaco_veenstra.svg');
        background-image:250px 54px;
        background-repeat:no-repeat;
        background-position:center center;
        text-indent:-9999em;
    }
    .trialerItem .trailerImage {
        width:100%;
        position:relative;
        padding-top:40px;
        padding-bottom:40px;
        background-color:#ffffff;
    }
}
@media (max-width: 767px)
{
    #normalNavi,
    #navi {
        display:none !important;
    }
    #headerHolder {
        width:100%;height:130px;
        background-image:url('img/bg_header_left_mobile.png');
        background-repeat:no-repeat;
        background-position:left -2830px top 45px;
    }
    #logo {
        display:block;
        width:250px;height:54px;
        padding:0;margin:60px 0 0 20px;
        transition: all .25s ease-in-out;
            -webkit-transition: all .25s ease-in-out;
                -moz-transition: all .25s ease-in-out;
                    -o-transition: all .25s ease-in-out;
    }
    #logo a {
        display:block;
        width:250px;height:54px;
        background-image:url('img/logo_texaco_veenstra.svg');
        background-image:250px 54px;
        background-repeat:no-repeat;
        background-position:center center;
        text-indent:-9999em;
    }
    #topNavi ul li.trailer a {
    padding-left:0;
    background-image:none;
    }
    .trialerItem .trailerImage {
        width:100%;
        position:relative;
        padding-top:40px;
        padding-bottom:40px;
        background-color:#ffffff;
    }
    .trialerItem .description {
        padding-top:40px;
        padding-bottom:40px;
    }
    .trialerItem .price {
        padding-bottom:10px;
    }
    footer .contentPadding {
        padding-top:20px;
        padding-bottom:0px;
    }
}