:root {
 --red: #E50043;
 --Headgray: #425159;
 --lightgray: #CFD3D5;
 --DarkGray: #2C373D;
}


/* montserrat-100 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/montserrat-v26-latin-100.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-100.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-100.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-100.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-100.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-100italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 100;
  src: url('../fonts/montserrat-v26-latin-100italic.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-100italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-100italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-100italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-100italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-100italic.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 200;
  src: url('../fonts/montserrat-v26-latin-200.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-200.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-200.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-200.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-200.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-200italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 200;
  src: url('../fonts/montserrat-v26-latin-200italic.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-200italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-200italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-200italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-200italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-200italic.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/montserrat-v26-latin-300.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-300.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-300.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-300.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 300;
  src: url('../fonts/montserrat-v26-latin-300italic.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-300italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-300italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-300italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-300italic.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/montserrat-v26-latin-regular.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-regular.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/montserrat-v26-latin-italic.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-italic.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/montserrat-v26-latin-500.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-500.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-500.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-500.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 500;
  src: url('../fonts/montserrat-v26-latin-500italic.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-500italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-500italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-500italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-500italic.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/montserrat-v26-latin-600.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-600.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-600.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-600.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-600italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 600;
  src: url('../fonts/montserrat-v26-latin-600italic.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-600italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-600italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-600italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-600italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-600italic.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/montserrat-v26-latin-700.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-700.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/montserrat-v26-latin-700italic.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-700italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-700italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-700italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-700italic.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/montserrat-v26-latin-800.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-800.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-800.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-800.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-800.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-800italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 800;
  src: url('../fonts/montserrat-v26-latin-800italic.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-800italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-800italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-800italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-800italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-800italic.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/montserrat-v26-latin-900.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-900.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-900.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-900.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-900.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/* montserrat-900italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Montserrat';
  font-style: italic;
  font-weight: 900;
  src: url('../fonts/montserrat-v26-latin-900italic.eot'); /* IE9 Compat Modes */
  src: url('../fonts/montserrat-v26-latin-900italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v26-latin-900italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/montserrat-v26-latin-900italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/montserrat-v26-latin-900italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/montserrat-v26-latin-900italic.svg#Montserrat') format('svg'); /* Legacy iOS */
}







html {
  scroll-behavior: smooth;
}


* {
  
  box-sizing: border-box;
  font-family:  Montserrat , Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif; 
  
  }


body{
  color: var(--Headgray);
  font-size: 14px;
  background-color: white;
  font-family:  Montserrat , Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif; 
  line-height: 1.2rem;
}


h1{

  font-size: 2rem;
  line-height: 3rem;
}


h2{
  font-weight: bold;
  font-size: 1.6rem;
  color: var(--red);
  text-transform: uppercase;
  padding-bottom: 25px;
  line-height: 2.5rem;
}

h3{
  font-weight: bold;
  font-size: 1rem;
  color: var(--red);
  text-transform: uppercase;
  padding-bottom: 20px;
}

h4{
  font-weight: bold;
  font-size: 1.3rem;
  color: black;
  
  padding-bottom: 20px;
}

h4 a{
  font-weight: bold;
 
  color: var(--DarkGray);
  text-decoration: none;
  padding-bottom: 20px;
}


.headerH2{
  font-weight: bold;
  font-size: 4rem;
  color: var(--red);
  text-transform: uppercase;
  padding-bottom: 25px;
  line-height: 4.5rem;
}

.headerH1{

  font-size: 1.5rem !important;
  line-height: 3rem;
  font-style: italic;
}

.headerH3{
  font-weight: bold;
  font-size: 1.8rem;
  color: var(--red);
  text-transform: uppercase;
  padding-bottom: 20px;
}

.accoImage{
 border-radius: 18px ;
}

.centerContainer {
  position: relative;
  text-align: center;
  color: red;
  font-weight: bold;
  font-size: 3rem;
  line-height: 3.5rem;
}

