body {
    margin: 0 auto;
    font-family: Montserrat;
}

#warning-message {
    display: none;
    width: 100%;
}

#warning-message h1 {
    font-family: Montserrat, sans-serif;
    font-size: 5vw;
    line-height: 6vw;
    margin-top: 6vw;
    text-align: center;
    color: #3F4A8C;
}

#trl-container {
    width: 99%;
}

@media only screen and (orientation:portrait) {
    #trl-container {
        display: none;
    }
    #warning-message {
        display: block;
    }
}

@media only screen and (orientation:landscape) {
    #warning-message {
        display: none;
    }
}

#gradient {
    position: absolute;
    width: 99vw;
    height: 162.5vw;
    left: 0vw;
    top: 0vw;
    background: linear-gradient(180deg, #F7FAFC -6.31%, #B6D7E5 43.14%, #206574 87.69%);
    z-index: -999;
}

#gradient14 {
    position: absolute;
    width: 99vw;
    height: 187.135vw;
    left: 0;
    top: 0;
    background: linear-gradient(180deg, #F7FAFC -6.31%, #B6D7E5 43.14%, #206574 87.69%);
    z-index: -999;
}

#gradient12 {
    position: absolute;
    width: 99vw;
    height: 150.781vw;
    left: 0;
    top: 0;
    background: linear-gradient(180deg, #F7FAFC -6.31%, #B6D7E5 43.14%, #206574 87.69%);
    z-index: -999;
}

#gradient06 {
    position: absolute;
    width: 99vw;
    height: 65.885vw;
    left: 0;
    top: 0;
    background: linear-gradient(180deg, #F7FAFC -6.31%, #B6D7E5 43.14%, #206574 87.69%);
    z-index: -999;
}

#gradient02 {
    position: absolute;
    width: 99vw;
    height: 178.906vw;
    left: 0;
    top: 0;
    background: linear-gradient(180deg, #F7FAFC -6.31%, #B6D7E5 43.14%, #206574 87.69%);
    z-index: -999;
}

#gradient07 {
    position: absolute;
    width: 99vw;
    height: 56.3vw;
    left: 0;
    top: 0;
    background: linear-gradient(180deg, #F7FAFC -6.31%, #B6D7E5 43.14%, #206574 87.69%);
    z-index: -999;
}

#gradient08 {
    position: absolute;
    width: 99vw;
    height: 88.18vw;
    left: 0;
    top: 0;
    background: linear-gradient(180deg, #F7FAFC -6.31%, #B6D7E5 43.14%, #206574 87.69%);
    z-index: -999;
}

#background-gray {
    position: absolute;
    width: 99vw;
    height: 78.646vw;
    left: 0vw;
    top: 162.5vw;
    background: #E4EAF1;
    z-index: -998;
}

.container {
    width: 83%;
    margin: 0 auto;
}

#header {
    margin-top: 3.125vw;
}

#logo {
    float: right;
}

#figure1 {
    position: absolute;
    top: 5.417vw;
    left: 28.438vw;
}

.colored-msg {
    background: #CB922B;
}

.white-txt {
    font-style: normal;
    font-weight: bold;
    font-size: 2.292vw;
    line-height: 2.5vw;
    letter-spacing: -0.07vw;
    font-feature-settings: 'case' on;
    color: #FFFFFF;
}

.white-txt span {
    position: relative;
    font-size: 1.51vw;
    line-height: 1.25vw;
    top: -0.521vw;
    left: 0.208vw;
}

#colored-msg-1 {
    margin-top: 33.75vw;
}

#container-msg-1 {
    padding-top: 5vw;
    padding-bottom: 3.385vw;
    width: 88%;
}

#container-msg-1 span {
    position: relative;
    font-size: 1.4vw;
    line-height: 1.20vw;
    top: -0.521vw;
    left: 0.208vw;
}

h1 {
    font-style: normal;
    font-weight: bold;
    font-size: 2.813vw;
    line-height: 110%;
    /* or 3.073vw */
    letter-spacing: -0.07vw;
    color: #1C2958;
    margin-top: 2.552vw;
    margin-bottom: 0vw;
}

h2 {
    font-style: normal;
    font-weight: normal;
    font-size: 2.292vw;
    line-height: 110%;
    /* or 2.5vw */
    letter-spacing: -0.07vw;
    color: #1C2958;
    margin-top: 0.833vw;
}

.card {
    width: 57.865vw;
    height: 26.042vw;
    background: #E3E9EB;
    box-shadow: inset 0vw 0.208vw 0vw rgb(255 255 255 / 30%), 0vw 0.208vw 0vw rgb(0 0 0 / 30%);
    border-radius: 1.563vw;
    margin-bottom: 1.823vw;
}

