:root {
    --obl: 1370px;                                /*ширина области*/
    --obl2: 1370px;                                /*ширина области*/
    --obl3: 1370px;                                /*ширина области*/
    --obl4: 1370px;                                /*ширина области*/
    --int: 28px;                                  /*промежуток между плашками*/
    --pad: 30px;                                  /*отстпы padding по ширине*/
    --chng: 2px;                                  /*боковое смещение для рамки*/

    --col2: 2;                                     /* количество колонок */
    --obj2: calc((var(--obl2) - var(--chng)*2)/var(--col2)); /*ширина объекта 2 колонки*/
    --pls2: calc((var(--obl2) - var(--int) - var(--chng)*2)/var(--col2));  /*ширина плашки 2 колонки*/
    --plo2: calc(var(--pls2) - var(--pad)*2);     /*ширина плашки с отступами 2 колонки*/
 
    --col3: 3;                                     /* количество колонок */
    --obj3: calc((var(--obl3) - var(--chng)*2)/var(--col3));                   /*ширина объекта 3 колонки*/
    --pls3: calc((var(--obl3) - 2*var(--int))/var(--col3));  /*ширина плашки 3 колонки*/
    --plo3: calc(var(--pls3) - var(--pad)*2);     /*ширина плашки с отступами 3 колонки*/

    --col4: 4;                                     /* количество колонок */
    --obj4: calc((var(--obl4) - var(--chng)*2)/var(--col4));                   /*ширина объекта 4 колонки*/
    --pls4: calc((var(--obl4) - 3*var(--int))/var(--col4));  /*ширина плашки 4 колонки*/
    --plo4: calc(var(--pls4) - var(--pad)*2);     /*ширина плашки с отступами 4 колонки*/

    --arto: #c52600;
    --arth: #4f04f4;
    --slids: #ffffff;
}


.art_bank.art_icon {
    display: block;
    width: 100%;
    position: relative;
    float: left;
}

.art_bank.art_icon .contentBody {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    position: relative;
}

.art_bank.art_icon .contentBody .records-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
     flex-direction: row;
    -webkit-justify-content: space-around;
    -webkit-box-pack: space-around;
    -ms-flex-pack: space-around;
    justify-content: space-around;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
	
    position: relative;
    align-items: stretch;
}

.art_bank.art_icon .contentBody .records-container {
    width: var(--obl);
}

.art_bank.art_icon .contentBody .records-container .object {
    display: block;
    position: relative;
    float: left;
    text-align: center;
    overflow: hidden;
    -webkit-transition: all 1.5s ease-in-out;
    -moz-transition: all 1.5s ease-out;
    -o-transition: all 1.5s ease-out;
    transition: all 1.5s ease-in-out;
}

.art_bank.art_icon .contentBody .records-container .object:hover .link.record-field {
    background: var(--arth);
}

.art_bank.art_icon .contentBody .records-container .object:hover .link.record-field .objectImage {
    filter: contrast(0%) brightness(300%);
}
.content.art_bank.art_icon.imgArt .records-container .object:hover .link.record-field .objectImage {
    filter: none;
}
.art_bank.art_icon .contentBody .records-container .object:hover .link.record-field .objectNote .valuta,
.art_bank.art_icon .contentBody .records-container .object:hover .link.record-field .objectNote .cena,
.art_bank.art_icon .contentBody .records-container .object:hover .link.record-field h4 {
    color: #ffffff;
}

.art_bank.art_icon .contentBody .records-container .object:hover .link.record-field .objectNote {
    color: #dfdddd;
}


.art_bank.art_icon .contentBody .records-container .object .record-field {
    text-decoration: none;
    margin-bottom: 40px;
    display: block;

    /*position: absolute;*/
    position: relative;
    padding: 15px var(--pad);
    transition: all 1.5s ease;
    right: 0;
    left: 0;
}

.art_bank.art_icon .contentBody .records-container .object h4 {
    font-size: 20px;
    font-weight: normal;
    color: var(--arto);
}
.art_bank.art_icon.zebra .contentBody .records-container .object .record-field {
    background-image: url(x_pr_a.png);
    text-align: center;
    position: relative;
    margin-top: var(--chng);
    background-color: #f7f7f7;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    -moz-box-shadow: 0 0 2px 0 rgb(0 71 133 / 55%);
    -webkit-box-shadow: 0 0 2px 0 rgb(0 71 133 / 55%);
    box-shadow: 0 0 2px 0 rgb(0 71 133 / 55%);
}
.art_bank.art_icon.big .contentBody .records-container .object .record-field .objectNote {
    font-size: 18px;
    text-align: center;
}

.art_bank.art_icon .contentBody .records-container .object .record-field .objectNote {
    color: #222222;
    font-size: 14px;
    text-align: left;
}

.art_bank.art_icon.h115 .contentBody .records-container .object .record-field,
.art_bank.art_icon.h115 .contentBody .records-container .object {
    min-height: 115px;
}