/* Centered text */
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: var(--red); /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 10px; /* Rounded corners */
  font-size: 18px; /* Increase font size */
}



#myBtn:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}




/* Override UGG site */
#main {width: 100%; padding:0;}
.content-asset p {margin:0 auto;}
.breadcrumb {display:none;}

/* Helpers */
/**************************/
.margin-top-10 {padding-top:10px;}
.margin-bot-10 {padding-bottom:10px;}

/* Typography */
/**************************/

.sc {color: #3b8595;}
.ny {color: #3d3c3a;}
.atw {color: #c48660;}

/* Section - Title */
/**************************/
#parallax-world-of-ugg .title {background: white; padding: 60px; margin:0 auto; text-align:center;}
#parallax-world-of-ugg .title h1 {font-size:35px; letter-spacing:8px;}

/* Section - Block */
/**************************/
#parallax-world-of-ugg .block {background: white; padding: 60px; width:820px; margin:0 auto; text-align:justify;}
#parallax-world-of-ugg .block-gray {background: #f2f2f2;padding: 60px;}
#parallax-world-of-ugg .section-overlay-mask {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: black; opacity: 0.70;}

/* Section - Parallax */
/**************************/
#parallax-world-of-ugg .parallax-one {padding-top: 200px; padding-bottom: 200px; overflow: hidden; position: relative; width: 100%; background-image: url(https://futureworld.engineer/images/header/sunflower.webp); background-attachment: fixed; background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; background-repeat: no-repeat; background-position: top center;}
#parallax-world-of-ugg .parallax-two {padding-top: 200px; padding-bottom: 200px; overflow: hidden; position: relative; width: 100%; background-image: url(https://futureworld.engineer/images/header/sunflower.webp); background-attachment: fixed; background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; background-repeat: no-repeat; background-position: center center;}
#parallax-world-of-ugg .parallax-three {padding-top: 200px; padding-bottom: 200px; overflow: hidden; position: relative; width: 100%; background-image: url(https://futureworld.engineer/images/header/sunflower.webp); background-attachment: fixed; background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; background-repeat: no-repeat; background-position: center center;}

.appledevices{
	width: 100%;
	max-width: 600px; /* Optional, falls du eine Maximalbreite willst */
	margin: 0 auto;   /* Zentriert auf größeren Bildschirmen */
}

/* Extras */
/**************************/
#parallax-world-of-ugg .line-break {border-bottom:1px solid black; width: 150px; margin:0 auto;}

/* Media Queries */
/**************************/
@media screen and (max-width: 959px) and (min-width: 768px) {
  #parallax-world-of-ugg .block {padding: 40px; width:620px;}
}
@media screen and (max-width: 767px) {
  #parallax-world-of-ugg .block {padding: 30px; width:420px;}
  #parallax-world-of-ugg h2 {font-size:30px;}
  #parallax-world-of-ugg .block {padding: 30px;}
  #parallax-world-of-ugg .parallax-one, #parallax-world-of-ugg .parallax-two, #parallax-world-of-ugg .parallax-three {padding-top:100px; padding-bottom:100px;}
}
@media screen and (max-width: 479px) {
  #parallax-world-of-ugg .block {padding: 30px 15px; width:290px;}
}










.ReasonsTop{
  color: white; 
  text-align: center;
}
 
.ReasonIcon{
  width: 40%;
}



.myLi {
  margin: 0;
  padding: 14px 0 14px 45px !important;
  list-style: none;
  background-image: url("../images/feather/eye.svg");
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 25px;
}

.myContainer {

  background-image:url('../images/header/Header-MIT_simple.svg');
  background-size: cover;
}

.yt_box{
  position: relative;
  max-width: 700px; /* wie breit soll das Video maximal sein */
  margin: auto;
}
.yt_box:before{
  content: "";
  display: block;
  padding-top: 56%; /* 16:9 Format */
}
.yt_box iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;;
  left: 0;
  right: 0;
  bottom: 0;
}

.darkBackground{
  background-color: var(--DarkGray); 
  color: white;
}

.darkBackground h2{
  color: white;
}

.darkBackground h3{
  color: white;
}

.bg-light {
  --bs-bg-opacity: 1;
  background-color: var(--red)!important;
}

.navbar-nav {

    --bs-nav-link-padding-x: 0;
    --bs-nav-link-padding-y: 0.5rem;
    --bs-nav-link-font-weight: bold;
    --bs-nav-link-color: WHITE;
    --bs-nav-link-hover-color: var(--lightgray);
    --bs-nav-link-disabled-color: var(--bs-navbar-disabled-color);
    list-style: none;

}

.nav-link.active{
  color: white !Important;
  text-transform: uppercase;
}
.nav-link{
  color: white !Important;
  text-transform: uppercase;
}


.btn {
  --bs-btn-padding-x: 0.75rem;
  --bs-btn-padding-y: 0.375rem;
  --bs-btn-font-family: ;
  --bs-btn-font-size: 1rem;
  --bs-btn-font-weight: 400;
  --bs-btn-line-height: 1.5;
  --bs-btn-color: #212529;
  --bs-btn-bg: transparent;
  --bs-btn-border-width: 2px;
  --bs-btn-border-color: transparent;
  --bs-btn-border-radius: 0.375rem;
  --bs-btn-hover-border-color: transparent;
  --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15),0 1px 1px rgba(0, 0, 0, 0.075);
  --bs-btn-disabled-opacity: 0.65;
  --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);
  display: inline-block;
  padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
  font-family: var(--bs-btn-font-family);
  font-size: var(--bs-btn-font-size);
  font-weight: var(--bs-btn-font-weight);
  line-height: var(--bs-btn-line-height);
  color: var(--bs-btn-color);
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
  border-radius: var(--bs-btn-border-radius);
  background-color: var(--bs-btn-bg);
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.btn-equal-height {
        display: flex;
        align-items: center; /* Zentriert Text vertikal */
        justify-content: center; /* Zentriert Text horizontal */
        height: 100%;
        min-height: 48px; /* Optional: Mindesthöhe für eine schöne Optik */
    }
	
.btn-custom-flex {
        display: flex !important;
        align-items: center;      /* Vertikale Zentrierung */
        justify-content: center;   /* Horizontale Zentrierung */
        text-align: center;        /* Falls der Text umbricht */
        min-height: 48px;          /* Einheitliche Mindesthöhe */
        height: 100%;              /* Nimmt volle Höhe der Spalte ein */
        width: 100%;
        padding: 10px 15px;        /* Platz zum Rand */
        line-height: 1.2;          /* Schönerer Zeilenabstand bei Umbruch */
    }

    /* Entfernt Standard-Link-Unterstreichung im Button */
    .btn-custom-flex, .btn-custom-flex:hover {
        text-decoration: none;
        color: white; /* Oder deine gewünschte Textfarbe */
    }

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--red);
  --bs-btn-border-color: white;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--red);
  --bs-btn-hover-border-color: white;
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--red);
  --bs-btn-active-border-color: white;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--red);
  --bs-btn-disabled-border-color: white;
    border-radius: 20px;
	
}

