html, body { 
    position: relative; 
    width: 100%; 
    min-width: 600px;      
    height: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
    background: #f7f1ea;
}
div, section, p, img, a, ul, li, button, input, textarea, select, h1, h2, h3, h4, br {
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
}
a {
    text-decoration: none;
    color: inherit;
    color: expression(this.parentNode.currentStyle['color']);
    cursor: pointer;
}
@font-face {
    font-family: MullerRegular;
    src: url(/data/fonts/MullerRegular.ttf);
}
@font-face {
    font-family: MullerRegular;
    src: url(/data/fonts/MullerRegular.eot);
}
@font-face {
    font-family: MullerLight;
    src: url(/data/fonts/MullerLight.ttf);
}
@font-face {
    font-family: MullerLight;
    src: url(/data/fonts/MullerLight.eot);
}
@font-face {
    font-family: MullerThin;
    src: url(/data/fonts/MullerThin.ttf);
}
@font-face {
    font-family: MullerThin;
    src: url(/data/fonts/MullerThin.eot);
}
@font-face {
    font-family: MullerBlack;
    src: url(/data/fonts/MullerBlack.ttf);
}
@font-face {
    font-family: MullerBlack;
    src: url(/data/fonts/MullerBlack.eot);
}
#page {
    position: relative;
    min-height: 100%;
}
#header {
    position: relative;
    background: #fff;
}
#wrapper { 
    position: relative;
    padding-bottom: 200px;
    min-height: 100%;
}
#footer {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 195px;
    background: linear-gradient(to bottom right, #284d5d, #2f343a);
    border-top: #990b0b solid 5px;
    z-index: 0;
}
#top {
    position: relative;
    max-width: 80%;
    height: 100px;
    margin: 0 auto;
}
#top .logo {
    float: left;
    width: 78px;
    height: 78px;
    margin-top: 15px;
    background: url(/data/images/sntc-logo.png);
}
#address-top {
    padding: 25px 0 0 90px;
}
#address-top .left {
    float: left;
    font: 700 20pt Roboto, Arial, sans-serif;
    line-height: 1.1;
}
#address-top .right {
    float: right;
    font: 400 12pt Roboto, Arial, sans-serif;
    text-align: right;
}
.menu-top-box {
    background: #990b0b;
}
#menu-top {
    max-width: 80%;
    margin: 0 auto;
    font: 400 16pt Roboto, Arial, sans-serif;
    color: #fff;
}
#menu-top .item {
    float: left;
    height: 36px;
    padding: 10px 15px 0 15px;
    transition: all 0.5s ease;
}
#menu-top .item:hover {
    background-color: #6F0303;
}
#menu-top .item-current {
    float: left;
    height: 36px;
    padding: 10px 15px 0 15px;
    background: #000;
}
.module {
    position: relative;
    max-width: 80%;
    margin: 0 auto;
    padding: 0 20px;
}
h1.page-title-warm {
    padding: 20px 0;
    font: 400 50pt Roboto;
    line-height: 1.1;
    text-align: center;
    color: #990b0b;
}
h1.page-title-cold {
    padding: 20px 0;
    font: 400 50pt Roboto;
    line-height: 1.1;
    text-align: center;
    color: #284d5d;
}
h1.page-title-invert {
    margin: 20px 0;
    padding: 10px 0;
    font: 700 38pt Roboto;
    line-height: 1.1;
    text-align: center;
    color: #fff;
    text-shadow: #284d5d 0 0 10px;
}
h2.warm {
    margin-bottom: 20px;
    font: 400 28pt Roboto;
    color: #990b0b;
    text-align: center;
}
h3.warm, span.warm {
    padding: 20px 0;
    font: 700 18pt Roboto;
    color: #990b0b;
    text-align: center;
}
h3.cold, span.cold {
    padding: 20px 0;
    font: 700 18pt Roboto;
    color: #284d5d;
    text-align: center;
}
.text-regular {
    font: 400 14pt Roboto;
}
.text-regular p {
    padding-bottom: 15px;
}
.text-small {
    font: 400 9pt Roboto;
}
.text-footer {
    padding-top: 50px;
    font: 400 11pt Roboto;
    color: #fff;
}
.text-footer p {
    padding-bottom: 10px;
}
.link, .link-invert {
    text-decoration: underline;
    cursor: pointer;
}
.sublink {
    border-bottom: dashed 1px;
}
.link:hover, .sublink:hover {
    color: #e00;
}
.link-invert:hover {
    color: #fff;
}
.white {
    padding: 50px 0;
    background: #fff;
}
div.warm {
    padding: 50px 0;
    background: #f7f1ea;
}
div.cold {
    padding: 50px 0;
    background: #e3e8e9;
}
.office {
    padding: 50px 0;
    background: url(/data/images/Perm-2.jpg) center center;
    background-size: cover;
}
.work {
    margin-right: -10px;
    font: 300 20pt Roboto;
    text-align: center;
    color: #fff;
}
.work-100 {
    height: 120px;
    padding: 10px 20px;
    margin: 0 10px 10px 0;
    background: rgba(153,11,11,0.7);
}
.work-33 {
    float: left;
    width: calc(33.3% - 50px);
    height: 120px;
    padding: 10px 20px;
    margin: 0 10px 10px 0;
    background: rgba(153,11,11,0.7);
}
.work-66 {
    float: left;
    width: calc(66.6% - 50px);
    height: 120px;
    padding: 10px 20px;
    margin: 0 10px 10px 0;
    background: rgba(153,11,11,0.7);
}
.work-50 {
    float: left;
    width: calc(50% - 50px);
    height: 120px;
    padding: 10px 20px;
    margin: 0 10px 10px 0;
    background: rgba(153,11,11,0.7);
}
.intro {
    margin: 30px -20px 0 0;
    display: flex;
    display: -webkit-flex;
    display: -moz-flex;    
    flex-wrap: wrap;
    align-content:stretch;
}
.intro .item {
    float: left;
    width: calc(50% - 20px);
    margin: 0 20px 20px 0;
    padding-top: 210px;
    background: #fff;
    background-position: top center;
    background-repeat: no-repeat;
    transition: all 0.5s ease;
    display: flex;
    display: -webkit-flex;
    display: -moz-flex;
    flex-wrap: wrap;
    align-content:space-between;        
}
.intro .item:hover {
    background-color: #EBCCC1;
}
.intro .item p {
    padding: 0 20px;
    font: 400 14pt Roboto;
}
.intro .item button {
    width: calc(100% - 40px);
    margin: 20px;
    padding: 8px 15px;
    font: 700 18pt Roboto;
    color: #990b0b;
    background: none;
    border: #990b0b solid 2px;
    cursor: pointer;
    transition: all 0.5s ease;
}
.intro .item button:hover {
    color: #fff;
    background: #990b0b;
}
.experts {
    font: 400 14pt Roboto;
    border-top: #333 solid 1px;
}
.experts .item {
    padding: 10px 0;
    border-bottom: #333 solid 1px;
}
.experts .item .item-name {
    float: left;
    width: calc(20% - 20px);
    margin-left: 20px;
}
.experts .item .item-doc {
    float: right;
    width: 77%;
}
.experts .item .item-doc .doc-name {
    float: left;
    width: 20%;
}
.experts .item .item-doc .doc-title {
    float: right;
    width: 77%;
}
.experts .item .item-doc .doc-delimiter {
    width: 100%;
    margin: 10px 0;
    border-bottom: #aaa dashed 1px;
}
.clients {
    margin-right: -20px;
}
.clients .item {
    float: left;
    width: 200px;
    height: 200px;
    margin: 0 20px 20px 0;
    padding: 20px 5px 0 5px;
    text-align: center;
    background: #fff;
    outline: #DCCFC7 solid 1px;
}
.inset {
    float: right;
    width: 200px;
    margin: 0 0 10px 20px;
    padding: 20px;
    background: #fff;
    outline: #DCCFC7 solid 1px;
}
.inset .doc {
    margin-top: 10px;
    padding: 5px 0 0 30px;
    min-height: 24px;
    font: 400 9pt Roboto;
    background: url(/data/images/icon-docx.png) 0 0 no-repeat;
}
button.big {
    width: 100%;
    margin: 30px 0;
    padding: 20px;
    font: 700 18pt Roboto;
    color: #990b0b;
    text-align: center;
    background: none;
    border: #990b0b solid 2px;
    cursor: pointer;
    transition: all 0.5s ease;
}
button.big:hover {
    color: #fff;
    background: #990b0b;
}
form#docs-upload {
    display: none;
}
#files-list p {
    padding: 10px 20px;
    font: 400 11pt Roboto;
    border-bottom: #DCCFC7 solid 1px;
}
.document {
    min-height: 64px;
    padding: 20px 0 20px 70px;
    background: url(/data/images/icon-doc.png) 0 15px no-repeat;
    border-bottom: #DCCFC7 solid 1px;
}
.step-bar {
    margin-bottom: 20px;
    font: 400 18pt Roboto;
    color: #990b0b;
    border-bottom: #990b0b solid 2px;
}
.step-bar span {
    padding: 0 7px;
    color: #990b0b;
    font: 700 20pt Roboto;
}
.step-bar span.current {
    color: #fff;
    background: #990b0b;
}
#calculator {
    min-height: 350px;
}
div.step {
    position: relative;
    min-height: 350px;
}
.step-radio {
    padding: 8px 18px;
    margin-top: 20px;
    color: #284d5d;
    font: 400 14pt Roboto;
    text-align: center;
    border: #284d5d solid 2px;
    cursor: pointer;
    transition: all 0.5s ease;
}
.step-radio:hover {
    color: #fff;
    background: #284d5d;
}
.step-radio-select {
    padding: 10px 20px;
    margin-top: 20px;
    color: #fff;
    font: 400 14pt Roboto;
    text-align: center;
    background: #990b0b;
    cursor: pointer;
}
input.calc {
    width: 120px;
    margin: 0 10px;
    color: #000;
    font: 700 20pt Roboto;
    text-align: center;
    border-bottom: #990b0b solid 1px;
    background: none;
}
.step-left {
    float: left;
    width: 48%;
    text-align: right;
}
.step-right {
    float: right;
    width: 48%;
    text-align: left;
}
button.step {
    display: inline;
    opacity: 1;
    padding: 10px 20px;
    font: 700 14pt Roboto;
    color: #990b0b;
    background: none;
    border: #990b0b solid 2px;
    cursor: pointer;
    transition: all 0.5s ease;
}
button.step:hover {
    color: #fff;
    background: #990b0b;
}
button.step-disabled {
    display: inline;
    opacity: 0.2;
    padding: 10px 20px;
    font: 700 14pt Roboto;
    color: #990b0b;
    background: none;
    border: #990b0b solid 2px;
    transition: all 0.5s ease;
}
.map {
    float: right;
    width: calc(50% - 20px);
    height: 500px;
    margin-left: 20px;
    background: #ddd url(/data/images/loading-96.gif) center center no-repeat;
}
.clear {
    clear: both;
}