@font-face {
    font-family:'PT Sans';
    src: url('./fonts/PT Sans.eot');
    src: url('./fonts/PT Sans.eot?#iefix') format('embedded-opentype'),
    url('./fonts/PT Sans.woff2') format('woff2'),
    url('./fonts/PT Sans.woff') format('woff'),
    url('./fonts/PT Sans.ttf') format('truetype'),
    url('./fonts/PT Sans.otf') format('opentype'),
    url('./fonts/PT Sans.svg#PT Sans') format('svg');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    unicode-range: U+0020-FB02;
}

@font-face {
    font-family:'PT Sans';
    src: url('./fonts/PT Sans Italic.eot');
    src: url('./fonts/PT Sans Italic.eot?#iefix') format('embedded-opentype'),
    url('./fonts/PT Sans Italic.woff2') format('woff2'),
    url('./fonts/PT Sans Italic.woff') format('woff'),
    url('./fonts/PT Sans Italic.ttf') format('truetype'),
    url('./fonts/PT Sans Italic.otf') format('opentype'),
    url('./fonts/PT Sans Italic.svg#PT Sans Italic') format('svg');
    font-weight: 400;
    font-style: italic;
    font-stretch: normal;
    unicode-range: U+0020-FB02;
}

@font-face {
    font-family:'PT Sans';
    src: url('./fonts/PT Sans Bold Italic.eot');
    src: url('./fonts/PT Sans Bold Italic.eot?#iefix') format('embedded-opentype'),
    url('./fonts/PT Sans Bold Italic.woff2') format('woff2'),
    url('./fonts/PT Sans Bold Italic.woff') format('woff'),
    url('./fonts/PT Sans Bold Italic.ttf') format('truetype'),
    url('./fonts/PT Sans Bold Italic.otf') format('opentype'),
    url('./fonts/PT Sans Bold Italic.svg#PT Sans Bold Italic') format('svg');
    font-weight: 700;
    font-style: italic;
    font-stretch: normal;
    unicode-range: U+0020-FB02;
}

@font-face {
    font-family:'PT Sans';
    src: url('./fonts/PT Sans Bold.eot');
    src: url('./fonts/PT Sans Bold.eot?#iefix') format('embedded-opentype'),
    url('./fonts/PT Sans Bold.woff2') format('woff2'),
    url('./fonts/PT Sans Bold.woff') format('woff'),
    url('./fonts/PT Sans Bold.ttf') format('truetype'),
    url('./fonts/PT Sans Bold.otf') format('opentype'),
    url('./fonts/PT Sans Bold.svg#PT Sans Bold') format('svg');
    font-weight: 700;
    font-style: normal;
    font-stretch: normal;
    unicode-range: U+0020-FB02;
}

* {
    margin: 0;
    padding: 0;
    border: 0;
    transition: 250ms ease;
}

html {
    height: 100%;
}

body {
    cursor: default;
    background-color: #c6c7c8;
    font-family: 'PT Sans', sans-serif;
    color: #3e3d40;
    font-size: 14px;
    height: 100%;
}

a {
    color: #3e3d40;
    text-decoration: none;
}

br.clear {
    clear: both;
}

div#page {
    width: 960px;
    min-height: 100%;
    margin: 0 auto;
    background-color: white;
}

div#header {
    width: 960px;
    height: 275px;
    background-repeat: no-repeat;
}

div#header a:hover {
    text-decoration: underline;
}

div#header ul {
    list-style-type: none;
}

div#header li {
    float: left;
}

div#header ul#smartnav {
    float: right;
    margin-top: 141px;
    margin-right: 20px;
}

div#header ul#smartnav li {
    width: 140px;
    color: #fff;
}

div#header ul#smartnav a {
    display: block;
    color: #fff;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
}

div#header ul#cart {
    float: right;
    margin-top: 35px;
    margin-right: 20px;
}

div#header ul#cart li {
    width: 140px;
    color: #fff;
}

div#header ul#cart a {
    display: block;
    color: #fff;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
}

div#header ul#issues {
    float: left;
    margin-top: 5px;
    margin-left: 155px;
}

div#header ul#issues li {
    display: flex;
    width: 160px;
    position: relative;
}

div#header ul#issues li:last-child {
    margin-left: 178px;
}