button.btn-primary a{
  color: white !important;
  text-decoration: none;
 padding: 48px;
  
}

.btn-touch-optimized {
        display: flex !important;
        align-items: center;
        justify-content: center;
        min-height: 48px; /* Absolute Mindesthöhe für Google/Apple */
        padding: 12px 24px;
        width: 100%;
        text-align: center;
        text-decoration: none !important;
        /* Falls der Text im Button zu klein ist, hier mind. 16px nutzen */
        font-size: 16px; 
    }

    /* 2. Den Abstand zwischen den Zielen sicherstellen */
    .button-container {
        /* Erzeugt vertikalen Abstand, wenn die Spalten stapeln */
        margin-bottom: 16px; 
        /* Verhindert, dass die Buttons am Rand kleben */
        padding: 0 8px; 
    }

    /* Verhindert den Abstand beim letzten Element in der Reihe auf Mobile */
    @media (min-width: 768px) {
        .button-container {
            margin-bottom: 0;
        }
    }

.btn-primaryWB {
  --bs-btn-color: var(--red);
  --bs-btn-bg: white;
  --bs-btn-border-color: var(--red);
  --bs-btn-hover-color: var(--red);
  --bs-btn-hover-bg: white;
  --bs-btn-hover-border-color: var(--red);
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: var(--red);
  --bs-btn-active-bg: white;
  --bs-btn-active-border-color: var(--red);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--red);
  --bs-btn-disabled-bg: white;
  --bs-btn-disabled-border-color: var(--red);
    border-radius: 20px;
	padding: 48px;
	
}

