/*
 * Base structure
 */


/* Move down content because we have a fixed navbar that is 50px tall  */

body {
  padding-bottom: 30px;
}

.theme-dropdown .dropdown-menu {
  position: static;
  display: block;
  margin-bottom: 20px;
}

.theme-showcase > p > .btn {
  margin: 5px 0;
}

.theme-showcase .navbar .container {
  width: auto;
}


/*
 * Global add-ons
 */

.sub-header {
  padding-bottom: 10px;
  border-bottom: 1px solid #eee;
}


/*
 * Sidebar
 */


/* Hide for mobile, show later */

.sidebar {
  display: none;
}

@media (min-width: 768px) {
  .sidebar {
    position: relative;
    top: 1px;
    bottom: 0;
    left: 0;
    z-index: 1000;
    display: block;
    padding: 20px;
    overflow-x: hidden;
    overflow-y: hidden;
    /* Scrollable contents if viewport is shorter than content. */
    background-color: #f5f5f5;
    border-right: 1px solid #eee;
  }
}




/*
 * Main content
 */




/*
 * Placeholder dashboard ideas
 */

.placeholders {
  margin-bottom: 30px;
  text-align: center;
}

.placeholders h4 {
  margin-bottom: 0;
}

.placeholder {
  margin-bottom: 20px;
}

.placeholder img {
  display: inline-block;
  border-radius: 50%;
}

.seat_overview_block_outer
{
  border-color:#4285F4;
}
.seat_overview_block_header
{
  color: #fff;
  background-color: #5ba0db9f;
  border-color: #0660f1;
  border-radius: 10px;
  border-width: 1px;
  border-style: solid;
  
}

.seat_overview_block_inner
{
  color: #fff;
  background-color: #6c757dcb;
  border-color: #6c757d;
  border-radius: 10px;
  margin-top:5%;
  padding-top: 5%;
  padding-bottom: 5%;
}

/* Seat Overview - Querformat Bild */

.seat_overview_background {
  position: relative;
  display: inline-block;
  top:0;
  left:0;
  width:100%;
  height:100%;
}

/* Change Seat Overview - Mobile device*/
/* On screens that are 992px or less, set the background  */
@media screen and (max-width: 992px) {
  .seat_overview_background {
    transform: rotate(270deg);
    margin-top: 25%;
    margin-bottom: 25%;
    margin-left: -20%;
    width:160%;
    height:160%;
  }
}
/* On screens that are 600px or less, set the background  */
@media screen and (max-width: 576px) {
  .seat_overview_background {

    margin-top: 40%;
    margin-bottom: 40%;
    margin-left: -48%;
    width:200%;
    height:200%;

  }
}
/* On screens that are 992px or lager, set the background  */
@media only screen and (min-width: 992px)  {
  .seat_overview_background {

  }
}

/* Seat Overview - Hochformat Bild */
.seat_overview_background_norotate {
  position: relative;
  display: inline-block;
  top:0;
  left:0;
  width:100%;
  height:100%;
}
/* Change Seat Overview - Mobile device*/
/* On screens that are 992px or less, set the background  */
@media screen and (max-width: 992px) {
  .seat_overview_background_norotate {
    margin-top: 2%;
    margin-bottom: 2%;
    margin-left: 0%;
    width:160%;
    height:160%;
  }
}
/* On screens that are 600px or less, set the background  */
@media screen and (max-width: 576px) {
  .seat_overview_background_norotate {

    margin-top: 1%;
    margin-bottom: 1%;
    margin-left: 0%;
    width:200%;
    height:200%;

  }
}
/* On screens that are 992px or lager, set the background  */
@media only screen and (min-width: 992px)  {
  .seat_overview_background_norotate {

  }
}





/* Custom Colored ProgressBar */

.progress-bar-checkout {
  background-color: #663399;
}

.progress-striped .progress-bar-checkout {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}

.progress-bar-checkin {
  background-color: #FF9933;
}

.progress-striped .progress-bar-checkin {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}


/* Custom Colored Panels */

.huge {
  font-size: 40px;
}

.panel-green {
  border-color: #5cb85c;
}

.panel-green .panel-heading {
  border-color: #5cb85c;
  color: #fff;
  background-color: #5cb85c;
}

.panel-green a {
  color: #5cb85c;
}

.panel-green a:hover {
  color: #3d8b3d;
}

.panel-red {
  border-color: #d9534f;
}

.panel-red .panel-heading {
  border-color: #d9534f;
  color: #fff;
  background-color: #d9534f;
}