div#header ul#issues a {
    display: block;
    color: #fff;
    font-weight: bold;
    font-size: 22px;
    line-height: 1;
}

div#header ul#issues span {
    display: block;
    position: absolute;
    color: #fff;
    font-size: 20px;
    line-height: 1;
}

div#header ul#issues .current-issue-volume-number {
    bottom: 9px;
    left: -46px;
}

div#header ul#issues .next-issue-volume-number {
    bottom: 11px;
    left: -43px;
}

/* TODO: change bg color #FFCC36 */
ul#menu {
    display: flex;
    width: 960px;
    height: 42px;
    background-color: rgb(255, 204, 76);
    list-style-type: none;
    align-items: center;
}

ul#menu li {
    float: left;
    color: #58585a;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 18px;
    padding: 0 14px;
    border-right: 1px #fff solid;
}

ul#menu li:first-child {
    margin-left: 33px;
}

ul#menu li:last-child {
    border: 0;
}

ul#menu a {
    color: #58585a;
    font-size: 1em;
}

ul#menu a:hover, ul#menu a.act {
    color: #fefeff;
}

div#content {
    width: 900px;
    padding-top: 28px;
    padding-bottom: 24px;
    padding-left: 30px;
    color: #3e3d40;
}

div#content table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 900px;
}

div#content tr.bgc1 {
    background-color: #e3e3e3;
}

div#content td.bgc1 {
    background-color: #e3e3e3;
}

div#content td.bgc2 {
    background-color: #cccccd;
}

div#content td {
    padding: 12px;
    font-size: 14px;
    color: #3e3d40;
    vertical-align: top;
}

div#content td:first-child {
    width: 200px;
}

div#content td:last-child {
    width: 652px;
}

div#content td.abstract {
    font: 16px Times;
    line-height: 22px;
    text-align: justify;
}

div#content td.abstract p {
    font: 16px Times;
    line-height: 22px;
    text-align: justify;
}

div#content span.code {
    display: block;
    color: #87888a;
    font-size: 11px;
    margin-bottom: 6px;
}

div#content span.caption {
    display: block;
    color: #ff9600;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 10px
}
div#content span.caption:not(:first-child) {
    margin-top: 10px
}

div#content p {
    font-size: 14px;
    line-height: 20px;
    color: #3e3d40;
}

div#content span.authors {
    color: #87888a;
}

div#content h2 {
    display: block;
    font-size: 36px;
    line-height: 36px;
    color: #b1b3b4;
    font-weight: bold;
}

div#content h2.topic {
    margin-bottom: 15px;
    margin-left: 15px;
    font-size: 28px;
}

div#content td.spacer {
    background-color: #e3e3e3;
    padding: 11px;
}

div#content a {
    text-decoration: underline;
    color: #3e3d40;
    font-size: 1em;
}

div#content a:hover {
    text-decoration: none;
    color: #3e3d40;
}

div#content a.icon {
    display: block;
    background-repeat: no-repeat;
    color: #87888a;
    font-size: 18px;
    font-weight: bold;
    margin-top: 4px;
    margin-bottom: 2px;
    padding-left: 28px;
}

div#content a.buy {
    background-image: url('../img/icons/buy.png');
    background-position: 2px 0;
    width: 120px;
}

div#content a.download {
    background-image: url('../img/icons/download.png');
    background-position: 2px 0;
    width: 90px;
}

div#content a.abstract {
    background-image: url('../img/icons/abstract.png');
    background-position: 2px 0;
    width: 80px;
}

div#content a.fulltext {
    margin-left: 15px;
    margin-bottom: 20px;
    width: 210px;
}

ul#footer {
    display: flex;
    align-items: center;
    background-image: url('../img/footer.png');
    list-style-type: none;
    height: 74px;
}

ul#footer li {
    color: #58585a;
    font-size: 16px;
    padding: 6px 12px;
    border-right: 1px #fff solid;
}

ul#footer li:first-child {
    margin-left: 254px;
}

ul#footer li:last-child {
    border: 0;
}

ul#footer a {
    color: #ff9600;
    font-size: 1em;
}

ul#footer a:hover, ul#footer a.act {
    color: #ff9600;
    text-decoration: underline;
}

div#iconbar {
    width: 960px;
    height: 74px;
}

