/** IE FIX | START **/
body.ie{ margin-left: auto; margin-right: auto; max-width: 1200px; }
.ie #content{ max-width: 100%; }
/** IE FIX | END **/

html{ position: relative; background-color: lightgray; overflow-x: hidden; }
body{
  font-size: 20px;
  font-family: 'Zilla Slab', sans-serif;
  min-height: 100vh;
  text-align: justify;
  background-image:url("../img/assets/bg3.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
h1,h2,h3,h4,h5,h6{ margin-top:15px; margin-bottom:15px;}

*::selection{ color: #f2f2f2; background-color: #b3101d; text-shadow: #b3101d; }
a{ color: #283288; }
b{ color: #b3101d;}
label{ margin:0; cursor: pointer; }
button:focus { outline: none; }
.bold{ font-weight: 700; }
.fixed{ position: fixed; }
.cursor{ cursor: pointer; }
.hidden{ opacity: 0 !important; display: none !important; visibility: hidden !important; }
.center{ margin-left: 50%; -webkit-transform: translate(-50%,0); transform: translate(-50%,0); }
.logo{ max-height: 100px; display: block; margin-left: auto; margin-right: auto; }
.t-italic{ font-style: italic; }
.t-block{ text-align: justify !important; }
.t-center{ text-align: center !important; }
.t-left{ text-align: left !important; }
.t-right{ text-align: right !important; }
.f-kuer{ color: #b3101d; }
.no-select{ user-select: none; }
.no-break{white-space: nowrap !important; }
.no-border{border: 0 !important; }
.no-padding{ padding: 0 !important; }
.nav-toggle{ z-index: 3; }
.inline-sup{ vertical-align: super; font-size: 14px; }
.label-container{ display: flex; align-items: center; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; cursor: pointer; }
.bg-img{
  width:100%;
  height:100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-origin: content-box;
  background-position: center;
  max-height: 420px;
  border-radius: 15px;
  -webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
     -moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
          box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
}
br, .no-select{
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
img.img-responsive{
  width:100%;
  height:auto;
  padding-left:15px;
  padding-right:15px;
  padding-bottom:10px;
}
.finish::after{
  content: "";
  top:0;
  position: absolute;
  z-index: 1;
  pointer-events: none;
  animation-name: shineEffect;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.25) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%); /* IE10+ */
  background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0.25) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%); /* W3C */
}
.tumbleweed-container{
  position: fixed;
  z-index: 3;
  bottom: 100px;
  left: -25%;
  opacity: 0;
  display: inline;
  transition: opacity 0.5s ease;
}
.tumbleweed-container.show{ opacity: 1; animation: leftToRight 5s linear alternate infinite; }
.tumbleweed-container.show>.tumbleweed{ animation: upAndDown 1s linear alternate infinite; }
.tumbleweed-container.show>.tumbleweed>img{ animation: spin 1s linear infinite; }
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes upAndDown { from { transform: translateY(-15%); } to { transform: translateY(15%); } }
@keyframes leftToRight { from { left:-25%; } to { left: 100%; } }
@keyframes shineEffect{ from { transform:translateX(-100%); } to { transform:translateX(320%); } }
/** BREAKPOINT: md | START **/
@media (min-width: 768px){
  body{ font-size: 18px; }
  .t-md-center{ text-align: center !important; }
  .t-md-block{ text-align: justify !important; }
  .t-md-left{ text-align: left !important; }
  .t-md-right{ text-align: right !important; }
}
/** BREAKPOINT: md | END **/

/** BREAKPOINT: lg | START **/
@media (min-width: 992px){
  .t-lg-center{ text-align: center !important; }
  .t-lg-block{ text-align: justify !important; }
  .t-lg-left{ text-align: left !important; }
  .t-lg-right{ text-align: right !important; }
}
/** BREAKPOINT: lg | END **/
