@media screen and (max-width:600px) {
    body, html {
        margin: 0;
        padding: 0;
        height: 100%;
        /*background: linear-gradient(
        to top left,
        #6b4f3f 0%,       /* brun cacao * /
        #8c5a79 50%,      /* prune rosé * /
        #290e3c 100%      /* violet profond * /
      );*/
      background-repeat: no-repeat !important;
    }
}

@font-face {
    font-family: 'lcd';
    src: url('lcd.ttf');
    src: url('lcd.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'segoe-ui';
    src: url('segoeui.ttf');
    src: url('segoeui.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

*{
    font-family: 'segoe-ui';
}

.free {
    font-family:freestys;
}

/*THEME COLOR */

:root {
    --yellow: #DAA520;
    --black: #1C1C1C;
    --light: #F5F5DC;
    --two-light: #f2dca6;
    --highlight: #3d195b;
    --gray: #EAEAEA;
    --slate-gray: #2F4F4F;
    --green-light: #00ff87;
    --grey-dark: #7d7d7d;
    --line: linear-gradient(to top left, #2f4f4f 0%, #3d195b 180%);

    --blue: #2196F3;
    --grey-medium: #bfbebb; /*bg dark */
    --grey-blue: #e8e9f0; /*card Header*/
	--grey-light: #f3f0ec; /*Border Grey */
	--red: #d31f26;
}

.error {
    border: 1px var(--red) solid;
}

/*body{
    background: var(--line);   
}*/

body::after {
    background: #fff;
}

.lined{
    background: var(--line)
}

.b-gold {
    border: 1px var(--yellow) solid !important;
}

.oranged {
    background-color: var(--yellow) !important;
}

.fly{
    border: 1px var(--slate-gray) solid !important;
}

.highlight {
    border: 1px solid var(--green-light);
}

h2{
    margin: 0 !important;
}

.no-mt {
    margin-top: 0px !important;
}

.separator{
	float: none;
	clear: both;
	display: block;
	margin: 10px auto;
	height: 1px;
	border-bottom:	1px var(--slate-gray) solid;
	opacity: 0.2;
}

.separator.dotted{
	border-bottom:	1px var(--blue) dotted !important;
}

.separator-block {
    padding: 4px 8px !important;
    width: 100%;
    box-shadow: var(--grey-light) inset 2px 2px 0 0;
}

.title{
    background-color: var(--two-light) !important;
}

.my-btn {
    color: var(--slate-gray);
    border: 1px var(--slate-gray) solid !important;
}

.my-btn-danger{
    color: var(--light);
    background-color: var(--highlight);
}

.random-cards {
    background-color: var(--black);
}

.modal-header {
    background-color: var(--slate-gray);
}

.invisible {
    background-color: transparent;
}

.green-text {
    color: var(--slate-gray) !important;
}

.pointer {
    cursor: pointer;
}

.my-label {
    font-weight: bold;
    color: var(--slate-gray);
}

.gold-btn {
    background-color: var(--yellow) !important;
    color: var(--black);
    font-weight: bold;
}

.green-outline {
    background-color: var(--slate-gray) !important;
    color: var(--light);
    font-weight: bold;
}

/*# sourceMappingURL=styles.css.map*/