@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap");

body { background-color:#e0e0e0; background-color:#f2f2f2; padding:0; margin:0; font-family:Roboto; font-size:12pt; }
h1 { font-weight:300; color:#423f34; }
h3 { font-weight:300; }
a { color:inherit; }

input,select { font-family: Roboto; font-size: 12pt; width:150px; color: #333333; font-weight: 300; border: 0px; padding: 10px; margin: 1px; border-radius: 2.5px; height:39px; background-color:white;}

input[type=submit] { background-color:#ffd203; color:#323141; -webkit-appearance:none; }

.input_blocks {display:flex; flex-direction: row; padding: 7px 0px 7px 0px; flex-wrap: wrap; }
.input_block { display:flex; flex-direction: column; text-transform:uppercase; font-size:9pt; padding: 5px 0px 5px 0px; }
.input_title { color:#6e6e6e; font-weight:350; font-size:8pt; }
.input_text { }
.input_check { display:flex; height:100%; align-items: center; justify-content: center; padding:5px;}

.clear { display:inline;  cursor:pointer; padding-left:1px; font-size:8pt; font-weight:300; }

#payment_blocks {  display:flex; flex-direction: column; }
.payment_block { display:flex; }
.del_payment { display:flex;  justify-content: center; align-items:center; font-size:16pt; color:gray; min-width:40px; cursor:pointer; }

#company { display:none; }
#INN { display:none; }

#option_add { display:flex; color:gray; font-size:10pt;}
.option_add_link { color:gray; font-size:10pt; text-decoration: underline; cursor:pointer; }

main { max-width:95%; margin:0px auto; }

.max980 { max-width:980px; margin:0px auto; }


.header { display:flex; flex-direction: row; justify-content: space-around; align-items:center; width:100%; background-color:#333333; color:#fafafa; font-size:24pt; height:70px; }

.logo_block { display:flex; font-weight: bold;  }
.logo_part_img { font-weight: bold; background: url("img/univer_logo.png") no-repeat center center; background-size: contain; width:80px; height:70px; }
.logo_direction { width:7px; }
.logo_part_text { display:flex; flex-direction: column; justify-content: center; align-items:center; font-weight: 300; color:#f7b82b; color:white; }
.logo_part_top { font-weight: normal; color:#f7b82b; color:#fafafa; }
.logo_part_sub { font-weight: 300; font-size:10pt; color:#fafafa; }

.menu { font-size:12pt; color:#f8bf28; color:#fafafa; }
.header a { color:#fafafa; text-decoration:none; }

.phone { font-weight:300; color:#f8bf28; }

.button_block { display:flex; flex-direction: row; justify-content: space-between; }
.button_title { display: inline-block; padding:10px 35px 10px 35px; background:#ffd203; color:#323141; font-weight:300; border-radius: 2.5px; cursor:pointer; }
#button_title2 { background:#d9032a; color:white; }

.polis_table { display:grid; grid-row-gap:2px; place-items: center; grid-template-columns: auto auto auto auto auto auto auto auto auto; justify-items:start; }

.OA_table { display:grid; grid-row-gap:2px; place-items: center; grid-template-columns: auto auto auto auto auto auto auto auto; justify-items:start; }
.OA_th { text-transform: uppercase; font-size: 8pt; color:#6e6e6e; padding:0px 0px 0px 10px; text-transform: uppercase; font-weight:350;  }
.OA_cell { width:100%; min-height:17px; background-color:white; color: #333333; color:#423f34; color:#949494; color:#6c6c6c; font-size: 11pt; font-weight: 400; padding:10px 0px 10px 10px;  }
.OA_total { color: #6c6c6c; font-size:12pt; font-weight:300; padding: 10px 0px 0px 10px; }
.bold { font-weight:bold; }

.left_angle { border-radius: 2.5px 0px 0px 2.5px; }
.right_angle { border-radius: 0px 2.5px 2.5px 0px;  }

.AVR_table { display:grid; grid-row-gap:2px; place-items: center; grid-template-columns: auto auto auto auto auto auto auto auto auto auto auto; justify-items:start; }

.action_block { display:flex; justify-content:space-between; align-items:center; min-height:114px;}

.download_block { display:flex; flex-direction: column; justify-content:flex-start; align-items:center; width:70px; padding-top:25px; }
.download_icon { background: url('/img/excel_logo.svg') no-repeat center center; width:70px; height:70px; }
.download_title {  }

.navi { color:#6e6e6e; font-size:9pt; }

footer { display: flex; flex-flow: row wrap; justify-content: space-around; background-color: #1c1c1c; font-family: "Roboto", sans-serif; color: white; padding:60px 20px 60px 20px; margin-top:70px;}
.contact { display: flex; flex-flow: column nowrap; justify-content: baseline; width: 30%; margin: 10px 0px 40px 0px; }
.contact_title { display: flex; font-size: 18px; }
.contact_address { display: flex; font-size: 14px; color: #999999; }

.ui-menu { position:absolute; padding: 2px; margin: 0; display: block;  list-style: none; cursor: default; border: 1px solid #dddddd; background: #eeeeee; }
.ui-menu-item { zoom: 1; width: 100%; padding:5px; cursor:pointer; }
.ui-corner-all { display:flex; }
.ui-corner-all a { text-decoration: none;  padding: .2em .4em; line-height: 1.5; zoom: 1; }

.ui-corner-all div { padding:2px; }
.item_hidden { display:none; }

.cell_status { display:inline-block; border-radius:5px; padding:1px 5px 1px 5px; }

.status_gray { background-color:#e9edff; background-color:#ee9786; color:white; }
.status_bordo { background-color:#84011c; background-color:#c17961; color:white; }
.status_red { background-color:#ff395d; background-color:#e8d86b; color:white; }
.status_orange { background-color:orange; background-color:#6a9a6a; color:white; }
.status_yellow { background-color:#d8c372; background-color:#6ba5a7; color:white; }
.status_green { background-color:#24b902; background-color:#4a7564; color:white; }

.status_nocolor { border: 1px solid gray; font-weight:300; cursor:pointer; color: #6e6e6e; }
.status_nocolor a { text-decoration: none; }

.status_block { display:flex; flex-flow: row nowrap; justify-content:space-between; align-items:center; width:95%; }
.status_point { width: 30px; height: 30px; background: #24b902; background:#ffd203; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; cursor:pointer; }
.status_title { padding-top:40px; }
.status_line { background:#24b902; background:#ffd203; width:20%; height:3px; }
.future { background:#d5d3c9; }

.logout { font-size:9pt; color: #6e6e6e; position: absolute; right:0; padding:23px; }

.light { color:#a5a08b; color:#949494; color:#6e6e6e; font-weight: 350; }

.about_link { font-size:10pt; color: #6c6c6c; padding-top:15px; }

.h1_block { display:flex; justify-content:space-between; padding-top:25px; padding-bottom:20px; align-items:center; }
.h1_title { font-weight: 300; color: #423f34; font-size: 2em; }
.h1_button { display: inline-block; padding: 7px 25px 7px 25px; background: #ffd203; color: #323141; font-size:10pt; font-weight: 400; text-transform:uppercase; border-radius: 2.5px; cursor: pointer; }

.agent_title { font-weight:300; padding-bottom:20px; color: #6e6e6e; font-size:9pt; }

#status_notice { display:flex; flex-direction: row; justify-content: center; font-size:10pt; font-weight:300; }
#status_notice_text { background-color:white; padding:10px; border-radius: 5px;}

.year_grid { display:grid; width:auto; grid-row-gap:12px; place-items:start; justify-items:start; }
.year_grid div { background-color:white; width:100%; border:1px solid #f2f2f2; }

.page_menu_block { display:flex; color:#6c6c6c; justify-content: center; }
.page_menu { background-color:white; border-radius: 2.5px; padding:10px 10px 10px 10px; margin:0px 10px 10px 10px; }

.green { color:green; }
.red { color:#ee9786; }
.yellow { color:#e8d86b; }

#address option { width:800px; }

#page_block { display:flex; flex-direction: row-reverse; justify-content:right; align-items:center; height:50px; font-size:10pt; }
.page_link { display:flex; color: #6c6c6c; color:lightgray; cursor:pointer; border: 1px solid lightgray; border-radius: 5px; padding: 1px 5px 1px 5px; margin:4px; }
.page_link.num { color:gray; border: 1px solid gray; }

.del_OA { color:red; }

@keyframes render {
  0% {
    stroke-dasharray: 0 100;
  }
}

.canvas { display: flex; justify-content: space-between; align-items: center; max-width: 800px; }

.legend { max-width: 250px; margin-left: 30px; }

.title {   font-family: "Verdana", sans-serif; font-size: 18px; line-height: 21px; color: #591d48; }

.caption-list { margin: 0; padding: 0; list-style: none; }

.caption-item { position: relative; margin: 20px 0; padding-left: 30px; font-family: "Verdana", sans-serif; font-size: 16px; line-height: 18px; color: #591d48; cursor: pointer; }

.caption-item:hover { opacity: 0.8; }

.caption-item::before { content: ""; position: absolute; top: 0; left: 0; width: 20px; height: 20px; border-radius: 8px; }

.caption-item:nth-child(1)::before { background-color: #86cfa3; }
.caption-item:nth-child(2)::before { background-color: #a2c6e0; }
.caption-item:nth-child(3)::before { background-color: #ffc7ec; }
.caption-item:nth-child(4)::before { background-color: #f8faa0; }
.caption-item:nth-child(5)::before { background-color: #adffd8; }
.caption-item:nth-child(6)::before { background-color: #f2c48f; }
.caption-item:nth-child(7)::before { background-color: #e3bfe2; }

.chart { min-width: 500px; }

.unit { fill: none; stroke-width: 10; cursor: pointer; animation-name: render; animation-duration: 1.5s; transition-property: all;  transition-duration: 1.5s; }
.unit:nth-child(1) { stroke: #86cfa3; }
.unit:nth-child(2) { stroke: #a2c6e0; }
.unit:nth-child(3) { stroke: #ffc7ec; }
.unit:nth-child(4) { stroke: #f8faa0; }
.unit:nth-child(5) { stroke: #adffd8; }
.unit:nth-child(6) { stroke: #f2c48f; }
.unit:nth-child(7) { stroke: #e3bfe2; }

.li_marker { display:inline-block; width:18px; margin-right:10px; border-radius: 2.5px; }

label.switch { 
  text-align: left;
  width: 60px;
  height: calc(60px / 2);
  border-radius:60px;   
  background-color:#ffd203;
  display: inline-block;
  position: relative;
  cursor: pointer;
}

label.switch > span {
  display: block;
  width: 100%;
  height: 100%;
}

label.switch > input[type="checkbox"] {
  opacity: 0;
  position: absolute;
}

label.switch > span:before, label.switch > span:after {
  content: "";
  cursor: pointer;
  position: absolute;
}

label.switch > input[type="checkbox"]:focus ~ span {
  box-shadow: 0 0 0 0px #ffd203;
}

label.switch > input[type="checkbox"]:checked:focus ~ span {
  box-shadow: 0 0 0 0px #fff;
}

label.switch > span {
  border-radius: 60px;   
}

label.switch > span:before {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  background-color: white;
  border-radius: 60px;
  transition: opacity .2s ease-out .1s, transform .2s ease-out .1s;
  transform: scale(1);
  opacity: 1;
}

label.switch > span:after{
  top: 50%;
  z-index: 3;
  transition: transform .4s cubic-bezier(0.44,-0.12, 0.07, 1.15);
  width: calc(60px / 2);
  height: calc(60px / 2);
  transform: translate3d(0, -50%, 0);
  background-color: #fff;
  border-radius: 100%;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .3); 
}

label.switch > input[type="checkbox"]:checked ~ span:before {
  transform: scale(0);
  opacity: .7;
}

label.switch > input[type="checkbox"]:checked ~ span:after {
  transform: translate3d(100%, -50%, 0);
}

.switch input { width:auto; }


.lds-facebook {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-facebook div {
  display: inline-block;
  position: absolute;
  left: 8px;
  width: 16px;
  background: #ffd203;
  animation: lds-facebook 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
}
.lds-facebook div:nth-child(1) {
  left: 8px;
  animation-delay: -0.24s;
}
.lds-facebook div:nth-child(2) {
  left: 32px;
  animation-delay: -0.12s;
}
.lds-facebook div:nth-child(3) {
  left: 56px;
  animation-delay: 0;
}
@keyframes lds-facebook {
  0% {
    top: 8px;
    height: 64px;
  }
  50%, 100% {
    top: 24px;
    height: 32px;
  }
}

@media (max-width: 480px) 
{
	.phone { display: none; }
	.logo_direction { width:5px; }
	.mobilehidden { display:none; }
}