/*BUDGET.CSS */

/* TERUG NAAR LAAT JE VERRASSEN op BUDGET*/
#backButtonBudget{
display:none;
width:100%;
margin:10px auto 10px 5px;
background-color:#FF6347;
color:#fff;
padding:4px 2px 7px 2px;
text-align:center;
text-decoration:none;
border-radius:8px;
font-size:1.4em;
cursor:pointer;
border:none;
text-shadow:1px 1px 1px grey;
box-shadow:rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
transition:background-color 0.3s ease
}
#backButtonBudget:hover{background-color:#45a049}

/* WAT EET JE MORGEN BUDGET*/
.ButtonContainerWatEetJeMorgenBudget{width:98%;text-align:center;margin-top:25px;margin-left:5px;
}
/* WAT EET JE MORGEN OPMAAK BUTTON BUDGET */
.WatEetJeMorgenBudget{
width:100%;
padding:4px 5px 7px 5px;
font-size:1.4em;
cursor:pointer;
border:none;
border-radius:8px;
transition:background-color 0.3s ease;
margin-top:5px;
background-color:#FF6347;
color: #fff;
text-shadow:1px 1px 1px grey;
box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset
}

.WatEetJeMorgenBudget:hover{background-color:#45a049}

/*GEEN BULLIT - Genruik: bij voorbereiding*/
.geen-bullit{list-style:none}

/* QR BUDGET*/
.QrBudget{
z-index:2;
position:relative;
float:right;
margin-right:15px;
top:15px;
width:90px;
height:90px;
background:url('../budget-included/qr-budget/qr-budget.png') no-repeat
}
/* MEDIA */
@media only screen and (max-width:900px){.QrBudget{display:none}}
@media only screen and (max-width:834px){.QrBudget{display:none}}
@media only screen and (max-width:820px){.QrBudget{display:none}}
@media only screen and (max-width:720px){.QrBudget{display:none}}

/* QR EETZE MEERINFO*/
.BGbuttonLeesMeer{font-size:1.0em;margin:5px 0 0 0;cursor:pointer;background-color:#dcdcdc;color:#000;height:30px;width:100%;border-radius:10px;border:0}

/* LEES MEER MINDER VOOR BUDGET PAGINAS JUS*/
#more-jus{display:none}

/* EETBUTTON LEES MEER MINDER*/
.BGbuttonLeesMeer{font-size:1.0em;margin:5px 0 0 0;cursor:pointer;background-color:#dcdcdc;color:#000;height:30px;width:100%;border-radius:10px;border:0}

/* LEES MEER MINDER 1 t/m 12 VOOR BUDGET PAGINAS*/
#bg-1, #bg-2, #bg-3, #bg-4, #bg-5, #bg-6, #bg-7, #bg-8, #bg-9, #bg-10, #bg-11, #bg-12 {display:none}

/* CONTAINER-4 BUDGET */
.EETcontainer-4-budget{
margin-left:20px;
margin-right:20px;
font-size:0.8em;
display:grid;
grid-template-columns:repeat(4,1fr);
column-gap:1.0vw;
cursor:default;
background-color:transparent
}

.EETcontainer-4-budget >div{}
.EETcontainer-4-budget img{width:100%;border-radius:15px;display:block;box-shadow:2px 2px 6px #ccc}
.EETcontainer-4-budget img:hover{background-color:#f0f3e7}
.EETcontainer-4-budget p{margin:5px 0 -1px -8px;padding-left:10px}
.EETcontainer-4-budget h1{height:25px; font-size:1.2em}
.EETcontainer-4-budget h2{height:45px; font-size:1.1em;margin-left:0;text-align:center}
.EETcontainer-4-budget h3{height:20px; font-size:1.2em;margin-top:-5px;text-align:left;margin-left:22px}
.EETcontainer-4-budget h4{font-size:1.3em;margin-bottom:0;margin-top:10px;font-weight:normal;text-align:left;color:#daa520;text-shadow:1px 1px 1px #000}
.EETcontainer-4-budget ul{margin-top:10px;margin-left:0;margin-right:0;background-color:#F0F2F3;border-radius:15px;padding:10px 5px 10px 25px;list-style:inherit;line-height:2.0em;border:1px solid #c0c0c0}
.EETcontainer-4-budget li{line-height:1.3em}
/* MEDIA */
@media only screen and (max-width:1024px){.EETcontainer-4-budget{grid-template-columns:repeat(3,1fr);margin-right:10px}}
@media only screen and (max-width:926px){.EETcontainer-4-budget{grid-template-columns:repeat(3,1fr);margin-right:10px}}
@media only screen and (max-width:844px){.EETcontainer-4-budget{grid-template-columns:repeat(2,1fr);margin-right:5px}}
@media only screen and (max-width:568px){.EETcontainer-4-budget{grid-template-columns:repeat(1,1fr);margin-right:0}}
@media only screen and (max-width:428px){.EETcontainer-4-budget{grid-template-columns:repeat(1,1fr);margin-right:15px}}
@media only screen and (max-width:414px){.EETcontainer-4-budget{grid-template-columns:repeat(1,1fr);margin-right:20px}}

.EETcontainer-4-budget a:link,
.EETcontainer-4-budget a:visited{color:#000;text-decoration:none}
.EETcontainer-4-budget a:hover,
.EETcontainer-4-budget a:active{color:#7AA10F;text-decoration:none}

.EETcontainer-4-budget hr{
border:0;
height:1px;
margin-top:8px;
margin-bottom:6px;
margin-left:-10px;
width:100%;
background:linear-gradient(to left, rgba(204,204,204,9), transparent)}


/*ZET LANDSCAPE OP MOBIEL OP KLEUR*/
/*Dit kan/mag hier staan omdat er geen POPUP.html is */
@media screen and (max-width: 896px) and (orientation: landscape){

html, body{
margin:0;
padding:0;
background:green;
height:100vh;
width:100vw;
overflow:hidden;
display:flex;
align-items:center;
justify-content:center;
}

body::before{
content:"Deze website werkt alléén in portrait weergave.\A Draai je scherm a.u.b.";
color:white;
font-size:3.0rem;
text-align:center;
padding:1rem;
white-space:pre-line;
}

body *{
display:none !important;
}

}