.art_bank.art_icon.h230 .contentBody .records-container .object .record-field,
.art_bank.art_icon.h230 .contentBody .records-container .object {
    min-height: 230px;
}

.art_bank.art_icon.h240 .contentBody .records-container .object .record-field,
.art_bank.art_icon.h240 .contentBody .records-container .object {
    min-height: 240px;
}

/* two */
.art_bank.art_icon.two .contentBody .records-container .object {
    width: 50%;
}
.art_bank.art_icon.two .contentBody .records-container .object .record-field {
    width: var(--plo2);
}
.art_bank.art_icon.two .contentBody .records-container .object:nth-child(2n+1) .record-field {
    margin-right: calc(var(--obj2) - var(--pls2));
    margin-right: -o-calc(var(--obj2) - var(--pls2));
    margin-right: -moz-calc(var(--obj2) - var(--pls2));
    margin-right: -ms-calc(var(--obj2) - var(--pls2));
    margin-right: -webkit-calc(var(--obj2) - var(--pls2));
    margin-left: var(--chng);
}
.art_bank.art_icon.two .contentBody .records-container .object:nth-child(2n+2) .record-field {
    margin-left: calc(var(--obj2) - var(--pls2));
    margin-left: -o-calc(var(--obj2) - var(--pls2));
    margin-left: -moz-calc(var(--obj2) - var(--pls2));
    margin-left: -ms-calc(var(--obj3) - var(--pls3));
    margin-left: -webkit-calc(var(--obj2) - var(--pls2));
    margin-right: var(--chng);
}
/* two */

/* three */
.art_bank.art_icon.three .contentBody .records-container .object {
    width: 33.33%;
}
.art_bank.art_icon.three .contentBody .records-container .object .record-field {
    width: var(--plo3);
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;
}
.art_bank.art_icon.three .contentBody .records-container .object .record-field .ObNote {
    text-align: left;
}
.art_bank.art_icon .contentBody .records-container .object h4 {
    font-size: 20px;
    font-weight: normal;
    color: var(--arto);
    margin-top: 0;
    margin-bottom: 10px;
}
.art_bank.art_icon.three .contentBody .records-container .object .record-field .ObImg img {
    width: 60px;
    max-width: unset !important;
}
.art_bank.art_icon.three .contentBody .records-container .object .record-field .ObImg {
    width: 60px;
}
.art_bank.art_icon.three .contentBody .records-container .object:nth-child(3n+1) .record-field {
    margin-right: calc(var(--obj3) - var(--pls3));
    margin-right: -o-calc(var(--obj3) - var(--pls3));
    margin-right: -moz-calc(var(--obj3) - var(--pls3));
    margin-right: -ms-calc(var(--obj3) - var(--pls3));
    margin-right: -webkit-calc(var(--obj3) - var(--pls3));
    margin-left: var(--chng);
}
.art_bank.art_icon.three .contentBody .records-container .object:nth-child(3n+2) .record-field {
    margin-right: calc((var(--obj3) - var(--pls3))/2);
    margin-right: -o-calc((var(--obj3) - var(--pls3))/2);
    margin-right: -moz-calc((var(--obj3) - var(--pls3))/2);
    margin-right: -ms-calc((var(--obj3) - var(--pls3))/2);
    margin-right: -webkit-calc((var(--obj3) - var(--pls3))/2);
    margin-left: calc((var(--obj3) - var(--pls3))/2);
    margin-left: -o-calc((var(--obj3) - var(--pls3))/2);
    margin-left: -moz-calc((var(--obj3) - var(--pls3))/2);
    margin-left: -ms-calc((var(--obj3) - var(--pls3))/2);
    margin-left:  -webkit-calc((var(--obj3) - var(--pls3))/2);
}
.art_bank.art_icon.three .contentBody .records-container .object:nth-child(3n+3) .record-field {
    margin-left: calc(var(--obj3) - var(--pls3));
    margin-left: -o-calc(var(--obj3) - var(--pls3));
    margin-left: -moz-calc(var(--obj3) - var(--pls3));
    margin-left: -ms-calc(var(--obj3) - var(--pls3));
    margin-left: -webkit-calc(var(--obj3) - var(--pls3));
    margin-right: var(--chng);
}

/* four */
.art_bank.art_icon.four .contentBody .records-container .object {
    width: 25%;
}

.art_bank.art_icon.four .contentBody .records-container .object .record-field {
    width: var(--plo4);
}

.art_bank.art_icon.four .contentBody .records-container .object:nth-child(4n+1) .record-field {
    margin-right: calc(var(--obj4) - var(--pls4));
    margin-right: -o-calc(var(--obj4) - var(--pls4));
    margin-right: -moz-calc(var(--obj4) - var(--pls4));
    margin-right: -ms-calc(var(--obj4) - var(--pls4));
    margin-right: -webkit-calc(var(--obj4) - var(--pls4));
    margin-left: var(--chng);
}