button.btn.btn-primaryWB a{
	
}

.btn-primaryGr {
  --bs-btn-color: white;
  --bs-btn-bg: var(--DarkGray);
  --bs-btn-border-color: var(--DarkGray);
  --bs-btn-hover-color: white;
  --bs-btn-hover-bg: var(--DarkGray);
  --bs-btn-hover-border-color: var(--DarkGray);
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: white;
  --bs-btn-active-bg: var(--DarkGray);
  --bs-btn-active-border-color: var(--DarkGray);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: white;
  --bs-btn-disabled-bg: var(--DarkGray);
  --bs-btn-disabled-border-color: var(--DarkGray);
    border-radius: 20px;
	width: 100%;          /* Nimmt auf kleinen Displays den vollen Platz ein */
    max-width: 400px;     /* Hier stellst du deine gewünschte maximale Breite ein */
    min-height: 48px;     /* WICHTIG für den Fehler "Berührungszielbereiche" */
    display: inline-block;
}

button.btn.btn-primaryGr a{
  color: white;
  text-decoration: none;
  padding: 48px;
}


@media only screen and (max-device-width: 600px) {
      .show-mobile {
        display: block;
      }
      .hide-mobile {
        display: none;
      }
      .textPicRow {
        padding: 0px 0px 0px 0px !important;
      }
      .pictureLeft {
        padding: 0px 15px 0px 15px !important;
      }
      .firstRow {
        padding: 50px 10px 50px 10px !important;
      }
      .row {
        --bs-gutter-x: 0rem;
        --bs-gutter-y: 0;
      }
      .video-container{
       padding-bottom: 0px !important;
      }
      .video-container video{
       height: 100% !important;
       width: 100% !important;
      }
    }

 @media only screen and (min-device-width: 601px) {
      .show-mobile {
        display: none;
      }
      .hide-mobile {
        display: block;
      }

    }
  .video-container {
    position: relative;
}

.video-container video {
  width: 99%;
  height: 99%;
  position: absolute;
  object-fit: cover;
  z-index: 0;
}

/* Just styling the content of the div, the *magic* in the previous rules */
.video-container .caption {
  z-index: 1;
  position: relative;
  width: 100%;
  text-align: center;
  color: #dc0000;
  padding: 0px;
}


.container{
  background-color: white;
}




img.img-fluid{
  width: 100%;
}



