@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Display:ital,wght@0,200;0,400;0,600;1,200;1,400;1,600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,200;0,400;0,600;1,200;1,400;1,600&display=swap');

:root {
    --darkBlue: rgb(51, 56, 113);
    --raspberry: rgb(191, 70, 102);
    --lightBlue: rgb(217, 233, 243);
    --mediumBlue: rgb(159, 196, 217);
    --sscBlue: rgb(95, 156, 192);
    --red: #F30000 ;
    --lightgreen: #20C997;
    --lightgreenHSL: hsl(162, 73%, 95%);
    --darkgreen: #41a19c;
    --limegreen: #b8cf5a;
    --teal: #78C1C2;
    --blue: #0854a0;
    --darkgrey: #666;
    --lightgrey-4: rgba(211, 211, 211, .4);
    --blackRGB: 0,0,0;
    --lightgreenRGB: 32, 201, 151;
    --dargreenRGB: 65,161,156;
    --limegreenRGB: 184,207,90;
    --tealRGB: 120,193,194;
    --blueRGB: 8,84,160;
    --category1: #0854a0;
    --category1RGB: 8,84,160;
    --category2: #b8cf5a;
    --category2RGB: 184,207,90;
}

body {
    font-family: 'Montserrat', Helvetica, sans-serif;
    font-weight: 400;
    color: var(--darkBlue);
}

#ssc header {
    position: relative;
}

#ssc #logo {
    display: block;
}

#ssc h2 {
    font-weight: 600;
    color: var(--sscBlue);
}

#ssc .bg1 {
    background-color: var(--lightBlue);
}

#ssc .bg2 {
    background-color: white;
}

#ssc .bg1, #ssc .bg2 {
    padding-top: 3rem;
    padding-bottom: 2rem;
}