.art_bank.art_icon.four .contentBody .records-container .object:nth-child(4n+2) .record-field {
    margin-left: calc(var(--obj4) - var(--pls4) - var(--int)/2);
    margin-left: -o-calc(var(--obj4) - var(--pls4) - var(--int)/2);
    margin-left: -moz-calc(var(--obj4) - var(--pls4) - var(--int)/2);
    margin-left: -ms-calc(var(--obj4) - var(--pls4) - var(--int)/2);
    margin-left: -webkit-calc(var(--obj4) - var(--pls4) - var(--int)/2);
    margin-right: calc(var(--int)/2);
    margin-right: -o-calc(var(--int)/2);
    margin-right: -moz-calc(var(--int)/2);
    margin-right: -ms-calc(var(--int)/2);
    margin-right: -webkit-calc(var(--int)/2);
}

.art_bank.art_icon.four .contentBody .records-container .object:nth-child(4n+3) .record-field {
    margin-left: calc(var(--int)/2);
    margin-left: -o-calc(var(--int)/2);
    margin-left: -moz-calc(var(--int)/2);
    margin-left: -ms-calc(var(--int)/2);
    margin-left: -webkit-calc(var(--int)/2);
    margin-right: calc(var(--obj4) - var(--pls4) - var(--int)/2);
    margin-right: -o-calc(var(--obj4) - var(--pls4) - var(--int)/2);
    margin-right: -moz-calc(var(--obj4) - var(--pls4) - var(--int)/2);
    margin-right: -ms-calc(var(--obj4) - var(--pls4) - var(--int)/2);
    margin-right: -webkit-calc(var(--obj4) - var(--pls4) - var(--int)/2);
}

.art_bank.art_icon.four .contentBody .records-container .object:nth-child(4n+4) .record-field {
    margin-left: calc(var(--obj4) - var(--pls4));
    margin-left: -o-calc(var(--obj4) - var(--pls4));
    margin-left: -moz-calc(var(--obj4) - var(--pls4));
    margin-left: -ms-calc(var(--obj4) - var(--pls4));
    margin-left: -webkit-calc(var(--obj4) - var(--pls4));
    margin-right: var(--chng);
}

.art_bank.art_icon .contentBody .records-container .object .record-field .objectNote .cena {
    font-size: 28px;
    font-style: normal;
    color: var(--olink);
}
.art_bank.art_icon .contentBody .records-container .object .record-field .objectNote .valuta {
    font-style: normal;
    font-size: 18px;
    color: var(--olink);
}

.art_bank.art_icon .contentBody .records-container .object .record-field .objectNote ul {
    padding-left: 20px;
}

@media screen and (min-width:0px) and (max-width:1490px) {
:root {
    --obl: 100%;
    --obl2: 100%;
    --obl3: 100%;
    --obl4: 100%;

    --obj2: calc(var(--obl2) - var(--chng));                    /*ширина объекта 2 колонки*/
    --pls2: calc(var(--obl2) - var(--int)/3*2);                 /*ширина плашки 2 колонки*/

    --obj3: calc(var(--obl3) - var(--chng));                    /*ширина объекта 3 колонки*/
    --pls3: calc(var(--obl3) - var(--int)/3*2);                 /*ширина плашки 3 колонки*/
    
    --obj4: calc(var(--obl4) - var(--chng));                    /*ширина объекта 4 колонки*/
    --pls4: calc(var(--obl4) - var(--int)/3*2);                 /*ширина плашки 4 колонки*/
}

}

@media screen and (min-width:0px) and (max-width:1170px) {
:root {
    --obj4: calc(var(--obl4) - var(--chng));                    /*ширина объекта 4 колонки*/
    --pls4: calc(var(--obl4) - var(--int)/2);                 /*ширина плашки 4 колонки*/
}

.art_bank.art_icon.four .contentBody .records-container .object:nth-child(4n+2) .record-field {
    margin-left: calc(var(--obj4) - var(--pls4));
    margin-left: -o-calc(var(--obj4) - var(--pls4));
    margin-left: -moz-calc(var(--obj4) - var(--pls4));
    margin-left: -ms-calc(var(--obj4) - var(--pls4));
    margin-left: -webkit-calc(var(--obj4) - var(--pls4));
    

    margin-right:var(--chng);
}

.art_bank.art_icon.four .contentBody .records-container .object:nth-child(4n+3) .record-field {
    margin-right: calc(var(--obj4) - var(--pls4));
    margin-right: -o-calc(var(--obj4) - var(--pls4));
    margin-right: -moz-calc(var(--obj4) - var(--pls4));
    margin-right: -ms-calc(var(--obj4) - var(--pls4));
    margin-right: -webkit-calc(var(--obj4) - var(--pls4));
    margin-left: var(--chng);
}


}