@charset "UTF-8";
/* CSS Document */

:root {
	--primary-color-opacity: 228, 34, 78;
	--white-color: #fff;
	--black-color: #000;
	--gray-color: #aaa;
	--font-color: #222;
	--marker-color: var(--primary-color);
	--base-font-size: 1.8rem;
	/* 18px */
	--default-font-family: 'Roboto', Arial, Helvetica, sans-serif;
	--left-right-padding: 2rem;
	--mobile-left-right-padding: .5rem;
}
/* roboto-regular - latin */
@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 400;
	src: local(''),
		 url('../fonts/roboto-v30-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
         url('../fonts/roboto-v30-latin-regular.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
  /* roboto-700 - latin */
  @font-face {
	font-family: 'Roboto'; 
	font-style: normal;
	font-weight: 500;
	src: local(''),
		 url('../fonts/roboto-v30-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */
         url('../fonts/roboto-v30-latin-500.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  }
html {
  min-height: 100%;
  -webkit-text-size-adjust: none;
  box-sizing: border-box;
  font-size: 62%;
}
*, *::before, *::after {
  box-sizing: inherit;
}
* {
  margin: 0;
  padding: 0;
}
body {
  background-color: white;
}
img {
  border: 0;
  display: block;
  max-width: 100%;
  height: auto;
  image-rendering: -webkit-optimize-contrast;
}



/* ###### Background-Image und Wrapper-Hintergrund #################### */

body	{
		background-image:url("../images/wtv_bg_simulation.jpg");
		background-position:bottom;
		background-repeat:repeat-y;
		background-position:center;
		background-attachment:fixed;
		background-size:contain;
		background-size:cover;
		background-color: #f0f0f0;
		}



.container {
			background-color:#ffffff;
		}*/

/* ################################################*/





/* ################################# */
/* ################################# */

#company_logo {
    background: url("https://www.scheererservice.de/wtv_full_2024/logo/wtv_logo_150x150.jpg") no-repeat #efefef;     /*-----------------------SCHEERER------------------*/
}

/* ################################# */
/* ################################# */

#jobtitel{
  padding-inline: var(--left-right-padding);
}

/*JOBTITEL ####### */                                      /*-----------------------SCHEERER------------------*/       
h1 {
  font-size: 3.3rem;
	line-height: 3.7rem;
	margin-top: 1.3rem;
     padding-bottom:0;
    margin-bottom: 1rem;
    color: var(--primary-color);
}

small {
  font-size: 0.52em;
  font-weight: normal;
    line-height: 1.5rem;
}

h1, h2, b, strong {
  font-weight: 700;
}

h3 {
  font-size: 1.8rem;
	line-height: 2.4rem;
	font-weight: 500;
  margin-bottom: .5rem;
	  margin-top: .5rem;
	color: var(--white-color);
}

h3.black-color {
  font-size: 1.8rem;
	line-height: 2.4rem;
	font-weight: 500;
  margin-bottom: .5rem;
	  margin-top: .5rem;
   color: #000000;
}

h3.secondary-color {
  font-size: 1.8rem;
	line-height: 2.4rem;
	font-weight: 500;
  margin-bottom: .5rem;
	  margin-top: .5rem;
    color: var(--secondary-color);
}

/*DACH ####### */
h5 {                                                        /*-----------------------SCHEERER------------------*/                             
      font-size: 1em;
      line-height: 2.7rem;
      font-weight: bold;
      margin-top: 1.3rem;
    margin-bottom: -0.8rem;
	}

/*SUBLINE ####### */
h6 {                                                        /*-----------------------SCHEERER------------------*/                             
      font-size: 1em;
      line-height: 1.7rem;
      font-weight: normal;
    
      margin-bottom: 2.5rem;
	}

                                                              /*-----------------------SCHEERER------------------*/  

h2 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  font-size: 2.4rem;
  margin-top: 2.5rem;
  margin-bottom: 1rem;
  background-color: var(--primary-color);
  color: var(--white-color);
}

h2.ohneHintergrund    {
          padding-bottom: 0;
          font-size: 1.8rem;
          margin-top: 0.8rem;
          margin-bottom: -1.5rem;
          background-color: var(--white-color);
          color: var(--primary-color);
        }




/* ################################# */                   /*-----------------------SCHEERER------------------*/    
/* ################################# */
p {
    margin-top: 2.0rem;
}

.abstand    {
          margin-top: 0rem;
          padding-top: 0rem;
           }

ul {
    padding-top: 1.6rem;
}

.ul-ohne-abstand {
    padding-top: 0rem;
}


/* ################################# */                      
/* ################################# */

 

/* ################################# */
/* ################################# */


/* ################################# */
/* ################################# */

.user-data ul {
margin: .6em 0;
  padding: 0 0 0 2em;
    list-style: none;
  list-style-position: outside;
  list-style-image: none;
  list-style-type: none;
/*list-style-position: outside;*/	
}

.user-image{
width: 125px;
height: auto;
float: left;
padding-right: 15px;
	}

.user-image2{
width: 125px;
height: auto;
float: left;
 padding-right: 15px;
	}

.user-data {
height: 95px;
	}

user-data2 {
height: 95px;
	}


/* ################################# */
/* ################################# */


/*-----------------------SCHEERER------------------*/
/* ################################################                
#    SCHEERER - SIEGEL - Anfang   #
################################################ */                    

.certificat {
	display: flex;
    flex-wrap: wrap;
    margin: 0;
    margin-bottom: 2.0rem;
    }
.certificat > * {
  flex: 1 1 calc;
     }
    
.certificat img  {
	padding-top: 0.9em;
    padding-right: 1em;
    }

.accordion .certificat img  {
	padding-top: 0.2em;
    padding-right: 1em;
    }

/* ################################################
#    SCHEERER - SIEGEL - Ende   #
################################################ */


ul {
  margin: .5rem 0 2.5rem;
}
ul li {
  list-style-type: none;
  position: relative;
  left: 1em;
  margin-right: 1em;
  margin-bottom: .5rem;
}
ul li:last-child {
  margin-bottom: 0;
}
ul li::before {
  content: '\25CF'; /* ECKIGE BULLETS -> content: '\25A0'; */
  position: absolute;
  left: -1em;
  top: -2px;
  color: #000000;
}

ul.white li::before {
  color: #ffffff;
}

   /* eingerückte Liste################## */                           /*-----------------------SCHEERER------------------*/
ul ul {
  margin: 0;
    padding: 0;
    margin-bottom: .5rem;
    margin-left: 2rem;
    }
ul ul  li {
       
   margin: 0;
    padding: 0;
    margin-right: 2em;
   margin-bottom: .5rem;
}
ul ul li::before {
  content: '\25CB'; /* ECKIGE BULLETS -> content: '\25A1'; */
  }


/*Aufzählungsliste Karussel ######################*/          /*-----------------------SCHEERER---------------------------------------*/


.slider-content blockquote ol {
              font-size: 1.8rem;
              text-align: left;
              }

.slider-content-nurRahmen blockquote ol {
              font-size: 1.8rem;
              text-align: left;
              }

ol {
  margin: .5rem 0 2.5rem;
}

ol li {
    padding-left: 1em;
    /*font-weight: normal;*/
  }

ol li::after {
  content: '\25CF'; /* ECKIGE BULLETS -> content: '\25A0'; */
  position: absolute;
  left: 0;
  top: -2px;
            }







a {
  color: inherit;
  font-weight: inherit;
  text-decoration: none;
   color: var(--primary-color);

}
a:hover {
  text-decoration: underline;
}


.container {
  border: 1px solid var(--gray-color);
  margin: 0 auto;
  max-width: 765px;
  font-size: var(--base-font-size);
  line-height: 1.4;
  font-family: var(--default-font-family);
  color: var(--font-color);
  text-shadow: none;
  overflow: hidden;
	
}
.font-color {
	color: var(--font-color);
}
.primary-color {
	color: var(--primary-color);
}
.intro-title {
	font-weight: 700;
	font-size: 3rem;
	text-transform: uppercase;
	line-height: 1.1;
	margin-bottom: .5rem;
}
.intro {
	background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 50%, #e96a0a 50%, #e96a0a 100%);
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-block: 2rem;
	margin-bottom: 3rem;
}
.intro-text {
	flex: 0 0 35%;
   }
.intro-img {
	flex: 0 0 60%;
}
.title {
	margin-bottom: 2rem;
	color: var(--white-color);
}
.p-inline {
  padding-inline: var(--left-right-padding);
}
.full-width {
  margin-inline: calc(-1 * var(--left-right-padding));
}
.mobile {
  display: none;
}
.header {
  padding-top: 2rem;
  padding-bottom: 2rem;
  position: relative;
}
.title-block {
padding-top: 1.2rem;
padding-bottom: 0.7rem;
/*background: #536576;
background: linear-gradient(90deg, #49a6d380 50%, rgba(0, 0, 0, .0) 90%), url() right top/cover no-repeat;*/
background: var(--primary-color);
margin-bottom: 2rem;
margin-top: 0rem;
}

.logo {
  display: block;
  max-width: 600px;
}
.header .logo {
	max-height: 80px;
	width: auto;
}

/****** top slider css ******/


.slideshow-container {
	max-width: 1000px;
	position: relative;
	margin: auto;
	  overflow:hidden;
  }

  .slideshow-container > span {
	   position: absolute;

  }


  /* Next & previous buttons */
  .prev, .next {
	cursor: pointer;
	position: absolute;
	top: 50%;
	width: auto;
	padding: 16px;
	margin-top: -22px;
	color: white;
	font-weight: bold;
	font-size: 18px;
	transition: 0.6s ease;
	border-radius: 0 3px 3px 0;
  }

  /* Position the "next button" to the right */
  .next {
	right: 0;
	border-radius: 3px 0 0 3px;
  }

  /* On hover, add a black background color with a little bit see-through */
  .prev:hover, .next:hover {
	background-color: rgba(255,255,255,0.8); color:#fff;
	text-decoration: none;
  }

  /* Caption text */
  .text {
	color: #f2f2f2;
	font-size: 15px;
	padding: 8px 12px;
	position: absolute;
	bottom: 8px;
	width: 100%;
	text-align: center;
  }







  .content-java{
	width:100%;
	height:100%;
	position:absolute;



  }

  .content-java-text{
		width:330px;
	height:auto;
	float:right;
	position:relative;
	top:-150px;
	  margin-right:50px;
	  padding: 8px;
	  -webkit-animation-name: mymove; /* Safari 4.0 - 8.0 */
	  -webkit-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
	  -moz-animation-name: mymove; /* Safari 4.0 - 8.0 */
	  -moz-animation-duration: 1.5s; /* Safari 4.0 - 8.0 */
	  animation-name: mymove;
	  animation-duration: 1.5s;
	  font-family: 'Panton', sans-serif;
	  z-index:0;
	  background: rgba(var(--primary-color-opacity), .8);
	  padding: 6px;

  }

  /* Safari 4.0 - 8.0 */
  @-webkit-keyframes mymove {
	  from {right: -200px;}
	  to {right: 0;}
  }

  @keyframes mymove {
	  from {right: -200px;}
	  to {right: 0;}
  }

  .content-java-text h1{
	font-family: 'Panton', sans-serif;
	font-size:24px;
	color:#fff;
	text-align:left;
	margin-left:30px;
	padding-bottom:10px;
  }
  .content-java-text h2{
	font-family: 'Panton', sans-serif;
	font-weight:normal;
	font-size:16px;
	font-style:italic;
	color:#fff;
	font-weight: 700;
	text-align:left;
	margin: 0;
	margin-left:30px;
	background: none;
	padding: 0;
  }

  /* The dots/bullets/indicators */
  .dot {
	cursor: pointer;
	height: 10px;
	width: 10px;
	margin: 0 1px;
	background-color: #bbb;
	border-radius: 50%;
	display: inline-block;
	transition: background-color 0.6s ease;

  }


  .dot-abstand{margin-top:5px; margin-bottom: 2rem;}

  .active, .dot:hover {
	background-color: #717171;
  }










  /* Slider */
  #slider{
	width:100%;
	height:500px;
	position:relative;
	overflow:hidden;
  }
  @keyframes load{
	from{left:-100%;}
	to{left:0;}
  }
  .slides{
	width:400%;
	height:100%;
	position:relative;
	-webkit-animation:slide 30s infinite;
	-moz-animation:slide 30s infinite;
	animation:slide 30s infinite;
  }
  .slider{
	width:25%;
	height:100%;
	float:left;
	position:relative;
	z-index:1;
	overflow:hidden;
  }
  .slide img{
	width:100%;
	height:100%;
  }
  .slide img{
	width:100%;
	height:100%;
  }
  img.img-desktop {
	display: block;
  }
  img.img-mobile {
	display: none;
  }
  .image{
	width:100%;
	height:100%;
  }
  .image img{
	width:100%;
	height:100%;
  }


  /* Contents */
  .slideshow-container .content{
	width:100%;
	height:100%;
	position:absolute;
	overflow:hidden;

  }


  @media only all and (max-width:700px) {
   .er-fe .content-java-text,
   .er-be .content-java-text {
	width:76%;
	float: none;
	min-height:50px;
	top: auto;
	margin-right: 0;
	bottom:0;
	margin:0 auto;
	-webkit-animation:mymove 2.5s;
	-webkit-animation-fill-mode:forwards;
	-moz-animation:mymove 2.5s;
	-moz-animation-fill-mode:forwards;
	animation:mymove 2.5s;
	animation-fill-mode:forwards;
	font-family:'Panton',sans-serif;
	z-index:1000000;
	background-color: rgba(var(--primary-color-opacity), .8) ; /* primary color */
	padding:10px 2%;
   }
   @keyframes mymove {
	from {
	 top:0
	}
	to {
	  top:-110px
	}
   }

  }
/******** Top slider css end *******/



/*.content > h2:first-of-type {
  margin-top: 0;
  margin-bottom: 2rem;
}*/


.nobr, .nowrap {
  white-space: nowrap;
}
.cf::before, .cf::after {
  content: " ";
  display: table;
}
.cf::after {
  clear: both;
}
.container address {
  font-style: inherit;
}
ul.slider-without-numbers {
	left: 0;
	margin-left: 0;
    }

ul.slider-without-numbers li {
	left: 0;
	margin: 0;
}

ul.slider-without-numbers li::before {
	display: none;
    
}
.slider-without-numbers {
	margin-bottom: 4rem;
  cursor: w-resize;
  display: flex;
}
/* start of slider styles */
.slider {
	margin-top: 4rem;
  margin-bottom: 4rem;
  cursor: w-resize;
  display: flex;
  counter-reset: sliderItem;
}
.slider li {
  counter-increment: sliderItem;
  user-select: none;
}
.slide-number {
  width: 40px;
  height: 40px;
  color: black;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2rem;
  font-weight: 700;
  border-radius: 50%;
  background-color: #fff;
  margin: 1rem auto 0;
}
.slide-number::before {
  content: counter(sliderItem);
}
.slider-content {
          border: 1px solid var(--gray-color);
          height: 100%;
          background-color: var(--gray-color);
          font-weight: bold;
          text-align: center;
}
.tns-slide-active .slider-content {
  border: 1px solid var(--primary-color);
  height: 100%;
  background-color: var(--primary-color);
}

.slider-content img {
                                width: 100%;
                            }



.slider-content blockquote {
  padding: 1rem 4%;
  font-size: 1.6rem;
  color: var(--secondary-color);
  text-align: center;
}

.slider-content img {
                                width: 100%;
                            }

/*--------------------------*/
.slider-content-nurRahmen {
                    height: 100%;
                   border: 1px solid var(--primary-color);
                    -moz-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.20);
                    -webkit-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.20);
                    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.20);
                }

