body {line-height: initial !important; height: 100%; font-family: 'Roboto', sans-serif; overflow:hidden;}
* { margin: 0; padding: 0; }
a {text-decoration: none}
img {border: none}

html {
-webkit-text-size-adjust: none;
}

p {
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

*{
    -ms-touch-action: cross-slide-y; 
    -ms-overflow-style: none;
    -ms-scroll-chaining: none; 
}
    
.mdl-layout {background-color: #dddddd;}
.mdl-layout__header {background-color: #131313;}
.mdl-layout__header-row {padding-left: 54px !important; padding-right: 10px !important;}
.mdl-layout__drawer-button {width: 40px !important}
.mdl-badge[data-badge]:after {background-color: #33c21f; color: #ffffff}
.mdl-layout__content{ position: relative; }
.mdl-layout__content .loading {display: none; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-color: #dddddd;}
.mdl-layout__content .loading .mdl-spinner{position: absolute; left: 50%; top: 50%; margin-left: -20px; margin-top: -20px;}
.mdl-button {box-shadow: none !important;}
.mdl-data-table td{white-space: normal !important}
.mdl-navigation .material-icons{margin-right: 10px;}
.mdl-navigation .mdl-navigation__link {padding: 16px 20px !important; cursor: pointer;}
.mdl-navigation .sublink{padding-left: 25%;}
.mdl-list__item {letter-spacing: 0}
.mdl-layout__drawer-button  i{color: #ffffff}
.mdl-chip {cursor: pointer;}
.mdl-badge.mdl-badge--overlap:after {background-color: #eeeeee; color: #000000}
/*.mdl-chip .mdl-chip__contact{line-height: 1.4em !important}*/
.mdl-radio {margin-bottom: 5px;}

.mdl-layout__tab-bar {width: 100%; padding-left: 0;}
.mdl-layout__tab-bar-button {background: none}
.mdl-card__supporting-text {width: auto !important}

#header_logo_ru {max-height: 17px;}
#header_logo_en {max-height: 21px;}
@media screen and (min-width:500px) {
    #header_logo_ru {max-height: 24px !important;}
    #header_logo_en {max-height: 24px !important;}
}


select {margin: 20px 0 40px 0; width: 90%; font-size: 120%; font-family: Arial; border: 0px; border-bottom: 1px solid #cccccc; padding: 10px 0; color: #cccccc;}
select:focus, select.active{border-bottom: 1px solid #004381; color: #000000}

.centertext {text-align: center !important;}
.righttext {text-align: right !important;}
.lefttext {text-align: left !important;}

.fontgray {color: #666666;}
.fontlightgray {color: #cccccc;}
.fontgreen {color: #009900;}
.fontred {color: #990000;}
.fontyellow {color: #999900;}

.bggray {background-color: #999999; color: #ffffff;}
.bggreen {background-color: #009900; color: #ffffff;}
.bgred {background-color: #990000; color: #ffffff;}
.bgyellow {background-color: #999900; color: #ffffff;}

.bglightgreen {background-color: #b9e3ad;}
.bglightyellow {background-color: #e8d04f}
.bglightred {background-color: #c68383}
.bglightgray {background-color: #dddddd}

.bggamefuel {background-color: #ffff66;}
.bggamehealth {background-color: #ff1538}
.bggamereputation {background-color: #21b93d}
.bggametime {background-color: #5dc2f1}

.bgwhite_important {background-color: #ffffff !important; color: #111111 !important;}
.bggray_important {background-color: #999999 !important; color: #ffffff;}
.bggreen_important {background-color: #009900 !important; color: #ffffff;}
.bgred_important {background-color: #990000 !important; color: #ffffff;}
.bgyellow_important {background-color: #999900 !important; color: #ffffff;}

.bglightgreen_important {background-color: #b9e3ad !important}
.bglightyellow_important {background-color: #e8d04f !important}
.bglightred_important {background-color: #c68383 !important}
.bglightgray_important {background-color: #cccccc !important}

td.bglightgreen, tr.bglightgreen {border-top: 1px solid #00cc00; border-bottom: 1px solid #00cc00}
td.bglightyellow, tr.bglightyellow {border-top: 1px solid #cccc00; border-bottom: 1px solid #cccc00}
td.bglightred, tr.bglightred {border-top: 1px solid #cc0000; border-bottom: 1px solid #cc0000}

.mdl-data-table .subgroup{ padding-top: 5px !important; background-color: #eeeeee; height: 20px; color: #666666; font-weight: bold; padding-bottom: 5px !important;}
.mdl-data-table .subgroup td{height: 20px; padding-top: 5px; padding-bottom: 5px;}

.android-more-button {color: #ffffff;}

#mainmenu_container .mainmenuheader {text-align: center; background-color: #cccccc; position: relative;}
#mainmenu_container .mainmenuheader img{margin: 10px 0 20px 0; width: 60%; max-width: 100px; display: inline-block; border-radius: 100%; border: 6px solid #c86021}
#mainmenu_container .mainmenuheader.online img{ border: 6px solid #33c21f; box-shadow: 0 0 15px #33c21f}
#mainmenu_container .mainmenuheader.offline img{ border: 6px solid #c86021}
#mainmenu_container .mainmenuheader .triangle{position: absolute; left:50%; margin-left: -10px; bottom: 0; width: 0; height: 0; display: inline-block; border: 10px solid transparent; border-bottom: 10px solid #fafafa;}

.textpage {padding: 0 30px 30px 30px;}

.form {position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 10}
.form .black{position: absolute; left: 0; right: 0; top: 0; bottom: 0; background-color: rgba(0,0,0,0.5); z-index: 11}
.form .panel{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 12;}
.form .panel .closebutton {position: absolute; right: 20px; top: 20px; z-index: 13; background-color: #ffffff;}

#loginform .panel{width: 350px; background-color: #ffffff; overflow: visible}
#loginform .panel .mdl-card__supporting-text{overflow: visible}
#loginform #login_phone{padding-top: 8px; margin: 20px 0; padding-bottom: 5px; padding-right: 10px; border-top:0; border-right: 0; border-left: 0; border-bottom: 1px solid #bbbbbb; color: #222222; font-size: 140%; font-weight: bold}
#loginform #login_phone::-moz-placeholder{color:#dddddd}
#loginform #login_phone::-webkit-input-placeholder{color:#dddddd}
#loginform #login_phone:focus{border-bottom: 1px solid #aaaaaa; outline: none !important}

.cartbutton {position: fixed; right: 20px; bottom: 20px; cursor: pointer; z-index: 10; overflow: visible}
.cartbutton:hover {background-color: #cc0000}
.cartbutton span {margin-left: 30px; position: absolute; right: 0px; top: 0px; width: 20px; height: 20px;  background-color: #ffffff; color: #aa0000; border-radius: 100%; font-size: 70%;}

.mainmenu {width: calc(100% - 20px); margin: 10px; text-align: center; display: grid; grid-column-gap: 0px;grid-row-gap: 0px;}
.mainmenu .maincardin{display: inline-block;}
.mainmenu .maincard {display: block; width: calc(100% - 20px); margin: 10px; color: #666666; cursor: pointer; opacity: 1}
.mainmenu .maincard:hover {opacity: 1; box-shadow: 0 1px 4px rgba(0,0,0,0.4)}
.mainmenu .maincard .mdl-card__title {min-height: 272px; color: #ffffff; text-align: left;}
.mainmenu .maincard .mdl-card__title .mdl-card__title-text{text-align: left;}
.mainmenu .maincard .mdl-card__supporting-text {text-align: left; height:32px;}
.mainmenu .maincard .mdl-card__actions {text-align: right; background-color: #eeeeee}
.mainmenu .maincard .mdl-card__actions a{}

.mainmenu {grid-template-columns: repeat(4, 1fr);}
.mainmenu .card1 { grid-area: 1 / 1 / 2 / 3; }
.mainmenu .card2 { grid-area: 1 / 3 / 2 / 4; }
.mainmenu .card3 { grid-area: 1 / 4 / 2 / 5; }
.mainmenu .card4 { grid-area: 2 / 1 / 3 / 2; }
.mainmenu .card5 { grid-area: 2 / 2 / 3 / 3; }
.mainmenu .card6 { grid-area: 2 / 3 / 3 / 5; }
.mainmenu .card7 { grid-area: 3 / 1 / 4 / 2; }
.mainmenu .card8 { grid-area: 3 / 2 / 4 / 3; }
.mainmenu .card9 { grid-area: 3 / 3 / 4 / 5; }

@media screen and (max-width:800px) {
    .mainmenu .card2 .mdl-card__title { min-height: 200px !important; }
    .mainmenu .card2 .mdl-card__supporting-text {height: 54px !important;}
    .mainmenu .card3 .mdl-card__title { min-height: 200px !important;  }
    .mainmenu .card3 .mdl-card__supporting-text {height: 54px !important;}
    .mainmenu .card5 .mdl-card__title { min-height: 200px !important; }
    .mainmenu .card5 .mdl-card__supporting-text {height: 54px !important;}
    .mainmenu .card6 .mdl-card__title { min-height: 200px !important;  }
    .mainmenu .card6 .mdl-card__supporting-text {height: 54px !important;}
    .mainmenu .card7 .mdl-card__title { min-height: 200px !important; }
    .mainmenu .card7 .mdl-card__supporting-text {height: 36px !important;}
    .mainmenu .card8 .mdl-card__title { min-height: 200px !important;  }
    .mainmenu .card8 .mdl-card__supporting-text {height: 36px !important;}
}

@media screen and (max-width:1000px) {
    .mainmenu {grid-template-columns: repeat(2, 1fr);}
    .mainmenu .card1 { grid-area: 1 / 1 / 2 / 3; }
    .mainmenu .card2 { grid-area: 2 / 1 / 3 / 2; }
    .mainmenu .card3 { grid-area: 2 / 2 / 3 / 3; }
    .mainmenu .card4 { grid-area: 3 / 1 / 4 / 3; }
    .mainmenu .card5 { grid-area: 4 / 1 / 5 / 2; }
    .mainmenu .card6 { grid-area: 4 / 2 / 5 / 3; }
    .mainmenu .card7 { grid-area: 5 / 1 / 6 / 2; }
    .mainmenu .card8 { grid-area: 5 / 2 / 6 / 3; }
    .mainmenu .card9 { grid-area: 6 / 1 / 7 / 3; }
    .mainmenu .card1 .mdl-card__supporting-text {height: 20px !important;}
    .mainmenu .card4 .mdl-card { min-height: 150px !important; }
    .mainmenu .card4 .mdl-card__title { min-height: 150px !important; }
    .mainmenu .card4 .mdl-card__supporting-text {height: 20px !important;}
    .mainmenu .card9 .mdl-card { min-height: 200px !important; }
    .mainmenu .card9 .mdl-card__title { min-height: 200px !important; }
    .mainmenu .card9 .mdl-card__supporting-text {height: 20px !important;}
}

@media screen and (min-width:1400px) {
    .mainmenu {grid-template-columns: repeat(5, 1fr);}
    
    .mainmenu .card1 { grid-area: 1 / 1 / 2 / 3; }
    .mainmenu .card2 { grid-area: 1 / 3 / 2 / 5; }
    .mainmenu .card3 { grid-area: 1 / 5 / 2 / 6; }
    .mainmenu .card4 { grid-area: 2 / 1 / 3 / 2; }
    .mainmenu .card5 { grid-area: 2 / 2 / 3 / 4; }
    .mainmenu .card6 { grid-area: 2 / 4 / 3 / 6; }
    .mainmenu .card7 { grid-area: 3 / 1 / 4 / 3; }
    .mainmenu .card8 { grid-area: 3 / 3 / 4 / 5; }
    .mainmenu .card9 { grid-area: 3 / 5 / 4 / 6; }
}

.videos {margin:10px;}
.videos h4{padding: 0; margin: 0; padding-left: 10px; font-weight: bold;}
.videos .about{padding-left: 10px; opacity: 0.5}
.videos .video{position: relative; margin: 10px; display: inline-block;}
.videos .video img{width: 320px;}
.videos .video .buttons{display: none; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.5);  text-align: center; padding-top: 40px;}
.videos .video .buttons a{margin: 20px; background-color: #ffffff; background-size: 70% 70%; background-repeat: no-repeat; background-position: center center;}
.videos .video .buttons a.vkvideo{background-image: url('/images/design/icon-vkvideo.png');}
.videos .video .buttons a.youtube{background-image: url('/images/design/icon-youtube.png');}
.videos .video .buttons span{display: none !important}
.videos .video:hover .buttons{ display: block;}


.carmenu {width: 100%;}
.carmenu .carbutton{width: 100%; position: relative; min-height: 250px; height: 30%; cursor: pointer; background-position: center center; background-size: cover; background-repeat: no-repeat}
.carmenu .carbutton .carbuttonmask {position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.6)}
.carmenu .carbutton .carbuttonlabel {position: absolute; text-align: center; width: 200px; height: 50px; left: 50%; top: 50%; margin-left: -100px; margin-top:-25px; font-size: 200%; color: #ffffff;}
.carmenu .carbutton:hover .carbuttonmask {background-color: rgba(0,0,0,0.4)}

.carsmenu {width: calc(100% - 20px); margin: 10px; text-align: center; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));  grid-gap: 0px;}
.carsmenu .carcardin{display: inline-block;}
.carsmenu .carcard {display: block; width: calc(100% - 20px); margin: 10px; color: #666666; cursor: pointer; opacity: 1}
.carsmenu .carcard:hover {opacity: 1; box-shadow: 0 1px 4px rgba(0,0,0,0.4)}
.carsmenu .carcard .mdl-card__title {min-height: 300px; color: #ffffff; text-align: left;}
.carsmenu .carcard .mdl-card__title .mdl-card__title-text{text-align: left;}
.carsmenu .carcard .mdl-card__supporting-text {text-align: left; height:17px;}
.carsmenu .carcard .mdl-card__actions {text-align: right; background-color: #eeeeee}
.carsmenu .carcard .mdl-card__actions a{}

.carsmenu {width: calc(100% - 20px); margin: 0 10px; text-align: center; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));  grid-gap: 0px;}
.carsmenu .merchardin{display: inline-block;}
.carsmenu .merchcard {display: block; min-height: 100px; width: calc(100% - 20px); margin: 10px; color: #666666; cursor: pointer; opacity: 1}
.carsmenu .merchcard:hover {opacity: 1; box-shadow: 0 1px 4px rgba(0,0,0,0.4)}
.carsmenu .merchcard .mdl-card__title {min-height: 100px; color: #ffffff; text-align: left;}
.carsmenu .merchcard .mdl-card__title .mdl-card__title-text{text-align: left;}

.modelmenu {width: calc(100% - 20px); margin: 0 10px; text-align: center; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));  grid-gap: 0px;}
.modelmenu .modelcardin{display: inline-block;}
.modelmenu .modelcard {display: block; width: calc(100% - 20px); margin: 10px; max-width: 430px; color: #666666; cursor: pointer; opacity: 1}
.modelmenu .modelcard:hover {opacity: 1; box-shadow: 0 1px 4px rgba(0,0,0,0.4)}
.modelmenu .modelcard .mdl-card__title {min-height: 300px; color: #222222; text-align: left;}
.modelmenu .modelcard .mdl-card__title .mdl-card__title-text{text-align: left;}
.modelmenu .modelcard .mdl-card__title .badges{position: absolute; left: 10px; top: 10px;}
.modelmenu .modelcard .mdl-card__title .new{display: inline-block; margin-bottom: 5px; background-color: #ff6600; color: #ffffff; text-transform: uppercase; font-weight: bold; padding: 5px 8px; font-size: 70%;}
.modelmenu .modelcard .mdl-card__title .sale{display: inline-block; margin-bottom: 5px; background-color: #cc0066; color: #ffffff; text-transform: uppercase; font-weight: bold; padding: 5px 8px; font-size: 70%;}
.modelmenu .modelcard .mdl-card__title .old{display: inline-block; margin-bottom: 5px; background-color: #888888; color: #ffffff; text-transform: uppercase; font-weight: bold; padding: 5px 8px; font-size: 70%;}
.modelmenu .modelcard .mdl-card__supporting-text {text-align: left; height:70px;}
.modelmenu .modelcard .mdl-card__supporting-text .modelnumber {color: #007700; padding-bottom: 5px}
.modelmenu .modelcard .mdl-card__actions {position: relative; text-align: right; background-color: #eeeeee}
.modelmenu .modelcard .mdl-card__actions .prices{position: absolute; left: 15px; top: 9px; font-size: 120%; font-weight: bold; color: #000000}
.modelmenu .modelcard .mdl-card__actions .pcs{position: absolute; left: 15px; bottom: 9px; font-size: 65%; font-weight: normal; color: #666666}


/*
.itemsmenu {width: calc(100% - 20px); margin: 10px;  text-align: center; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));  grid-gap: 0px;}
.itemsmenu .itemcardin{display: inline-block;}
.itemsmenu .itemcard {display: block; width: calc(100% - 20px); max-width: 430px; margin: 10px;}
.itemsmenu .itemcard .number {display: block; color: #770000; padding: 2px 15px 15px 17px; font-size: 80%; text-align: left;}
.itemsmenu .itemcard .title {display: block; color: #000000; padding: 15px 15px 0 15px; font-size: 200%; text-align: left;}
.itemsmenu .itemcard .about {padding: 15px; color: #666666; text-align: left; font-size: 90%}
.itemsmenu .itemcard .about h4{font-size: 120%; font-weight: bold; padding: 0; margin: 0; color: #444444}
.itemsmenu .itemcard .photos {padding: 0 15px; text-align: left; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));  grid-gap: 10px;}
.itemsmenu .itemcard .photos .photobox{display: block;}
.itemsmenu .itemcard .photos .photobox img{width: 100%; min-height: 200px; margin-left: -2px; margin-top: -2px; border: 2px solid #999999}
.itemsmenu .itemcard .mdl-card__actions {position: relative; text-align: right; background-color: #eeeeee}
.itemsmenu .itemcard .mdl-card__actions .prices{position: absolute; left: 15px; top: 9px; font-size: 120%; font-weight: bold; color: #000000}
.itemsmenu .itemcard .mdl-card__actions .pcs{position: absolute; left: 15px; bottom: 9px; font-size: 65%; font-weight: normal; color: #666666}
*/

.itemsmenu {width: calc(100% - 20px); margin: 10px;  text-align: center; }
.itemsmenu .itemcardin{display: inline-block;}
.itemsmenu .itemcard {display: block; width: calc(100% - 20px); margin: 10px; min-height: 50px}
.itemsmenu .itemcard .number {display: block; color: #999999; padding: 2px 15px 15px 17px; font-size: 80%; text-align: left;}
.itemsmenu .itemcard .important {display: block; color: #006600; margin-top: -10px; padding: 0px 15px 15px 17px; font-size: 120%; text-align: left; font-weight: bold;}
.itemsmenu .itemcard .title {display: block; color: #000000; padding: 15px 15px 0 15px; font-size: 200%; text-align: left;}
.itemsmenu .itemcard .paramstable {display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 48%));  grid-gap: 10px;}
.itemsmenu .itemcard .lefttable {display: block;}
.itemsmenu .itemcard .righttable {display: block}
.itemsmenu .itemcard .showbutton {display: none}
.itemsmenu .itemcard .about {padding: 15px; color: #666666; text-align: left; font-size: 90%}
.itemsmenu .itemcard .about h4{font-size: 120%; font-weight: bold; padding: 0; margin: 0; color: #444444}
.itemsmenu .itemcard .photo {padding: 0 15px; text-align: left;}
.itemsmenu .itemcard .photo .photobox img{width: 100%; margin-left: -2px; margin-top: -2px; border: 2px solid #999999}
.itemsmenu .itemcard .photos {padding: 0 15px; margin-top: 10px; text-align: left; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 200px));  grid-gap: 10px;}
.itemsmenu .itemcard .photos .photobox{display: block;}
.itemsmenu .itemcard .photos .photobox img{width: 100%; margin-left: -2px; margin-top: -2px; border: 2px solid #999999}
.itemsmenu .itemcard .mdl-card__actions {position: relative; text-align: right; background-color: #eeeeee}
.itemsmenu .itemcard .mdl-card__actions .prices{position: absolute; left: 15px; top: 9px; font-size: 120%; font-weight: bold; color: #000000}
.itemsmenu .itemcard .mdl-card__actions .rub{color: rgba(0,0,0,0.5)}
.itemsmenu .itemcard .mdl-card__actions .pcs{position: absolute; left: 15px; bottom: 9px; font-size: 65%; font-weight: normal; color: rgba(0,0,0,0.5)}
.itemsmenu .itemcard .ownerline {position: relative; background-color: #111111; min-height: 53px}
.itemsmenu .itemcard .ownerline .ownername{position: absolute; left: 15px; top: 9px; color: #ffffff; font-size: 100%; font-weight: bold;}
.itemsmenu .itemcard .ownerline .ownername a{color: #ffffff !important; text-decoration: underline;}
.itemsmenu .itemcard .ownerline .ownercity{position: absolute; left: 15px; bottom: 9px; font-size: 65%; font-weight: normal; color: #ffffff}
.itemsmenu .itemcard .ownerline.preorderownerline {background-color: #cccccc}
.itemsmenu .itemcard .ownerline.preorderownerline .ownername{color: #000000;}
.itemsmenu .itemcard .ownerline.preorderownerline .ownername a{color: #000000 !important;}
.itemsmenu .itemcard .ownerline.preorderownerline .ownercity{color: #000000}


.itemsmenu .itemcard.short .paramstable{display: none}
.itemsmenu .itemcard.short .photo .photobox img{max-width: 350px !important}
.itemsmenu .itemcard.short .photo {margin-bottom: 10px;}
.itemsmenu .itemcard.short .photos {display: none; }
.itemsmenu .itemcard.short .showbutton {display: block; margin-bottom: 10px; margin-left: 10px; text-align: left;}

.itemsmenu .itemcard.hideshort .number{display: none}
.itemsmenu .itemcard.hideshort .paramstable{display: none}
.itemsmenu .itemcard.hideshort .photo{display: none}
.itemsmenu .itemcard.hideshort .photos {display: none; }
.itemsmenu .itemcard.hideshort .showbutton {display: none; }

.itemsmenu .itemcard.cart .paramstable{display: none}
.itemsmenu .itemcard.cart .photo {display: none;}
.itemsmenu .itemcard.cart .photos {margin-bottom: 10px; grid-template-columns: repeat(auto-fit, minmax(100px, 150px));}
.itemsmenu .itemcard.cart .showbutton {display: block; margin-bottom: 10px; margin-left: 10px; text-align: left;}

.cartsummary {width: calc(100% - 40px); margin: 10px 20px;  text-align: left; min-height: 30px;}
.cartsummary .title {display: block; color: #000000; padding: 15px 15px 0 15px; font-size: 200%; text-align: left;}
.cartsummary .paramstable {display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 48%));  grid-gap: 10px;}
.cartsummary .lefttable {display: block;}
.cartsummary .righttable {display: block}
.cartsummary .showbutton {display: none}
.cartsummary .about {padding: 15px; color: #666666; text-align: left; font-size: 90%}
.cartsummary .about h4{font-size: 120%; font-weight: bold; padding: 0; margin: 0; color: #444444}
.cartsummary .mdl-card__actions {position: relative; text-align: right; background-color: #eeeeee}
.cartsummary .mdl-card__actions .prices{position: absolute; left: 15px; top: 7px; font-size: 190%; font-weight: bold; color: #000000}
.cartsummary .mdl-card__actions .rub{color: rgba(0,0,0,0.5)}
.cartsummary .mdl-card__actions .pcs{position: absolute; left: 15px; bottom: 9px; font-size: 65%; font-weight: normal; color: rgba(0,0,0,0.5)}
.cartsummary .packingbox {display: inline-block; font-weight: bold;}
.cartsummary .packingbox img{ width: 200px;}
.cartsummary .packingbox span{position: absolute; left: 0; top: -15px; font-size: 70%; font-weight: normal}

.contact_icon {width: 50px; height: 50px; cursor: pointer; opacity: 0.9; margin: 2px;}
.contact_icon:hover {opacity: 1;}
.contact_icon.contact_icon80{width: 40px; height: 40px; margin: 7px;}
.contact_icon.unselected {opacity: 0.1;}
.contact_icon.selected {opacity: 1;}

.breadcrumbs {padding-left: 20px !important;color: #bbbbbb; height: 30px; margin-top: 10px; margin-left: -20px;}
.breadcrumbs .active{color: #000000}
.breadcrumbs .mdl-navigation {height: 30px;}
.breadcrumbs .mdl-navigation .mdl-navigation__link {line-height: 30px; padding: 0px 24px !important}

.dealers {width: calc(100% - 20px); margin: 10px; text-align: center; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));  grid-gap: 0px;}
.dealers .dealerin{display: inline-block;}
.dealers .dealer {display: block; width: calc(100% - 20px); margin: 10px; max-width: 600px; color: #666666; cursor: pointer; opacity: 1; text-align: left;}
.dealers .dealer .dealer_logo {width: 100%; height: 200px; background-position: center center; background-repeat: no-repeat; background-size: cover}
.dealers .dealer h2 {font-weight: bold; padding: 10px;}
.dealers .dealer .contact {padding: 4px 10px;}



.orderslist {width: calc(100% - 20px); margin: 10px;  text-align: center; }
.orderslist .ordercard {position: relative; display: block; width: calc(100% - 20px); margin: 10px 10px 20px 10px; min-height: 50px}
.orderslist .ordercard .owner {display: block; color: #007700; padding: 0px 15px 7px 17px; font-size: 80%; text-align: left;}
.orderslist .ordercard .owner .ownername{display: block; font-size: 170%; font-weight: bold; color: #000000; margin-top: 8px; margin-bottom: 3px; margin-left: -2px}
.orderslist .ordercard .owner .ownername a{color: #000000; font-weight: bold; text-decoration: underline;}
.orderslist .ordercard .owner .ownercity{display: block; font-size: 85%; font-weight: normal; color: #666666;}
.orderslist .ordercard .title {position: absolute; right: 10px; top: 8px; color: #777777; font-size: 70%; text-align: right;}
.orderslist .ordercard .buttons {background-color: rgba(255,255,255,0.9); border-radius: 5px; position: absolute; right: 3px; top: 22px; text-align: right;}
.orderslist .ordercard .orderitemstable {width: 100%;}
.orderslist .ordercard .orderitemstable td {text-align: left; padding-top:3px; padding-bottom: 3px;}
.orderslist .ordercard .orderitemstable tr.thin {height: auto;}
.orderslist .ordercard .orderitemstable tr.thin td {height: auto; padding-top:3px; padding-bottom: 3px;}
.orderslist .ordercard .orderitemstable tr td:first-of-type {padding-left: 10px;}
.orderslist .ordercard .orderitemstable tr td:last-of-type {padding-right: 10px;}
.orderslist .ordercard .ordersteps {background-color: #efefef; width: 100%; margin: 0; text-align: center; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));  grid-gap: 0px;}
.orderslist .ordercard .orderstep {position: relative; color: rgba(0,0,0,0.3); font-size: 80%; text-align: center; padding: 10px; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc;}
.orderslist .ordercard .orderstep:first-of-type { border-left: 1px solid #cccccc;}
.orderslist .ordercard .orderstep:last-of-type { border-right: 1px solid #cccccc;}
.orderslist .ordercard .orderstep .arrow{position: absolute; width: 24px; height: 24px; border-right: 1px solid #cccccc; border-top: 1px solid #cccccc; right: -13px; top:5px; transform: rotate(45deg);}
.orderslist .ordercard .orderstep .statuslabel{display: inline-block; position: relative; padding-left: 30px;}
.orderslist .ordercard .orderstep .statuslabel i{position: absolute; left: 0; top: -5px; display: none}
.orderslist .ordercard .orderstep .statuslabel i.timer{top: -3px;}
.orderslist .ordercard .orderstep.await {font-weight: bold; color: #000000}
.orderslist .ordercard .orderstep.awaitconfirmation {font-weight: bold; color: #000000; background-color: #c1c17d; border-top: 1px solid #79794e; border-bottom: 1px solid #79794e;}
.orderslist .ordercard .orderstep.complete {font-weight: bold; color: #000000; background-color: #b9e3ad; border-top: 1px solid #6d906d; border-bottom: 1px solid #6d906d;}
.orderslist .ordercard .orderstep.fail {font-weight: bold; color: #000000; background-color: #934e4e; border-top: 1px solid #7b3434; border-bottom: 1px solid #7b3434; border-right: 1px solid #7b3434;}
.orderslist .ordercard .orderstep.complete:first-of-type { border-left: 1px solid #6d906d;}
.orderslist .ordercard .orderstep.complete:last-of-type { border-right: 1px solid #6d906d;}
.orderslist .ordercard .orderstep.complete .arrow{background-color: #b9e3ad; border-color: #6d906d}
.orderslist .ordercard .orderstep.awaitconfirmation .arrow{background-color: #c1c17d; border-color: #79794e}
.orderslist .ordercard .orderstep.await .statuslabel i.timer{display: block}
.orderslist .ordercard .orderstep.awaitconfirmation .statuslabel i.check{display: block}
.orderslist .ordercard .orderstep.complete .statuslabel i.check{display: block}
.orderslist .ordercard .orderstep.fail .statuslabel i.fail{display: block}

.orderslist .ordercard .mdl-card__actions {position: relative; text-align: right; background-color: #eeeeee}
.orderslist .ordercard .mdl-card__actions .prices{position: absolute; left: 15px; top: 9px; font-size: 120%; font-weight: bold; color: #000000}
.orderslist .ordercard .mdl-card__actions .rub{color: rgba(0,0,0,0.5)}
.orderslist .ordercard .mdl-card__actions .pcs{position: absolute; left: 15px; bottom: 9px; font-size: 65%; font-weight: normal; color: rgba(0,0,0,0.5)}
.orderslist .ordercard .ownerline {position: relative; background-color: #111111; }
.orderslist .ordercard .ownerline .ownername{position: absolute; left: 15px; top: 9px; color: #ffffff; font-size: 100%; font-weight: bold;}
.orderslist .ordercard .ownerline .ownername a{color: #ffffff !important; text-decoration: underline;}
.orderslist .ordercard .ownerline .ownercity{position: absolute; left: 15px; bottom: 9px; font-size: 65%; font-weight: normal; color: #ffffff}



.preorder-line {width: calc(100% - 20px); margin: 10px;  text-align: left; }
.preorder-line .title{font-size: 150%; font-weight: bold; padding-left: 10px; padding-bottom: 8px;}
.preorder-line .subtitle{font-size: 90%; color: rgba(0,0,0,0.7); padding: 5px 0 10px 0;}
.preorder-line .ownerline{position: relative; font-size: 120%; background-color: #cccccc}
.preorder-line .ownerline .ownername{position: absolute; left: 15px; top: 9px; color: #ffffff; font-size: 100%; font-weight: bold;color: #000000;}
.preorder-line .ownerline .ownername a{color: #ffffff !important; text-decoration: underline; color: #000000 !important;}
.preorder-line .ownerline .ownercity{position: absolute; left: 15px; bottom: 9px; font-size: 65%; font-weight: normal;}

.queueitem td {text-align: left; padding-top:3px; padding-bottom: 3px;}
.queueitem {height: auto;}
.queueitem td {height: auto; padding-top:3px; padding-bottom: 3px;}
.queueitem td:first-of-type {padding-left: 10px;}
.queueitem td:last-of-type {padding-right: 10px;}