#SUO {
    font-family: arial, sans-serif;
    border-collapse: collapse;
    width: 100%;
    font-size:smaller;
}

#SUO td,
#SUO th {
    border: 1px solid #dddddd;
    text-align: center;
    padding: 3px;
}

.grey
{ background-color: #dddddd61; }

.bold,
#SUO th {
    font-weight: bold;
}

/* Диаграмма */

.vertical .progress-fill span
{ display: none; }

h2.header-title {
    display: block;
    font: normal 2.4rem / 1.2 "PT Sans", Helvetica, Arial, sans-serif;
    color: #69321f;
    font-size: 1.27rem;
    line-height: 1;
    margin-bottom: 10px;
    font-weight: bold;
}

.horizontal .progress-bar {
    float: left;
    height: 45px;
    width: 100%;
    padding: 12px 0;
}

.horizontal .progress-track {
    position: relative;
    width: 100%;
    height: 20px;
    background: #ebebeb;
}

.horizontal .progress-fill {
    position: relative;
    background: #888888a6;
    height: 20px;
    width: 50%;
    color: #fff;
    text-align: center;
    font-size: 12px;
    line-height: 20px;
}

.rounded .progress-track,
.rounded .progress-fill {
    border-radius: 3px;
    box-shadow: inset 0 0 5px #000000;
}

/* Vertical */

.vertical .progress-bar {
    float: left;
    height: 150px;
    width: 40px;
    margin-left: 25px;
}

.vertical .progress-track {
    position: relative;
    width: 40px;
    height: 100%;
    background: #ebebeb;
}

.vertical .progress-fill {
    position: relative;
    background: #888888a6;
    height: 50%;
    width: 40px;
    color: #fff;
    text-align: center;
    font-size: 12px;
    line-height: 20px;
}

.rounded .progress-track,
.rounded .progress-fill {
    box-shadow: inset 0 0 5px #000000;
    border-radius: 3px;
}

.progress-bar {
    background-color: #623b2a;
}

.legend {
    display: block;
    float: right;
    margin-top: 20px;
}

.legend li {
    margin-top: 5px;
    margin-left: 12px;
    text-indent: 1em;
}

.legend span {
    border: 1px solid #ccc;
    float: right;
    width: 12px;
    height: 12px;
    margin: 2px;
    margin-left: 5px;
}

.legend .green,
.progress-fill.green {
    background-color: #00b050;
}
.legend .yellow,
.progress-fill.yellow {
    background-color: #ffff00;
}
.legend .red,
.progress-fill.red {
    background-color: #ff0000;
}

/* Loader */

#floatingBarsG{
    position:relative;
    width:60px;
    height:75px;
    margin:55px 0 0 80px;
}

.blockG{
    position:absolute;
    background-color:rgb(255,255,255);
    width:10px;
    height:23px;
    border-radius:8px 8px 0 0;
    -o-border-radius:8px 8px 0 0;
    -ms-border-radius:8px 8px 0 0;
    -webkit-border-radius:8px 8px 0 0;
    -moz-border-radius:8px 8px 0 0;
    transform:scale(0.4);
    -o-transform:scale(0.4);
    -ms-transform:scale(0.4);
    -webkit-transform:scale(0.4);
    -moz-transform:scale(0.4);
    animation-name:fadeG;
    -o-animation-name:fadeG;
    -ms-animation-name:fadeG;
    -webkit-animation-name:fadeG;
    -moz-animation-name:fadeG;
    animation-duration:1.2s;
    -o-animation-duration:1.2s;
    -ms-animation-duration:1.2s;
    -webkit-animation-duration:1.2s;
    -moz-animation-duration:1.2s;
    animation-iteration-count:infinite;
    -o-animation-iteration-count:infinite;
    -ms-animation-iteration-count:infinite;
    -webkit-animation-iteration-count:infinite;
    -moz-animation-iteration-count:infinite;
    animation-direction:normal;
    -o-animation-direction:normal;
    -ms-animation-direction:normal;
    -webkit-animation-direction:normal;
    -moz-animation-direction:normal;
}