div#iconbar img {
    margin-left: 256px;
}

select, input[type="text"], input[type="password"], input[type="file"] {
    border-color: #c6c6c6 #dadada #eaeaea;
    background: #fafafa;
    color: #999;
    font-size: 1.1em;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    line-height: 1.1em;
    padding: 6px;
    border-style: solid;
    border-width: 1px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    width: 50% !important;
}

select:hover, input[type="text"]:hover, input[type="password"]:hover, input[type="file"]:hover {
    color: #666;
    background: #fff none;
    border-color: #c6c6c6;
}

select:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="file"]:focus {
    color: #333;
    background: #fff none;
    border-color: #659ec9 #70aedd #a8cfec;
    outline: 0;
}

ul.list {
    list-style-type: square;
    margin: 10px 0 10px 20px;
}

ul.list ul {
    list-style-type: circle;
}

h5.caption {
    margin-top: 20px;
    font-weight: bold;
}

div.cookie-note {
    position: sticky;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    bottom: 0;
    right: 0;
    left: 0;
    height: 120px;
    font-size: 14px;
    font-weight: bold;
}

div.cookie-note button {
    width: 75px;
    height: 35px;
    background-color: #ff9600;
    border-radius: 3px;
    font-size: 14px;
    font-weight: bold;
    margin-left: 20px;
    cursor: pointer;
}

div.cookie-note button:hover {
    background-color: #ffcc4c;
}

.container {
    display: grid;
    grid-template-columns: 2fr repeat(12, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 1px;
    justify-items: stretch;
    align-items: stretch;
    max-width: 900px;
}

.bgc1 {
    background-color: #e3e3e3;
}

.bgc2 {
    background-color: #cccccd;
}

.bgc0 {
    background-color: #ffffff;
}

/*.archive-table {*/
/*    width: 900px;*/
/*}*/

/*.archive-table-row td {*/
/*    border: 1px solid black;*/
/*}*/

/*.archive-table-row h2 {*/
/*    display: block;*/
/*    float: left;*/
/*}*/

/*.archive-table-volume div {*/
/*    float: left;*/
/*    margin-top: 11px;*/
/*    margin-left: 9px;*/
/*    color: #87888a;*/
/*    font-size: 18px;*/
/*}*/

/**
 * New style for header
 * 16.10.2019
 * by AGO
**/
.icon {
    width: 100%;
    height: 100%;
    background: transparent none no-repeat center;
    background-size: contain;
}

.icon--account {
    background-image: url("../img/icons/account.svg");
}

.icon--search {
    background-image: url("../img/icons/search.svg");
}

.icon--cart {
    background-image: url("../img/icons/cart.svg");
}

.icon--checkout {
    background-image: url("../img/icons/checkout.svg");
}

.icon--logout {
    background-image: url("../img/icons/logout.svg");
}

.text-svg {
}

.text-svg > svg {
    width: auto;
    height: 100%;
}

header.header {
    font-family: "PT Sans", serif;
    color: #FFFFFF;
}

.header__top {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    padding: 0;
    background-color: #FFCC36;
    box-shadow: rgba(255, 214, 0, 0.4);
}

.header__bottom {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    background-color: #27292B;
}

.header-logo {
    padding: 27px 0;
    margin-left: 30px;
}

.logo {
    font-family: "PT Sans", serif;
    color: #FFFFFF;
    font-weight: bold;
    white-space: nowrap;
}

.logo:hover {
    color: #ffffff;
}

.logo__name {
    font-size: 60px;
    line-height: 71px;
    text-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);
}

.logo__name:after {
    display: block;
    content: '';
    height: 4px;
    width: 170px;
    background-color: rgba(255, 255, 255, 0.5);
    margin: 7px 0 10px;
}

.logo__description {
    font-size: 20px;
    line-height: 20px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}

.header-top-panel,
.header-bottom-panel {
    margin-right: 30px;
    display: flex;
}

.header-bottom-panel {
    align-items: flex-end;
}

.header-top-panel {
    flex-direction: column;
    justify-content: space-between;
}

.header-bottom-panel {
    position: relative;
    align-items: flex-start;
}

.header-bottom-panel:before {
    display: block;
    content: '';
    height: 5px;
    width: 100%;
    background-color: #FF8600;
    position: absolute;
    top: 0;
    left: 0;
}