.slider-content-nurRahmen img {
                                width: 100%;
                            }


.slider-content-nurRahmen blockquote {
                                  padding: 1rem 4%;
                                  font-size: 1.6rem;
                                  color: #000000;
                                  text-align: center;
                                }
/*---------------------------------*/

.slider h3 {
  font-size: 1.8rem;
	  font-weight: bold;
  margin-bottom: 1rem;
  color: var(--white-color);
}

.tns-outer {
  position: relative;
}
.tns-controls button {
  position: absolute;
  bottom: -1.5rem;
  z-index: 1;
  border: none;
  width: 40px;
  height: 53px;
  background-color: transparent;
  transition: all .2s ease;
  font-size: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.tns-controls button:hover {
  transform: scale(1.5, 1.5);
}
.tns-controls button:disabled:hover {
  transform: none;
}
.tns-controls button:disabled {
  opacity: .3;
  cursor: inherit;
  font-size: 0;
}
.tns-controls button:first-child {
  left: calc(50% - 45px);
}
.tns-controls button:last-child {
  right: calc(50% - 45px);
}
.tns-controls button:first-child::before, .tns-controls button:last-child::before {
  position: absolute;
  left: 0;
  top: 0;
  color: var(--secondary-color);
}
.tns-controls button:first-child::before {
  content: '\276E';
  font-size: 4rem;
}
.tns-controls button:last-child::before {
  content: '\276F';
  font-size: 4rem;
}
/* end of slider styles */
.video-wrapper {
  margin-top: 1rem;
  margin-bottom: 2rem;
/*  background: url("https://www.scheererservice.de/wtv_full_2024/images/kunde_bg.jpg") left top/cover no-repeat;*/
  position: relative;
}
.video {
    position: relative;
    padding-bottom: 56.428%;
    overflow: hidden;
    width: 100%;
    font-family: "var(--default-font-family)";
}
.video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.firme-details {
  background-color: var(--secondary-color);
  color: var(--white-color);
  margin: 0 calc(-1 * var(--left-right-padding));
  padding: .5rem var(--left-right-padding);
  font-size: 1.5rem;
}
dl {
  padding: 1rem 0;
  color: var(--white-color);
  display: grid;
  grid-template-columns: repeat(2, auto);
}
dl > * {
  border-top: 1px solid white;
  padding: .5rem 0;
}
dl > :first-of-type {
  border-top: none;
	
}
dt {
  font-weight: bold;
}
dd {
  text-align: right;
	color: var(--white-color);
}

/*###########################################
#    SCHEERER - LINKFARBE FIRMENDETAILS  - Anfang   #
###########################################*/

dd a {
  text-align: right;
	color: var(--white-color);
/*	color: var(--primary-color);*/
	/*	color: var(--secondary-color);*/
}

/*###########################################
#    SCHEERER - LINKFARBE FIRMENDETAILS  - Ende   #
###########################################*/

.socIcons {
	display: flex;
    width: 200px;
    justify-content: space-between;
    align-items: center;
    margin-top: 1rem;
}
.socIcons_2x {
	width: 90px;
}

.socIcons_3x {
	width: 120px;
}
 
.socIcons_4x {
	width: 200px;
}

.socIcons_5x {
	width: 220px;
}

.socIcons_6x {
	width: 250px;
}   

.socIcons_7x {
	width: 300px;
}                                                                       /*-----------------------SCHEERER------------------*/
.socIcons a {
	width: 40px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.socIcons.white svg {
	width: 25px;
	height: 25px;
	fill: #ffffff;
}

.socIcons.black svg {
	width: 25px;
	height: 25px;
	fill: #000000;
}

.socIcons.primary-color svg {
	width: 25px;
	height: 25px;
	fill: var(--primary-color);
}

.socIcons.secondary-color svg {
	width: 25px;
	height: 25px;
	fill: var(--secondary-color);
}


                                                                     /*-----------------------SCHEERER------------------*/
.ueber-firmen.background-primary {
  background-color: var(--primary-color);
  margin-top: 2rem;
  margin-bottom: 3rem;
 padding-top: 1.1rem;
  padding-bottom: 2rem;
  color: var(--white-color);
}

.ueber-firmen.background-secondary {
  background-color: var(--secondary-color);
  margin-top: 2rem;
  margin-bottom: 3rem;
  padding-top: 1.1rem;
  padding-bottom: 2rem;
  color: var(--white-color);
}


.ueber-firmen.background-weiss {
  background-color: #ffffff;
  margin-top: 2rem;
  margin-bottom: 3rem;
 padding-top: 1.1rem;
  padding-bottom: 2rem;
  color: var(--font-color);
}

.ueber-firmen p:last-child {
  margin-bottom: 0;
}
.ueber-firmen h2 {
  padding: 0;
  margin: 0 0 2rem;
  background-color: transparent;
  color: inherit;
}
.ueber-firmen h3 {
  color: white;
  font-size: 2rem;
  margin-bottom: 1rem;
}
.accordion:not(:first-of-type) {
  border-top: 1px solid var(--white-color);
}
.accordion {
  padding: 1rem 0 -1rem 0;
}
.accordion:last-of-type {
  padding-bottom: 0;
}
details[open] summary {
  font-weight: 700;
}
details[open] summary ~ * {
  animation: open 0.3s ease-in-out;
}
@keyframes open {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
details summary::-webkit-details-marker {
  display: none;
}
details summary {
  width: 100%;
  padding: 0.5rem 0;
  position: relative;
  cursor: pointer;
  font-weight: 300;
  list-style: none;
}
.accordion-title {
  display: block;
  padding-right: 2rem;
}
details summary:after {
  content: "+";
  color: var(--white-color);
  position: absolute;
  line-height: 0;
  font-size: 3.6rem;
  top: 50%;
  transform: translateY(-50%);
  right: .5rem;
  transform-origin: center;
  transition: 200ms linear;
}

/*###########################################################
###########################################################*/
/*summary2 - Überschriften ohne farbigen Hintergrund*/



details.ohneHintergrund summary:after {
  content: "+";
  color: var(--primary-color);
  position: absolute;
  line-height: 0;
  font-size: 3.6rem;
  top: 50%;
  transform: translateY(-50%);
  right: .5rem;
  transform-origin: center;
  transition: 200ms linear;
}

/*###########################################################
###########################################################*/








details[open] summary:after {
  font-weight: 700;
  transform: rotate(45deg);
}
details summary {
  outline: 0;
}
details p {
  margin: 1rem 0 1.5rem !important;
}
#start {
  position: absolute;
  left: calc(50% - 80px);
  top: calc(50% - 80px);
  border-radius: 50%;
  border: 8px solid var(--white-color);
  width: 160px;
  height: 160px;
  z-index: 10;
  cursor: pointer;
  background-color: transparent;
  transition: all .15s ease-in-out;
}
#start:hover {
  transform: scale(1.2);
}
#start::after {
  content: '';
  position: absolute;
  left: 54%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 0;
  height: 0;
  border-top: 40px solid transparent;
  border-left: 74px solid var(--white-color);
  border-bottom: 40px solid transparent;
}
#map {
  height: 350px;
  margin-block: .5rem;
     margin-top: 0;
    margin-bottom: 2rem;
}
.map-marker-icon {
	position: relative;
}
.map-marker-icon::after {
	content: '';
	background: url("../images/marker-shadow.png") center center/cover no-repeat;
	position: absolute;
	left: -5px;
	bottom: 0;
	width: 60px;
	height: 60px;
	z-index: -1;
}
.map-marker-icon path {
	position: relative;
	fill:var(--marker-color);
  }
