@import 'fonts/font.css';

body {margin: 0; padding: 0; }

body, td { font-family: 'HelveticaNeueCyrlight'; font-size: 16px; letter-spacing: 0.5px; }

a { color: #000; }
a:hover { color: #a0a0a0; }

.getcard {letter-spacing: 2px; text-decoration: none; border-bottom: 1px solid #a0a0a0;}

.header {margin: 50px 0 10px 0; border: 0px solid red;}
.logo {font-family: 'HelveticaNeueCyrUltralight'; font-size: 96px; letter-spacing: 2px; text-decoration: none; transition: 0.5s;}

.button {border: 1px solid #000; padding: 10px 15px 10px 15px; letter-spacing: 2px; text-transform: uppercase; text-decoration: none; color: #000; transition: 0.5s; background-color: #FFF; cursor: hand; cursor: pointer; -webkit-appearance: none; }

.centerlogin { border: 0px solid red; width: 500px; height: 500px; position: absolute; left: 50%; top: 50%; margin: -250px 0 0 -250px; }
.fieldname {font-size: 14px; color: #a0a0a0; text-transform: uppercase; letter-spacing: 1px;}
.login {font-size: 18px; border: none; border-bottom: 1px solid #dadada; width: 240px; margin: 5px 0 10px 0;}
.code {font-size: 18px; border: none; border-bottom: 1px solid #dadada; width: 200px; margin: 5px 0 10px 0;}
.text {font-size: 18px; border: none; border: 1px solid #dadada; width: 240px; height: 100px; margin: 5px 0 10px 0;}
.select {padding: 5px; border: 1px solid #dadada; font-size: 16px; font-color: #a0a0a0;}
.error {color: red; font-size: 14px;}

.menu {padding: 10px 0 10px 0; vertical-align: top; border: 0px solid red;}
.menuitem {display: inline-block; width: 100px;  margin: 2px 2px 2px 2px; background-color: #fff; vertical-align: top; text-align: left; border: 0px solid red;}
.menulink {color: #000; text-decoration: none; font-size: 15px; line-height: 23px; letter-spacing: 1px; border-bottom: 1px solid #dadada;}

.menuitemseparator {display: inline-block; vertical-align: top;border: 0px solid red;}

.menuitemcard {display: inline-block; border: 1px solid #444; padding: 20px 4px 5px 4px; margin: 6px 5px 6px 5px; border-radius: 10px; background-color: #1e3559; width: 110px; height: 45px; vertical-align: top; transition: 0.5s;}

.menuitemcard.blocked {
	background-color: #dadada;
	border: 1px solid #AAA;
	color: #a0a0a0;
}
.menuitemcard:hover { background-color: #173b60; transform: scale(1.10) rotate(-10deg); transition: 0.5s; }
.menuitemcard:hover.blocked {
	background-color: #E0E0E0;
}

.cardname {text-decoration: none; color: #fff; font-size: 14px}
.cardnumber {font-size: 12px; color: #fff;}
.cardpercent {font-size: 12px; color: #fff; line-height: 20px; letter-spacing: 2px;}
.cardpercent.blocked {color: #a0a0a0 !important; }

.submenu {margin: 30px 0 0 0;}
.submenulink {font-size: 18px; text-decoration: none; border-bottom: 1px solid #dadada; color: #444;}
.submenulink.on {font-size: 18px; text-decoration: none; border-bottom: 0px solid #dadada; color: #a0a0a0;}

.mobilemenu { display: none; margin: 20px 0 5px 0; border: 0px solid red;}

/*Вывод контента*/

h1 { font-family: 'HelveticaNeueCyrUltralight'; font-size: 48px; letter-spacing: 2px; text-decoration: none;  font-weight: normal; font-style: normal; }

.cardtable { width: 100%; max-width: 520px; border: 0px solid red;}
.cardtable tr {}
.cardtable tr:hover {background-color: #fafafa;}
.cardtable td { padding: 5px 5px 5px 2px; font-size: 15px; border-bottom: 1px solid #eaeaea;}
.cardtable th {font-size: 13px; font-style: italic; font-weight: 0; vertical-align: top; padding: 5px 5px 5px 2px; letter-spacing: 0.5px;} 

.titletd {display: inline-block; vertical-align: top; width: 160px; text-align: left; padding: 5px 0 5px 5px;}
.contenttd {display: inline-block; vertical-align: top; width: 300px; text-align: left; padding: 5px 0 5px 5px;}

.gray {font-size: 14px; color: #a0a0a0;}


@media screen and (max-width:560px) {
/* Для мобильных устройств */
	
body, td  { font-size: 18px; }

.header {margin-top: 50px;}

.logo { font-size: 52px; transition: 0.5s; margin: 0; line-height: 21px; }
.login { font-size: 18px; width: 240px; transition: 0.5s;}

.centerlogin { width: 300px; height: 250px; position: absolute; left: 50%; top: 50%; margin: -175px 0 0 -150px; transition: 0.5s;}

.menu {display: none;}
.menuitemcard {margin-top: 0; margin-bottom: 10px;}
.menuitem {width: 90% !important;  height: 40px !important;  padding: 5px !important; border: 0px solid red;  transition: 0.5s; text-align: center;}
.menuitemseparator {display: none; }
.menulink {border: none;}

.mobilemenu {display: block;}

.cardtable th  {letter-spacing: 0;}

h1 {font-size: 32px; margin: 20px 0 10px 0;}

.button {margin: 10px 0 10px 0 !important;}
.gray {font-size: 13px; }
}
