@charset "UTF-8";
/*//////////////////////////////////////////////=============================
   PIZZATAINMENT.DE   //////////   © 2022-2023 BITENOTBARK, Tim Gloystein
=============================//////////////////////////////////////////////*/

/*//////////////////////////////////////////////=============================
     FONTS
=============================//////////////////////////////////////////////*/
@font-face {
 font-family: 'latoregular';
 src: url('../fonts/lato/lato-regular-webfont.woff2') format('woff2'),
  url('../fonts/lato/lato-regular-webfont.woff') format('woff');
 font-weight: normal;
 font-style: normal;
}
@font-face {
 font-family: 'latoitalic';
 src: url('../fonts/lato/lato-italic-webfont.woff2') format('woff2'),
  url('../fonts/lato/lato-italic-webfont.woff') format('woff');
 font-weight: normal;
 font-style: normal;
}
@font-face {
 font-family: 'latobold';
 src: url('../fonts/lato/lato-bold-webfont.woff2') format('woff2'),
  url('../fonts/lato/lato-bold-webfont.woff') format('woff');
 font-weight: normal;
 font-style: normal;
}
@font-face {
 font-family: 'latobold_italic';
 src: url('../fonts/lato/lato-bolditalic-webfont.woff2') format('woff2'),
  url('../fonts/lato/lato-bolditalic-webfont.woff') format('woff');
 font-weight: normal;
 font-style: normal;
}

@font-face {
 font-family: 'diazoregular';
 src: url('../fonts/diazo/diazo_mvb_rough2_cond_regular.woff2') format('woff2'),
  url('../fonts/diazo/diazo_mvb_rough2_cond_regular.woff') format('woff');
 font-weight: normal;
 font-style: normal;
}
@font-face {
 font-family: 'diazobold';
 src: url('../fonts/diazo/diazo_mvb_rough2_cond_bold.woff2') format('woff2'),
  url('../fonts/diazo/diazo_mvb_rough2_cond_bold.woff') format('woff');
 font-weight: normal;
 font-style: normal;
}

@font-face {
 font-family: 'noveregular';
 src: url('../fonts/nove/nove-webfont.woff2') format('woff2'),
  url('../fonts/nove/nove-webfont.woff') format('woff');
 font-weight: normal;
 font-style: normal;
}
/*==========================/////////////////////==========================*/


/*//////////////////////////////////////////////=============================
     BASICS
=============================//////////////////////////////////////////////*/
:root {
 --purple: #5d3b95;
 --brightpurple: #7f1aa1;
 --darkpurple: #310e79;
 --mint: #2fb8af;
 --red:  #db2315;
 --white:  #ffffff;
/* color: var(--orange);*/
}

html {
	scroll-behavior: smooth;
 font-size: 62.5%;
}
body {
 background-color: var(--purple);
 color: var(--white);
 font-family: 'latoregular', Arial, sans-serif; 
 font-size: 1.6rem;
}
::selection {
 background: var(--orange);
 text-shadow: none;
 color: #fff;
}
::-moz-selection {
 background: var(--orange);
 text-shadow: none;
 color: #fff;
}
main ::placeholder {
 font-size: 1em;
 text-align: center;
 font-style: normal !important;
 font-family: 'latoregular' !important;
}
main ::-webkit-input-placeholder {
 font-style: normal !important;
 font-family: 'latoregular' !important;
}
main :-moz-placeholder {
 font-style: normal !important;
 font-family: 'latoregular' !important;
}
main ::-moz-placeholder {
 font-style: normal !important;
 font-family: "latoregular" !important;
}
main :-ms-input-placeholder {  
 font-style: normal !important;
 font-family: 'latoregular' !important;
}
#mobileNav {
 display: none;
}
.navbar {
 display: none;
}
.spinner-wrapper {
 background-color: var(--purple);
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 z-index: 9999;
 display: flex;
 justify-content: center;
 align-items: center;
 transition: all 0.2s;
}
.spinner-border {
 height: 60px;
 width: 60px;
}
/*==========================/////////////////////==========================*/


