@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: normal;
    src: url(fonts/Roboto-Regular.ttf) format('truetype');
}

@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: normal;
    src: url(fonts/Roboto-Italic.ttf) format('truetype');
}

@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: bold;
    src: url(fonts/Roboto-ExtraBold.ttf) format('truetype');
}

@font-face {
    font-family: 'Open Sans';
    font-style: italic;
    font-weight: bold;
    src: url(fonts/Roboto-ExtraBoldItalic.ttf) format('truetype');
}

@font-face {
    font-family: 'Open Sans Condensed';
    font-style: normal;
    font-weight: normal;
    src: url(fonts/Roboto_Condensed-Regular.ttf) format('truetype');
}

@font-face {
    font-family: 'Open Sans Condensed';
    font-style: normal;
    font-weight: bold;
    src: url(fonts/Roboto_Condensed-ExtraBold.ttf) format('truetype');
}

@font-face {
    font-family: 'Open Sans Condensed';
    font-style: italic;
    font-weight: normal;
    src: url(fonts/Roboto_Condensed-RegularItalic.ttf) format('truetype');
}

@font-face {
    font-family: 'Open Sans Condensed';
    font-style: italic;
    font-weight: bold;
    src: url(fonts/Roboto_Condensed-ExtraBoldItalic.ttf) format('truetype');
}

/* global theme variable */
:root {
    --buttonBackground: #F0F0F0;
    --buttonActiveBackground: #9EDCFF;
    --border: #EDEDED;
    --activeBackground: #EDEDED;
    --required: #FF6060;
    --text: #0C3B63;
    --red: #FF4343;
    --green: #71E25D;
    --darkblue: #0C3B63;
    --blue: #27A5F2;
    --orange: #FFCE60;
    --hover: rgb(220,241,253);
    --rectangleBorder: #EDEDED;
    --gridHeaderBackGround: #D3EBFF;
    --gridChildHeaderBackGround: #F0F0F0;
    --gridFilterBackGround: #EDEDED;
    --opacityDisabled: 0.6;
    --opacityDisabledButton: 0.3;
    --textDisabled: rgb(12,59,99,var(--opacityDisabled));
    --contentBorder: #9EDCFF;
    --tabBackground: #9EDCFF;
    --borderRadius: 5px;
    --borderWidth: 1px;
    --navBackground: white;
    --navText: #0C3B63;
    --navActiveBackground: #9EDCFF;
    --navHoverBackground: rgb(220,241,253);
    --navHoverText: #0C3B63;
}