/* Тень для основного контейнера */
#js-show-iframe-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 293px;
    max-width: 100%;
    background: linear-gradient(138.4deg, #38bafe 26.49%, #2d73bc 79.45%);
    color: #fff;
    cursor: pointer;
    /*margin-bottom: 50px;*/
    
    /* Тень */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    border-radius: 8px; /* Добавляем скругленные углы */
    overflow: hidden; /* Чтобы тень не обрезалась */
}

/* Основные стили баннера */
#js-show-iframe-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 293px;
    max-width: 100%;
    background: linear-gradient(138.4deg, #38bafe 26.49%, #2d73bc 79.45%);
    color: #fff;
    cursor: pointer;
}

#js-show-iframe-wrapper .pos-banner-fluid * {
    box-sizing: border-box;
}

/* Кнопка */
#js-show-iframe-wrapper .pos-banner-fluid .pos-banner-btn_2 {
    display: block;
    width: 240px;
    min-height: 56px;
    font-size: 18px;
    line-height: 24px;
    cursor: pointer;
    background: #0d4cd3;
    color: #fff;
    border: none;
    border-radius: 8px;
    outline: 0;
}

#js-show-iframe-wrapper .pos-banner-fluid .pos-banner-btn_2:hover {
    background: #1d5deb;
}

#js-show-iframe-wrapper .pos-banner-fluid .pos-banner-btn_2:focus {
    background: #2a63ad;
}

#js-show-iframe-wrapper .pos-banner-fluid .pos-banner-btn_2:active {
    background: #2a63ad;
}

/* Анимации */
@-webkit-keyframes fadeInFromNone {
    0% {
        display: none;
        opacity: 0;
    }
    1% {
        display: block;
        opacity: 0;
    }
    100% {
        display: block;
        opacity: 1;
    }
}

@keyframes fadeInFromNone {
    0% {
        display: none;
        opacity: 0;
    }
    1% {
        display: block;
        opacity: 0;
    }
    100% {
        display: block;
        opacity: 1;
    }
}