.containerTab{
  border: 0px solid white;

  height: 400px;
  width: auto;
  border-radius:25px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/* Style the tab */
.tab {
  float: left;
  background-color: #f1f1f1;
  width: 30%;
  height: 400px;
  border-radius:25px 0px 0px 25px;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  display: block;
  background-color: inherit;
  color: black;
  padding: 22px 16px;
  height:80px;
  width: 100%;
  border: none;
  outline: none;
  cursor: pointer;
  transition: 0.3s;
  text-align:left;
  font-weight: bold;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current "tab button" class */
.tab button.active {
  background-color: white;
}

/* Style the tab content */
.tabcontent {
  float: left;
  padding: 20px 12px 12px 20px;
  width: 70%;
  height: 400px;
 
}

.fst_button{
border-radius: 25px 0px 0px 0px;
}
.lst_button{
border-radius: 0px 0px 0px 25px;
}

/* Accordion specific design*/
.accordion-header .collapsed{
  background : #eceeef;
}
.accordion-button:not(.collapsed){
  color: #212529;
  background : white;
}

.fst-accordion-button{
  border-radius: 25px 25px 0px 0px;
}
.lst-accordion-button{
  border-radius: 0px 0px 25px 25px;
}

.AccIcon{
  width: 20px !important;
}


/* Media query for switching to accordion layout -- DONT CHANGE THE PX, 1000px is intended! */
@media screen and (max-width: 1000px) {
  .containerTab {
    display: none;
  }
  .accordion {
    display: block;
  }  
}

@media screen and (min-width: 1001px) {
  .containerTab {
    display: block;
  }
  .accordion {
    display: none;
  }  
}

.myRow  {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) * .5);
  padding-left: 0px;
  margin-top: var(--bs-gutter-y);
  background-color: white;"
}

.sliderBackground{
  background-color: white !important;
  padding: 50px 0px 50px 0px;
}

.sliderImg{
  width: 100%;
    height: 100%;
    background-color: transparent;
    border-radius: 0px 0px 0px 0px;
  }

.sliderContainer{
    max-width: 800px;
    background-color: white;
    padding: 0;
}

.colBack{
    background-color: white;
}

.review{
    font-size: 14px;
    font-weight: 300;
    padding: 30px 0 ;
}

.name{
    font-size: 18px;
    color: #E50043;
    margin: 0;
}

.job{
    color: #595959;
    font-size: 14px;
}