.panel-red a {
  color: #d9534f;
}

.panel-red a:hover {
  color: #b52b27;
}

.panel-yellow {
  border-color: #f0ad4e;
}

.panel-yellow .panel-heading {
  border-color: #f0ad4e;
  color: #fff;
  background-color: #f0ad4e;
}

.panel-yellow a {
  color: #f0ad4e;
}

.panel-yellow a:hover {
  color: #df8a13;
}

.top-spacer {
  margin-top: 10px;
}

.teamcontainer {
  position: relative;
  border: solid 1px gray;
  margin: 5px;
  margin-right: 20px;
  padding: 5px;
  background-image: linear-gradient(to bottom,#f5f5f5 0,#e8e8e8 100%);
  font-size: 0.8em;
}

.team{
  font-size: 1.2em;
  font-weight: bold;
}

.team:first-child{
  border-bottom: solid 1px #313131;
}

.match-comment{
  position: absolute;
  bottom: 0;
  text-align: center;
  width: 100%;
}

.seatbutton{
	display: inline-block;
	height:40px;
	width:40px;
	vertical-align: middle;
}

.progress-bar-grey {
	background-color: #767676;
	background-image: -webkit-linear-gradient(top,#c6c6c6 0,#767676 100%);
	background-image: -o-linear-gradient(top,#c6c6c6 0,#767676 100%);
	background-image: -webkit-gradient(linear,left top,left bottom,from(#c6c6c6),to(#767676));
	background-image: linear-gradient(to bottom,#c6c6c6 0,#767676 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c6c6c6', endColorstr='#767676', GradientType=0);
	background-repeat: repeat-x;
}

.form-control::placeholder {
    color: #adb5bd;
}

/* new Checkox desing   */
.checkbox label:after,
.radio label:after {
    content: '';
    display: table;
    clear: both;
}

.checkbox .cr,
.radio .cr {
    position: relative;
    display: inline-block;
    border: 1px solid #a9a9a9;
    border-radius: .25em;
    width: 1.3em;
    height: 1.3em;
    float: left;
    margin-right: .5em;
}

.radio .cr {
    border-radius: 50%;
}

.checkbox .cr .cr-icon,
.radio .cr .cr-icon {
    position: absolute;
    font-size: .8em;
    line-height: 0;
    top: 50%;
    left: 20%;
}

.radio .cr .cr-icon {
    margin-left: 0.04em;
}

.checkbox label input[type="checkbox"],
.radio label input[type="radio"] {
    display: none;
}

.checkbox label input[type="checkbox"] + .cr > .cr-icon,
.radio label input[type="radio"] + .cr > .cr-icon {
    transform: scale(3) rotateZ(-20deg);
    opacity: 0;
    transition: all .3s ease-in;
}

.checkbox label input[type="checkbox"]:checked + .cr > .cr-icon,
.radio label input[type="radio"]:checked + .cr > .cr-icon {
    transform: scale(1) rotateZ(0deg);
    opacity: 1;
}

.checkbox label input[type="checkbox"]:disabled + .cr,
.radio label input[type="radio"]:disabled + .cr {
    opacity: .5;
}


/* ende Checkox desing   */

.hand {
  cursor:pointer;
}

.fillcell {
  margin-bottom:0;
  width:100%;
  height:100%;
}

table.datatable td {
  padding-top:0;
  padding-bottom:0;
  border-spacing: 0;
  line-height: 2.4rem;
}


/* Progressbar entryticket.tpl */

#entryticketheading {
  text-transform: uppercase;
  color: #673AB7;
  font-weight: normal
}

#entryticketform {
  text-align: center;
  position: relative;
  margin-top: 20px
}

#entryticketform fieldset {
  background: white;
  border: 0 none;
  border-radius: 0.5rem;
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding-bottom: 20px;
  position: relative
}

.entryticketform-card {
  text-align: left
}

#entryticketform fieldset:not(:first-of-type) {
  display: none
}

#entryticketform input,
#entryticketform textarea {
  padding: 8px 15px 8px 15px;
  border: 1px solid #ccc;
  border-radius: 0px;
  margin-bottom: 25px;
  margin-top: 2px;
  width: 100%;
  box-sizing: border-box;
  font-family: montserrat;
  color: #2C3E50;
  background-color: #ECEFF1;
  font-size: 16px;
  letter-spacing: 1px
}

#entryticketform input:focus,
#entryticketform textarea:focus {
  -moz-box-shadow: none !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  border: 1px solid #673AB7;
  outline-width: 0
}