/* Шрифты */
@font-face {
    font-family: LatoWebLight;
    src: url(https://pos.gosuslugi.ru/bin/fonts/Lato/fonts/Lato-Light.woff2) format("woff2"),
         url(https://pos.gosuslugi.ru/bin/fonts/Lato/fonts/Lato-Light.woff) format("woff"),
         url(https://pos.gosuslugi.ru/bin/fonts/Lato/fonts/Lato-Light.ttf) format("truetype");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: LatoWeb;
    src: url(https://pos.gosuslugi.ru/bin/fonts/Lato/fonts/Lato-Regular.woff2) format("woff2"),
         url(https://pos.gosuslugi.ru/bin/fonts/Lato/fonts/Lato-Regular.woff) format("woff"),
         url(https://pos.gosuslugi.ru/bin/fonts/Lato/fonts/Lato-Regular.ttf) format("truetype");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: LatoWebBold;
    src: url(https://pos.gosuslugi.ru/bin/fonts/Lato/fonts/Lato-Bold.woff2) format("woff2"),
         url(https://pos.gosuslugi.ru/bin/fonts/Lato/fonts/Lato-Bold.woff) format("woff"),
         url(https://pos.gosuslugi.ru/bin/fonts/Lato/fonts/Lato-Bold.ttf) format("truetype");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: RobotoWebLight;
    src: url(https://pos.gosuslugi.ru/bin/fonts/Roboto/Roboto-Light.woff2) format("woff2"),
         url(https://pos.gosuslugi.ru/bin/fonts/Roboto/Roboto-Light.woff) format("woff"),
         url(https://pos.gosuslugi.ru/bin/fonts/Roboto/Roboto-Light.ttf) format("truetype");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: RobotoWebRegular;
    src: url(https://pos.gosuslugi.ru/bin/fonts/Roboto/Roboto-Regular.woff2) format("woff2"),
         url(https://pos.gosuslugi.ru/bin/fonts/Roboto/Roboto-Regular.woff) format("woff"),
         url(https://pos.gosuslugi.ru/bin/fonts/Roboto/Roboto-Regular.ttf) format("truetype");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: RobotoWebBold;
    src: url(https://pos.gosuslugi.ru/bin/fonts/Roboto/Roboto-Bold.woff2) format("woff2"),
         url(https://pos.gosuslugi.ru/bin/fonts/Roboto/Roboto-Bold.woff) format("woff"),
         url(https://pos.gosuslugi.ru/bin/fonts/Roboto/Roboto-Bold.ttf) format("truetype");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: ScadaWebRegular;
    src: url(https://pos.gosuslugi.ru/bin/fonts/Scada/Scada-Regular.woff2) format("woff2"),
         url(https://pos.gosuslugi.ru/bin/fonts/Scada/Scada-Regular.woff) format("woff"),
         url(https://pos.gosuslugi.ru/bin/fonts/Scada/Scada-Regular.ttf) format("truetype");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: ScadaWebBold;
    src: url(https://pos.gosuslugi.ru/bin/fonts/Scada/Scada-Bold.woff2) format("woff2"),
         url(https://pos.gosuslugi.ru/bin/fonts/Scada/Scada-Bold.woff) format("woff"),
         url(https://pos.gosuslugi.ru/bin/fonts/Scada/Scada-Bold.ttf) format("truetype");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: Geometria;
    src: url(https://pos.gosuslugi.ru/bin/fonts/Geometria/Geometria.eot);
    src: url(https://pos.gosuslugi.ru/bin/fonts/Geometria/Geometria.eot?#iefix) format("embedded-opentype"),
         url(https://pos.gosuslugi.ru/bin/fonts/Geometria/Geometria.woff) format("woff"),
         url(https://pos.gosuslugi.ru/bin/fonts/Geometria/Geometria.ttf) format("truetype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: Geometria-ExtraBold;
    src: url(https://pos.gosuslugi.ru/bin/fonts/Geometria/Geometria-ExtraBold.eot);
    src: url(https://pos.gosuslugi.ru/bin/fonts/Geometria/Geometria-ExtraBold.eot?#iefix) format("embedded-opentype"),
         url(https://pos.gosuslugi.ru/bin/fonts/Geometria/Geometria-ExtraBold.woff) format("woff"),
         url(https://pos.gosuslugi.ru/bin/fonts/Geometria/Geometria-ExtraBold.ttf) format("truetype");
    font-weight: 900;
    font-style: normal;
}

/* Стили для баннера версии 10 */
#js-show-iframe-wrapper {
    background: var(--pos-banner-fluid-10__background);
}

#js-show-iframe-wrapper .pos-banner-fluid .pos-banner-btn_2 {
    width: 100%;
    min-height: 52px;
    background: #fff;
    color: #0b1f33;
    font-size: 16px;
    font-family: LatoWeb, sans-serif;
    font-weight: 400;
    padding: 0;
    line-height: 1.2;
}

#js-show-iframe-wrapper .pos-banner-fluid .pos-banner-btn_2:active,
#js-show-iframe-wrapper .pos-banner-fluid .pos-banner-btn_2:focus,
#js-show-iframe-wrapper .pos-banner-fluid .pos-banner-btn_2:hover {
    background: #e4ecfd;
}

#js-show-iframe-wrapper .bf-10 {
    position: relative;
    display: grid;
    grid-template-columns: var(--pos-banner-fluid-10__grid-template-columns);
    grid-template-rows: var(--pos-banner-fluid-10__grid-template-rows);
    width: 100%;
    max-width: var(--pos-banner-fluid-10__max-width);
    box-sizing: border-box;
    grid-auto-flow: row dense;
}

#js-show-iframe-wrapper .bf-10__decor {
    background: var(--pos-banner-fluid-10__bg-url) var(--pos-banner-fluid-10__bg-url-position) no-repeat;
    background-size: var(--pos-banner-fluid-10__bg-size);
    background-color: #fffaf6;
    position: relative;
}

#js-show-iframe-wrapper .bf-10__content {
    display: flex;
    flex-direction: column;
    padding: var(--pos-banner-fluid-10__content-padding);
    grid-row: var(--pos-banner-fluid-10__content-grid-row);
    justify-content: center;
}

#js-show-iframe-wrapper .bf-10__text {
    margin: var(--pos-banner-fluid-10__text-margin);
    font-size: var(--pos-banner-fluid-10__text-font-size);
    line-height: 1.4;
    font-family: LatoWeb, sans-serif;
    font-weight: 700;
    color: #fff;
}

#js-show-iframe-wrapper .bf-10__bottom-wrap {
    display: flex;
    flex-direction: row;
    align-items: center;
}

#js-show-iframe-wrapper .bf-10__logo-wrap {
    position: absolute;
    top: var(--pos-banner-fluid-10__logo-wrap-top);
    right: var(--pos-banner-fluid-10__logo-wrap-right);
}

#js-show-iframe-wrapper .bf-10__logo {
    width: var(--pos-banner-fluid-10__logo-width);
    margin-left: 1px;
}

#js-show-iframe-wrapper .bf-10__slogan {
    font-family: LatoWeb, sans-serif;
    font-weight: 700;
    font-size: var(--pos-banner-fluid-10__slogan-font-size);
    line-height: 1.2;
    color: #005ca9;
}

#js-show-iframe-wrapper .bf-10__btn-wrap {
    width: 100%;
    max-width: var(--pos-banner-fluid-10__button-wrap-max-width);
}

/* ИЗМЕНЕНИЯ ДЛЯ РАЗМЕЩЕНИЯ НА ОДНОЙ ЛИНИИ */
#js-show-iframe-wrapper {
    width: 45%; /* Уменьшаем ширину первого баннера */
    max-width: 1000px;
    min-height: 250px; /* Фиксируем минимальную высоту */
    margin-right: 5px; /* Добавляем отступ справа */
}

.widget-wrapper {
    width: 45%; /* Устанавливаем такую же ширину */
    max-width: 600px;
    min-height: 250px; /* Добавляем такую же минимальную высоту */
    /* Добавляем скругленные углы и тень */
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    overflow: hidden; /* Чтобы содержимое не выходило за скругленные углы */
    display: flex; /* Для выравнивания содержимого */
}

.widget-wrapper iframe {
    width: 100% !important; /* Переопределяем inline-стиль */
    height: 100% !important; /* Занимаем всю высоту контейнера */
    flex-grow: 1; /* Растягиваем iframe на всю высоту */
}
/* Контейнер для двух баннеров */
.banners-container {
    display: flex;
    justify-content: center;
    align-items: stretch; /* Выравниваем по высоте */
    flex-wrap: wrap;
    /*gap: 20px;*/
    margin-bottom: 50px;
}

/* Адаптивность для мобильных */
@media (max-width: 768px) {
    .banners-container {
        flex-direction: column;
        align-items: center;
    }
    
    #js-show-iframe-wrapper,
    .widget-wrapper {
        width: 100%;
        max-width: 100%;
        margin-right: 0;
    }
    
    #js-show-iframe-wrapper {
        margin-bottom: 20px;
    }
    
    .widget-wrapper {
        height: 250px; /* Фиксируем высоту на мобильных */
    }
    
    .widget-wrapper iframe {
        height: 250px !important;
    }
}
	.widget-wrapper {
    width: 45%; /* Устанавливаем такую же ширину */
    max-width: 600px;
    /* Добавляем скругленные углы и тень */
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    overflow: hidden; /* Чтобы содержимое не выходило за скругленные углы */
}

	.widget-wrapper iframe {
    width: 100% !important; /* Переопределяем inline-стиль */
    height: 300px;
    /* border-radius наследуется от родителя */
}