@font-face {
    font-family: 'Montserrat';
    src: url('./fonts/Montserrat.ttf');
}
@font-face {
    font-family: 'Roboto';
    src: url('./fonts/Roboto-Regular.ttf');
}
/*  load font GTEestipro */
@font-face {
    font-family: 'Gte_light';
    src: url('./fonts/gteestiprodisplay_light.otf');
}
@font-face {
    font-family: 'Gte_regular';
    src: url('./fonts/gteestiprodisplay_regular.otf');
}
@font-face {
    font-family: 'Gte_bold';
    src: url('./fonts/gteestiprodisplay_bold.otf');
}
@font-face {
    font-family: 'Gte_medium';
    src: url('./fonts/gteestiprodisplay_medium.otf');
}


html {
    user-scalable: none;  -webkit-text-size-adjust: none; touch-action: manipulation;
}
body {
    font-family: 'Roboto', sans-serif;
    user-scalable: none;  -webkit-text-size-adjust: none; touch-action: manipulation;
}
a { text-decoration: none; color: unset; }

.q-page-container { background: #FFF; }

.montserrat_font { font-family: 'Gte_medium', sans-serif; }

/* --------------------------------------------------  *
* --------------- Bootstrap breakpoints -------------  *
* ----------------------------------------------------*/
.container,
.container-sm,
.container-md,
.container-lg,
.container-xl {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 718px) {
    .container,
    .container-sm {
        max-width: 540px;
    }
}

@media (min-width: 1024px) {
    .container,
    .container-sm,
    .container-md {
        max-width: 1140px;
    }
}

@media (min-width: 1439px) {
    .container,
    .container-sm,
    .container-md,
    .container-lg {
        max-width: 1140px;
    }
}

@media (min-width: 1920px) {
    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl {
        max-width: 1140px;
    }
}

/* add media query for mobile only -> max-width: 718px */
@media (max-width: 718px) {
    .home_searchbar {
        margin-top: 0px !important;
        padding-top: 16px !important;
    }
}


/* -------------------------------------------------- *
* ------------------ General styles ------------------ *
* ---------------------------------------------------- */
.text-trim {
    width:calc(100% - 34px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block;
}
.text-shadow {
    text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.4);
}
.page_content {
     display: block; margin: 0 auto;
}

.main_header {
    max-height: 480px; width: 100%; display: block;
    position: relative; z-index: 10;
    background-image: url('../../../catalog/view/images/top_header.jpg'); background-size: cover;
    background-repeat: no-repeat; background-position: center 0px;
    border-bottom-right-radius: 20px; border-bottom-left-radius: 20px;
    padding-top: 20px; padding-bottom: 20px;
}
.main_header .logo_link {
    width: 170px; height: 170px; display: block; position: absolute; z-index: 20;
    left: 60px; top: 30px;   cursor: pointer;
}
.main_header .top_contacts {
    position: absolute; top: 250px; left: 55px; z-index: 10;
    width: 280px; display: block; padding: 0px;  text-align: left;
}
.main_header .top_contacts .top_contact_icon  { }
.main_header .top_contacts .top_contact_value  {
    font-family: 'Roboto', sans-serif; font-size: 11.5pt; font-weight: 700;
    color: #FFF; text-decoration: none; cursor: pointer; padding-top: 4px;
}

.main_header .top_menu {
  width: 100%; display: block; position: relative; z-index: 30;
}
.main_header .menu_item {
    font-family: 'Roboto', sans-serif; font-size: 10.5pt; font-weight: 600;
    color: #333; text-decoration: none; cursor: pointer; text-transform: uppercase;
    display: inline-block;
    padding-left: 10px; padding-right: 10px; padding-top: 6px; padding-bottom: 6px;
    margin-left: 5px; margin-right: 5px;

}
.main_header .menu_item .active {
    color: #FFF;  background-color: #2B5CCE; border-radius: 25px; display: block;
    padding-left: 18px; padding-right: 18px; padding-top: 6px; padding-bottom: 6px;
}
.main_header .menu_item .active:hover {
    background-color: #437afd;
}

.main_header .menu_item:hover {
    color: #2B99FF; text-decoration: none;
}
.main_header .menu_item img {
    vertical-align: middle;
}
.top_info_blocks { padding-top: 20px; padding-left: 40px; }
.top_info_blocks img {  display: block; }
.top_info_blocks span {
    font-size: 8pt; color: #7E7E7E; line-height: 1em; display: block; padding-top: 6px; padding-left: 14px;
}

.chip_block { margin-top: 10px; }
.chip_block .text_grey {
    color: #888888; font-size: 10pt; font-weight: 600; display: block;
}
.chip_block .text_blue {
    color: #2B5CCE; font-size: 15pt; font-weight: 900; text-transform: uppercase; display: block;
}


/** --------------------- Mobile ------------------------- **/

.main_header_mobile {
    min-height: 380px; width: 100%; display: block;
    position: relative; z-index: 0;
    background-image: url('../../../catalog/view/images/top_header.jpg'); background-size: contain;
    background-repeat: no-repeat; background-position: center 0px;
    border-bottom-right-radius: 20px; border-bottom-left-radius: 20px;
    padding-top: 20px; padding-bottom: 20px;
}
.mobile_logo_link {
    width: 75px; height: 60px; display: block; position: absolute; z-index: 20;
    left: 10px; top: 10px;  cursor: pointer;
}

.main_header_mobile .top_contacts_buttons {
    width: 100%; display: block; padding-top: 110px; padding-left: 13px;
}

.main_header_mobile .top_info_blocks {
    padding-top: 20px; padding-left: 10px;  width: 100%;
}
.main_header_mobile .top_info_blocks span {
    font-size: 8pt; color: #7E7E7E; line-height: 1em;  padding-top: 6px; padding-left: 0px;
}
.main_header_mobile .top_info_blocks img { align-self: center !important; display: block; margin: auto;   }

.main_header_mobile .chip_block { margin-top: 0px;}

.mobile_menu { padding-top: 50px; padding-bottom: 50px; }
.mobile_menu .menu_item {
    font-family: 'Roboto', sans-serif; font-size: 10.5pt; font-weight: 600;
    color: #333; text-decoration: none; cursor: pointer; text-transform: uppercase;
    display: block; border-bottom: #CCC 1px dotted;
    padding-left: 10px; padding-right: 10px; padding-top: 6px; padding-bottom: 6px;
    margin-left: 5px; margin-right: 5px; margin-top: 5px; margin-bottom: 5px;
    text-align: center !important;

}
.mobile_menu .menu_item .active {
    color: #FFF;  background-color: #2B5CCE; border-radius: 25px; display: block;
    padding-left: 18px; padding-right: 18px; padding-top: 6px; padding-bottom: 6px;
}

.mobile_menu  .top_contact_value { font-weight: bold; font-size: 11pt; }

/** --------------------- Titles heading ------------------------- **/
h1 {
    color: #0299ED; width: 100%; display: block; font-family: 'Gte_bold'; font-size: 14pt;
    margin-top: 10px; margin-bottom: 10px; position: relative; z-index: 30;
    line-height: 1.1em;
    font-weight: 600;
    background: url('../../../catalog/view/images/page_title_li.svg') no-repeat left center;
    background-size: 8px 8px;
    padding-left: 20px; font-weight: bold; line-height: 30px;
}
h2 {
    width: 100%; display: block; font-family: 'Gte_bold'; font-size: 14pt; font-weight: 600;
    margin-top: 10px; margin-bottom: 10px; position: relative;  padding-top: 12px; padding-bottom: 12px;
    line-height: 1.1em;
}

h1.shop_title {
    background: url('../../../catalog/view/images/page_title_li_square.svg') no-repeat left center; background-size: 8px 8px;
    padding-left: 20px; font-weight: bold; line-height: 30px;
}

h4 { font-size: 14pt; color: #0b73d6; }

.grey_title_area {
    background: linear-gradient(180deg, #F0F0F0 0%, #D2D2D2 100%);
    border-radius: 18px;  border: none;  padding: 5px;
}

.def_text {
    color: #000;  text-align: justify;  font-family: Roboto;
    font-size: 11pt;  font-style: normal; font-weight: 400; line-height: normal;
}


/* --------------------------------------------------- *
* -------------- Shop: Product list  ---------------- *
* ---------------------------------------------------- */
.product_card {
    border-radius: 12px; display: block;  border-collapse: collapse; border: none;
    background: #FFF; min-height: 150px; width: 100%;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25);
    border-top: #0299ED 7px solid; cursor: pointer;
    margin: auto; margin-bottom: 12px; margin-top: 12px;
    max-width: 280px;
}
.product_card img { border-radius: 15px; display: block; width: 100%; }
.product_card .product_title {
    width: 100%; display: block; text-align: center; color: #444; font-weight: bold;
    margin-bottom: 10px; font-size: 10pt; margin-bottom: 10px;
}
.product_card .price {
    font-size: 15pt; color: #666666; font-weight: 900; padding-top: 8px; padding-left: 10px; display: block;
}
.product_card img.cart_icon { width: 32px; float: right; }
.product_card img.cart_icon:hover { filter: brightness(75%); }

.product_card .grey_line {
    background: #999999; padding: 12px; min-height: 45px;
    margin-top: 0px; padding-top: 10px; display: block; position: relative; z-index: 0;
    border-bottom-left-radius: 12px; border-bottom-right-radius: 12px;
}
.product_card .white_card {
    padding: 16px;  display: block; position: relative; z-index: 20;
}

/* --------------------------------------------------- *
* -------------- Custom Buttons params ---------------- *
* ---------------------------------------------------- */
.def_btn {
    width: auto;  height: 35px;
    flex-shrink: 0; border-radius: 25px; border-collapse: collapse; border: none;
    font-family: 'Montserrat', sans-serif; font-size: 9pt; font-weight: 500;
    padding-left: 15px; padding-right: 15px;
}
.def_btn .btn_badge {
    border-radius: 50%; font-size: 8pt;
    padding-left: 6px; padding-right: 6px; padding-top: 1px; padding-bottom: 1px;
}
.blue_btn {
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(180deg, #2B5CCE 0%, #225eee 100%);
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
    border-radius: 25px;
}
.blue_btn i { color: #FFF; }
.blue_btn span {
    font-size: 9pt; color: #FFF; font-style: normal; font-weight: 500;
}
.blue_btn:hover {
    background: linear-gradient(180deg, #154ed7 0%, #0d3798 100%);
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
}
.grey_btn {
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(180deg, #ececec 0%, rgba(225, 225, 225, 0.74) 100%);
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
    border-radius: 25px;
}
.grey_btn i { color: #666; }
.grey_btn:hover {
    background: linear-gradient(180deg, #cbcbcb 0%, rgba(255, 255, 255, 0.74) 100%);
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
}
.grey_btn span {
    font-size: 9pt; color: #333; font-style: normal; font-weight: 500;
}

.white_btn {
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(180deg, #2B5CCE 0%, #225eee 100%);
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
    border-radius: 25px;
}


.outline_btn {
    display: flex; align-items: center; justify-content: center;
    border-radius: 25px;  border: 1px solid #FFF; background: transparent;
}
.outline_btn span {
    font-size: 9pt; color: #FFF; font-style: normal; font-weight: 500;
}
.outline_btn .badge { background-color: #00C9FF; color: #FFF; border-radius: 50%;   }


/* --------------------------------------------------- *
* -------------- Form inputs and select --------------- *
* ---------------------------------------------------- */
.app_form .q-input .q-field__control {
    border-radius: 10px !important; display: block;
    background: #EAEBEE;
    box-shadow: inset 0px 2px 3px rgba(0, 0, 0, 0.25);
}
.app_form .q-input input::placeholder {
    color: #676767; font-size: 13pt;
}
.app_form .q-textarea .q-field__control {
    border-radius: 10px !important; display: block;
    background: #EAEBEE;
    box-shadow: inset 0px 2px 3px rgba(0, 0, 0, 0.25);
}
.app_form .q-textarea textarea::placeholder {
    color: #676767; font-size: 12pt;
}
.no_wrap { white-space: nowrap; }

button.btn_blue:hover  { color: #24ffff !important; }
.rounded_btn { border-radius: 25px !important; }

/* --------------------------------------------------- *
* ---------------  Product Details page -------------- *
* ---------------------------------------------------- */
#product-info .breadcrumb  {
    border: none; background: none;  background-color: transparent;
}
#product-info .img-thumbnail {
    border-radius: 12px; overflow: hidden;
}
#product-info .ext_images {  height: 50px; border-radius: 8px; }

#product-info .img-thumbnail-container { position: relative;  }
#product-info .zoom_icon { position: absolute; right: 8%; top: 8%; z-index: 50; width: 40px; }

#product-info .product_cart_area {
    background-color: #ADADAD; border-radius: 15px; text-align: center; padding: 5px; padding-bottom: 8px;
}

.info_page_content { margin-top: 40px; }

.right_menu_user a { color: #0274b6; font-weight: bold; }
.right_menu_user a img { width: 18px; }

.simple_list_menu ul li {
    /*background: url('../../../catalog/view/images/cats_menu_li.svg') no-repeat left center; background-size: 7px 7px;
    padding-left: 22px; font-weight: bold; line-height: 50px; text-decoration: underline;*/
}

.btn.btn-primary, .btn.btn-secondary, .btn.btn-danger, .btn.btn-info, .btn.btn-positive, .btn.btn-light {
    border-radius: 15px !important; border: none;
}
.btn.btn-primary:hover {
    color: #4fffe4 !important;
}
.form-control.bg-grey-2 {
    border-radius: 15px !important;
}

/* --------------------------------------------------- *
* -------------------- Home Page  -------------------- *
* ---------------------------------------------------- */
.home_searchbar {
    background: linear-gradient(180deg, #F0F0F0 0%, #D2D2D2 100%);
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);
    border-radius: 25px;  border: none;  padding: 10px; display: block;
    position: relative; z-index: 0;  padding-top: 14px;
    padding-left: 20px;
}
.home_searchbar input { height: 40px; border-radius: 15px !important; margin-bottom: 3px; }
.home_searchbar .btn-lg, .home_searchbar .btn-group-lg > .btn { --bs-btn-padding-y: unset; }

.categories_menu { margin-top: -20px; padding-top: 20px; }
.categories_menu .menu_head {
    background: linear-gradient(180deg, #dedede 0%, #bebebe 100%);
    border-radius: 15px;  border: none;  padding: 15px; display: block;
    color: #FFF; font-weight: bold; font-size: 12pt; text-transform: uppercase;
    font-family: 'Montserrat', sans-serif; text-align: center;
    padding-bottom: 40px;
}
.categories_menu .menu_list_container  {
    background: linear-gradient(180deg, #2B5CCE 0%, #1e4193 100%);
    min-height: 800px; border-radius: 15px;  border: none;  display: block;
    margin-top: -28px; padding: 18px; padding-left: 35px;
}
.categories_menu .cat_menu_link {
    color: #FFF; font-weight: 400; font-size: 10.5pt; display: block;
    background: url('../../../catalog/view/images/cats_menu_li.svg') no-repeat left center; background-size: 17px 17px;
    padding-left: 20px; font-weight: bold; line-height: 30px; text-decoration: none;
}
.categories_menu .cat_menu_link:hover {
    color: #58ffee;
}
.categories_menu .cat_menu_link.active {
    color: #FFF;
}

.categories_menu .exchange_rates {
    width: 100%; display: block; text-align: center;
    padding-top: 15px; margin-top: 20px; border-top: #8AFFFF 3px solid;
    color: #FFF; font-weight: 700; font-size: 10.5pt; display: block;
}
.categories_menu .title {
    color: #8AFFFF; font-size: 11pt; width: 100%; display: block; text-align: center;
    text-transform: uppercase;
}

.badge {
    background-color: #CCC; border-radius: 12px; display: block;
    padding: 6px;  padding-top: 5px;  text-align: center;
    line-height: 14px; color: #FFF; font-size: 8pt; font-weight: 600;
}
.badge.badge_green { background-color: #72CE76;  }
.badge.badge_grey { background-color: #656565;  }

/* --------------------------------------------------- *
* ------------------ Carousel Slider ----------------- *
* ---------------------------------------------------- */
#slider_container {
    background-color: #F0F0F0; border-radius: 20px; min-height: 200px;
    padding: 10px; margin-top: 20px; margin-bottom: 20px; display: block; text-align: center;
    width: 100%; display: block; position: relative; z-index: 0;
}

#slider_container .product_card {
    border-top: none;
}
#slider_container .product_title_blue {
    background-color: #0494E5; color: #FFF; font-size: 10pt; font-weight: 600;
    display: block; border-top-left-radius: 15px; border-top-right-radius: 15px;
    padding: 12px;
}
#slider_container .carousel {
    border: none; background: none;  background-color: transparent; box-shadow: none;
}

#slider_container .carousel-dark .carousel-control-prev-icon, .carousel-dark .carousel-control-next-icon
{ filter: invert(0); }

#sections_list .product_title_blue {
    background: linear-gradient(180deg, #1a45a9 0%, #225eee 100%);
    color: #FFF; font-size: 9pt; font-weight: 600;
    display: block; border-top-left-radius: 15px; border-top-right-radius: 15px;
    padding: 12px; width: 100%; display: block; text-align: center; text-transform: uppercase;
    min-height: 60px;
    /* vertical align text by center od div  */
    display: flex; align-items: center; justify-content: center;
}
#sections_list .product_card  { border-top: none; }

#advantages { padding-bottom: 20px; }
#advantages .advantage_card_title {
    color: #4071CB; font-weight: 700; font-size: 12pt; font-family: 'Montserrat', sans-serif;
    display: block; text-align: center; text-transform: uppercase; padding-top: 10px;
}
#advantages .advantage_card_icon { display: block; text-align: center; }
#advantages .advantage_card_icon img { height: 130px; }
#advantages  .advantage_card_text {
    color: #6b6b6b; font-weight: 400; font-size: 9pt; font-family: 'Roboto', sans-serif;
    display: block; text-align: justify; padding-top: 10px; line-height: 1em;
    padding-left: 20px; padding-right: 20px;
}

/* --------------------------------------------------- *
* ------------------ Footer Slide Area  -------------- *
* ---------------------------------------------------- */

.footer_slide {
    margin-top: 40px; position: relative; z-index: 0;
    background-image: url('../../../catalog/view/images/footer_bg.jpg'); background-size: contain;
    background-repeat: no-repeat; background-position: top right;
    border-top-left-radius: 20px; border-top-right-radius: 20px;
    padding: 0px; overflow: hidden;
}
.footer_slide .slide_pic {
    display: block; position: relative; z-index: 10;
}
.footer_slide .slide_pic img { height: 400px; width: auto; margin-top: -1px; display: block; }
.footer_slide  .footer_contacts  {
    width: 450px; height: 150px; display: block; position: absolute; z-index: 20;
    right: 40px; top: 30px; text-align: center;
}
.footer_slide .contacts_title  {
    color: #8AFFFF; font-weight: 600; font-size: 11pt; font-family: 'Montserrat', sans-serif;
    display: block; text-align: right; text-transform: uppercase; padding-top: 10px;
    text-decoration: underline; margin-bottom: 15px;
}
.footer_slide .foot_menu_item {
    color: #FFF; font-weight: 500; font-size: 9pt; font-family: 'Roboto', sans-serif; text-align: right;
    background: url('../../../catalog/view/images/menu_li_mini_right.svg') no-repeat right center; background-size: 11px 11px;
    padding-right: 15px; font-weight: bold; line-height: 30px;  text-decoration: none;
}
.footer_slide .foot_menu_item a:hover {
    color: #2eedff; text-decoration: none;
}

.footer_slide  .footer_copyrights  {
    position: absolute; bottom: 46px; right: 50px; max-width: 500px; height: 40px; text-align: right;
    z-index: 999;
}
.footer_slide  .footer_copyrights .address {
    color: #8AFFFF; font-weight: 600; font-size: 10pt; font-family: 'Montserrat', sans-serif;
}
.footer_slide  .footer_copyrights .copyrights { font-size: 9pt; }

.footer_social_icons { margin-top: 10px; display: block; }
.footer_social_icons i {
    color: #FFF; font-size: 19pt; margin-left: 12px; margin-right: 12px;
    display: inline-block; vertical-align: middle; padding: 0px;
    cursor: pointer;
}




.info_contact_form {
    background: #e1e1e1; border-radius: 15px; padding: 20px; margin-top: 20px;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25);
}

.page_searchbar input { height: 40px; border-radius: 15px !important; margin-bottom: 3px; }
.page_searchbar .btn-lg, .home_searchbar .btn-group-lg > .btn { --bs-btn-padding-y: unset; }

#featured_slider .product_card img {
    height: 140px; width: auto; display: block; margin: auto;
}
#featured_slider .product_title_grey {
    width: 100%; display: block; text-align: center; color: #333; font-weight: bold;
    padding-top: 12px; padding-bottom: 12px;
}


.category_card {
    border-radius: 12px; display: block;  border-collapse: collapse; border: none;
    background: #FFF; height: 300px; width: 100%;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25);
    margin: auto; margin-bottom: 10px; margin-top: 10px; overflow: hidden;
    max-width: 300px;
}
.category_card img {
    border-radius: 15px;
    height: 170px !important; width: auto; display: block;
    margin: auto; margin-top: 20px;
}

#account_menu a {
    color: #007bbd; width: 100%; display: block; font-family: 'Montserrat'; font-size: 10pt;
    font-weight: 600;
    background: url('../../../catalog/view/images/page_title_li.svg') no-repeat 20px center; background-size: 8px 8px;
    padding-left: 40px; font-weight: bold; line-height: 30px;
}
#account_menu a:hover {
    color: #2B99FF; text-decoration: none;
}

#account_menu_page li {
    color: #007bbd; width: 100%; display: block; font-family: 'Montserrat'; font-size: 10pt;
    font-weight: 600;
    background: url('../../../catalog/view/images/page_title_li.svg') no-repeat 20px center; background-size: 8px 8px;
    padding-left: 40px; font-weight: bold; line-height: 30px;
}

#accordion .accordion-header  button {
    font-size: 12pt; color: #007bbd;
}