.card-right {
    float: right;
}

.card-portrait {
    position: relative;
    left: 3.594vw;
    top: 1.771vw;
}

#card-portrait-2 {
    left: 4.479vw;
    top: 3.125vw;
}

.card-h1 {
    position: relative;
    left: 24.219vw;
    top: -17.5vw;
    width: 29.271vw;
    height: 4.167vw;
    background: #CB922B;
    border-radius: 4.688vw;
    font-style: normal;
    font-weight: 600;
    font-size: 2.292vw;
    line-height: 4.167vw;
    letter-spacing: -0.07vw;
    text-decoration-line: underline;
    color: #FFFFFF;
    text-align: center;
}

#card-h1-2 {
    left: 21.51vw;
    top: -18.646vw;
    width: 20.052vw;
}

.card-p {
    position: relative;
    width: 36.458vw;
    left: 26.302vw;
    top: -15vw;
    font-style: normal;
    font-weight: normal;
    font-size: 1.667vw;
    line-height: 1.823vw;
    letter-spacing: -0.07vw;
    color: #1C2958;
}

#card-p-2 {
    left: 21.823vw;
    top: -16.406vw;
}

.card-p span {
    position: relative;
    font-size: 0.938vw;
    top: -0.625vw;
    left: 0.156vw;
}

.clearFix {
    clear: both;
}

#text-1 {
    padding-top: 2.813vw;
}

#text-2 {
    padding-top: 5.677vw;
    padding-bottom: 3.125vw;
}

.big-white-txt {
    font-size: 2.813vw
}

#molec-big {
    float: left;
    width: 22.5%;
    text-align: center;
}

#molec-big-txt {
    width: 14.167vw;
    height: 3.073vw;
    background: #1C2958;
    border-radius: 4.688vw;
    margin: 0 auto;
    text-align: center;
    font-style: normal;
    font-weight: bold;
    font-size: 1.719vw;
    line-height: 3.021vw;
    letter-spacing: -0.07vw;
    color: #FFFFFF;
}

#molec-smalls {
    position: absolute;
    width: 0;
    height: 0;
}

.molec-small {
    position: absolute;
    text-align: center;
}

#molec-small-1 {
    left: 20.6vw;
}

#molec-small-2 {
    left: 41.475vw;
}

#molec-small-3 {
    left: 64.5vw;
}

.molec-txt {
    text-align: center;
}

.molec-txt-p {
    margin-top: 0.938vw;
    margin-bottom: 3.281vw;
}

#molec-txt-oneline {
    margin-top: 2.5vw;
    margin-bottom: 4.219vw;
}

.molec-smalltxt {
    font-style: normal;
    font-weight: normal;
    font-size: 1.146vw;
    line-height: 110%;
    text-align: center;
    letter-spacing: -0.07vw;
    color: #1C2958;
}

.molec-smalltxt span {
    position: relative;
    font-size: 0.729vw;
    top: -0.208vw;
    left: 0.156vw;
}

.brown-colored-text {
    width: 66.354vw;
    height: 8.021vw;
    background: #CB922B;
    border-radius: 4.688vw;
    margin: 3.542vw auto;
}

.brown-colored-text p {
    position: relative;
    top: 1.354vw;
    font-style: normal;
    font-weight: 600;
    font-size: 2.292vw;
    line-height: 2.5vw;
    text-align: center;
    letter-spacing: -0.07vw;
    color: #FFFFFF;
}

#text-3 {
    font-style: normal;
    font-weight: bold;
    font-size: 2.292vw;
    line-height: 2.5vw;
    letter-spacing: -0.07vw;
    color: #1C2958;
    margin: 5.208vw auto;
}

#text-3 span {
    position: relative;
    font-size: 1.302vw;
    top: -1vw;
    left: 0.2vw;
}

#text-4 {
    font-style: normal;
    font-weight: bold;
    font-size: 2.813vw;
    line-height: 3.073vw;
    letter-spacing: -0.07vw;
    color: #1C2958;
    margin-top: 10.521vw;
    margin-bottom: 1.563vw;
}

#text-4 span {
    position: relative;
    font-size: 1.302vw;
    top: -1.406vw;
    left: 0.313vw;
}

#conveniently-simple {
    width: 64%;
    text-align: center;
}

#inhaler-instr {
    margin-top: 1.563vw;
}

