<!DOCTYPE html>
<!--[if IE]><![endif]-->
<!--[if IE 8 ]><html dir="{{ direction }}" lang="{{ lang }}" class="ie8"><![endif]-->
<!--[if IE 9 ]><html dir="{{ direction }}" lang="{{ lang }}" class="ie9"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html dir="{{ direction }}" lang="{{ lang }}"{% if body_class %} class="body-product"{% endif %}>
<!--<![endif]-->
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ title }}</title>
{% if (oct_remarket_data.open_graph is defined and oct_remarket_data.open_graph) and octOpenGraphs is not empty %}
{% for octOpenGraph in octOpenGraphs %}
{% if octOpenGraph.content is not empty %}
<meta property="{{ octOpenGraph.property }}" content="{{ octOpenGraph.content }}" />
{% endif %}
{% endfor %}
{% endif %}
{% if oct_analytics_google_webmaster_code is defined and oct_analytics_google_webmaster_code is not empty %}
<meta name="google-site-verification" content="{{ oct_analytics_google_webmaster_code }}" />
{% endif %}
<meta name="robots" content="max-image-preview:large">
{% if oct_analytics_googletm_code is defined and oct_analytics_googletm_code is not empty %}
<!-- Google Tag Manager -->
<script id="octGtm">(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','{{ oct_analytics_googletm_code }}');</script>
<!-- End Google Tag Manager -->
{% endif %}
{% if home_microdata is defined and home_microdata %}
<script type="application/ld+json">
{{ home_microdata | raw }}
</script>
{% endif %}
<base href="{{ base }}" />
{% if robots %}
<meta name="robots" content="{{ robots }}" />
{% endif %}
{% if description %}
<meta name="description" content="{{ description }}" />
{% endif %}
{% if keywords %}
<meta name="keywords" content="{{ keywords }}" />
{% endif %}
{% if oct_preloads %}
{% for oct_preload in oct_preloads %}
<link rel="preload" as="image" href="{{ oct_preload }}">
{% endfor %}
{% endif %}
{% for style in styles %}
{% if oct_preload_styles is defined and oct_preload_styles %}
<link rel="preload" as="style" href="{{ style.href }}">
{% endif %}
<link href="{{ style.href }}" rel="stylesheet" media="{{ style.media }}" />
{% endfor %}
{% for script in scripts %}
<script src="{{ script }}"></script>
{% endfor %}
{% for link in links %}
<link href="{{ link.href }}" rel="{{ link.rel }}" />
{% endfor %}
{% for analytic in analytics %}
{{ analytic }}
{% endfor %}
<script{% if oct_footer_scripts is defined and oct_footer_scripts and oct_minify is defined and oct_minify %} id="dataFonts"{% endif %}>
    let octFonts = localStorage.getItem('octFonts');
    if (octFonts !== null) {
        var octHead  = document.getElementsByTagName('head')[0];
        var octLink  = document.createElement('link');
        octLink.rel  = 'stylesheet';
        octLink.type = 'text/css';
        octLink.href = location.protocol + '//' + location.host + '/catalog/view/theme/oct_remarket/stylesheet/oct-fonts.css';
        octLink.media = 'all';
        octHead.appendChild(octLink);
    }
</script>
</head>
<body>
{% if oct_analytics_googletm_code is defined and oct_analytics_googletm_code is not empty %}
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id={{ oct_analytics_googletm_code }}" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
{% endif %}
{% if oct_bar_data.status is defined and oct_bar_data.status %}
<div class="oct-fixed-bar fixed-{{ bar_position }} d-none d-lg-block">
    {% if oct_bar_data.show_cart is defined and oct_bar_data.show_cart %}
    <div onclick="{% if oct_popup_cart_status is defined and oct_popup_cart_status %}octPopupCart();{% else %}location = '{{ shopping_cart }}';{% endif %}" class="oct-fixed-bar-item oct-fixed-bar-item-cart" title="{{ fixed_bar_cart }}">
        <img src="{{ base}}catalog/view/theme/oct_remarket/img/sprite.svg#include--fixed-bar-cart" alt="{{ fixed_bar_cart }}" width="24" height="24">
        <span class="oct-fixed-bar-quantity oct-fixed-bar-quantity-cart">{{ cart_total_bar }}</span>
    </div>
    {% endif %}
    {% if oct_bar_data.show_compare is defined and oct_bar_data.show_compare %}
    <a href="{{ compare_link }}" class="oct-fixed-bar-item oct-fixed-bar-item-compare" title="{{ fixed_bar_compare }}">
        <img src="{{ base}}catalog/view/theme/oct_remarket/img/sprite.svg#include--fixed-bar-compare" alt="{{ fixed_bar_compare }}" width="24" height="24">
        <span class="oct-fixed-bar-quantity oct-fixed-bar-compare-quantity">{{ compare_total }}</span>
    </a>
    {% endif %}
    {% if oct_bar_data.show_wishlist is defined and oct_bar_data.show_wishlist %}
    <a href="{{ wishlist_link }}" class="oct-fixed-bar-item oct-fixed-bar-item-wishlist" title="{{ fixed_bar_wishlist }}">
        <img src="{{ base}}catalog/view/theme/oct_remarket/img/sprite.svg#include--fixed-bar-wishlist" alt="{{ fixed_bar_wishlist }}" width="24" height="20">
        <span class="oct-fixed-bar-quantity oct-fixed-bar-wishlist-quantity">{{ wishlist_total }}</span>
    </a>
    {% endif %}
    {% if product_views_count is defined and product_views_count %}
    <div onclick="rmSidebar('{{ oct_product_views }}', 'viewed');" class="oct-fixed-bar-item oct-fixed-bar-item-viewed" title="{{ oct_product_views }}">
        <img src="{{ base}}catalog/view/theme/oct_remarket/img/sprite.svg#include--fixed-bar-viewed" alt="{{ oct_product_views }}" width="24" height="24">
        <span class="oct-fixed-bar-quantity">{{ product_views_count }}</span>
    </div>
    {% endif %}
    {% if oct_bar_data.show_account is defined and oct_bar_data.show_account %}
        {% if account_link %}
        <a href="{{ account_link }}" class="oct-fixed-bar-item oct-fixed-bar-item-viewed" title="{{ text_account }}">
            <img src="{{ base}}catalog/view/theme/oct_remarket/img/sprite.svg#include--fixed-bar-account" alt="{{ text_account }}" width="20" height="22">
        </a>
        {% else %}
        <div onclick="octPopupLogin();" class="oct-fixed-bar-item oct-fixed-bar-item-viewed" title="{{ text_account }}">
            <img src="{{ base}}catalog/view/theme/oct_remarket/img/sprite.svg#include--fixed-bar-account" alt="{{ text_account }}" width="20" height="22">
        </div>
        {% endif %}
    {% endif %}
</div>
{% endif %}
{{ oct_mobile_sidebar }}
<div id="rm_sidebar" class="rm-sidebar">
    <div class="rm-sidebar-content">
        <div class="rm-sidebar-title d-flex alig-items-center justify-content-between">
            <span class="rm-sidebar-title-text">{{ oct_menu }}</span>
            <span class="rm-sidebar-title-close modal-close">
                <span aria-hidden="true" class="modal-close-icon modal-close-left"></span>
                <span aria-hidden="true" class="modal-close-icon modal-close-right"></span>
            </span>
        </div>
        <div id="rm_sidebar_content"></div>
    </div>
</div>
{% if (oct_information_bar_value is defined and oct_information_bar_value is not empty and oct_information_bar_value) %}
<div id="oct-infobar">
    <div class="container">
        <div class="row">
            <div class="col-lg-12 d-flex align-items-center justify-content-between flex-column flex-md-row">
                <div class="oct-infobar-text">{{ text_oct_information_bar }}</div>
                <button type="button" aria-label="Information" id="oct-infobar-btn" class="mt-3 mt-md-0">{{ oct_info_bar_close }}</button>
            </div>
        </div>
    </div>
</div>
<script>
$('#oct-infobar-btn').on('click', function () {
    $('#oct-infobar').addClass('hidden');
    const date = new Date('{{ oct_information_bar_day_now }}'.replace(/-/g, "/"));
    date.setTime(date.getTime() + ({{ oct_info_max_day }} * 24 * 60 * 60 * 1000));
    document.cookie = '{{ oct_information_bar_value }}=1; path=/; expires=' + date.toUTCString();
});
</script>
<style>
#oct-infobar {background:{{ oct_information_bar_background }};}
.oct-infobar-text {color:{{ oct_information_bar_color_text }};}
.oct-infobar-text a {color:{{ oct_information_bar_color_url }};}
#oct-infobar-btn {background:{{ oct_information_bar_background_button }};color:{{ oct_information_bar_color_text_button }};}
#oct-infobar-btn:hover {background:{{ oct_information_bar_background_button_hover }};color:{{ oct_information_bar_color_text_button_hover }};}
</style>
{% endif %}
{% if oct_remarket_data.header_cur is defined or oct_remarket_data.header_lang is defined or oct_remarket_data.header_account is defined or oct_remarket_data.header_menu is defined %}
<nav id="top" class="top-nav d-none d-lg-block">
	<div class="container d-flex justify-content-between">
	  	{% if header_informations is defined and header_informations is not empty %}
		<ul class="top-nav-info-list list-unstyled d-flex align-items-center text-uppercase">
			{% for header_link in header_informations %}
			<li><a href="{{ header_link.href }}">{{ header_link.title }}</a></li>
			{% endfor %}
		</ul>
		{% endif %}
		<div class="top-nav-account-links list-unstyled d-flex">
			{{ language }}
			{{ currency }}
            {% if oct_remarket_data.header_account is defined %}
			<div class="top-nav-account-links-item rm-dropdown-box">
				{% if logged %}
				<span title="{{ text_account }}" class="rm-dropdown-toggle d-flex align-items-center">{{ text_account }}</span>
                <div class="rm-dropdown">
                    <div class="rm-dropdown-inner">
                        <ul class="list-unstyled">
        		            <li><a href="{{ account }}">{{ text_account }}</a></li>
        		            <li><a href="{{ order }}">{{ text_order }}</a></li>
        		            <li><a href="{{ logout }}">{{ text_logout }}</a></li>
        				</ul>
                    </div>
                </div>
				{% else %}
				<span onclick="octPopupLogin();" title="{{ text_account }}" class="d-flex align-items-center" role="button" aria-haspopup="true">{{ text_account }}</span>
				{% endif %}
	        </div>
            {% endif %}
		</div>
	</div>
</nav>
{% endif %}
<header>
  <div class="container-fluid container-sm">
    <div class="row align-items-center flex-column flex-md-row">
		{% if logo %}
    	<div class="col-md-3 col-lg-2 order-0">
            <div id="logo" class="d-flex align-items-center justify-content-center">
    			{% if oct_home is defined and oct_home %}
    			<span><img src="{{ logo }}" title="{{ name }}" alt="{{ name }}" class="img-fluid"{% if logo_width is defined and logo_width %} width="{{ logo_width }}"{% endif %}{% if logo_height is defined and logo_height %} height="{{ logo_height }}"{% endif %} /></span>
    			{% else %}
    			<a href="{{ home }}">
    				<img src="{{ logo }}" title="{{ name }}" alt="{{ name }}" class="img-fluid"{% if logo_width is defined and logo_width %} width="{{ logo_width }}"{% endif %}{% if logo_height is defined and logo_height %} height="{{ logo_height }}"{% endif %} />
    			</a>
    			{% endif %}
            </div>
		</div>
		{% else %}
		<h1><a href="{{ home }}">{{ name }}</a></h1>
		{% endif %}
        <div class="col-2 d-none d-lg-block order-1">
            <button id="menu_toggle_button" type="button" aria-label="Menu" class="rm-btn primary d-flex align-items-center justify-content-between">
                <span class="rm-btn-icon">
                    <img class="catalog-icon" src="catalog/view/theme/oct_remarket/img/sprite.svg#include--footer-catalog-icon" alt="" width="14" height="14">
                    <img class="close-icon" src="catalog/view/theme/oct_remarket/img/sprite.svg#include--close-catalog-icon" alt="" width="14" height="14">
                </span>
                <span class="rm-btn-text">{{ oct_menu_catalog }}</span>
            </button>
        </div>
        <div class="col-12 col-md-6 col-lg-4 order-3 order-md-2{% if oct_remarket_data.contact_address[oct_lang_id] is defined and oct_remarket_data.contact_address[oct_lang_id] %} mt-lg-2 mt-xl-3{% endif %}">
            {{ search }}
            {% if oct_remarket_data.contact_address[oct_lang_id] is defined and oct_remarket_data.contact_address[oct_lang_id] %}
    		<div class="rm-header-address d-none d-lg-block">
    	        <div class="rm-dropdown-box w-100">
                    <div class="rm-dropdown-toggle">
                        <span>{{ oct_our_address }}:</span>
                        <span class="rm-header-address-link">{{ oct_remarket_data.contact_address[oct_lang_id] }}</span>
                    </div>
    				<div class="rm-dropdown">
    					<div id="rm_header_locations" class="rm-dropdown-inner">
                            <div class="rm-header-location-inner">
                                <div class="rm-header-location active">
                                    <div class="d-flex align-items-center">
                                        <div class="rm-header-location-address">{{ oct_remarket_data.contact_address[oct_lang_id] }}</div>
                                        {% if oct_locations %}
                                        <button class="rm-btn secondary ml-auto">
                                            <span class="rm-btn-icon"><img src="{{ base}}catalog/view/theme/oct_remarket/img/sprite.svg#include--header-location-chevron" alt="" width="18" height="12"></span>
                                        </button>
                                        {% endif %}
                                    </div>
                                    {% if contact_open is defined and contact_open or contact_map is defined and contact_map and oct_contact_telephones is defined and oct_contact_telephones is not empty %}
                                    <div class="rm-header-location-collapsed">
                                        {% if oct_contact_telephones is defined and oct_contact_telephones is not empty %}
                                        <div class="rm-header-location-phones">
                                            <span>{{ oct_telephones }}</span>
                                            {% for oct_contact_telephone in oct_contact_telephones %}
                                            <a href="tel:{{ oct_contact_telephone|replace({" " : "", "-" : "", "(" : "", ")" : ""}) }}">{{ oct_contact_telephone }}</a>
                                            {% endfor %}
                                        </div>
                                        {% endif %}
                                        {% if oct_remarket_data.contact_open[oct_lang_id] is defined and oct_remarket_data.contact_open[oct_lang_id] %}
                                        <div class="rm-header-location-shedule">
                                            {% for contact_open in oct_contact_opens %}
                                            <span>{{ contact_open }}</span><br>
                                            {% endfor %}
                                        </div>
                                        {% endif %}
                                        {% if contact_map is defined and contact_map %}
                                        <div class="rm-header-location-map">
                					    	<div id="oct-contact-map" class="not_in"></div>
                					    <script>
                                            var width = document.documentElement.clientWidth;

                                            if (width > 992) {
                    					    	$('.rm-dropdown-toggle').on('mouseenter mouseleave', function() {
                    						    	octShowMap('{{ contact_map }}', '#oct-contact-map');
                    							});
                                            } else {
                                                $('.rm-dropdown-toggle').on('click', function() {
                    						    	octShowMap('{{ contact_map }}', '#oct-contact-map');
                    							});
                                            }
                					    </script>
                                        </div>
                					    {% endif %}
                                    </div>
                                    {% endif %}
                                </div>
                                {% if oct_locations %}
                                {% set key = 0 %}
                        		{% for location in oct_locations %}
                                {% set key = key + 1 %}
                        		<div id="rm-header-location-{{ key }}" class="rm-header-location">
                                    <div class="d-flex align-items-center">
                    					{% if location.address is defined and location.address %}
                    					<div class="rm-header-location-address">{{ location.address }}</div>
                    					{% endif %}
                                        <button class="rm-btn secondary ml-auto">
                                            <span class="rm-btn-icon"><img src="{{ base}}catalog/view/theme/oct_remarket/img/sprite.svg#include--header-location-chevron" alt="" width="18" height="12"></span>
                                        </button>
                                    </div>
                                    {% if location.open is defined and location.open or location.map is defined and location.phone is defined and location.phone %}
                                    <div class="rm-header-location-collapsed">
                                        {% if location.phone is defined and location.phone %}
                						<div class="rm-header-location-phones">
                							<span>{{ oct_telephones }}</span>
            								{% for phone in location.phone %}
            								<a href="tel:{{ phone|replace({" " : "", "-" : "", "(" : "", ")" : ""}) }}">{{ phone }}</a>
            								{% endfor %}
                						</div>
                						{% endif %}
                						{% if location.open is defined and location.open %}
                						<div class="rm-header-location-shedule">
            								{% for open in location.open %}
            								<span>{{ open }}</span><br>
            								{% endfor %}
                						</div>
                						{% endif %}
                            			{% if location.map is defined %}
                            			<div id="oct-header-location-map-{{ key }}" class="rm-header-location-map not_in"></div>
                                        <script>
                                        $('body').on('click', '#rm-header-location-{{ key }}', function(){
                                            octShowMap('{{ location.map }}', '#oct-header-location-map-{{ key }}');
                                        });
                                        </script>
                            			{% endif %}
                                    </div>
                        			{% endif %}
                        		</div>
                        		{% endfor %}
                            {% endif %}
                            </div>
                            <div class="d-flex justify-content-center rm-header-location-contacts-btn">
                                <a href="{{ contact }}" class="rm-btn secondary">
                                    <span class="rm-btn-text">{{ oct_go_contact_text }}</span>
                                </a>
                            </div>
    				    </div>
    				</div>
    			</div>
    		</div>
    		{% endif %}
        </div>
		{% if oct_contact_telephones is defined and oct_contact_telephones is not empty %}
		<div class="col-12 col-md-3 col-lg-2 d-none d-md-flex justify-content-center order-2 order-md-3">
          <div class="rm-header-phones d-flex align-items-center">
            <div class="rm-header-phones-icon">
              <img src="{{ base}}catalog/view/theme/oct_remarket/img/sprite.svg#include--header-phones-icon" alt="" width="30" height="30">
            </div>
            <div class="rm-header-phones-list">
            {% for oct_contact_telephone in oct_contact_telephones %}
            <a href="tel:{{ oct_contact_telephone|replace({" " : "", "-" : "", "(" : "", ")" : ""}) }}" class="rm-header-phones-list-item">{{ oct_contact_telephone }}</a>
            {% endfor %}
            {% if oct_popup_call_phone_status is defined and oct_popup_call_phone_status %}
			<span class="rm-header-phones-list-link blue-link rm-phone-link" onclick="octPopupCallPhone();">{{ oct_call_phone }}</span>
			{% endif %}
            </div>
          </div>
        </div>
        {% endif %}
        <div class="col-md-2 d-lg-flex justify-content-center order-4">
            {{ cart }}
        </div>
        {{ menu }}
    </div>
  </div>
</header>
