﻿/* Основной файл стилей */

@font-face {
    font-family: "Scada";
    src:
        url('../fonts/Scada-Regular.woff') format("woff"    ),
        url('../fonts/Scada-Regular.ttf' ) format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Scada";
    src:
        url('../fonts/Scada-Bold.ttf' ) format("truetype");
    font-weight: bold;
    font-style: normal;
}




* {
    font-family: "Scada", arial, sans-serif;
    margin:0;
    padding:0;
    box-sizing:border-box;
    line-height:1.3;
}


html, body {
    font-size: 16px;
    margin:0;
    padding:0;
}


table {
    border-collapse: collapse;
}



a {
    /* color: #005b88; */
    color: #0088ff;
    text-decoration: none;
}

    a:hover {
        text-decoration: underline;
    }


a[target="_blank"] {
    color: crimson;
}


ul {
    margin-left: 30px;
    margin-top: 0;
    padding-top: 0;
}

li {
    font-size:1.1rem;
}

ul.expand li {
    margin-bottom: 20px;
}


ul div.contact, ul div.contact a {
    font-size:1.5rem;
}

ul.description li {
    font-size: 1rem;
    color: #555;
    margin-bottom: 3px;
}


li div.description {
    padding-left: 15px;
    font-size: 1rem;
    color: #333;
    margin-top: 10px;
}


.page-title {
    color: #0080ff;
    text-align:center;
    display: block;
    font-size: 2.3rem;
    padding: 0 20px 10px 20px;
    border-bottom: 1px solid #DDD;
    margin-bottom: 10px;
    font-weight: normal;
}

.page-title-ext {
    color: #333;
    text-align:center;
    display: block;
}




.page-part {
    padding: 60px 0;
}

.page-part-title {
    font-size: 1.5rem;
    text-transform: uppercase;
    color: #777;
    font-weight: bold;
    margin-bottom: 30px;
}


.page-part-1 {
    background: #ffffff;
}

.page-part-2 {
    background: #f5f5f5;
}

.page-part-border-top {
    border-top: 1px solid #DDD;
}

.page-part-border-bottom {
    border-bottom: 1px solid #DDD;
}

.page-part-border-both {
    border-top   : 1px solid #DDD;
    border-bottom: 1px solid #DDD;
}


/* .page-part-content p { */
p {
    hyphens: auto;
    line-height: 1.3;
    font-size: 1.2rem;
    margin-bottom: 15px;
    text-align: justify;
}

/* .page-part-content p.remark { */
p.remark {
    hyphens: auto;
    color:#555; font-size:1rem; margin-top:20px; margin-bottom:0;
}




.page-subpart {
    margin-top:30px;
    margin-bottom:30px;
}


.page-subpart-title {
    font-size:1.5rem;
    color:#333;
    margin-bottom:10px;
}




.page-subpart2 {
    margin-top:30px;
    margin-bottom:20px;
}


.page-subpart2-title {
    font-size: 1.2rem;
    text-transform: uppercase;
    color: #555;
    margin-bottom: 20px;
}


.page-subpart3 {
    margin-bottom:20px;
}

.page-subpart3-title {
    font-size:1.2rem;
    color:#004080;
    margin-bottom:15px;
    border-bottom:1px solid #004080;
    padding-bottom:5px;
}



.page-toogle-container-title {
    margin-top:20px;
}

.page-toogle-container-title a {
    display: inline-block;
    font-size: 1.2rem;
    margin-bottom:10px;
}


.page-toogle-container-title div {
    display: inline-block;
    /* color:#0060F0; */
    color:#333333;
    font-size: 1.2rem;
    margin-bottom:10px;
    margin-top:20px;
}



.toogle-child-1 {
    background:#f5f5f5;
    padding:20px;
}

.toogle-child-2 {
    padding-left:20px;
}


img.product {
    max-width: 100%;
    border: 1px solid #DDD;
    vertical-align: top;
    margin-right: 15px;
}


div.field {
    display:inline-block;
    margin:0 30px 20px 0;
    vertical-align:top;
}

div.field label {
    color: #777;
    display: block;
    font-size: 0.95rem;
    margin-bottom: 3px;
}

div.field .value {
    font-size: 1.2rem;
}


/* Кнопка для перехода в начало страницы */

#id-to-top {
    z-index:1000;
    display:none;
    -border-radius:5px;
    border-radius:100px;
    position:fixed;
    bottom:20px;
    right:40px;
    color: #ddd;
    box-shadow:5px 5px 10px rgba(0,0,0,.5);
    background:rgba(0,0,0,0.6);
    text-decoration:none;
    border:1px solid #DDD;
}

#id-to-top:hover {
    color: #FFF;
    background:#333;
}





.toogle-block {
    animation: toogle-block 1s;
}

@keyframes toogle-block {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.toogle-none {
    animation: toogle-none 1s;
}

@keyframes toogle-none {
    from { opacity: 1; }
    to   { opacity: 0; }
}



table.grid {}
table.grid th { vertical-align:middle !important; padding:10px !important; border:1px solid #DDD !important; background:#EEE !important; }
table.grid td { vertical-align:middle !important; padding:10px !important; border:1px solid #DDD !important; }
table.grid td img { width:100% !important; }
table.grid td.center { text-align:center !important; }
table.grid td.right  { text-align:right  !important; }

table.grid.small td, table.grid.small th { font-size:0.9rem; }


.width800px { max-width:800px !important; }