@font-face { font-family: gilroy-regular; 
	src: url('Gilroy-Regular.ttf'); 
} 

:root {
	--page-title-text-color: #fff;
	--page-title-bg-color: #296a9d;
	--page-bg-color: #fff;
	--text-color: #d31717;
	--line-color: #333;
	--button-panel-background-color: #fff;
	--header-text-color: #111;
	--header-bg-color: #3c0f17;
	--footer-text-color: #111;
	--footer-bg-color: #53a4e4;
	--tile-background-color: #fff;
	--tile-header-text-color: #fff;
	--tile-header-bg-color: #296a9d;
}

@media screen, print {

 .bColor1 { background-color:rgb(98, 249, 98)9 !important; }
/* .pageHeader .logo a {display: inline-block;background: url(img/logo.png) no-repeat;width: 200px;height: 54px;background-size: contain;background-position: 0px 20px;} */
/* .pageHeader .logo {width: 16rem;} */

.logo { display: inline-block; background: none;}
.pageHeader .logo a {display: inline-block;background: url(img/logo.png) no-repeat; width: 165px;height: 54px;background-size: contain; background-position: 0px 1em;}
.logon .logo {display: flex !important;background: url(img/logo.png) no-repeat; height: 54px;background-size: contain;background-position: center; margin-bottom: 1em; width: 22em;}

.logon .logo {display: flex !important;background: url(img/logo.png) no-repeat;width: auto;height: 54px;background-size: contain;background-position: center;}
.logon .logoText {    display: flex !important ;justify-content: center;align-items: center;  }
.logon .tgbot {display: flex !important;background: url(img/tgbot.png) no-repeat;height: 150px;background-size: contain;background-position: center;}
.logon .tgbottext {    display: flex !important ;justify-content: center;align-items: center;  }
.logon .soobsh {display: flex !important;background: url(img/soobsh.png) no-repeat;height: 205px;background-size: contain;background-position: center;}


ul.dashboard li.tile img { opacity: 0.8; height: 5rem; margin-top: 10px; margin-left: 20px;}

ul.dashboard li.tile { background-image: url("img/setka.png"); background-size: contain; min-height: 8em; cursor: pointer; border-radius: 20px; margin: 2%; margin-top: 6px; list-style-type: none; background-color: #fff; }
ul.dashboard li.tile .header { margin-left: 10px; vertical-align: middle; font-size: 1.5rem; color: #E7226E; font-weight: 700; text-align: middle; background-color: transparent; border-radius: 4px 4px 0px 0px;}
ul.dashboard li.tile .body { font-size: 0.95rem; color: #888; margin-left: 10px; padding: 10px; }

ul.tabs > li {background-color: #dce8ff;}
ul.tabs > li.selected {background-color: #6294f9;}

.isAutoPayCheck {
	margin: 10px 0 0;
}
.apcheck {
    margin: 10px 0 0;
    line-height: normal;
    width: 20px;
    height: 20px;
}

.pageHeader > .content {
	display: grid; 
	grid-template-areas: "logo glue contract balance buttons"; 
	grid-template-columns: 150px 2fr 4fr 4fr 100px; 
	grid-template-rows: 1fr; 
	text-transform: uppercase;
	max-width: 50rem; 
	margin: 5px auto;
}

html, body { 
	height: 100%;
	min-height: 100%; 
	background-color: var(--page-bg-color);
        background: linear-gradient(to right, #e42b6d, #ffa73f);
}

#all {
	position: relative;
	min-height: calc( 100% - 6rem);
	width: 40vw;
	min-width: 800px;
	margin-left: auto;
	margin-right: auto;
	/* font-family: Verdana, Arial, Helvetica, sans-serif; */
	font-family: gilroy-regular;
}

/*блок контента страницы. этим id помечен <td>*/
.content, .empty {
	color: #000000;
	padding-right: 5px;
	padding-left: 5px;
	font-size: 12pt;
	min-height: 70%;
	margin-top: -80px;
}

.pageHeader {
	color: var(--header-text-color);
	/* background-color: var(--header-bg-color); */
	top: 0; 
	left: 0; 
	height: 5rem; 
	width: 100vw;	
	position: relative;
}

div.footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	min-width: 100%;
	height: 40px;
	font-size: 12px;
	color: #eee;
	/* background-color: #6294f9; */
	border-top-style: solid;
	border-top-color: #ffffff;
	border-top-width: 1px;
	text-align: right;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	border: 1px solid #ddd;
}
div.footer p { color: #eee; padding: 2px 10px; }
div.footer p a { color: #eee; }

div.tabs > input[type="radio"]:checked + label {background-color: #6294f9;border-bottom: 1px solid #fff;}		
div.tabs > label {text-align: center;vertical-align: middle;user-select: none;background-color: #dce8ff;border: 1px solid #e0e0e0;border-top-left-radius: 5px;border-top-right-radius: 5px;padding: 2px 8px;font-size: 16px;line-height: 1.5;transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;cursor: pointer;position: relative;top: 1px;}


.button1 {background-color: #dce8ff;}


div.pageTitle {
	background-color: #dce8ff;
	margin-top: 70px;
}


}