@font-face {src: url("font/open-sans.ttf"); font-family: "Open sans";}
@font-face {src: url("font/open-sans-bold.ttf"); font-family: "Open sans bold";}

body {background:#f5f6f8;font-family: 'Open sans';margin:auto;}
a{text-decoration: none;}
b{font-family: "Open sans bold";}
li{list-style-type: none;}
ul{margin:0; padding:0;}
input,textarea{outline: none;}
input{}
textarea{font-size: 15px;font-family: "Open sans";resize: none;}
.page-not-found{width: 100%;height: 100vh;text-align: center;display: flex;flex-direction: column;justify-content: center;align-items: center;}
.page-not-found .top{color: #5879ba;font-size: 10em;font-family: 'Open sans bold';}
.page-not-found .bottom{color: #99a4b9;font-size: 2.5em;position: relative;top: -10px;}
.message{color: white;width: 100%;line-height: 50px;text-align: center;position: fixed;top: -50px;left: 0;z-index: 1;transition: .5s;cursor: pointer;}
.message.active{top: 0;}
.message.red{background: #a54b4b;}
.message.green{background: #5290c7;}
.success{background: #3665bf;color: white;padding: 20px;font-size: 20px;font-family: 'Open sans bold';position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);cursor: default;}

.sidebar{background: white;width: 250px;position: fixed;top: 120px;left: calc(50% + 420px);transform: translateX(-50%);box-shadow: 0 2px 10px #c5ccd147;}
.sidebar a{color: #71839b;font-family: 'Open sans bold';display: block;}
.sidebar a .item{line-height: 50px;padding: 0 15px;}
.sidebar a .item.active{box-shadow: 3px 0 0 #71839b inset;display: block;}
.sidebar a:nth-child(1){border-bottom: 1px solid #f5f6f8;}
.container{width: 500px;margin: auto;}
.logo{background-image:url("../image/logo.png");background-size: cover;width:246px;height: 80px;margin: 20px auto 20px;}
.bread{color: #939fbb;margin-bottom: 20px;text-align: center;}
.bread a{color: #5e7491;font-size: 17px;font-family: "Open sans bold";}
.page .information{background: white;padding: 15px;margin-bottom: 15px;box-shadow: 0 2px 10px #c5ccd147;cursor: default;}
.page .list{/* background: white; *//* box-shadow: 0 2px 10px #c5ccd147; */}

.page.main{}
.page.main .list{}
.page.main .list .item{background: white;padding: 20px;margin-bottom: 20px;box-shadow: 0 2px 10px #c5ccd147;}
.page.main .list .item .image{background-size: cover;height: 250px;}
.page.main .list .item .name{color: black;margin-top: 20px;font-size: 20px;font-family: 'Open sans bold';}
.page.main .list .item .text{color: black;line-height: 25px;margin-top: 10px;}
.page.main .list .item .date{color: #ababab;margin-top: 10px;font-size: 14px;}

.page.testnet{}
.page.testnet .list .item{color: #5e7491;padding: 15px;font-family: 'Open sans bold';}

.page.testnet-category{}
.page.testnet-category .list{}
.page.testnet-category .list .item{color: #5e7491;padding: 15px;font-family: 'Open sans bold';}

.page.article{}
.page.article .list{}
.page.article .list .item{color: #5e7491;padding: 15px;font-family: 'Open sans bold';}

.page.restore{
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.page.restore .title{
    color: #696969;
    font-size: 18px;
    font-family: 'Open sans bold';
    cursor: default;
}
.page.restore form{
    margin-top: 15px;
    display: flex;
}
.page.restore form input{
    width: 100%;
    padding: 15px;
    margin-right: 15px;
    border: 1px solid #a5b4c9;
}
.page.restore form .button{
    background: #4a89dc;
    color: #194073;
    line-height: 48px;
    padding: 0 15px;
    font-size: 15px;
    font-family: 'Open sans bold';
    cursor: pointer;
}

.material img{width: 100%;margin-top: 15px;border-radius: 7px;cursor: pointer;}
.material .title{color: #969ca5;padding: 15px;font-size: 25px;font-family: 'Open sans bold';text-align: center;cursor: default;}
.material .help{background: white;padding: 15px;margin-top: 15px;box-shadow: 0 2px 10px #c5ccd147;}
.material .help .name{font-size: 18px;font-family: 'Open sans bold';text-align: center;cursor: default;}
.material .help .list{margin-top: 15px;display: flex;justify-content: center;}
.material .help .list .item{background: #f6f7f9;color: #6c7d8f;line-height: 40px;padding: 0 15px;margin-right: 10px;font-size: 14px;font-family: 'Open sans bold';text-align: center;border-radius: 7px;border: 1px solid #e9e9e9;}
.material .instruction{background: white;line-height: 27px;padding: 15px 20px;margin-top: 15px;font-family: 'Open sans bold';box-shadow: 0 2px 10px #c5ccd147;cursor: default;}
.material .instruction a{color: rgb(45 100 187 / 95%);}
.material .text{margin-bottom: 20px;}
.material .block{background: white;line-height: 25px;padding: 15px 20px 20px 20px;margin-top: 15px;box-shadow: 0 2px 10px #c5ccd147;cursor: default;}
.material .block h2{line-height: 33px;margin-top: 5px;margin-bottom: 12px;}
.material .block a{color: rgb(45 100 187 / 95%);font-family: "Open sans bold";}

/* картинка на странице */
.minimized {
    width: 300px;
    cursor: pointer;
    border: 1px solid #FFF;
}

.minimized:hover {
    border: 1px solid yellow;
}

/* увеличенная картинка */
#magnify {
    display: none;

    /* position: absolute; upd: 24.10.2016 */
    position: fixed;
    max-width: 100%;
    height: auto;
    z-index: 9999;
}

#magnify img {
    width: 100%;
}

/* затемняющий фон */
#overlay {
    display: none;

    background: #000;
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 0.5;
    z-index: 9990;
}

/* кнопка закрытия */
#close-popup {
    width: 30px;
    height: 30px;

    background: #FFFFFF;
    border: 1px solid #AFAFAF;
    border-radius: 15px;
    cursor: pointer;
    position: absolute;
    top: 15px;
    right: 15px;
}

#close-popup i {
    width: 30px;
    height: 30px;
    background: url(https://codernote.ru/files/cross.png) no-repeat center center;
    background-size: 16px 16px;
    display: block;
}

@keyframes rota {
    25% { transform: rotate(360deg); }
}

#close-popup:hover {
    animation: rota 4s infinite normal;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}