@media (max-width: 47.8125em), print {
  .container {
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    margin: auto;
  }
}
@media (max-width: 43.75em), print {
  .container {
    border: none;
  }
  .p-inline {
    padding-inline: var(--mobile-left-right-padding);
  }
  .full-width {
    margin-inline: calc(-1 * var(--mobile-left-right-padding));
  }
  .intro-title {
	font-weight: 700;
	font-size: 3rem;
	text-transform: uppercase;
	line-height: 1.1;
	margin-bottom: .5rem;
}
.intro {
	background: none;
	flex-direction: column;
	padding-block: 0;
	margin-bottom: 0;
}
.intro-text {
	flex: 1;
	order: 2;
}
.intro-img {
	flex: 1;
	order: 1;
	margin-bottom: 1.5rem;
}
h1 {
      font-size: 3.6rem;
  }
}
@media (max-width: 37.5em) {
  .mobile {
    display: block;
  }

}
@media (max-width: 31em) {

  .header {
    display: none;
  }
 dl {
    color: var(--white-color);
    display: grid;
    grid-template-columns: repeat(1, auto);
  }
  dt {
    padding-bottom: 0;
  }
  dd {
    border-top: none;
    text-align: left;
	      color: var(--white-color);

  }
	dd a {
  text-align: right;
	color: var(--white-color);
}
	
}
.tns-outer {
  padding: 0 !important
}
.tns-outer [hidden] {
  display: none !important
}
.tns-outer [aria-controls], .tns-outer [data-action] {
  cursor: pointer
}
.tns-slider {
  -webkit-transition: all 0s;
  -moz-transition: all 0s;
  transition: all 0s
}
.tns-slider > .tns-item {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}
.tns-horizontal.tns-subpixel {
  white-space: nowrap
}
.tns-horizontal.tns-subpixel > .tns-item {
  display: inline-block;
  vertical-align: top;
  white-space: normal
}
.tns-horizontal.tns-no-subpixel:after {
  content: '';
  display: table;
  clear: both
}
.tns-horizontal.tns-no-subpixel > .tns-item {
  float: left
}
.tns-horizontal.tns-carousel.tns-no-subpixel > .tns-item {
  margin-right: -100%
}
.tns-no-calc {
  position: relative;
  left: 0
}
.tns-gallery {
  position: relative;
  left: 0;
  min-height: 1px
}
.tns-gallery > .tns-item {
  position: absolute;
  left: -100%;
  -webkit-transition: transform 0s, opacity 0s;
  -moz-transition: transform 0s, opacity 0s;
  transition: transform 0s, opacity 0s
}
.tns-gallery > .tns-slide-active {
  position: relative;
  left: auto !important
}
.tns-gallery > .tns-moving {
  -webkit-transition: all 0.25s;
  -moz-transition: all 0.25s;
  transition: all 0.25s
}
.tns-autowidth {
  display: inline-block
}
.tns-lazy-img {
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  transition: opacity 0.6s;
  opacity: 0.6
}
.tns-lazy-img.tns-complete {
  opacity: 1
}
.tns-ah {
  -webkit-transition: height 0s;
  -moz-transition: height 0s;
  transition: height 0s
}
.tns-ovh {
  overflow: hidden
}
.tns-visually-hidden {
  position: absolute;
  left: -10000em
}
.tns-transparent {
  opacity: 0;
  visibility: hidden
}
.tns-fadeIn {
  opacity: 1;
  filter: alpha(opacity=100);
  z-index: 0
}
.tns-normal, .tns-fadeOut {
  opacity: 0;
  filter: alpha(opacity=0);
  z-index: -1
}
.tns-vpfix {
  white-space: nowrap
}
.tns-vpfix > div, .tns-vpfix > li {
  display: inline-block
}
.tns-t-subp2 {
  margin: 0 auto;
  width: 310px;
  position: relative;
  height: 10px;
  overflow: hidden
}
.tns-t-ct {
  width: 2333.3333333%;
  width: -webkit-calc(100% * 70 / 3);
  width: -moz-calc(100% * 70 / 3);
  width: calc(100% * 70 / 3);
  position: absolute;
  right: 0
}
.tns-t-ct:after {
  content: '';
  display: table;
  clear: both
}
.tns-t-ct > div {
  width: 1.4285714%;
  width: -webkit-calc(100% / 70);
  width: -moz-calc(100% / 70);
  width: calc(100% / 70);
  height: 10px;
  float: left
}