#conveniently-simple p {
    word-spacing: 3.333vw;
    font-style: normal;
    font-weight: bold;
    font-size: 2.292vw;
    line-height: 2.5vw;
    text-align: center;
    letter-spacing: -0.07vw;
    color: #FFFFFF;
    margin-top: 1.563vw;
    padding-bottom: 2.188vw;
}

#inhaler {
    position: relative;
    width: 0;
    height: 0;
}

#inhaler img {
    position: absolute;
    width: 42.188vw;
    height: 44.219vw;
    top: -41.667vw;
    left: 51.563vw;
}

#footer-buttons {
    padding-top: 5.417vw;
}

.colored-round-msg {
    width: 73.333vw;
    height: 4.167vw;
    background: #1C2958;
    border-radius: 4.688vw;
    margin: 0 auto;
    text-align: center;
}

.brown {
    background: #CB922B;
}

.colored-round-msg p {
    font-style: normal;
    font-weight: 600;
    font-size: 2.292vw;
    line-height: 4.167vw;
    text-align: center;
    letter-spacing: -0.07vw;
    color: #FFFFFF;
    margin: 1.25vw auto;
}

#postscriptum {
    padding-top: 0.938vw;
    padding-bottom: 5.208vw;
    font-style: normal;
    font-weight: normal;
    font-size: 1.042vw;
    line-height: 1.2vw;
    letter-spacing: -0.07vw;
    color: #1C2958;
}

/* --------------- */

/* --- PAGE 14 --- */

/* --------------- */

#figure1-2 {
    position: absolute;
    top: 9.517vw;
    left: 16.138vw;
    z-index: 2;
}

#breathe {
    position: absolute;
    left: 13.698vw;
    top: 30.625vw;
    z-index: 1;
}

#colored-msg-2 {
    margin-top: 41.65vw;
    margin-bottom: 5vw;
}

#container-msg-2 {
    padding-top: 2vw;
    padding-bottom: 1.885vw;
    font-size: 2.813vw;
    line-height: 3.073vw;
    letter-spacing: -0.07vw;
}

#colored-msg-3 {
    margin-top: 7.65vw;
    margin-bottom: 2.188vw;
}

#container-msg-3 {
    padding-top: 2vw;
    padding-bottom: 2.785vw;
    font-size: 2.813vw;
    line-height: 3.073vw;
    letter-spacing: -0.07vw;
}

#container-msg-3 span {
    font-size: 1.65vw;
    top: -0.921vw;
    left: 0.408vw;
}

.card-14 {
    height: 19.375vw;
    margin-bottom: 2.23vw;
}

.card-h1-14 {
    width: 46.875vw;
    font-style: normal;
    font-weight: bold;
    font-size: 2.292vw;
    line-height: 2.5vw;
    letter-spacing: -0.07vw;
    color: #CB922B;
    margin-bottom: 1.96vw;
}

.card-content {
    padding: 2.031vw 0 0 3.229vw;
}

.card-14-diagram {
    float: left;
    /*width: 15.938vw;*/
}

.card-14-diagram-text {
    font-style: normal;
    font-weight: 400;
    font-size: 1.354vw;
    line-height: 2.188vw;
    letter-spacing: -0.07vw;
    color: #1C2958;
    padding-left: 17.083vw;
}

.card-14-span-h {
    font-style: normal;
    font-weight: 700;
    font-size: 4.271vw;
    line-height: 3.021vw;
    letter-spacing: -0.07vw;
    color: #1C2958;
}

.card-14-span-upper {
    position: relative;
    font-size: 0.938vw;
    top: -0.417vw;
    left: 0.365vw;
}

.card-14-span-lower {
    position: relative;
    font-size: 0.938vw;
    top: 0.208vw;
    left: 0.052vw;
}

.card-14-diagram img {
    position: relative;
    z-index: 2;
}

.column {
    position: relative;
    height: 3.906vw;
    left: 4.219vw;
    top: -8.698vw;
}

.column-blue {
    width: 11.667vw;
    background: #19234E;
}

.column-gray {
    width: 6.979vw;
    top: -8.073vw;
    background: #96A1A9;
}

#figure4 {
    width: 0;
    height: 0;
}

#figure4 img {
    position: relative;
    width: 31.25vw;
    height: 54.74vw;
    left: 4.01vw;
    top: -3.906vw;
}

#text-5 {
    font-style: normal;
    font-weight: normal;
    font-size: 2.031vw;
    line-height: 2.24vw;
    letter-spacing: -0.07vw;
    color: #FFFFFF;
    margin-bottom: 2.708vw;
}

.colored-round-msg-14 p {
    font-weight: 600;
    font-size: 2.031vw;
}