/*//////////////////////////////////////////////=============================
     STYLING
=============================//////////////////////////////////////////////*/
h1 {
 font-family: 'noveregular', sans-serif;
 text-transform: uppercase;
 color: var(--white);
 font-size: 4rem; 
}
h2 {
 font-family: 'noveregular', sans-serif;
 text-transform: uppercase;
 color: var(--white);
 font-size: 4rem;
}
h3 {
 font-family: 'diazobold', sans-serif;
 text-transform: uppercase;
 color: var(--white);
 font-size: 2rem;
}
p {
 font-weight: 100;
 margin-bottom: 1.6rem;
}
p.card-text {
 font-size:1.2rem;
 line-height: 1.8rem;
}
b, strong {
 font-weight: 600;
}
a {
 color: var(--orange);
 text-decoration: underline;
}
a:hover, a:active {
 color: var(--orange);
 text-decoration: none;
}
ul {
 font-weight: 100;
 margin-bottom: 1.6rem;
}
.btn-danger {
  background: var(--red);
}
ol.upper-roman {
 list-style-type: upper-roman;
} 
ol.lower-alpha {
 list-style-type: lower-alpha;
} 
table {
 color: #fff !important;
}
/*==========================/////////////////////==========================*/


/*//////////////////////////////////////////////=============================
     LAYOUT
=============================//////////////////////////////////////////////*/
header {

}
header .logo {
 position: absolute;
 top: 0;
 left: 20px;
 width: 160px;
 height: 150px;
 opacity: 1;
 padding: 0;
 transition: all 0.4s;
}
header .logo img {
 display: block;
 margin-top: 20px;
 transition: all 0.4s;
}

.language {
 position: absolute;
 left: 20px;
 top: 20px;
}
.language img {
 max-width: 30px;
 -webkit-filter: opacity(.5);
 filter: opacity(.5);
 margin-bottom: 6px;
}
.language a:hover img {
 -webkit-filter: opacity(1);
 filter: opacity(1);
 transition-duration: .3s;
}
.language a.active img {
 -webkit-filter: opacity(1);
 filter: opacity(1);
}
.language a.active:hover img {
 -webkit-filter: blur(2px);
 filter: blur(2px);
 transition-duration: .3s;
}
.minusMargin {
 margin-top: 0;
}
.pizzaaahr {
  background-image: url('/img/minipizza.png');
  background-size: 100px auto;
  width: 100%; 
  height: 80px;
  content:"";
  border-top: none;
 opacity: 1;
}
.toTop {
 line-height: 40px;
 z-index: 999;
 display: none;
 cursor: pointer;
 position: fixed;
 bottom: 30px;
 right: 0px;
 background-color: transparent;
 border: none;
 color: var(--white);
 text-align: center;
 font-size: 32px;
 text-decoration: none;
}
.toTop:hover {
 background-color: transparent;
 border: none;
 color: var(--mint);
}
.pizzaRight {
 background-image: url("/img/pizzastueck-weiss@4x.png");
 background-repeat: no-repeat;
 background-size: contain;
 background-size: 100px auto;
 background-position: 102% -10px;
}
.pizzaLeft {
 background-image: url("../img/pizzastueck-weiss@4x.png");
 background-repeat: no-repeat;
 background-size: contain;
 background-size: 100px auto;
 background-position: -20px 0px;
}
footer {
 width: 100%;
 margin: 0 auto;
 padding: 1rem 0;
 font-family: 'diazoregular', Arial, Helvetica, sans-serif;
 color: var(--white);
 font-size: 1.8rem;
 line-height: 2.4rem;
 text-align: left;
}
footer a {
 color: var(--white);
}
footer a:hover {
 color: var(--white);
}
footer nav .active {
 background: none;
 color: var(--white);
}
footer nav ul {
 list-style-type: none;
 list-style-image: none;
}
footer nav ul {
 padding: 0;
 margin: 0;
}
.socialIcon {
 max-width: 10rem;
 -webkit-transition: max-width 0.3s; 
 -moz-transition: max-width 0.3s; 
 -ms-transition: max-width 0.3s; 
 -o-transition: max-width 0.3s; 
 transition: max-width 0.3s;  
}
.socialIcon:hover {
 max-width: 10.6rem;
}
.aktionsStoerer {
 position: absolute;
 top: 34rem;
 right: 0.5rem;
 max-width: 120px;
}
/*==========================/////////////////////==========================*/