.carousel-inner{
    max-width: 800px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.fa-minus {
    font-size: 14px;
}

.carousel-indicators {
    bottom: -20px;
    right: 0;
    margin: 0;
}

.carousel-indicators [data-bs-target ] {
    height: 10px;
    border: 2px solid #E50043;
    width: 10px;
    background-color: inherit;
    border-radius: 50%;
}

.carousel-indicators .active{
    border: 2px solid transparent;
    background-color:#E50043;
}



@media (max-width:560px) {
    .review{
        font-size: 14px;
        font-weight: 300;
    }
    .name{
        font-size: 13px;
    }
    .job{
        font-size: 10px;
    }
    .carousel-indicators [data-bs-target ] {
        height: 8px;
        border: 1px solid E50043;
        width: 8px;
        background-color: inherit;
        border-radius: 50%;
    }
    .carousel-indicators .active{
        border: 1px solid transparent;
        background-color:#E50043;
    }
}

.logoPara{
    padding-top: 30px;
}

.logoImg{
  padding-right: 15px;
  max-height: 60px;
}

.greyBox{
  background-color: #cdcdcd; 
  border-radius: 18px; 
  padding: 15px;
}

.whiteBoundingBox{
  padding-bottom: 15px
}

.card {
  --bs-card-spacer-y: 0rem;
  --bs-card-spacer-x: 1rem;
  --bs-card-title-spacer-y: 0.5rem;
  --bs-card-border-width: 0px;
  --bs-card-border-color: var(--bs-border-color-translucent);
  --bs-card-border-radius: 0.8rem;
  --bs-card-box-shadow: ;
  --bs-card-inner-border-radius: calc(0.375rem - 1px);
  --bs-card-cap-padding-y: 0.5rem;
  --bs-card-cap-padding-x: 1rem;
  --bs-card-cap-bg: rgba(0, 0, 0, 0.03);
  --bs-card-cap-color: ;
  --bs-card-height: ;
  --bs-card-color: #212529;
  --bs-card-bg: #fff;
  --bs-card-img-overlay-padding: 1rem;
  --bs-card-group-margin: 0.75rem;
  word-wrap: break-word;
}


.card-body {
  flex: 1 1 auto;
  padding: var(--bs-card-spacer-y) var(--bs-card-spacer-x);
  color: var(--bs-card-color);
  background-color: #f8f9fa;
  border-radius: 25px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.container{
  background-color: white;
}

.container-header{
  padding: 100px 0px 0px 0px;
}

.subHeader{
  font-weight: bold;
  font-size: 14px;
  color: var(--Headgray);
  line-height: 22px;
  text-transform: uppercase;;
}

.smallStrong{
  font-weight: bold;
  font-size: 14px;
  letter-spacing: 0px;
  line-height: 22px;
  color: var(--Headgray);
}

.firstRow{
  padding: 50px 0px 50px 0px;
}

.textPicRow{
  padding: 50px 50px 50px 50px;
}

.fluidPicCol{
  padding: 0px 0px 0px 0px;
}
@media only screen and (max-device-width: 768px ) {
  .fluidPicCol{
    padding: 0px 0px 20px 0px;
  }
}

.InfoContact{
  background-image: url( '../images/texturen/circuit-board.svg' );
  background-size: 300px;
  background-repeat: repeat;
  z-index: 0;
  padding: 50px 0px 50px 0px;
}

.navbar-collapse {
  flex-basis: 100%;
  flex-grow: 1;
  align-items: center;
  padding: 0px 0px 0px 150px;
}

ul.{
  list-style: none;
  counter-reset: my-counter;
  padding: 0;
  margin: 0;
}

.myli{
  list-style: none;
  border-top: 1px solid var(--lightgray);
  padding-top: 10px;
  margin-top: 10px;
  counter-increment: my-counter;
  padding-left: 30px;
  position: relative;
}

.myli:before {
  content: "0" counter(my-counter) ".";
  color: var(--red);
  position: absolute;
  left: 0;
}

html.fontawesome-i2svg-active.fontawesome-i2svg-complete body div.container.container-header div.row.firstRow div.col-md-12 div.row div.col-md-4 div.row div.col-md-12 ul li.smallStrong.myli a{
  color: var(--Headgray);
  text-decoration: none;
}

ul li.smallStrong.myli a{
  text-decoration: none;
  color: var(--Headgray);
}

.colCenter{
  text-align: center;
}

.rowSpacer{
  padding: 100px 0px 100px 0px;
}

.textStrong{
  font-weight: bold;

}

.textStrongFooter{
  font-weight: bold;
  color: white;
}

.align-items-center {
  align-items: center;
}

.pictureLeft{
  padding: 0px 0px 0px 50px;
}

.textBoldFooter{
  font-weight: bold;
  font-size: 20px;
}

.highlight{
  font-weight: bold;
  font-size: 1rem;
}

.highlightNumbers{
  font-weight: semi-bold;
  font-size: 1rem;
}

.highlightFooter{
  font-weight: bold;
  color: white;
}

.Semester1
{
background-image: url('https://futureworld.engineer/images/feather/share-2.svg');
background-repeat: no-repeat;
padding-left: 30px;  /* width of the image plus a little extra padding */
display: block;  /* may not need this, but I've found I do */
}

.textFooter{
  color: white;
}



.h2Footer{
  font-weight: bold;
  font-size: 1.6rem;
  color: white;
  line-height: 40px;
  text-transform: uppercase;
  padding-bottom: 50px;
}



.number{
  font-size: 3rem;
  font-weight: semi-bold;
  color: var(--Headgray);
}

a{
  color: var(--red);
}

a:hover{
  color: grey;
}

.redBGLink{
  color: white;
  text-decoration: none;
}

a.redBGLink:hover{
  color: var(--lightgray);
  text-decoration: none;
}

.myLinkDL:after {


  content: "";
  display: inline-block;
  width: 16px; /* Adjust the width and height to match the size of your image */
  height: 16px;
  background-image: url("../images/feather/download.svg"); /* Replace with the path to your image */
  background-size: contain;
  margin-left: 5px; /* Adjust the margin to add space between the link text and the image */
}

.myLinkExt:after {


  content: "";
  display: inline-block;
  width: 16px; /* Adjust the width and height to match the size of your image */
  height: 16px;
  background-image: url("../images/feather/external-link.svg"); /* Replace with the path to your image */
  background-size: contain;
  margin-left: 5px; /* Adjust the margin to add space between the link text and the image */
}


.greybg{
  background-color: rgb(211,211,211);
  color: var(--red);
  padding: 50px 50px 50px 50px !Important;
  text-align: center;
}

.redbg{
  background-color: var(--red);
  color: rgb(211,211,211);
  padding: 50px 50px 50px 50px !Important;
  text-align: center;
}

.redbg h1{
  color: white;
}



.myOuote{
  font-size: 1.5rem;
  font-weight: bold;
}

.myOuotePerson{
  font-size: 1.0rem;
  font-style: italic;
  font-weight: normal;
}

.myFooter{
  background-color: var(--red);
  /*background-image: url('../images/header/footer.jpg');*/
  background-position: top right;
  background-repeat: no-repeat;
  color: white;
  padding: 50px 0px 50px 0px;
  z-index: 999;
}


.myHeader{
  
  background-image: url('../images/header/Header-MIT_.jpg');
  background-position: bottom right;
  background-repeat: no-repeat;
  background-size: cover;
  color: white;
  padding: 50px 0px 50px 0px;
  z-index: 999;
}

.containerFooter{
  background-color: transparent;
  padding: 15px 15px 15px 15px;
}

.whiteLink a{
  color: white;
  text-decoration-line: none;
}

.whiteLink a:hover{
  color: grey;
  ext-decoration-line: none;
}

.video-container {
    position: relative;
    padding-top: 0;
    height: 100%;
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.graduationyear{
  font-weight: bold;
}

.button {
  display: inline-block;
  padding: 0.75rem 1.25rem;
  border-radius: 10rem;
  color: #fff;
  text-transform: uppercase;
  text-decoration: none;
  font-size: 1rem;
  letter-spacing: 0.15rem;
  transition: all 0.3s;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.button:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--red);
  border-radius: 10rem;
  z-index: -2;
}

.button:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  height: 100%;
  background-color: #999;
  transition: all 0.3s;
  border-radius: 10rem;
  z-index: -1;
}

.button:hover {
  color: #fff;
}

.button:hover:before {
  width: 100%;
}

.containerButton {
  padding-top: 20px;
  margin: 0 auto;
  text-decoration: none;
  width: 100%;
  text-align: center;
}

.row{
margin-right:0!important;
}
.container-fluid {
	padding-right:calc(var(--bs-gutter-x) * .5);
	
}

.img_header{
	border-radius:15%; /*rounded corners*/
width:100%;
}




/* Mobile */

@media only screen and (max-width: 768px) {

h1{

  font-size: 2rem;
  line-height: 3rem;
}


h2{
  font-weight: bold;
  font-size: 1.6rem !important;
  color: var(--red);
  text-transform: uppercase;
  padding-bottom: 25px;
  line-height: 2.0rem;
}

h3{
  font-weight: bold;
  font-size: 1rem;
  color: var(--red);
  text-transform: uppercase;
  padding-bottom: 20px;
}

h4{
  font-weight: bold;
  font-size: 1.3rem;
  color: black;
  
  padding-bottom: 20px;
}

h4 a{
  font-weight: bold;
 
  color: var(--DarkGray);
  text-decoration: none;
  padding-bottom: 20px;
}



  .headerH1{
    font-size: 12px !important;
    line-height: 1rem;
    font-style: italic;
  }
  .headerH2 {
    font-weight: bold;
    font-size: 0.8rem;
    color: var(--red);
    text-transform: uppercase;
    padding-bottom: 25px;
    line-height: 3.5rem;
  }
  .headerH3{
    font-weight: bold;
    font-size: 1.2rem;
    color: var(--red);
    text-transform: uppercase;
    padding-bottom: 20px;
  }
}

@media (max-width: 768px) {
  .appledevices {
    max-width: 100%;
    height: auto;
  }
}