/*   
Theme Name: BS 5 Theme
Theme URI: Bootstrap
Description: A Theme for WordPress with Bootstrap for styling.
Author: Inno-Cube
Author URI: Bootstrap
Version: 1.0
*/



/* Main Image Start Seite*/
.mainPictureContainer{
  min-height:60vh;
  padding: 0;
}
.mainPictureDescription{
  margin-top: 3vh;
  min-height:17vh;
  padding: 0;
  touch-action: manipulation; 
}
.mainSegment1{
  margin: 0;
  width:100vw;
  height:92vh;
  position:fixed;
  left:0px;
  top:8vh;
  z-index:0;
}

.mainSegment2{
  
  padding-left:0;
  padding-right:0;
  padding-top:5vh;
  position:relative;
  width:100vw;
  left:0;
  


}

.segmentContainer{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100vh;
  overflow: scroll;
  transition: margin-top .7s ease-in-out;

}

.segmentContainer::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.segmentContainer {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.mainPicture{
  background-size: cover!important;
}

.mainPicturePlaceholder{
  position:absolute;
  width: 100%;
  height: 100%;
  background: url("/wp-content/themes/bs-theme/img/BuildingSimulation.png") no-repeat center center;
  
}

.mainPictureOverlay{
  transition: background-size .5s ease-in-out, opacity .5s ease-in-out; 
}

.mainPictureText{
  font-size:2.2vw !important;
  width:35vw;
  min-height: 15vh;
  display:table  !important;
}

.mainPictureButton{
  position:absolute;
  bottom: 0vh;
  height: 18.5vh;
  right: 3vw;
}


/* Start Seite Tiles bei Main Image*/
.tileStart{
  background-size: 100% 301%;
  background-color: #041B27;
  
  background-position: 0% 100%;
  cursor:pointer;
  border: solid #5C6B73;
  border-width:0 0.5px 0.5px 0;
}

.tileStartSelected{
  background-position: 0% 50%;
  background-image: linear-gradient(to top, #041B27 33.3%, #00B4F4 33.3%, #00B4F4 66.6%, #041B27 66.6%);
  transition: background-position .5s ease-in-out, color .5s ease-in-out; 
}
.tileStartDeSelected{
  background-position: 0% 0%;
  background-image: linear-gradient(to top, #041B27 33.3%, #00B4F4 33.3%, #00B4F4 66.6%, #041B27 66.6%);
  transition: background-position .5s ease-in-out, color .5s ease-in-out; 
}

.tileStartText{
  
  color:#fff;
  font-size: calc(0.5em + 1vw);
}
.tileStartText-left{
  position:absolute;
  left:3vw;
  text-align: left;
}
.tileStartText-right{
  position:absolute;
  right:3vw;
  text-align:right;
}
.tileStartText-top{
  position:absolute;
  top: 8vh;
}
.tileStartText-bottom{
  position:absolute;
  bottom: 8vh;
}

.tileMiddle{
  top:50%;
  width:40%;
  left:30%;
  position:absolute;
}
.tileMiddleRotate{
  padding-bottom:100%;
  margin-top:-50%; 
  transform: rotate(-45deg);
  overflow:hidden;
  border: solid #5C6B73;
  border-width:0.5px;
}
.tileMiddleContent{
  position:absolute;
  top:-25%;
  left:-25%;
  width:150%;
  height:150%;
  transform:rotate(45deg);
  text-align:center;
  display:table;
}

.stdFontBold{
  font-family: Montserrat;
  font-weight: Bold;
  opacity: 1;
  width:75%;
}

/* Indicator Bar for small View*/

.bg-indicator{
  margin-left:1.5em;
  margin-top:0;
  width:4.5em;
  height:0.5em;
  background-image: linear-gradient(to right, #fff 11.1%, #041B27 11.1%, #041B27 22.2%, #fff 22.2%, #fff 33.3%, #041B27 33.3%, #041B27 44.4%, #fff 44.4%, #fff 55.5%, #041B27 55.5%, #041B27 66.6%, #fff 66.6%, #fff 77.7%, #041B27 77.7%, #041B27 88.8%, #fff 88.8%);

}
.indicator{
  transition: margin-left .5s ease-in-out;
  width:0.5em;
  height:0.5em;
}

.SwipeSubViewText{
  font-family: Montserrat;
  color:#fff;
  min-height:8vh;
  margin-left: 1em;
  display:table;
}

.SwipeSubViewDescription{
  font-weight:500;
  font-size:16px;
  display:table-cell;
  vertical-align: top;
}

.SwipeSubViewDesignation{
  font-weight:bold;
  font-size:24px;
  display:table-cell;
  vertical-align: bottom;
}

.SwipeSubViewContainer{
  transition: margin-left .5s ease-in-out;
  width:100%;
  position:absolute;
  top: 1vh;
  left: 0;

}

.unmarkable{
  -webkit-user-select: none;
  -moz-user-select: -moz-none;
  -ms-user-select: none;
  user-select: none;
}


.SuccessSloganText{
  display:table-cell;
  vertical-align:middle;
  padding-left: 15px;
  padding-right: 15px;
}

.SuccessDescriptionText{
  padding-left: 3%;
  padding-right: 3%;
  padding-top:1em;
  padding-bottom:1em;
  text-align:left;
  vertical-align: middle;
  margin:auto;
  max-width:30em;
  height:100%;
  display:table;
}

.MeetingImageContainer{
  max-width:120vh;
  width:100vw;
  height: 60vh;
  background: url('/wp-content/themes/bs-theme/img/Meeting.png') no-repeat left top; 
  background-size: 100% auto !important;
  float:right;

}
.MeetingImageAlign{
  position:relative;
  /*min-width:120vh;*/
  width:100%;
  margin-right:35vh;
  margin-left:auto;
  height: 60vh;
  /*top:70vh;*/
  z-index:14;
}

.IC-InNumbers{
  width:35vh;
  max-width:50vw;
  height:100%;
  position:absolute;
  top:0;
  text-align:center;
}
.IC-InNumbersContainer{
  position:absolute;
  right:0;
  bottom:0;
  width:100%;
  max-width:70vh;
  height:100%;
  z-index:15;
  
}
.IC-InNumbersText{
  color:#fff ;
  font-family: Montserrat;
  font-weight: Bold;
  display:block;

}
.IC-CustomerContainer{
  height: 100%;
  display:inline-table;
  padding-left:15px;
  padding-right:15px;
  width:36vh;
  position:relative;
  overflow:hidden;
}

.IC-CustomerContainer:hover .IC-CustomerText{
  color: #00b4f4;
}

.IC-CustomerContainer:hover .IC-CustomerBlock{
  filter: grayscale(0%);
}

.IC-CustomerBlock{
  background-size: contain !important;
  filter: grayscale(100%);
  height:100%;
  max-height: 35vh;
  width: 100%;
  cursor: pointer;
  position:absolute;
}


.IC-CustomerText{
  margin-top: 10px;
  font-weight: Bold;
  font-size: 1em;
  cursor: pointer;
  position: absolute;
  top: 35vh;
  text-align: center;
  width: 100%;
}

.IC-CustomerText:hover{
  color: #00b4f4;
}

.IC-CustomerBlock:hover{
  filter: grayscale(0%);
}