#entryticketform .action-button {
  width: 100px;
  background: #673AB7;
  font-weight: bold;
  color: white;
  border: 0 none;
  border-radius: 0px;
  cursor: pointer;
  padding: 10px 5px;
  margin: 10px 0px 10px 5px;
  float: right
}

#entryticketform .action-button:hover,
#entryticketform .action-button:focus {
  background-color: #311B92
}

#entryticketform .action-button-previous {
  width: 100px;
  background: #616161;
  font-weight: bold;
  color: white;
  border: 0 none;
  border-radius: 0px;
  cursor: pointer;
  padding: 10px 5px;
  margin: 10px 5px 10px 0px;
  float: right
}

#entryticketform .action-button-previous:hover,
#entryticketform .action-button-previous:focus {
  background-color: #000000
}

.entryticketcard {
  z-index: 0;
  border: none;
  position: relative
}

.entryticketfs-title {
  font-size: 25px;
  color: #673AB7;
  margin-bottom: 15px;
  font-weight: normal;
  text-align: left
}

.entryticketpurple-text {
  color: #673AB7;
  font-weight: normal
}

.entryticketsteps {
  font-size: 25px;
  color: gray;
  margin-bottom: 10px;
  font-weight: normal;
  text-align: right
}

.entryticketfieldlabels {
  color: gray;
  text-align: left
}

#entryticketprogressbar {
  margin-bottom: 30px;
  overflow: hidden;
  color: lightgrey
}

#entryticketprogressbar .active {
  color: #673AB7
}

#entryticketprogressbar li {
  list-style-type: none;
  font-size: 15px;
  width: 25%;
  float: left;
  position: relative;
  font-weight: 400
}

#entryticketprogressbar #account:before {
  font-family: "Font Awesome 5 Free"; 
  font-weight: 900; 
  content: "\f2bd";
}

#entryticketprogressbar #personal:before {
  font-family: "Font Awesome 5 Free"; 
  font-weight: 900; 
  content: "\f007"
}

#entryticketprogressbar #payment:before {
  font-family: "Font Awesome 5 Free"; 
  font-weight: 900; 
  content: "\f030"
}

#entryticketprogressbar #confirm:before {
  font-family: "Font Awesome 5 Free"; 
  font-weight: 900; 
  content: "\f00c"
}

#entryticketprogressbar li:before {
  width: 50px;
  height: 50px;
  line-height: 45px;
  display: block;
  font-size: 20px;
  color: #ffffff;
  background: lightgray;
  border-radius: 50%;
  margin: 0 auto 10px auto;
  padding: 2px
}

#entryticketprogressbar li:after {
  content: '';
  width: 100%;
  height: 2px;
  background: lightgray;
  position: absolute;
  left: 0;
  top: 25px;
  z-index: -1
}

#entryticketprogressbar li.active:before,
#entryticketprogressbar li.active:after {
  background: #673AB7
}

.entryticketprogress {
  height: 20px
}

.entryticketprogress-bar {
  background-color: #673AB7
}

.entryticketfit-image {
  width: 100%;
  object-fit: cover
}

/* ende entryticket.tpl desing   */

.steps-form-3 {
  width: 2px;
height: 470px;
  position: relative; }
.steps-form-3 .steps-row-3 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column; }
.steps-form-3 .steps-row-3:before {
  top: 14px;
  bottom: 0;
  position: absolute;
  content: "";
  width: 2px;
  height: 100%;
  background-color: #7283a7; }
.steps-form-3 .steps-row-3 .steps-step-3 {
  height: 150px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  text-align: center;
  position: relative; }
.steps-form-3 .steps-row-3 .steps-step-3.no-height {
  height: 50px; }
.steps-form-3 .steps-row-3 .steps-step-3 p {
margin-top: 0.5rem; }
.steps-form-3 .steps-row-3 .steps-step-3 button[disabled] {
  opacity: 1 !important;
  filter: alpha(opacity=100) !important; }
.steps-form-3 .steps-row-3 .steps-step-3 .btn-circle-3 {
  width: 60px;
  height: 60px;
  border: 2px solid #59698D;
  background-color: white !important;
  color: #59698D !important;
  border-radius: 50%;
  padding: 18px 18px 15px 15px;
  margin-top: -22px; }
.steps-form-3 .steps-row-3 .steps-step-3 .btn-circle-3:hover {
  border: 2px solid #4285F4;
  color: #4285F4 !important;
  background-color: white !important; }
.steps-form-3 .steps-row-3 .steps-step-3 .btn-circle-3 .fa {
  font-size: 1.7rem; }