Fancybox Inner Example


<title>Fancybox Inner Example</title>
<title>Fancybox Inner Example</title>

<title>Fancybox Inner Example</title>

<title>Fancybox Inner Example</title>

<title>Fancybox Inner Example</title>

<title>Fancybox Inner Example</title>

<title>Fancybox Inner Example</title>

<title>Fancybox Inner Example</title>


@media screen and (min-width: 1344px)
{
    /*Кнопка кабинет*/
    .right-icons.pull-right {
        width: 33.33333333333333%;
        position: relative;
        min-height: 1px;
        padding-left: 15px;
        padding-right: 15px;
    }    
    .logo_and_menu-row .personal-link .wrap {max-width: none;}
    .header-v7 .logo_and_menu-row .wrap_icon.wrap_cabinet {width: 300px;}
    .logo_and_menu-row .personal-link.with_dropdown .name {max-width: 220px;}
}
/*.col-xl-  (&gt;= 1200px)*/
@media screen and (min-width: 1200px)
{
}
/*.col-xl-  (&gt;= 1200px)*/
@media screen and (min-width: 1200px)
{
}
/*.col-lg-  (&gt;= 992px)*/
@media screen and (max-width: 1200px)
{
}
/*.col-md-  (&gt;= 768px)*/
@media screen and (max-width: 991px)
{
}
/*.col-sm-  (&gt;= 576px)*/
@media screen and (max-width: 767px)
{
}
/*.col-*/
@media screen and (max-width: 575px)
{


} 

.info_item .top_info .article {
font-size: 16px;
color: #000000;

}
.info_item .top_info .article .value  {
font-size: 24px;
color: #000000;
margin: 0px 0px 0px 8px 

}

.catalog_detail .props_list td {
font-size: 18px;
}

.cost.prices .price {
font-size: 24px;

}

.sku_props .bx_item_detail_size ul li {
 display: inline-block;
 font-weight: bold;
 border-radius: 30%  30% 30%;

}

.stickers [class*="sticker_"] {
  background-color: #CC00FF;
  width: auto;
  letter-spacing: 0.5px;
  position: relative;
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  line-height: 12px;
  padding: 5px 10px 4px;
  text-transform: uppercase;
  border-radius: 2px;
}

.stickers .sticker_5fad6205-9fe7-11ee-8115-000c29d50bd0 {
  background-color: #ffcc00;
  color: #000000;
  font-size: 10px;
  width: 42px; /* ширина стикера */
  height: 42px; /* высота стикера */
  border-radius: 50%; /* округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
} 


.stickers .sticker_d6ad6820-edf2-11ef-8161-000c29d50bd0 {
  background-color: #d4f002;
  color: #000000;
  font-size: 10px;
  width: 42px; /* ширина стикера */
  height: 42px; /* высота стикера */
  border-radius: 50%; /* округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
} 

.fill_bg_n .menu-row.middle-block.bgdark {
background-color: #000000;

}

.nbg.props_list td.char_value {
font-weight: bold;
}

.cost.prices .price.only_price {
font-size: 24px;
}


.logo-row .logo {
position:absolute;
left:0;
top:0;
width: 150%;
line-height: 100px;

}


.EXTENDED .blog-comment .blog-post-date,
.EXTENDED .blog-comment .blog-comment-date {
    display: none;
}

.bx-blue .btn.btn-default {
 color: #000000;
}


#bx-soa-order #bx-soa-orderSave a {
 color: #000000;
}


.btn.btn-default {
  color: #000000;
  font-weight: 600; 
}


.bx_filter .sku .bx_filter_input_checkbox .bx_filter_param_text, .sku_props .bx_item_detail_size ul li span {
  color: #000000;
  font-weight: bold;
}

.info_item .top_info .article .value {
font-size: 16px;
}


.image_wrapper_block, .image_wrapper_block a {
height: 200px;
}

.catalog_item .sa_block .article_block  {
color: #4682B4;
font-size: 13px;
font-weight: 600; 
}

.bx-soa-order.orderform--v1 .bx-soa .bx-soa-custom-label, #bx-soa-order.orderform--v1 .bx-soa .form-group label {
font-size: 16px;
}


.basket-root .basket-items-list .basket-item-block-image .fast_view {
    display: inline-block;
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: auto;
}

.brands-slider .brand-item img {
    width: auto !important;
    height: 100px !important; 

}

.top_slider_wrapp .flexslider .slides > li { /* применяем правило к каждому слайду внутри контейнера */
    transition: transform 0.7s cubic-bezier(0.25, 0.1, 0.25, 1); /* менее резкий и естественный переход */
}

.top_slider_wrapp .flexslider .slides > li:hover {
    transform: scale(1.05); /* увеличим масштаб на 5% — достаточно заметно, но не резко */
}

.tizers_block .row > div {
font-size: 30px;
font-weight: bold; 
line-height: 1.2;
}

.catalog_detail .item-stock > span  {
font-size: 18px;
font-weight: 600; 
}

#bx-soa-order .bx-soa-cart-total .bx-soa-cart-total-line-total .bx-soa-cart-d {
font-size: 25px !important;
font-weight: bold;
}


.icon-sneakers { /* применяем правило к каждому слайду внутри контейнера */
    transition: transform 0.7s cubic-bezier(0.25, 0.1, 0.25, 1); /* менее резкий и естественный переход */
}

