@import "tabs-color.css";
@import 'background-color.css';
@import 'icon-size.css';
@import 'crn-ion-segment.css';

:root {
    --assertive: #ef473a;
    --balanced: #33cd5f;
    --energized: #ffc900;
    --light: #ffffff;
    --stable: #f8f8f8;
    --calm: #11c1f3;
    --positive: #387ef5;
    --royal: #886aea;
    --dark: #444444;

    --white: #ffffff;
    --gray: #333333;
    --black: #000000;
    --blue: #0247FE;
    --light-blue: #85A5FF;
    --dark-blue: #00217A;
    --purple: #3D01A4;
    --light-purple: #B285FF;
    --dark-purple: #2D007A;
    --red: #FE2712;
    --light-red: #FE8F84;
    --dark-red: #7A0B00;
    --orange: #FB9B02;
    --light-orange: #FFD085;
    --dark-orange: #7A4B00;
    --yellow: #FFFF33;
    --light-yellow: #FFFF85;
    --dark-yellow: #7A7A00;
    --green: #66B032;
    --light-green: #B7FF85;
    --dark-green: #337A00;
}

.font-size-100 {
    font-size: 100%;
}

.font-size-200 {
    font-size: 200%;
}

.font-size-300 {
    font-size: 300%;
}

.font-size-400 {
    font-size: 400%;
}

.font-size-500 {
    font-size: 500%;
}

.font-size-600 {
    font-size: 600%;
}

.font-size-700 {
    font-size: 700%;
}

.top-13 {
    top: 13%;
}

.top-50 {
    top: 50%;
}

.top-78 {
    top: 78%;
}