/* ---------- FONTS -------------------------------------------------- */

@font-face
{
    font-family: 'RedHatDisplay-Bold';
    src: url('../fonts/RedHatDisplay-Bold.ttf') format('truetype');
}
@font-face
{
    font-family: 'RedHatDisplay-Medium';
    src: url('../fonts/RedHatDisplay-Medium.ttf') format('truetype');
}
@font-face
{
    font-family: 'RedHatDisplay-Regular';
    src: url('../fonts/RedHatDisplay-Regular.ttf') format('truetype');
}

@font-face
{
    font-family: 'RedHatText-Medium';
    src: url('../fonts/RedHatText-Medium.ttf') format('truetype');
}
@font-face
{
    font-family: 'RedHatText-Regular';
    src: url('../fonts/RedHatText-Regular.ttf') format('truetype');
}
@font-face
{
    font-family: 'RedHatText-RegularItalic';
    src: url('../fonts/RedHatText-RegularItalic.ttf') format('truetype');
}


/* ---------- GENERAL -------------------------------------------------- */

body
{
    font-family: 'RedHatText-Regular';
    font-size:13pt;
    overflow-x:hidden;
    background-color: #000;
    color: white;
}

h1,h2,h3,h4,h5
{
    font-family: 'RedHatDisplay-Bold';
}

.subtitle
{
    font-size:1.5em;
}

hr
{
    border:solid 3px white;
    width:100px;
}

.spacing
{
    margin-top:50px;
}
.spacing-lg
{
    margin-top:100px;
}


.boxed
{
    padding:20px;
    font-weight:bolder;
    text-align:center;
    border:solid 5px white;
    width:200px;
    border-radius:0;
    margin:10px;
    color:white;
}
.boxed:hover
{
    background-color:#eb2b1e;
    color:black;
    background-color: white;
}
.red
{
    background-color:#eb2b1e;
    color:white;
}

a, a:hover
{
    color:white;
    text-decoration:none;
}

a.underline,a.underline:hover{
  text-decoration: underline;
}

.borderless td, .borderless th
{
    border: none;
}
td
{
    /*padding: 2px 8px 5px 0 !important*/
    padding: 3px;
}
.table-borderless td p.smalltext {
    font-size: 9pt;
    margin-top: 20px;
}


ul.clean{
  padding:0px ;
  margin:0px;
}

ul.clean li{
  list-style: none;
  /*¨padding:5px 5px;*/
  padding:0px;
  margin:0px;
  text-align: center;
}


/* ---------- NAVBAR -------------------------------------------------- */

.navbar-toggler-icon
{
    color:black !important;
    border-color:black;
}

.navbar-nav, .navbar-toggler
{
    margin-top:-20px;
    margin-right:25px;
}

.toplogo
{
    height:100px;
    margin-top:20px;
    margin-bottom:20px;
}
.nav-item
{
    margin-left:30px;
    margin-right:30px;
    border-bottom:solid 3px black;
}
.nav-item:hover
{
    border-bottom:solid 3px white;
}
a.nav-link
{
    color:white;
}
a.nav-link:hover
{
    text-decoration:none;
}


/* ---------- NAVBAR -------------------------------------------------- */

.footerrow
{
    padding-top:25px;
    padding-bottom:25px;
    border-top:solid 5px white;
}
.footerrow .smalltext {
  font-size: 9pt;
}

/* ---------- HOME -------------------------------------------------- */

.topfoto
{
    border-top:solid 5px white;
}

.bbqspecialist
{
    background-repeat:no-repeat;
    margin-top:100px;
    padding-bottom:200px;
    padding-left:25px;
    padding-right:25px;
    position:relative;
}
.bbqspecialist.bbqspecialist-photo .img-fluid {
  position: relative;
  max-width: 65%;
  z-index: 100;
}

.bbqspecialist .foto1
{
    position:absolute;
    top:50px;
    left:0;
    width:25%;
    z-index:1;
}
.bbqspecialist .foto2
{
    position:absolute;
    top:0;
    right:0;
    width:25%;
    z-index:1;
}
.bbqspecialist.bbqspecialist-photo .foto1 {
  top: 40%;
  left: -15%;
  width: 35%;
}
.bbqspecialist.bbqspecialist-photo .foto2 {
  top: -20%;
  right: -20%;
  width: 50%;
}
@media (max-width:992px)
{
    .bbqspecialist .foto1 {visibility:hidden;}
    .bbqspecialist .foto2 {visibility:hidden;}
}


.uitgebreidaanbod
{
    padding-top:100px;
    padding-bottom:100px;
    padding-left:25px;
    padding-right:25px;
    position:relative;
}
.uitgebreidaanbod .foto1
{
    position:absolute;
    top:0;
    left:0;
    width:25%;
    z-index:1;
}
.uitgebreidaanbod .foto2
{
    position:absolute;
    bottom:0;
    right:0;
    width:30%;
    z-index:1;
}
@media (max-width:992px)
{
    .uitgebreidaanbod .foto1 {visibility:hidden;}
    .uitgebreidaanbod .foto2 {visibility:hidden;}
}

.vuurvlam
{
    padding-top:100px;
    padding-bottom:100px;
    padding-left:25px;
    padding-right:25px;
    position:relative;
}
.vuurvlam .foto1
{
    position:absolute;
    top:0;
    left:0;
    width:25%;
    z-index:1;
}
.vuurvlam .foto2
{
    position:absolute;
    bottom:0;
    right:0;
    width:20%;
    z-index:1;
}