.menu-panel {
    display: flex;
    justify-items: flex-start;
    flex-wrap: wrap;
}

.menu-panel__item {
    padding: 10px 0;
    min-width: 130px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.menu-panel__item + .menu-panel__item {
    margin-left: 20px;
}

.menu-panel-link, .issn {
    display: flex;
    align-items: center;
    font-size: 21px;
    line-height: 26px;
    font-weight: bold;
    color: #ffffff;
    text-decoration: none;
    padding: 10px 0;
}

.issn {
    flex: 2 0 auto;
    align-self: flex-end;
    margin-right: 30px;
}

.menu-panel-link:hover {
    color: #ffffff;
    text-decoration: underline;
}

.menu-panel-link__icon {
    display: block;
    width: 24px;
    height: 24px;
    margin-right: 15px;
}

.menu-panel-link__label {
    white-space: nowrap;
}

.menu-panel__item--cart,
.menu-panel__item--checkout,
.menu-panel__item--web-shop-instructions {
    padding-bottom: 0
}

.menu-panel__item--cart a,
.menu-panel__item--checkout a,
.menu-panel__item--web-shop-instructions a {
    padding-bottom: 0
}

.menu-panel__item--web-shop-instructions {
    flex-grow: 2;
    margin: 0 !important;
    text-align: center;
}

.menu-panel__item--web-shop-instructions span {
    width: 100%;
}

.header-op {
    height: 100%;
}

.header-op {
    display: flex;
    align-items: stretch;
    flex: 0 1 100%;
}

.header-op__column {
    flex: 0 1 auto;
    padding: 23px 27px;
}

.header-op__column--first {
    border-right: 1px solid #FFD600;
}

.header-op__column--second {
    border-left: 1px solid #FFD600;
}

.info-block {
    display: flex;
    color: #ffffff;
}

.info-block__count--big {
    color: #F39334;
    transform: scale(1.4)
}

.info-block__label {
    flex: 0 1 auto;
    height: 24px;
    width: auto;
}

.info-block-vol {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 4px solid #ffffff;
    width: 32px;
    height: 40px;
    font-weight: bold;
    margin: 0 14px 0 9px;
}

.info-block-vol__label {
    font-size: 10px;
    line-height: 12px;
    text-transform: uppercase;
    margin-top: 2px;
}

.info-block-vol__number {
    font-size: 20px;
    line-height: 24px;
}

.info-block-vol--big .info-block-vol__label {
    font-size: 14px;
    line-height: 16px;
}

.info-block-vol--big .info-block-vol__number {
    font-size: 24px;
    line-height: 28px;
}


.info-block-vol__number--distance {
    line-height: 30px;
}

.info-block__date {

}

.block-date .block-date__label {
    height: 24px;
    width: auto;
}

.block-date .block-date__label--small {
    height: 18px;
}


.block-date .block-date__date {
    display: block;
    font-size: 22px;
    line-height: 26px;
    font-weight: bold;
    color: #ffffff;
    margin-top: 2px;
    text-decoration: none;
}

.block-date .block-date__date:hover {
    color: #ffffff;
    text-decoration: underline;
}

.block-date .block-date__date--no-decoration:hover {
    color: #ffffff;
    text-decoration: none;
}

.preview_publication {
    background-color: transparent;
    height: 296px;
}

.preview-publication__header {
    background-color: #FDCA4E;
    height: 26%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    font-weight: bold;
    color: white;
}

.preview-publication__body {
    background-color: #919191;
    height: 74%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.preview-publication__volume {
    display: flex;
    flex-direction: column;
    text-align: center;
    color: #F39334;
    padding: 8px;
    border: 6px solid white;
}

.preview-publication__next-issue {
    display: flex;
    flex-direction: column;
}

/**
Archive Page
 */
div#content table tr.archive-table-row td:first-child {
    width: 170px;
}

div#content table tr.archive-table-row td:not(:first-child) {
    vertical-align: middle;
    cursor: pointer;
    text-align: center;
}

div#content table tr.archive-table-row td:last-child {
    width: 0;
}

div#content table tr.archive-table-row td.big {
    width: 110px;
}

.archive-issue-link {
    text-decoration: none;
    color: #ff9600;
}