.icon-sneakers:hover {
    transform: scale(1.1); /* увеличим масштаб на 5% — достаточно заметно, но не резко */
}


.bx-soa-order.orderform--v1 .bx-soa .bx-soa-custom-label, #bx-soa-order.orderform--v1 .bx-soa .form-group label {
color: #000000;
font-size: 20px;
font-weight: 600;
}

/* Общие стили */
.section_item_inner .section_info a {
    color: #000; /* Черный цвет */
    font-size: 16px; /* Размер шрифта по умолчанию */
    font-weight: bold; /* Жирный шрифт */
    line-height: 1.8em; /* Интервал между строками */
    font-family: 'Arial', sans-serif; /* Основной шрифт */
}

/* Медиа-запрос для смартфонов и планшетов */
@media screen and (max-width: 768px) {  
    .section_item_inner .section_info a {
        font-size: 14px; /* Уменьшаем размер текста для лучшей читаемости на небольших экранах */
        padding: 5px; /* Добавляем немного отступов вокруг ссылок */
    }
    
    .catalog_section_list .section_item li.name a span {
        font-size: 16px; /* Оптимальный размер заголовка для мобильного экрана */
        font-style: normal; /* Отключаем наклонность текста для улучшения восприятия */
    }
}

.bx_filter .bx_filter_parameters_box_title > span,
.bx_filter .bx_filter_parameters_box_title > div {
    padding: 3px 12px;
    font-size: 14px;
    font-weight: bold;
    color: #000000;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
}


/* Эффект наведения и нажатия */
.bx_filter .bx_filter_parameters_box_title > span:hover,
.bx_filter .bx_filter_parameters_box_title > div:hover {
    opacity: 0.9;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.bx_filter .bx_filter_parameters_box_title > span.active,
.bx_filter .bx_filter_parameters_box_title > div.active {
    transform: translateY(-4px);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
}

.bx_filter.compact .bx_filter_parameters_box .bx_filter_parameters_box_title.filter_title {
   display: none;
}

.xzoom-lens {
 width: 100px !important;
 height: 100px !important;
}

.xzoom-preview {
 width: 350px !important;
 height: 350px !important;
}


bx-soa-reference {
color: #ff0000;

}


.item_block item_block--brand col-2 {
    width: 200px;
    height: 200px;

    }

.catalog_section_list .section_item li.name a span {
    font-size: 20px;
    }


.catalog_block .catalog_item img, .product_slider .catalog_item img  {

    max-width: 100%;
    max-height: 110%;


    }

.stores_block_wrap .stores_block .stores_text_wrapp {
font-size: 17px;
font-weight: 600;

    }

.middle_info .top_props .props .value {
font-size: 13px;
font-weight: bold;
    }

.menu_top_block.catalog_block .dropdown > li.full.v_bottom > .dropdown > li > a, header .menu_top_block.catalogfirst li.full.v_bottom > .dropdown > li > a  {
font-size: 15px;
font-weight: 400;

    }


.stickers .sticker_17632109-b90d-11ee-8115-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;

}

.stickers .sticker_28e195d9-9816-11ee-8112-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}


.stickers .sticker_c5e71812-9e2f-11ee-8113-000c29d50bd0 {
  background-color: #F39C12 → #D35400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_c5e71828-9e2f-11ee-8113-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_c5e71828-9e2f-11ee-8113-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_eaf211cd-9819-11ee-8112-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_57c08f0e-b915-11ee-8115-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_11d8f111-981a-11ee-8112-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_0b0f7413-b907-11ee-8115-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_337036b5-b91c-11ee-8115-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_ec67ff17-b91b-11ee-8115-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_aef49c03-b91e-11ee-8115-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_aef49c03-b91e-11ee-8115-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_745a8a3c-981a-11ee-8112-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_39c10fbe-137b-11ef-8128-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_46705403-137b-11ef-8128-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_1f7621c3-4e34-11ef-813f-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_27cf35ad-4e34-11ef-813f-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}


.stickers .sticker_bb386d88-9e2f-11ee-8113-000c29d50bd0 {
  background-color: #FF2400;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}

.stickers .sticker_47efe65d-1350-11ef-8128-000c29d50bd0 {
  background-color: #4ab139;
  color: #ffffff;
  font-family: "Ubuntu", Arial, sans-serif;
  font-style: italic; /* Это заменяет неправильное свойство style */
  font-size: 12px;
  font-weight: bold;
  width: 36px; /* Ширина стикера */
  height: 36px; /* Высота стикера */
  border-radius: 50%; /* Округление углов для формы круга */
  display: flex;
  justify-content: center;
  align-items: center;
}


/* Объявление нового шрифта */
@font-face {
    font-family: 'Ubuntu-Italic'; /* Название шрифта, которое будем использовать далее */
    src: local('Ubuntu-Italic'),
         url('/bitrix/fonts/Ubuntu-Italic.ttf') format('truetype'), /* ttf-шрифт */
}


/* Увеличение размера изображения */
.tizers_block .item .img {
  width: 300px !important; /* Установите желаемую ширину */
  height: 200px !important;
}


.img-responsive {
    display: block;
    max-width: 100%;
    height: 105%;

}