/*****************************************************/
/********************** FONTS ************************/
/*****************************************************/

/** custom fonts can be added here with @font-face **/



/*****************************************************/
/********************** COLORS ***********************/
/*****************************************************/

/** custom colors can be set here **/

:root {
    /** color variables for readmode can be overridden here (insert color name, hex value, rgb or rgba) **/

    /* General */
    /*
    --accentColor: ;
    --swipeboxColor: ;
    --swipeboxBgColor: ;

    --nightModeAccentColor: ;
    */

    /* Top Bar */
    /*
    --topbarIconColor: white;
    --topbarBgColor: #03212c;
    --topbarContainerBgColor: white;
    --topbarElementColor: #e1e1e1;
    --articleProgressColor: #d8d8d8;

    --nightModeTopbarContainerBgColor: #1b2937;
    --nightModeTopbarElementColor: white;
    --nightModeArticleProgressColor: #d8d8d8;
    */

    /* Article */
    /*
    --articleBgColor: #ffffff;
    --articleTextColor: black;

    --nightModeArticleBgColor: #1b2937;
    --nightModeArticleTextColor: #ffffff;
    */

    /** color variables for readmode with TTS can be overridden here (insert color hex value) **/
    /*
    --playerAccentColor: #1268b2;
    --playerBgColor: #ffffff;
    --playerProgressColor: #e1e1e1;
    --playerBufferingColor: #bbbbbb;
    --playerTimeColor: #999999;
    --playerTextColor: black;
    --playerLoadingColor: rgba(153,153,153,0.25);
    --playerLoadingSize: 50px;
    --playerLoadingThickness: 6px;
    --playerLoadingOffset: 187;
    --playerLoadingDuration: 3s;

    --nightModePlayerAccentColor: white;
    --nightModePlayerBgColor: #1b2937;
    --nightModePlayerProgressColor: #666666;
    --nightModePlayerBufferingColor: #999999;
    --nightModePlayerTimeColor: white;
    --nightModePlayerBorderColor: #344250;
    --nightModePlayerTextColor: white;
    --nightModePlayerLoadingColor: #999999;

    --playerSpeechMarkerColor: #1268b2;
    --playerSpeechMarkerBgColor: rgba(153,153,153,0.25);

    --nightModePlayerSpeechMarkerColor: #1268b2;
    --nightModePlayerSpeechMarkerBgColor: rgba(153,153,153,0.25);

    --overlayBgColor: rgba(0,0,0,0.9);
    --overlayTextColor: #e1e1e1;
    --animationDuration: 10;
    */
}


/*****************************************************/
/********************** TOP BAR **********************/
/*****************************************************/

/** custom css for top bar can be added here **/


/*****************************************************/
/********************** ARTICLE **********************/
/*****************************************************/

/** custom css for article can be added here **/


/*****************************************************/
/******************** NIGHT MODE *********************/
/*****************************************************/

/** custom css for article in night mode can be added here **/


/*****************************************************/
/****************** MEDIA QUERIES ********************/
/*****************************************************/

/** custom css for different device sizes can be added here with @media **/