/*//////////////////////////////////////////////=============================
     FORMS
=============================//////////////////////////////////////////////*/
label {
 color: var(--red);
 font-family: 'latoregular', sans-serif;
}
input,textarea,select {
 height: calc(6rem + 2px) !important;
 font-size: 2.4rem !important;
}
textarea.form-control {
 min-height: calc(6em + 0.75rem + 2px);
}
input.switch {
 height: calc(2rem + 2px) !important;
 margin: 0 !important;
}
#url { 
 opacity: 0;
 position: absolute;
 top: 0;
 left: 0;
 height: 0;
 width: 0;
 z-index: -1; 
}
.msg {
 font-family: 'diazobold', sans-serif;
	font-weight: bold;
	font-size: 2rem;
	line-height: 2.4rem;
 text-align: center;
 margin-top: 5rem;
}
.anker {
 margin-bottom: 9rem;
 display: block;
}
.upload {
 color: white;
}
.form-control.upload {
 background: none !important;
 border: none;
}
.form-control.upload:focus {
 border: none !important;
 box-shadow: none;
 color: white;
}
/*==========================/////////////////////==========================*/



/*//////////////////////////////////////////////=============================
     BREAKPOINTS BOOTSTRAP v5.2
=============================//////////////////////////////////////////////*/
/*// Small devices (landscape phones, 576px and up) //*/
@media (min-width: 544px) {
 
}
/*// Medium devices (tablets, 768px and up) //*/
@media (min-width: 768px) {
 .toTop {
 bottom: 60px;
 right: 50px;
 }
}
/*// Large devices (desktops, 992px and up) //*/
@media (min-width: 992px) {
 .mobile-navbar-toggle {
  display: none;
 }
 .navbar {
  display: flex;
 }
 h1 {
  font-size: 8rem;
 }
 h2 {
  font-size: 8rem;
 }
 h3 {
  font-size: 4rem;
 }
 p {
  /*font-size: 1.4rem;
  line-height: 2.4rem;*/
 }
 ul {
  /*font-size: 1.4rem;
  line-height: 2.4rem;*/
 }
 .language img {
  max-width: 40px;
  margin-bottom: 10px;
 }
 .pizzaRight {
  background-image: url("/img/pizzastueck-weiss@4x.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-size: 400px auto;
  background-position: 102% -100px;
 }
 .pizzaLeft {
  background-image: url("/img/pizzastueck-weiss@4x.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-size: 400px auto;
  background-position: -60px 100px;
 }
 .minusMargin {
  margin-top: -120px;
 }
 .aktionsStoerer {
  position: absolute;
  top: 36rem;
  left: 14rem;
  max-width: 300px;
 }
}
/*// X-Large devices (large desktops, 1200px and up) //*/
@media (min-width: 1200px) {
 header #logo {
  /*left: 100px;
  width: 250px;*/
 }
 header #logo img {
  width: 220px;
  margin-top: 30px;
 }
 h1 {
  font-size: 8rem;
 }
 h2 {
  font-size: 8rem;
 }
}
/*// XX-Large devices (larger desktops, 1400px and up) //*/
@media (min-width: 1400px) { 
 h2 {

 }
}
/*==========================/////////////////////==========================*/


/*//////////////////////////////////////////////=============================
     PRINT
=============================//////////////////////////////////////////////*/
@media print {
 * {
  background: transparent !important;
  color: #000 !important;
  box-shadow: none !important;
  text-shadow: none !important;
 }
 a, a:visited {
  text-decoration: underline !important;
  border: none !important;
 }
 a[href]:after {
  content: " ("attr(href) ")";
 }
 abbr[title]:after {
  content: " ("attr(title) ")";
 }
 .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {
  content: "";
 }
 pre, blockquote {
  border: 1px solid #999;
  page-break-inside: avoid;
 }
 thead {
  display: table-header-group;
 }
 tr, img {
  page-break-inside: avoid;
 }
 img {
  max-width: 100% !important;
 }
 @page {
  margin: 0.5cm;
 }
 p, h2, h3 {
  orphans: 3;
  widows: 3;
 }
 h2, h3 {
  page-break-after: avoid;
 }
}