.circuit-text {
    font-style: normal;
    font-weight: 400;
    font-size: 2.031vw;
    line-height: 2.188vw;
    text-align: center;
    letter-spacing: -0.07vw;
    color: #FFFFFF;
}

.circuit-text b {
    font-style: normal;
    font-weight: 700;
    font-size: 2.813vw;
    line-height: 3.073vw;
    text-align: center;
    letter-spacing: -0.07vw;
    color: #FFFFFF;
}

#circuit-text-center {
    margin-bottom: 13.75vw;
}

#circuit-text-left {
    text-align: right;
    float: left;
}

#circuit-text-right {
    text-align: left;
    float: right;
}

#circuit-img {
    width: 0;
    height: 0;
}

#circuit-img img {
    position: absolute;
    width: 31.563vw;
    height: 30.625vw;
    left: 34vw;
    top: -11.875vw;
}

#text-6 {
    font-style: normal;
    font-weight: normal;
    font-size: 1.458vw;
    line-height: 1.615vw;
    text-align: center;
    letter-spacing: -0.07vw;
    color: #FFFFFF;
    margin-top: 11.354vw;
    margin-bottom: 4.792vw;
}

#footer-buttons-14 {
    padding-bottom: 1.042vw;
}

/* --------------- */

/* --- PAGE 12 --- */

/* --------------- */

.trelegy-h1 {
    font-style: normal;
    font-weight: bold;
    font-size: 2.813vw;
    line-height: 3.021vw;
    letter-spacing: -0.07vw;
    color: #1C2958;
    padding-top: 2.188vw;
}

.trelegy-h1-2 {
    font-size: 1.875vw;
    padding-top: 0.938vw;
}

.trelegy-h1-2 span {
    position: relative;
    top: -1.198vw;
    left: 0;
    font-size: 1.042vw;
}

#headers-12 {
    padding-bottom: 2.135vw;
}

#headers-12-2 {
    padding-top: 1.719vw;
    padding-bottom: 2.135vw;
}

#footer-buttons-12 {
    padding-top: 7.9vw;
    padding-bottom: 1.34vw;
}

/* --------------- */

/* --- PAGE 06 --- */

/* --------------- */

#footer-buttons-06 {
    padding-top: 5.9vw;
    padding-bottom: 3.35vw;
}

/* --------------- */

/* --- PAGE 02 --- */

/* --------------- */

.relative {
    position: relative;
}

#figure5 {
    z-index: -9;
}

#figure5 img {
    position: absolute;
    left: 35.417vw;
    top: 13.073vw;
}

.card-02-diagram {
    float: left;
    padding: 1.25vw;
}

.card-02-diagram-text {
    padding-left: 12.9vw;
}

.card-02-diagram-text-2 {
    width: 37%;
    float: left;
    padding-left: 2.6vw;
}

.card-02-diagram-text-3 {
    width: 38%;
    float: right;
    padding-left: 0;
}

.card-02-span-upper {
    left: 0;
}

.card-02-paragraph {
    padding-bottom: 0.938vw;
}

.card-02-p-line-height {
    line-height: 1.458vw;
}

.card-h1-02 {
    margin-bottom: 1vw;
}

.card-02-lifelungspadding {
    padding-top: 1.458vw;
}

#text-7 {
    font-style: normal;
    font-weight: bold;
    font-size: 2.813vw;
    line-height: 3.073vw;
    text-align: center;
    letter-spacing: -0.07vw;
    color: #1C2958;
    padding-top: 2.7vw;
    padding-bottom: 0.6vw;
}

#figure6 img {
    position: absolute;
    top: 62.5vw;
    left: 57.3vw;
}

/* --------------- */

/* --- PAGE 07 --- */

/* --------------- */

.header07 {
    font-style: normal;
    font-weight: bold;
    font-size: 2.292vw;
    line-height: 2.5vw;
    letter-spacing: -0.07vw;
    text-transform: uppercase;
    color: #1C2958;
    padding: 1.563vw 0;
}

.sfl-video-player {
    width: 69.531vw;
    height: 39.063vw;
}

video {
    width: 100%;
    height: auto;
}

#footer-buttons-07 {
    padding-top: 2.5vw;
    padding-bottom: 3.35vw;
}

#instruction {
    height: 68vw;
}

#instruction p {
    font-style: normal;
    font-weight: normal;
    font-size: 1.146vw;
    line-height: 1.25vw;
    text-align: justify;
    letter-spacing: -0.07vw;
    color: #1C2958;
    padding: 2.78vw;
}

.trl-button {
    cursor: pointer;
    user-select: none;
}

#warning-header {
    padding: 6vw;
}

#warning-container {
    text-align: center;
}