@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap');

html, body {margin:0; font-family: 'Roboto', sans-serif; height:100%;}
* {
  box-sizing: border-box;
}

@media screen and (max-width: 1080px) 
{

#wrapper, header {margin:auto; width:100%; max-width:1280px; height:100%;position:relative; padding: 0 20px;
}

header {height:120px; background-color:#cc0;padding:10px;}
header img {height:100px;}

nav {display:none;}

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #393;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 2px;
}

#myBtn:hover {
  background-color: #555;
}

#KnopBestel {background-image: url("afb/KnopBestel.png"); background-repeat:no-repeat;background-size: contain; height:60px;width:180px;padding:10px;font-size:0.8em;line-height:1em;margin:40px 0;
box-shadow: 0px 10px 14px -6px rgba(0,0,0,0.5);
-webkit-box-shadow: 0px 10px 14px -6px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 10px 14px -6px rgba(0,0,0,0.5);
}
#Nws-r ul li a {color:#fff;text-decoration:none;}

.half {width:100%; padding: 20px 0;
}
.left, nav ul li {clear:left; 
}
nav ul, #Nws-r ul {list-style-type:none; } 
nav ul li {font-size:1.8em; color:#fff; margin: 40px; }
nav ul li a {color:#fff; text-decoration:none;}

#Blok1-l img, #Blok2-r img {width:100%;}

#Blok1, #Blok2, #BlokNws, #BlokInfo {clear:left;}

#BlokNws {overflow:hidden; margin: 40px 0; display:block;}
#Nws-l, #Nws-r, #BlokNws {background-color:#393; color:#fff; padding:20px 8px;}
#Nws-r ul {line-height:1.2em; margin:0; margin-left:-40px;}

#Blok1-r, #Nws-l {font-size:1.4em; line-height:1.4em; }
#Blok1-r {italic; color:#393;}
#Blok2-l, #BlokInfo {color:#333;}
.padleft {padding-left:20px;}
.padright {padding-right:20px;}

.italic {font-style:italic;}

#BlokInfo ul {list-style:none;margin:0; padding:0;}

#BlokInfo {
display: table;width:100%;height:auto; background-color:#930;padding:20px 40px 40px 40px;color:#fff;
}
#BlokInfo ul {
display: table-row;
}
#BlokInfo ul li {
display: table-cell; width: 33%;text-align:center;
}
#BlokInfo img {max-height:60px;}

} /*max-width 1080*/

@media screen and (min-width: 1081px) and (max-width: 1300px) 
{

#wrapper, header {margin:auto; width:100%; max-width:1280px; height:100%;position:relative; padding: 0 20px;
}

header {height:120px; background-color:#cc0;padding:10px;}
header img {height:100px;}

nav {position:absolute; left:50%; top:-10px; margin-left:-25%;}

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #393;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 2px;
}

#myBtn:hover {
  background-color: #555;
}

#KnopBestel {background-image: url("afb/KnopBestel.png"); background-repeat:no-repeat;background-size: contain; height:60px;width:180px;padding:10px;font-size:0.8em;line-height:1em;margin:40px 0;
box-shadow: 0px 10px 14px -6px rgba(0,0,0,0.5);
-webkit-box-shadow: 0px 10px 14px -6px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 10px 14px -6px rgba(0,0,0,0.5);
}
#Nws-r ul li a {color:#fff;text-decoration:none;}

.half {width:50%; padding: 20px 0;
}
.left, nav ul li {float:left; 
}
nav ul, #Nws-r ul {list-style-type:none; } 
nav ul li {font-size:1.8em; color:#fff; margin: 40px; }
nav ul li a {color:#fff; text-decoration:none;}

#Blok1-l img, Blok2-r img {width:100%;}

#Blok1, #Blok2, #BlokNws, #BlokInfo {clear:left;}

#BlokNws {overflow:hidden; margin: 40px 0; display:block;}
#Nws-l, #Nws-r, #BlokNws {background-color:#393; color:#fff; padding:40px 20px;}
#Nws-r ul {font-size:1.4em; line-height:1.8em; margin:0; margin-left:-40px;}

#Blok1-r, #Nws-l {font-size:1.8em; font-weight:medium; line-height:1.4em; }
#Blok1-r {italic; color:#393;}
#Blok2-l, #BlokInfo {color:#333;font-size:1.4em;}
.padleft {padding-left:20px;}
.padright {padding-right:20px;}

.italic {font-style:italic;}

#BlokInfo ul {list-style:none;margin:0; padding:0;}

#BlokInfo {
display: table;width:100%;height:auto; background-color:#930;padding:20px 40px 40px 40px;color:#fff;
}
#BlokInfo ul {
display: table-row;
}
#BlokInfo ul li {
display: table-cell; width: 33%;text-align:center;
}
#BlokInfo img {max-height:60px;}
} /*min-width 1081 max-width 1300*/

@media screen and (min-width: 1301px) 
{

#wrapper, header {margin:auto; width:100%; max-width:1280px; height:100%;position:relative;
}

header {height:120px; background-color:#cc0;padding:10px;}
header img {height:100px;}

nav {position:absolute; left:50%; top:-10px; margin-left:-25%;}

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #393;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 2px;
}

#myBtn:hover {
  background-color: #555;
}

#KnopBestel {background-image: url("afb/KnopBestel.png"); background-repeat:no-repeat;background-size: contain; height:60px;width:180px;padding:10px;font-size:0.8em;line-height:1em;margin:40px 0;
box-shadow: 0px 10px 14px -6px rgba(0,0,0,0.5);
-webkit-box-shadow: 0px 10px 14px -6px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 10px 14px -6px rgba(0,0,0,0.5);
}
#Nws-r ul li a {color:#fff;text-decoration:none;}
.half {width:50%; padding: 20px 0;
}
.left, nav ul li {float:left; 
}
nav ul, #Nws-r ul {list-style-type:none; } 
nav ul li {font-size:1.8em; color:#fff; margin: 40px; }
nav ul li a {color:#fff; text-decoration:none;}

#Blok1-l img, Blok2-r img {width:100%;}

#Blok1, #Blok2, #BlokNws, #BlokInfo {clear:left;}

#BlokNws {overflow:hidden; margin: 40px 0; display:block;}
#Nws-l, #Nws-r, #BlokNws {background-color:#393; color:#fff; padding:40px 20px;}
#Nws-r ul {font-size:1.4em; line-height:1.8em; margin:0; margin-left:-40px;}

#Blok1-r, #Nws-l {font-size:1.8em; font-weight:medium; line-height:1.4em; }
#Blok1-r {italic; color:#393;}
#Blok2-l, #BlokInfo {color:#333;font-size:1.4em;}
.padleft {padding-left:20px;}
.padright {padding-right:20px;}

.italic {font-style:italic;}

#BlokInfo ul {list-style:none;margin:0; padding:0;}

#BlokInfo {
display: table;width:100%;height:auto; background-color:#930;padding:20px 40px 40px 40px;color:#fff;
}
#BlokInfo ul {
display: table-row;
}
#BlokInfo ul li {
display: table-cell; width: 33%;text-align:center;
}
#BlokInfo img {max-height:60px;}

} /*min-width 1301*/