ul.vuurvlam
{
    width:530px;
    columns: 2;
    -webkit-columns: 2;
    -moz-columns: 2;
    text-align:left;
}


.praktischeinfo
{
    margin-top:-200px;
    padding-top:200px;
    padding-bottom:100px;
    padding-left:25px;
    padding-right:25px;
    position:relative;
}
.praktischeinfo .foto1
{
    position:absolute;
    top:0;
    left:0;
    width:25%;
    z-index:1;
}
.praktischeinfo .foto2
{
    position:absolute;
    bottom:0;
    right:0;
    width:20%;
    z-index:1;
}

/* ---------- BBQ -------------------------------------------------- */


.onzeformules
{
    padding-top:100px;
    padding-bottom:100px;
    padding-left:25px;
    padding-right:25px;
    position:relative;
}
.onzeformules .foto1
{
    position:absolute;
    top:0;
    left:0;
    width:25%;
    z-index:1;
}
.onzeformules .foto2
{
    position:absolute;
    bottom:0;
    right:0;
    width:25%;
    z-index:1;
}
@media (max-width:992px)
{
    .onzeformules .foto1 {visibility:hidden;}
    .onzeformules .foto2 {visibility:hidden;}
}

.overzicht1
{
    padding-top:0;
    padding-bottom:30px;
    padding-left:25px;
    padding-right:25px;
    position:relative;
}
.overzicht1 .foto1
{
    position:absolute;
    top:0;
    left:0;
    width:25%;
    z-index:1;
}
.overzicht1 .foto2
{
    position:absolute;
    top:0;
    right:0;
    width:20%;
    z-index:1;
}
.overzicht1 .foto3
{
    position:absolute;
    top:-80px;
    right:0;
    width:20%;
    z-index:1;
}
@media (max-width:768px)
{
    .overzicht1 .foto2 {visibility:hidden;}
    .overzicht1 .foto3 {visibility:hidden;}
    .overzicht1b .text
    {
        padding:25px;
    }
}

.max70
{
    width:70%;
}


.traditioneel
{
    padding-top:100px;
    padding-bottom:100px;
    padding-left:25px;
    padding-right:25px;
    position:relative;
}
.traditioneel .foto1
{
    position:absolute;
    top:0;
    left:0;
    width:25%;
    z-index:1;
}
.traditioneel .foto2
{
    position:absolute;
    bottom:0;
    right:0;
    width:20%;
    z-index:-1;
}
@media (max-width:992px)
{
    .traditioneel .foto1 {visibility:hidden;}
    .traditioneel .foto2 {visibility:hidden;}
}


.winter
{
    padding-top:100px;
    padding-bottom:100px;
    /*padding-left:25px;
    padding-right:25px;*/
    position:relative;
}
.wintertxt
{
    margin-top:-100px;
}
.winter .foto1
{
    position:absolute;
    top:0;
    left:0;
    width:25%;
    z-index:1;
}
.winter .foto2
{
    position:absolute;
    bottom:0;
    right:0;
    width:30%;
    z-index:1;
}
.spaceBox
{
    height:200px;
}
@media (max-width:992px)
{
    .winter .foto1 {visibility:hidden;}
    .winter .foto2 {visibility:hidden;}
    .winter .spaceBox {visibility:hidden;}
}

.hapjesbbq .text, .traditioneel .text, .cotealos .text, .winter .text
{
    padding-left:15px;
    padding-right:15px;
}

.table-borderless
{
    max-width:95% !important;
    margin-left:auto;
    margin-right:auto;
    padding:15px !important;
}

/* ---------- CONTACT -------------------------------------------------- */

.contacteerons
{
    padding-top:100px;
    padding-bottom:100px;
    padding-left:25px;
    padding-right:25px;
    position:relative;
}
.contacteerons .foto1
{
    position:absolute;
    top:0;
    left:0;
    width:30%;
    z-index:1;
}
.contacteerons .foto2
{
    position:absolute;
    bottom:0;
    right:0;
    width:30%;
    z-index:1;
}
@media (max-width:992px)
{
    .contacteerons .foto1 {visibility:hidden;}
    .contacteerons .foto2 {visibility:hidden;}
}

.field
{
    border-style:none;
    background-color:white;
    color:black;
    padding:10px;
    width:90%;
}
.button
{
    border: solid 5px white;
    background-color:black;
    color: white;
    padding:15px;
}

.button:hover{
  color: black;
  background-color:white;
}


@media (max-width:480px)
{    
    .button2{
      font-size: 12px;
      border: solid 2px white;
    }
    
}



 .btn-img-opmaat
{
    width:190px;
    position:absolute;
    right:0px;
    top:220px;
    z-index:9998;
}
@media (min-width: 1550px)
{
    .btn-img-opmaat { position:fixed; }
}
@media (max-width: 792px)
{
    .btn-img-opmaat
    {
        width:120px;
        top:150px;
    }
}

/* ---------- MODAL -------------------------------------------------- */
.modal .modal-content {
    background-color: #000;
    color: #fff;
}
.modal .modal-header {
    border-bottom: none;
}

.modal .modal-footer {
    border-top: none;
}