/* Fonts */


@font-face {
    font-family: 'firago-medium';   
    src: url('../../fonts/firago-medium.woff2') format('woff2'),
        url('../../fonts/firago-medium.woff') format('woff'),
        url('../../fonts/firago-medium.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'firago-regular';   
    src: url('../../fonts/firago-regular.woff2') format('woff2'),
        url('../../fonts/firago-regular.woff') format('woff'),
        url('../../fonts/firago-regular.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'firago-bold';   
    src: url('../../fonts/firago-bold.woff2') format('woff2'),
        url('../../fonts/firago-bold.woff') format('woff'),
        url('../../fonts/firago-bold.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'firago-semibold';   
    src: url('../../fonts/firago-semibold.woff2') format('woff2'),
        url('../../fonts/firago-semibold.woff') format('woff'),
        url('../../fonts/firago-semibold.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
  }
  
  
  
  
  
  /* Italic */
  
  @font-face {
    font-family: 'firago-bookitalic';   
    src: url('../../fonts/firago-bookitalic.woff2') format('woff2'),
        url('../../fonts/firago-bookitalic.woff') format('woff'),
        url('../../fonts/firago-bookitalic.ttf') format('truetype');
    font-weight: 10;
    font-style: normal;
  }
  
  
  
  @font-face {
    font-family: 'firago-mediumitalic';   
    src: url('../../fonts/firago-mediumitalic.woff2') format('woff2'),
        url('../../fonts/firago-mediumitalic.woff') format('woff'),
        url('../../fonts/firago-mediumitalic.ttf') format('truetype');
    font-weight: 10;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'firago-mediumitalic';   
    src: url('../../fonts/firago-mediumitalic.woff2') format('woff2'),
        url('../../fonts/firago-mediumitalic.woff') format('woff'),
        url('../../fonts/firago-mediumitalic.ttf') format('truetype');
    font-weight: 10;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'firago-bolditalic';   
    src: url('../../fonts/firago-bolditalic.woff2') format('woff2'),
        url('../../fonts/firago-bolditalic.woff') format('woff'),
        url('../../fonts/firago-bolditalic.ttf') format('truetype');
    font-weight: 10;
    font-style: normal;
  }
  
  @font-face {
    font-family: 'firago-heavyitalic';   
    src: url('../../fonts/firago-heavyitalic.woff2') format('woff2'),
        url('../../fonts/firago-heavyitalic.woff') format('woff'),
        url('../../fonts/firago-heavyitalic.ttf') format('truetype');
    
    font-style: normal;
  }
  
  @font-face {
    font-family: 'firago-extrabolditalic';   
    src: url('../../fonts/firago-extrabolditalic.woff2') format('woff2'),
        url('../../fonts/firago-extrabolditalic.woff') format('woff'),
        url('../../fonts/firago-extrabolditalic.ttf') format('truetype');
    font-weight: 10;
    font-style: normal;
  }
  

html, body {
    padding: 15px 80px;
    background-color: #301c88;
    font-feature-settings: "case" on;
}






.maintitle {
    font-family: 'firago-bolditalic';
    text-align: center;
    font-size: 30px;
    padding-top: 5px;
    padding-bottom: 20px;
    color: #38deb3;
}


.maintext {
    font-family: 'firago-mediumitalic';
    color: #f7f7f7;
    opacity: 80%;
    font-size: 16px;
}


.paragraph-title {
    font-family: 'firago-mediumitalic';
    color: #f7f7f7;
    font-size: 19px;
}


.one {

margin-bottom: 40px;

}

.paragraph-title1 {
    font-family: 'firago-mediumitalic';
    color: #f7f7f7;
    font-size: 15px;
}



.paragraph-text {
    font-family: 'firago-bookitalic';
    color: #f7f7f7;
    opacity: 80%;
    font-size: 16px;
}


.logo {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 13%;
    position: relative;
}


@media (pointer: coarse), (hover: none), (hover: on-demand) {

    html, body {
        padding: 40px 45px;
    }

    .logo {
        width: 40%;
    }

    .maintitle {
        padding-top: 40px;
        padding-bottom: 35px;
    }


    .paragraph-title {
        font-size: 16px;
        padding-top: 25px;
        padding-bottom: 25px;
    }

    .maintext, .paragraph-text {
        font-size: 14px;
    }


}