#rotateG_01{
    left:0;
    top:27px;
    animation-delay:0.45s;
    -o-animation-delay:0.45s;
    -ms-animation-delay:0.45s;
    -webkit-animation-delay:0.45s;
    -moz-animation-delay:0.45s;
    transform:rotate(-90deg);
    -o-transform:rotate(-90deg);
    -ms-transform:rotate(-90deg);
    -webkit-transform:rotate(-90deg);
    -moz-transform:rotate(-90deg);
}

#rotateG_02{
    left:8px;
    top:10px;
    animation-delay:0.6s;
    -o-animation-delay:0.6s;
    -ms-animation-delay:0.6s;
    -webkit-animation-delay:0.6s;
    -moz-animation-delay:0.6s;
    transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    -webkit-transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
}

#rotateG_03{
    left:25px;
    top:3px;
    animation-delay:0.75s;
    -o-animation-delay:0.75s;
    -ms-animation-delay:0.75s;
    -webkit-animation-delay:0.75s;
    -moz-animation-delay:0.75s;
    transform:rotate(0deg);
    -o-transform:rotate(0deg);
    -ms-transform:rotate(0deg);
    -webkit-transform:rotate(0deg);
    -moz-transform:rotate(0deg);
}

#rotateG_04{
    right:8px;
    top:10px;
    animation-delay:0.9s;
    -o-animation-delay:0.9s;
    -ms-animation-delay:0.9s;
    -webkit-animation-delay:0.9s;
    -moz-animation-delay:0.9s;
    transform:rotate(45deg);
    -o-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
}

#rotateG_05{
    right:0;
    top:27px;
    animation-delay:1.05s;
    -o-animation-delay:1.05s;
    -ms-animation-delay:1.05s;
    -webkit-animation-delay:1.05s;
    -moz-animation-delay:1.05s;
    transform:rotate(90deg);
    -o-transform:rotate(90deg);
    -ms-transform:rotate(90deg);
    -webkit-transform:rotate(90deg);
    -moz-transform:rotate(90deg);
}

#rotateG_06{
    right:8px;
    bottom:7px;
    animation-delay:1.2s;
    -o-animation-delay:1.2s;
    -ms-animation-delay:1.2s;
    -webkit-animation-delay:1.2s;
    -moz-animation-delay:1.2s;
    transform:rotate(135deg);
    -o-transform:rotate(135deg);
    -ms-transform:rotate(135deg);
    -webkit-transform:rotate(135deg);
    -moz-transform:rotate(135deg);
}

#rotateG_07{
    bottom:0;
    left:25px;
    animation-delay:1.35s;
    -o-animation-delay:1.35s;
    -ms-animation-delay:1.35s;
    -webkit-animation-delay:1.35s;
    -moz-animation-delay:1.35s;
    transform:rotate(180deg);
    -o-transform:rotate(180deg);
    -ms-transform:rotate(180deg);
    -webkit-transform:rotate(180deg);
    -moz-transform:rotate(180deg);
}

#rotateG_08{
    left:8px;
    bottom:7px;
    animation-delay:1.5s;
    -o-animation-delay:1.5s;
    -ms-animation-delay:1.5s;
    -webkit-animation-delay:1.5s;
    -moz-animation-delay:1.5s;
    transform:rotate(-135deg);
    -o-transform:rotate(-135deg);
    -ms-transform:rotate(-135deg);
    -webkit-transform:rotate(-135deg);
    -moz-transform:rotate(-135deg);
}



@keyframes fadeG{
    0%{
        background-color:rgb(130,104,130);
    }

    100%{
        background-color:rgb(255,255,255);
    }
}

@-o-keyframes fadeG{
    0%{
        background-color:rgb(130,104,130);
    }

    100%{
        background-color:rgb(255,255,255);
    }
}

@-ms-keyframes fadeG{
    0%{
        background-color:rgb(130,104,130);
    }

    100%{
        background-color:rgb(255,255,255);
    }
}

@-webkit-keyframes fadeG{
    0%{
        background-color:rgb(130,104,130);
    }

    100%{
        background-color:rgb(255,255,255);
    }
}

@-moz-keyframes fadeG{
    0%{
        background-color:rgb(130,104,130);
    }

    100%{
        background-color:rgb(255,255,255);
    }
}