* {
    margin: 0;
    padding: 0;
}

html {
    background-size: auto;
    width: auto;
    min-width: 100%;
    height: 100%;
}

body {
    background: #8bc0d5;
    background: -moz-linear-gradient(bottom, #8bc0d5 0%, #204b7c 100%);
    background: -webkit-linear-gradient(bottom, #8bc0d5 0%, #204b7c 100%);
    background: linear-gradient(to top, #8bc0d5 0%, #204b7c 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#8bc0d5', endColorstr='#204b7c', GradientType=0);
    line-height: 1.0;
    margin: auto;
    max-width: auto;
    height: 100%;
}

.wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
}

header {
    flex: 0 0 auto;
    padding: 0.375rem;
}

section {
    flex: 1 0 auto;
    height: 80%;
    overflow-x: auto;
}

footer {
    flex: 0 0 auto;
}

#scrap {
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

.fixFox {
    flex: 0 0 auto;
    position: absolute;
}

.scroll {
    flex: 1 0 auto;
    margin-right: -50px;
    /* maximum width of scrollbar */
    padding-right: 50px;
    /* maximum width of scrollbar */
    overflow-y: scroll;
}


/*-----Текст-----------------------------*/


/*:root {
    font-size: 16px;
}*/

@media only screen and (max-width: 400px) {
    body {
        font-size: 11px;
    }
    .wrapper {
        max-width: 400px;
    }
}

@media only screen and (max-width: 800px) {
    body {
        font-size: 14px;
    }
    .wrapper {
        max-width: 800px;
    }
}

@media only screen and (max-width: 1100px) {
    body {
        font-size: 16px;
    }
    .wrapper {
        max-width: 1100px;
    }
}

@media only screen and (min-width: 1100px) {
    body {
        font-size: 18px;
    }
    .wrapper {
        max-width: 2400px;
    }
}


/*----Таблица----------------------------*/

body,
div,
table,
thead,
tbody,
tfoot,
tr,
th,
td,
p {
    font-family: "Calibri";
}

.scrapgroup {
    border-collapse: separate;
    border-spacing: 2px;
    width: auto;
    background: #6fa9ff;
    font-family: "Calibri";
    font-size: 16px;
}

.scrapgroup tr th {
    border: 0px solid #f2f2f2;
    height: auto;
    vertical-align: middle;
    padding: 5px 7px;
    background: #959595;
    background: -moz-linear-gradient(top, #959595 0%, #0d0d0d 46%, #010101 50%, #0a0a0a 53%, #4e4e4e 76%, #383838 87%, #1b1b1b 100%);
    background: -webkit-linear-gradient(top, #959595 0%, #0d0d0d 46%, #010101 50%, #0a0a0a 53%, #4e4e4e 76%, #383838 87%, #1b1b1b 100%);
    background: linear-gradient(to bottom, #959595 0%, #0d0d0d 46%, #010101 50%, #0a0a0a 53%, #4e4e4e 76%, #383838 87%, #1b1b1b 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#959595', endColorstr='#1b1b1b', GradientType=0);
    font-weight: bold;
    text-align: left;
    font-size: 1rem;
    color: lightyellow;
}

.scrapgroup tr td:first-child,
.scrapgroup .g_scrap {
    border: 0px solid #f2f2f2;
    height: auto;
    vertical-align: middle;
    padding: 5px 10px;
    background: #6fa9ff;
    background: -moz-linear-gradient(top, #6fa9ff 0%, #2d83c9 19%, #00639c 50%, #0d69a7 81%, #3b79cf 100%);
    background: -webkit-linear-gradient(top, #6fa9ff 0%, #2d83c9 19%, #00639c 50%, #0d69a7 81%, #3b79cf 100%);
    background: linear-gradient(to bottom, #6fa9ff 0%, #2d83c9 19%, #00639c 50%, #0d69a7 81%, #3b79cf 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#6fa9ff', endColorstr='#3b79cf', GradientType=0);
    font-weight: bold;
    text-align: left;
    font-size: 0.875rem;
    color: lightyellow;
}

.scrapgroup tr td:last-child {
    display: none;
}

.scrapgroup tbody tr td {
    border: 0px solid black;
    height: auto;
    vertical-align: middle;
    padding: 2px 5px;
    background: rgb(246, 244, 202);
    background: -moz-linear-gradient(top, rgba(246, 244, 202, 1) 0%, rgba(255, 242, 204, 1) 23%, rgba(255, 236, 177, 1) 50%, rgba(255, 242, 204, 1) 80%, rgba(237, 235, 215, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(246, 244, 202, 1) 0%, rgba(255, 242, 204, 1) 23%, rgba(255, 236, 177, 1) 50%, rgba(255, 242, 204, 1) 80%, rgba(237, 235, 215, 1) 100%);
    background: linear-gradient(to bottom, rgba(246, 244, 202, 1) 0%, rgba(255, 242, 204, 1) 23%, rgba(255, 236, 177, 1) 50%, rgba(255, 242, 204, 1) 80%, rgba(237, 235, 215, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#f6f4ca', endColorstr='#edebd7', GradientType=0);
    text-align: right;
    font-size: 0.75rem;
    color: #000000;
}

#accordeon {
    width: auto;
}

.acc-head {
    cursor: pointer;
}

.acc-body {
    display: none;
}

header div {
    float: left;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
}

div {
    padding: 0px 0px;
}

form {
    position: relative;
    width: 150px;
    margin: 0;
}

.d1 input {
    width: 100%;
    height: 1.5rem;
    padding-left: 10px;
    border: 2px solid #4E9EE5;
    border-radius: 5px;
    outline: none;
    background: #F9F0DA;
}

.d1 button {
    position: absolute;
    top: 0;
    right: 0px;
    width: 1.5rem;
    height: 1.5rem;
    border: none;
    background: #4E9EE5;
    border-radius: 0 5px 5px 0;
    cursor: pointer;
}

.d1 button:before {
    /*content: "\f002" для символа*/
    font-family: FontAwesome;
    font-size: 0.825rem;
    color: #F9F0DA;
}

a {
    text-decoration: none;
    color: cyan;
    transition: all 0.3s ease-out;
    position: relative;
    vertical-align: middle;
    padding: 5px;
    margin: -0.5px;
}

a:hover {
    color: #F9F0DA;
}

.d2 {
    margin-left: 100px;
    padding: 7px;
    border: 0px solid rgb(66, 160, 241);
    /*background: linear-gradient(to bottom, #47a9ff, rgb(10, 85, 150));*/
    border-radius: 5px;
    cursor: pointer;
}


/*.d2:hover {
    background: linear-gradient(to top, #46a9ff, rgb(10, 85, 150));
}*/

.d7:after {
    content: "";
    clear: both;
    display: table
}

.d7 form {
    width: auto;
    float: left;
    margin-left: 0rem;
}

.d7 input {
    width: 150px;
    height: 1.625rem;
    padding-left: 10px;
    border-radius: 5px;
    border: 2px solid #324b4e;
    background: #17B7E8;
    outline: none;
    position: relative;
    transition: .3s linear;
}

.d7 input:focus {
    width: 200px;
}

.d7 button {
    width: 1.625rem;
    height: 1.625rem;
    background: none;
    border: none;
    position: absolute;
    top: 0px;
    right: 0;
}

.d7 button:before {
    /*content: "\f002" для символа*/
    font-family: FontAwesome;
    color: #324b4e;
}