Blue Studio

Bílé stránky, černý text, sytě modrá tlačítka a světle šedozelené plochy.

Ukázkový web Stáhnout .MD pro AI

Základ

Bílé stránky s černým textem #0a0a0a, sytě modrá #0000ff jen na tlačítka, štítky a akcenty.
Světle šedozelená #eef2f0 odděluje sekce a nese karty služeb.
Písmo Matter ve všech velikostech, nadpisy řez 500, text 22 px.
Obsah široký nejvýš 1520 px na monitorech do 1920 px, na větších 2130 px. Hlavička jde vždy přes celou šířku.
Sekce oddělují velké svislé mezery.

Tlačítka

Plné modré tlačítko tlacitko-modre ve tvaru pilulky, rámeček 2 px, řez 500.
Obrysové tlačítko tlacitko-obrys, bílé s modrým rámečkem, v kartách přes celou šířku.
V hlavičce je výzva „Probrat váš projekt“ jako malá modrá pilulka.

Obrázky

Fotky a videa projektů nahrazuje sada 20 modrých vzorů, tmavých i světlých.
Obrázky mají zaoblení 10 px, náhledy projektů a článků jsou na šířku.

Navigace

Hlavička s logem, odkazy a podmenu Služby (Design, Weby, Marketing).
Na telefonu se menu otevírá z boku přes celou výšku a zavírá křížkem.
Patička s tlačítkem, kontaktem, dvěma sloupci odkazů a řádkem s právními odkazy.

Barvy

Značka

modrá#0000ffTlačítka, štítky, odrážky, hvězdičky a odkazy v textu.

jasná modrá#3452ffSvětlejší odstín modré v ilustracích a vzorech.

Text

inkoust#0a0a0aNadpisy, text, ikony a čáry v patičce.

šedá#696a74Data článků, popisky a doplňující text.

Plochy

šedozelená#eef2f0Podklad střídavých sekcí, karet a polí formuláře.

bílá#ffffffStránka, karty služeb a text na modré.

Typografie

Rozměry

Mezery a šířky

Název	Hodnota	Použití
`šířka obsahu`	1520px	Nejvyšší šířka obsahu na monitorech do 1920 px, na větších 2130 px.
`okraj stránky`	90px	Boční okraj na počítači, na telefonu 20 px.
`sekce`	120px	Svislá mezera mezi hlavními sekcemi.
`mezera mřížky`	30px	Mezera mezi kartami a náhledy.
`tlačítko`	30px 60px	Vnitřní okraj velkého tlačítka.

Rádiusy

Název	Hodnota	Použití
`obrázek a karta`	10px	Fotky, náhledy projektů a karty služeb.
`pilulka`	100px	Tlačítka a štítky.
`velká plocha`	30px	Rámeček sekce a formuláře.
`hodnocení`	50px 50px 50px 0	Bublina hodnocení klienta, ostrý roh vlevo dole.

Komponenty

Hlavička a patička

Hlavička

Logo vlevo, odkazy menu a modrá výzva vpravo. Odkazy 20 px řez 500, při najetí podtržení 1 px. Třídy: #header-outer, sf-menu, menu-item-btn-style-button.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div data-box-shadow="none" data-cart="false" data-condense="false" data-format="menu-left-aligned" data-full-width="true" data-has-buttons="no" data-has-menu="true" data-header-button_style="hover_scale" data-header-resize="0" data-lhe="animated_underline" data-logo-height="48" data-m-logo-height="36" data-megamenu-rt="1" data-mobile-fixed="1" data-padding="28" data-permanent-transparent="false" data-ptnm="false" data-remove-fixed="0" data-shrink-num="6" data-transparency-option="0" data-user-set-bg="#ffffff" data-using-logo="1" data-using-pr-menu="true" data-using-secondary="0" id="header-outer">
<div class="nectar" data-nosnippet="" id="search-outer">
<div id="search">
<div class="container">
<div id="search-box">
<div class="inner-wrap">
<div class="col span_12">
<form role="search">
<input aria-label="Search" name="s" placeholder="Hledat…" type="text" value=""/>
<button aria-label="Search" class="search-box__button" type="submit">Search</button> </form>
</div>
</div>
</div>
<div id="close"><a href="#" role="button"><span class="screen-reader-text">Close Search</span>
<span class="close-wrap"> <span class="close-line close-line1" role="presentation"></span> <span class="close-line close-line2" role="presentation"></span> </span> </a></div>
</div>
</div>
</div>
<header aria-label="Main Menu" id="top" role="banner">
<div class="container">
<div class="row">
<div class="col span_3">
<a data-supplied-ml="false" data-supplied-ml-starting="false" data-supplied-ml-starting-dark="false" href="#" id="logo">
<img alt="BLUE STUDIO Brno" class="stnd skip-lazy" height="34" src="obrazky/logo.svg" width="34"/> </a>
</div>
<div class="col span_9 col_last">
<div class="nectar-mobile-only mobile-header"><div class="inner"></div></div>
<div class="slide-out-widget-area-toggle mobile-icon slide-out-from-right-hover" data-custom-color="false" data-icon-animation="simple-transform">
<div> <a aria-expanded="false" aria-label="Navigation Menu" class="closed using-label" href="#" role="button">
<i class="label">Menu</i><span aria-hidden="true"> <i class="lines-button x2"> <i class="lines"></i> </i> </span> </a></div>
</div>
<nav aria-label="Main Menu">
<ul class="sf-menu">
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children nectar-regular-menu-item menu-item-5197" id="menu-item-5197"><a aria-expanded="false" aria-haspopup="true" href="#"><span class="menu-title-text">Služby</span></a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-7486" id="menu-item-7486"><a href="#"><span class="menu-title-text">Design</span></a></li><li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-5138" id="menu-item-5138"><a href="#"><span class="menu-title-text">Weby</span></a></li><li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-5175" id="menu-item-5175"><a href="#"><span class="menu-title-text">Marketing</span></a></li>
</ul>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-1480" id="menu-item-1480"><a href="#"><span class="menu-title-text">Projekty</span></a></li>
<li class="menu-item menu-item-type-taxonomy menu-item-object-category nectar-regular-menu-item menu-item-9260" id="menu-item-9260"><a href="#"><span class="menu-title-text">Případové studie</span></a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-1481" id="menu-item-1481"><a href="#"><span class="menu-title-text">Klienti</span></a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-3314" id="menu-item-3314"><a href="#"><span class="menu-title-text">Články</span></a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-11827" id="menu-item-11827"><a href="#"><span class="menu-title-text">Kontakt</span></a></li>
</ul>
</nav>
</div>
<div class="right-aligned-menu-items">
<nav>
<ul class="buttons sf-menu" data-user-set-ocm="off"><li class="button menu-item menu-item-type-post_type menu-item-object-page button_solid_color_2 menu-item-9004" id="menu-item-9004"><a href="#"><span class="menu-title-text">Probrat váš projekt</span></a></li>
</ul>
</nav>
</div>
</div>
</div>
</header>
</div></div></div>

Podmenu Služby

Rozbalené podmenu položky Služby s odkazy Design, Weby a Marketing. Otevírá se najetím, má jemný stín a zaoblené spodní rohy. Podtržená je jen aktuální a najetá položka. Třídy: menu-item-has-children, sub-menu.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div data-box-shadow="none" data-cart="false" data-condense="false" data-format="menu-left-aligned" data-full-width="true" data-has-buttons="no" data-has-menu="true" data-header-button_style="hover_scale" data-header-resize="0" data-lhe="animated_underline" data-logo-height="48" data-m-logo-height="36" data-megamenu-rt="1" data-mobile-fixed="1" data-padding="28" data-permanent-transparent="false" data-ptnm="false" data-remove-fixed="0" data-shrink-num="6" data-transparency-option="0" data-user-set-bg="#ffffff" data-using-logo="1" data-using-pr-menu="true" data-using-secondary="0" id="header-outer">
<div class="nectar" data-nosnippet="" id="search-outer">
<div id="search">
<div class="container">
<div id="search-box">
<div class="inner-wrap">
<div class="col span_12">
<form role="search">
<input aria-label="Search" name="s" placeholder="Hledat…" type="text" value=""/>
<button aria-label="Search" class="search-box__button" type="submit">Search</button> </form>
</div>
</div>
</div>
<div id="close"><a href="#" role="button"><span class="screen-reader-text">Close Search</span>
<span class="close-wrap"> <span class="close-line close-line1" role="presentation"></span> <span class="close-line close-line2" role="presentation"></span> </span> </a></div>
</div>
</div>
</div>
<header aria-label="Main Menu" id="top" role="banner">
<div class="container">
<div class="row">
<div class="col span_3">
<a data-supplied-ml="false" data-supplied-ml-starting="false" data-supplied-ml-starting-dark="false" href="#" id="logo">
<img alt="BLUE STUDIO Brno" class="stnd skip-lazy" height="34" src="obrazky/logo.svg" width="34"/> </a>
</div>
<div class="col span_9 col_last">
<div class="nectar-mobile-only mobile-header"><div class="inner"></div></div>
<div class="slide-out-widget-area-toggle mobile-icon slide-out-from-right-hover" data-custom-color="false" data-icon-animation="simple-transform">
<div> <a aria-expanded="false" aria-label="Navigation Menu" class="closed using-label" href="#" role="button">
<i class="label">Menu</i><span aria-hidden="true"> <i class="lines-button x2"> <i class="lines"></i> </i> </span> </a></div>
</div>
<nav aria-label="Main Menu">
<ul class="sf-menu">
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children nectar-regular-menu-item menu-item-5197" id="menu-item-5197"><a aria-expanded="false" aria-haspopup="true" href="#"><span class="menu-title-text">Služby</span></a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-7486" id="menu-item-7486"><a href="#"><span class="menu-title-text">Design</span></a></li><li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-5138" id="menu-item-5138"><a href="#"><span class="menu-title-text">Weby</span></a></li><li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-5175" id="menu-item-5175"><a href="#"><span class="menu-title-text">Marketing</span></a></li>
</ul>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-1480" id="menu-item-1480"><a href="#"><span class="menu-title-text">Projekty</span></a></li>
<li class="menu-item menu-item-type-taxonomy menu-item-object-category nectar-regular-menu-item menu-item-9260" id="menu-item-9260"><a href="#"><span class="menu-title-text">Případové studie</span></a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-1481" id="menu-item-1481"><a href="#"><span class="menu-title-text">Klienti</span></a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-3314" id="menu-item-3314"><a href="#"><span class="menu-title-text">Články</span></a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page nectar-regular-menu-item menu-item-11827" id="menu-item-11827"><a href="#"><span class="menu-title-text">Kontakt</span></a></li>
</ul>
</nav>
</div>
<div class="right-aligned-menu-items">
<nav>
<ul class="buttons sf-menu" data-user-set-ocm="off"><li class="button menu-item menu-item-type-post_type menu-item-object-page button_solid_color_2 menu-item-9004" id="menu-item-9004"><a href="#"><span class="menu-title-text">Probrat váš projekt</span></a></li>
</ul>
</nav>
</div>
</div>
</div>
</header>
</div></div></div>

Mobilní menu

Menu na telefonu otevřené z boku přes celou výšku, s podmenu a kontaktem. Zavírá se křížkem. Třídy: slide-out-widget-area, off-canvas-menu-container.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div aria-label="Off Canvas Menu" aria-modal="true" class="slide-out-from-right-hover" data-back-txt="zpět" data-dropdown-func="default" id="slide-out-widget-area" role="dialog">
<div class="inner-wrap">
<div class="inner" data-prepend-menu-mobile="false">
<a class="slide_out_area_close" href="#"><span class="screen-reader-text">Close Menu</span>
<span class="close-wrap"> <span class="close-line close-line1" role="presentation"></span> <span class="close-line close-line2" role="presentation"></span> </span> </a>
<div class="off-canvas-menu-container mobile-only" role="navigation">
<ul class="menu">
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-5197"><a aria-expanded="false" aria-haspopup="true" href="#">Služby</a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-7486"><a href="#">Design</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5138"><a href="#">Weby</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5175"><a href="#">Marketing</a></li>
</ul>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1480"><a href="#">Projekty</a></li>
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-9260"><a href="#">Případové studie</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1481"><a href="#">Klienti</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3314"><a href="#">Články</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-11827"><a href="#">Kontakt</a></li>
<li class="button menu-item menu-item-type-post_type menu-item-object-page menu-item-9004"><a href="#">Probrat váš projekt</a></li>
</ul>
<ul class="menu secondary-header-items">
</ul>
</div>
</div>
<div class="bottom-meta-wrap"><div class="widget widget_nav_menu" id="nav_menu-4"><div class="menu-off-canvas-container"><ul class="menu" id="menu-off-canvas"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-10873" id="menu-item-10873"><a href="#">Design magazín</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-4328" id="menu-item-4328"><a href="#">Podmínky spolupráce</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-privacy-policy menu-item-10754" id="menu-item-10754"><a href="#" rel="privacy-policy">Osobní údaje</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-10755" id="menu-item-10755"><a href="#">Cookies</a></li>
</ul></div></div></div></div>
</div></div></div></div>

Patička

Tlačítko, firma s kontaktem, dva sloupce odkazů a spodní řádek s copyrightem a právními odkazy. Třídy: #footer-outer, #footer-widgets, #copyright.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div data-bg-img-overlay="1.0" data-cols="5" data-copyright-line="false" data-custom-color="true" data-disable-copyright="false" data-full-width="false" data-link-hover="default" data-matching-section-color="true" data-midnight="light" data-using-bg-img="false" data-using-widget-area="true" id="footer-outer" role="contentinfo">
<div data-cols="5" data-has-widgets="true" id="footer-widgets">
<div class="container">
<div class="row">
<div class="col span_3">
<div class="widget widget_text" id="text-4"> <div class="textwidget"><a class="nectar-button small regular accent-color regular-button tlacitko-modre" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" role="button" style="margin-bottom: 30px; color: #ffffff; background-color: #0a0a0a;" target="_blank"><span>Probrat váš projekt</span></a>
</div>
</div> </div>
<div class="col span_3">
<div class="widget widget_text" id="text-2"> <div class="textwidget"><p><strong>BLUE STUDIO s.r.o.</strong></p>
<div class="footer-kontakt"><a href="#" id="CTAlinkEmailTo">info@blue.example</a><br/>
<a href="#" id="CTAlinkCallTo">+420 234 567 890</a></div>
</div>
</div>
</div>
<div class="col span_3">
<div class="widget widget_nav_menu" id="nav_menu-2"><div class="menu-footer-menu-03-container"><ul class="menu" id="menu-footer-menu-03"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3328" id="menu-item-3328"><a href="#">Projekty</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5198" id="menu-item-5198"><a href="#">Služby</a></li>
<li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-9153" id="menu-item-9153"><a href="#">Případové studie</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3330" id="menu-item-3330"><a href="#">Klienti</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5203" id="menu-item-5203"><a href="#">Články</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-9286" id="menu-item-9286"><a href="#">Kontakt</a></li>
</ul></div></div>
</div>
<div class="col span_3">
<div class="widget widget_nav_menu" id="nav_menu-3"><div class="menu-footer-menu-04-container"><ul class="menu" id="menu-footer-menu-04"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-4562" id="menu-item-4562"><a href="#">Praktický magazín</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-4783" id="menu-item-4783"><a href="#">Ke stažení</a></li>
</ul></div></div>
</div>
</div>
</div>
</div>
<div class="row" data-layout="default" id="copyright">
<div class="container">
<div class="col span_5">
<p></p><div class="left">2008-2026 © BLUE STUDIO s.r.o., IČO: 12345678</div> <div class="right"><a href="#">Podmínky spolupráce</a> <a href="#">Osobní údaje</a> <a href="#">Cookies</a></div>
</div>
<div class="col span_7 col_last">
<ul class="social">
</ul>
</div>
</div>
</div>
</div></div></div></div>

Úvod

Úvod domovské stránky

Nadpis, perex, modré tlačítko a hodnocení 4,8 s hvězdičkami, vpravo obrázek posledního projektu s odkazem. Třídy: top-level, tlacitko-modre, nectar-post-grid-wrap.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row top-level has-global-section full-width-section vc_row-o-equal-height vc_row-flex vc_row-o-content-middle top_padding_tablet_40px top_padding_phone_20px bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="dark" id="fws_6aaec9d5ee163" style="padding-top: 70px; padding-bottom: 0px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-6 vc_col-lg-6 vc_col-md-12 bsb_column column_container vc_column_container col no-extra-padding top_margin_tablet_40px top_margin_phone_20px bottom_margin_tablet_40px bottom_margin_phone_20px inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" style="margin-top: 20px; margin-bottom: 40px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row top_padding_tablet_0px top_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6aaec9d5eec7f" style="padding-top: 20px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="nectar-responsive-text font_size_desktop_2-3em font_size_tablet_2-1em font_size_phone_1-8em font_line_height_1-2em nectar-link-underline-effect" style="max-width: 760px;"><div class="bsb_row vc_row-fluid vc_row inner_row right_padding_100px bottom_padding_tablet_20px bottom_padding_phone_20px right_padding_tablet_0px right_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_67bdcac3781cd">
<div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<div class="bsb_wrapper">
<h1><strong>Vaše firma si zaslouží vypadat profesionálně</strong></h1>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="bsb_text_column bsb_content_element" style=" max-width: 900px; display: inline-block;">
<p data-end="361" data-start="294">Vytvoříme pro vás <strong>design, web i marketing tak, aby lidé hned pochopili, co děláte a proč si vybrat právě vás</strong>. Jsme BLUE STUDIO, grafické a webové studio z Brna pro celou ČR.</p>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d5ef6f3" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<a class="nectar-button jumbo regular accent-color regular-button tlacitko-modre" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" id="CTAbtnHeroKonzultace" role="button" style="margin-top: 10px; margin-bottom: 10px; color: #ffffff; background-color: #0a0a0a;"><span>Domluvit nezávaznou konzultaci</span></a>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row male" data-column-margin="default" data-midnight="" id="fws_6aaec9d5efdfa" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row" data-column-margin="default" data-midnight="dark" id="fws_6aaec9d5f0f3b" style="padding-top: 0px; padding-bottom: 0px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="iwithtext"><div class="iwt-icon"> <img alt="Google" decoding="async" src="assets/soubory/2025/12/google-logo.svg"/> </div><div class="iwt-text">
<div class="hodnoceni"><span class="stredni-text"><strong>4,8</strong></span></div>
<p><img alt="" class="size-full bs-image-5523 alignnone" decoding="async" height="18" role="img" src="assets/soubory/2024/12/star.svg" width="18"/><img alt="" class="size-full bs-image-5523 alignnone" decoding="async" height="18" role="img" src="assets/soubory/2024/12/star.svg" width="18"/><img alt="" class="size-full bs-image-5523 alignnone" decoding="async" height="18" role="img" src="assets/soubory/2024/12/star.svg" width="18"/><img alt="" class="size-full bs-image-5523 alignnone" decoding="async" height="18" role="img" src="assets/soubory/2024/12/star.svg" width="18"/><img alt="" class="size-full bs-image-5523 alignnone" decoding="async" height="18" role="img" src="assets/soubory/2024/12/star.svg" width="18"/><br/>
<a href="#" rel="noopener">recenze od našich klientů</a> </p></div><div class="clear"></div></div>
</div>
</div>
</div>
</div></div>
<style data-type="vc_custom-css" type="text/css">img.size-full.bs-image-5523.alignnone {
display: inline-flex;
}
@media (min-width: 1000px) {
.row .col .iwithtext .iwt-icon img:not([srcset]) {
width: 32px;
border-radius: 0 !important;
margin-top: 5px;
}
}
.iwithtext .iwt-icon {
top: 3px!important;
}
.iwithtext .iwt-text {
padding-left: 45px !important;
}
.hodnoceni {
display: flex;
position: absolute;
font-size: 1.2em;
}
.iwithtext .iwt-text p {
padding-top:5px;
padding-left: 3em !important;
line-height: 1.2em;
}</style><style data-type="vc_custom-css">img.size-full.bs-image-5523.alignnone {
display: inline-flex;
}
@media (min-width: 1000px) {
.row .col .iwithtext .iwt-icon img:not([srcset]) {
width: 32px;
border-radius: 0 !important;
margin-top: 5px;
}
}
.iwithtext .iwt-icon {
top: 3px!important;
}
.iwithtext .iwt-text {
padding-left: 45px !important;
}
.hodnoceni {
display: flex;
position: absolute;
font-size: 1.2em;
}
.iwithtext .iwt-text p {
padding-top:5px;
padding-left: 3em !important;
line-height: 1.2em;
}</style>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
<div class="vc_col-sm-6 vc_col-lg-6 vc_col-md-12 bsb_column column_container vc_column_container col no-extra-padding top_margin_tablet_20px top_margin_phone_20px bottom_margin_tablet_20px bottom_margin_phone_40px inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" style="margin-bottom: 20px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="nectar-post-grid-wrap text-color-light spacing-none" data-el-settings='{"post_type":"portfolio","pagination":"none","image_size":"medium","parallax_scrolling":"","aspect_ratio_image_size":"","category_position":"default","category_display":"default","display_categories":"0","display_excerpt":"0","excerpt_length":"20","content_next_to_image_excerpt_pos":"default","display_date":"0","display_estimated_reading_time":"0","display_author":"0","author_functionality":"default","author_position":"default","color_overlay":"","color_overlay_opacity":"0.3","color_overlay_hover_opacity":"0.4","card_bg_color":"","grid_style":"content_overlaid","hover_effect":"animated_underline","post_title_overlay":"","heading_tag":"default","heading_tag_render":"default","enable_gallery_lightbox":"0","remove_links":"0","category_style":"underline","overlay_secondary_project_image":"","vertical_list_hover_effect":"none","vertical_list_read_more":"","vertical_list_read_more_style":"text","read_more_button":"0","animation":"none","custom_fields":"","custom_fields_location":"before_post_meta","display_type":"grid","text_content_layout":"all_bottom_left"}' data-load-more-color="black" data-load-more-text="Zobrazit další" data-query='{"post_type":"portfolio","posts_per_page":"1","order":"DESC","orderby":"date","offset":"0","cpt_name":"post","custom_query_tax":"","ignore_sticky_posts":"","exclude_current_post":""}' data-style="content_overlaid"><div class="nectar-post-grid-filters" data-active-color="default" data-align="default" data-animation="none" data-sortable=""><div><a class="active all-filter" data-filter="-1" data-total-count="30" href="#">Vše</a><a data-filter="eshop" data-total-count="3" href="#">E-shop</a><a data-filter="vizualni-identita" data-total-count="23" href="#">Logo a identita</a><a data-filter="marketing" data-total-count="6" href="#">Marketing</a><a data-filter="tiskoviny" data-total-count="22" href="#">Tiskoviny</a><a data-filter="web" data-total-count="14" href="#">Tvorba webu</a><a data-filter="ux-webdesign" data-total-count="20" href="#">Webdesign</a></div></div><div class="nectar-post-grid custom_font_size_22px font_size_tablet_22px font_size_phone_18px text-opacity-1 text-opacity-hover-1 overlaid-aspect-ratio-image-size-16-9 category-position-before-title" data-animation="none" data-animation-stagger="90" data-border-radius="none" data-cat-click="default" data-columns="1" data-grid-item-height="60vh" data-grid-spacing="none" data-hover-effect="animated_underline" data-indicator="" data-indicator-color="#000" data-indicator-style="default" data-indicator-text="ZOBRAZIT" data-indicator-text-color="#fff" data-shadow-hover="" data-text-color="light" data-text-hover-color="light" data-text-layout="all_bottom_left" data-text-style="default"><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="9730"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Excursia" class="nectar-post-grid-item-bg__media" decoding="async" fetchpriority="high" height="450" src="obrazky/excursia-video-b097d3.webp" width="800"/></div></div></div><div class="bg-overlay" data-hover-opacity="0.4" data-opacity="0.3"></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Excursia: Nová tvář dobrodružných zájezdů</span></a><div class="item-main"><h3 class="post-heading"><span>Excursia: Nová tvář dobrodružných zájezdů</span></h3></div></div></div></div></div></div>
<div class="bsb_text_column bsb_content_element nejmensi">
<p>Nejnovější projekt: <a href="#">Excursia: Nová tvář dobrodružných zájezdů</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Úvod služby

Nadpis služby, perex a tlačítka vedle obrázku. Třídy: top-level, nectar-responsive-text, img-with-aniamtion-wrap.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row top-level full-width-section vc_row-o-equal-height vc_row-flex vc_row-o-content-middle reverse_columns_desktop top_padding_tablet_40px top_padding_phone_20px bs-uvod" data-column-margin="default" data-midnight="dark" id="fws_6ab1a0a965e1e" style="padding-top: 60px; padding-bottom: 0px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-6 vc_col-lg-6 vc_col-md-12 bsb_column column_container vc_column_container col no-extra-padding top_margin_tablet_40px top_margin_phone_20px bottom_margin_tablet_20px bottom_margin_phone_20px inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" style="margin-top: 40px; margin-bottom: 60px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row top_padding_phone_20px bottom_padding_tablet_0px bottom_padding_phone_0px right_padding_tablet_0px right_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6ab1a0a9668e4" style="padding-bottom: 20px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="nectar-responsive-text font_size_desktop_2-3em font_size_tablet_2-1em font_size_phone_1-8em font_line_height_1-2em nectar-link-underline-effect" style="max-width: 1260px;"><div class="bsb_row vc_row-fluid vc_row inner_row right_padding_100px bottom_padding_tablet_20px bottom_padding_phone_20px right_padding_tablet_0px right_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_67bdcac3781cd">
<div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<div class="bsb_wrapper">
<h1><strong>Představte si nový web, který odráží jedinečnost vaší značky</strong></h1>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row right_padding_tablet_0px right_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6ab1a0a9672b8" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element" style=" max-width: 690px; display: inline-block;">
<p>Funkční struktura, promyšlený design a technické řešení bez zbytečných efektů. Web je pracovní nástroj. Navrhujeme řešení, která fungují dnes i za pár let.</p>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6ab1a0a96790b" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<a class="nectar-button jumbo regular accent-color regular-button tlacitko-modre" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" role="button" style="margin-top: 20px; margin-bottom: 20px; color: #ffffff; background-color: #0a0a0a;"><span>Probrat váš projekt</span></a>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
<div class="vc_col-sm-6 vc_col-lg-6 vc_col-md-12 bsb_column column_container vc_column_container col centered-text no-extra-padding top_margin_tablet_30px top_margin_phone_30px bottom_margin_tablet_30px bottom_margin_phone_30px inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" style="margin-bottom: 10px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="img-with-aniamtion-wrap center" data-animation="none" data-max-width="100%" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="pp center" href="#">
<img alt="Originální web, který přemění návštěvníky na zákazníky" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" fetchpriority="high" height="1513" src="obrazky/originalni-web-01-56da98.webp" width="2344"/>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Úvod projektu

Titulek detailu projektu se štítky oboru. Třídy: project-title, section-title.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div id="full_width_portfolio"><div class="row project-title">
<div class="container">
<div class="title-wrap">
<div class="col span_12 section-title no-date">
<h1>Excursia: Nová tvář dobrodružných zájezdů</h1>
</div>
</div>
</div>
</div></div></div></div></div>

Úvod článku

Titulek článku s datem a kategorií. Třídy: blog-title, heading-title, meta-category.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap no-sidebar"><div class="container main-content"><div class="row heading-title hentry"><div class="col span_12 section-title blog-title">
<h1 class="entry-title">Jak probíhá tvorba webu: nejčastější obavy zákazníků a proces od první konzultace po spuštění</h1>
<div data-hide-on-mobile="false" id="single-below-header">
<span class="meta-author vcard author"><span class="fn"><span class="author-leading">By</span> <a href="#" rel="author">Jan Modrý</a></span></span><span class="meta-date date published">10. března 2026</span><span class="meta-date date updated rich-snippet-hidden">15 března, 2026</span><span class="meta-category"><a class="design" href="#">Design</a>, <a class="podnikani" href="#">Podnikání</a>, <a class="web" href="#">Web</a></span> </div>
</div></div></div></div></div></div></div>

Služby

Karty služeb

Tři bílé karty na šedozelené ploše: štítek, obrázek, nadpis, text, seznam s fajfkami a obrysové tlačítko. Nadpis je odkaz a podtrhne se i při najetí na obrázek. Třídy: full-width-section, tlacitko-obrys, male.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row full-width-section has-row-bg-color vc_row-o-equal-height vc_row-flex top_margin_60px bottom_margin_0px top_padding_tablet_60px top_padding_phone_40px bottom_padding_tablet_60px bottom_padding_phone_40px right_padding_tablet_0px right_padding_phone_0px left_padding_tablet_0px left_padding_phone_0px top_margin_tablet_40px top_margin_phone_20px bottom_margin_tablet_0px bottom_margin_phone_0px" data-column-margin="40px" data-midnight="dark" id="fws_6aaec9d605fd8" style="padding-top: 120px; padding-bottom: 100px; --row-bg-color: #eef2f0;"><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop using-bg-color" style="background-color: #eef2f0; "></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col centered-text no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row top_padding_tablet_20px top_padding_phone_20px bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6aaec9d6068e1" style="padding-bottom: 60px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element stredni-text" style=" max-width: 1200px; display: inline-block;">
<p>Spolehlivé a dlouhodobé partnerství pro vaši firmu</p>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-6 vc_col-xs-12 bsb_column column_container vc_column_container col no-extra-padding top_margin_phone_0px no-extra-padding_tablet no-extra-padding_phone" data-animation="" data-bg-color="#ffffff" data-bg-opacity="1" data-border-radius="10px" data-delay="0" data-has-bg-color="true" data-padding-pos="all" data-using-bg="true" style="margin-top: 20px; margin-bottom: 20px; ">
<div class="vc_column-inner"><div class="column-bg-overlay-wrap column-bg-layer" data-bg-animation="none"><div class="column-bg-overlay" style="opacity: 1; background-color: #ffffff;"></div></div>
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d607663" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column padding-8-percent padding-6-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper bs-sluzba">
<div class="bsb_text_column bsb_content_element male">
<p><span style="color: #0000ff;"><strong>DESIGN</strong></span></p>
</div>
<div class="img-with-aniamtion-wrap tl_br_6px tr_br_6px bl_br_6px br_br_6px" data-animation="none" data-border-radius="custom" data-max-width="100%" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="" href="#" target="_self">
<img alt="Dejte svému brandu tvář, na kterou budete hrdí" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="1652" src="obrazky/brand-f74b00.webp" width="2560"/>
</a>
</div>
</div>
</div>
</div><div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 40px;"></div></div>
<div class="bsb_text_column bsb_content_element">
<h2><a href="#"><strong>Logo a vizuální identita</strong></a></h2>
</div>
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 10px;"></div></div>
<div class="bsb_text_column bsb_content_element">
<p>Navrhujeme <strong>logotypy na míru, vizuální identity a brand manuály</strong> pro malé a střední firmy. <strong>Branding Brno</strong>, který vám pomůže působit konzistentně napříč všemi kanály.</p>
</div>
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 10px;"></div></div>
<div class="bsb_text_column bsb_content_element male">
<ul>
<li>Originální návrh loga (ne šablona)</li>
<li>Kompletní vizuální identita firmy</li>
<li>Brand manuál a podklady pro tisk i online</li>
<li>Rebranding a modernizace stávajícího loga</li>
</ul>
</div>
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 10px;"></div></div><a class="nectar-button large regular accent-color regular-button tlacitko-obrys tlacitko-full" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" role="button" style="margin-top: 20px; margin-bottom: 20px; color: #ffffff; background-color: #0a0a0a;"><span>Další informace</span></a>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-6 vc_col-xs-12 bsb_column column_container vc_column_container col no-extra-padding no-extra-padding_tablet no-extra-padding_phone flex_gap_desktop_10px" data-animation="" data-bg-color="#ffffff" data-bg-opacity="1" data-border-radius="10px" data-delay="0" data-has-bg-color="true" data-padding-pos="all" data-using-bg="true" style="margin-top: 20px; margin-bottom: 20px; ">
<div class="vc_column-inner"><div class="column-bg-overlay-wrap column-bg-layer" data-bg-animation="none"><div class="column-bg-overlay" style="opacity: 1; background-color: #ffffff;"></div></div>
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d609460" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column padding-8-percent padding-6-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper bs-sluzba">
<div class="bsb_text_column bsb_content_element male">
<p><span style="color: #0000ff;"><strong>WEBY</strong></span></p>
</div>
<div class="img-with-aniamtion-wrap tl_br_6px tr_br_6px bl_br_6px br_br_6px" data-animation="none" data-border-radius="custom" data-max-width="100%" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="" href="#" target="_self">
<img alt="Originální web, který přemění návštěvníky na zákazníky" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="1513" src="obrazky/originalni-web-01-56da98.webp" width="2344"/>
</a>
</div>
</div>
</div>
</div><div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 40px;"></div></div>
<div class="bsb_text_column bsb_content_element">
<h2><a href="#"><strong>Firemní nebo osobní web</strong></a></h2>
</div>
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 10px;"></div></div>
<div class="bsb_text_column bsb_content_element">
<p>Tvoříme <strong>firemní a osobní weby</strong> na míru na platformě <strong>WordPress</strong> a <strong>Shoptet e-shopy</strong>. Zaměřujeme se na tvorbu webu, UX, SEO a dlouhodobou udržitelnost.</p>
</div>
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 10px;"></div></div>
<div class="bsb_text_column bsb_content_element male">
<ul>
<li>Analýza, struktura a obsah webu</li>
<li>UX a UI design, responzivní provedení</li>
<li>Technické SEO, rychlost a bezpečnost</li>
<li>Analytické a marketingové nástroje</li>
</ul>
</div>
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 10px;"></div></div><a class="nectar-button large regular accent-color regular-button tlacitko-obrys tlacitko-full" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" role="button" style="margin-top: 20px; margin-bottom: 20px; color: #ffffff; background-color: #0a0a0a;"><span>Další informace</span></a>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-6 vc_col-xs-12 bsb_column column_container vc_column_container col no-extra-padding no-extra-padding_tablet no-extra-padding_phone flex_gap_desktop_10px" data-animation="" data-bg-color="#ffffff" data-bg-opacity="1" data-border-radius="10px" data-delay="0" data-has-bg-color="true" data-padding-pos="all" data-using-bg="true" style="margin-top: 20px; margin-bottom: 20px; ">
<div class="vc_column-inner"><div class="column-bg-overlay-wrap column-bg-layer" data-bg-animation="none"><div class="column-bg-overlay" style="opacity: 1; background-color: #ffffff;"></div></div>
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d60b3df" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column padding-8-percent padding-6-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper bs-sluzba">
<div class="bsb_text_column bsb_content_element male">
<p><span style="color: #0000ff;"><strong>MARKETING</strong></span></p>
</div>
<div class="img-with-aniamtion-wrap tl_br_6px tr_br_6px bl_br_6px br_br_6px" data-animation="none" data-border-radius="custom" data-max-width="100%" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="" href="#" target="_self">
<img alt="Kompletní marketing pro vaši firmu" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="1513" src="obrazky/marketing-06-3d5b47.webp" width="2344"/>
</a>
</div>
</div>
</div>
</div><div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 40px;"></div></div>
<div class="bsb_text_column bsb_content_element">
<h2><a href="#"><strong>Marketing a kampaně</strong></a></h2>
</div>
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 10px;"></div></div>
<div class="bsb_text_column bsb_content_element">
<p>Nastavujeme <strong>marketingovou strategii, </strong>spravujeme <strong>sociální sítě a </strong>spouštíme <strong>PPC kampaně</strong>. Zaměřujeme se na marketing pro malé firmy.</p>
</div>
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 10px;"></div></div>
<div class="bsb_text_column bsb_content_element male">
<ul>
<li>Strategie komunikace a obsahový plán</li>
<li>Správa sociálních sítí (Facebook, Instagram)</li>
<li>Meta a Google Ads kampaně</li>
<li>Pravidelné reporty a optimalizace výsledků</li>
</ul>
</div>
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 10px;"></div></div><a class="nectar-button large regular accent-color regular-button tlacitko-obrys tlacitko-full" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" role="button" style="margin-top: 20px; margin-bottom: 20px; color: #ffffff; background-color: #0a0a0a;"><span>Další informace</span></a>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Postup v krocích

Číslované kroky 01. až 05., text vedle obrázku a střídání stran. Třídy: vc_row-o-equal-height, img-with-animation.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row vc_row-o-equal-height vc_row-flex vc_row-o-content-middle max-width reverse_columns_desktop top_padding_tablet_0px top_padding_phone_0px bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="70px" data-midnight="dark" id="fws_6ab1a0a96d331" style="padding-top: 20px; padding-bottom: 20px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-6 vc_col-lg-6 vc_col-md-12 bsb_column column_container vc_column_container col no-extra-padding bottom_margin_tablet_20px bottom_margin_phone_20px inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" style="margin-bottom: 20px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="img-with-aniamtion-wrap" data-animation="none" data-max-width="100%" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a aria-label="Brand manuál vám zajistí konzistenci a rozpoznatelnost vaší značky" class="pp" href="#" title="">
<img alt="Unikátní vzhled, který vynikne" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="1330" src="obrazky/originalni-web-02-f7c3ca.webp" width="1772"/>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="vc_col-sm-6 vc_col-lg-6 vc_col-md-12 bsb_column column_container vc_column_container col no-extra-padding top_margin_tablet_20px top_margin_phone_20px bottom_margin_tablet_20px bottom_margin_phone_20px inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" style="margin-top: 20px; margin-bottom: 20px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row right_padding_100px bottom_padding_tablet_20px bottom_padding_phone_20px right_padding_tablet_0px right_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6ab1a0a96e1f7" style="padding-bottom: 20px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<h2 class="bs-h1"><span style="color: #0000ff;"><strong>01.</strong></span></h2>
</div>
<div class="bsb_text_column bsb_content_element">
<h2 class="bs-h1"><strong>Unikátní vzhled, který vynikne</strong></h2>
</div>
<div class="bsb_text_column bsb_content_element" style=" max-width: 960px; display: inline-block;">
<p data-end="470" data-start="178"><strong data-end="224" data-start="178">Váš web nebude vypadat jako stovky jiných.</strong> Navrhneme pro vás originální vizuální styl na míru - žádné šablony, ale design, který vychází z vaší značky a z požadovaných cílů. Vytváříme funkční weby, které budí důvěru, zaujmou na první pohled a vedou návštěvníka k akci.</p>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Ceník

Seznam problémů s ikonami, kruhové fotky, štítky a tři balíčky s cenou „od“. Třídy: nectar-icon-list-item, nectar-circle-images, nectar-badge.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row full-width-section has-row-bg-color vc_row-o-equal-height vc_row-flex top_margin_60px bottom_margin_0px top_padding_tablet_60px top_padding_phone_40px bottom_padding_tablet_40px bottom_padding_phone_40px right_padding_tablet_0px right_padding_phone_0px left_padding_tablet_0px left_padding_phone_0px top_margin_tablet_40px top_margin_phone_20px bottom_margin_tablet_0px bottom_margin_phone_0px" data-column-margin="40px" data-midnight="dark" id="ceny" style="padding-top: 120px; padding-bottom: 80px; --row-bg-color: #eef2f0;"><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop using-bg-color" style="background-color: #eef2f0; "></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col centered-text no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row top_padding_tablet_40px top_padding_phone_40px bottom_padding_tablet_40px bottom_padding_phone_20px" data-column-margin="default" data-midnight="" id="fws_6ab1a0a97623c" style="padding-bottom: 80px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element nadpis" style=" max-width: 1200px; display: inline-block;">
<h3>První dojem rozhoduje. Struktura, obsah, promyšlený design a technické řešení bez zbytečných efektů. Navrhujeme weby, které fungují dnes i za pár let.</h3>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-6 vc_col-xs-12 bsb_column column_container vc_column_container col no-extra-padding no-extra-padding_tablet no-extra-padding_phone flex_gap_desktop_10px" data-animation="" data-bg-color="#ffffff" data-bg-opacity="1" data-border-radius="10px" data-delay="0" data-has-bg-color="true" data-padding-pos="all" data-using-bg="true" style="margin-top: 20px; margin-bottom: 20px; ">
<div class="vc_column-inner"><div class="column-bg-overlay-wrap column-bg-layer" data-bg-animation="none"><div class="column-bg-overlay" style="opacity: 1; background-color: #ffffff;"></div></div>
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6ab1a0a976f0a" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column padding-8-percent padding-6-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 20px;"></div></div>
<div class="bsb_text_column bsb_content_element">
<p><span style="color: #0000ff;"><strong>Balíček MINI</strong></span></p>
</div>
<div class="bsb_text_column bsb_content_element">
<h2 class="bs-h1"><strong>Začněte prodávat</strong></h2>
</div>
<div class="bsb_text_column bsb_content_element">
<p>Funkční web do 2 stránek - ideální pro menší nebo začínající projekty.</p>
</div>
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 20px;"></div></div>
<div class="bsb_text_column bsb_content_element vc_custom_1757769304986">
<h2><span style="color: #0000ff;"><strong>od 24 990 Kč</strong></span></h2>
</div>
<div class="bsb_text_column bsb_content_element vc_custom_1759235168963 male" style=" max-width: 360px; display: inline-block;">
<p>+ bonus: správa webu v hodnotě 3 000 Kč na <strong>3 měsíce zdarma</strong></p>
</div>
<a class="nectar-button jumbo regular accent-color regular-button tlacitko-obrys tlacitko-full" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" role="button" style="margin-top: 20px; margin-bottom: 40px; color: #ffffff; background-color: #0a0a0a;"><span>Probrat váš projekt</span></a><div class="divider-wrap height_tablet_10px height_phone_0px" data-alignment="default"><div class="divider" style="height: 10px;"></div></div>
<div class="bsb_text_column bsb_content_element">
<ul>
<li>2 stránky webu</li>
<li>Originální grafický návrh webu v ceně</li>
<li>Responzivní design je u nás standard</li>
<li>Praktické a funkční SEO</li>
<li>HTTPS a SSL certifikát</li>
<li>Zřízení e-mailů</li>
<li>Kontaktní formulář</li>
<li>Integrace GDPR</li>
<li>Možnost rozšíření o jazykové mutace</li>
<li>Podpora přes e-mail i telefon</li>
<li>Správa webu na 3 měsíce zdarma</li>
</ul>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-6 vc_col-xs-12 bsb_column column_container vc_column_container col no-extra-padding no-extra-padding_tablet no-extra-padding_phone flex_gap_desktop_10px" data-animation="" data-bg-color="#ffffff" data-bg-opacity="1" data-border-animation="" data-border-animation-delay="" data-border-color="#0000FF" data-border-radius="10px" data-border-style="solid" data-border-width="1px" data-delay="0" data-has-bg-color="true" data-padding-pos="all" data-using-bg="true" style="margin-top: 20px; margin-bottom: 20px; ">
<div class="vc_column-inner" style="border: 1px solid #0000FF;"><div class="column-bg-overlay-wrap column-bg-layer" data-bg-animation="none"><div class="column-bg-overlay" style="opacity: 1; background-color: #ffffff;"></div></div>
<div class="bsb_wrapper">
<div class="nectar-badge nectar-inherit-body nectar-display-block text-color-0000FF padding-amount-large badge-style-default border-radius-20px"><div class="nectar-badge__inner nectar-bg-extra-color-2">Nejoblíbenější volba</div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6ab1a0a978de4" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column padding-8-percent top_margin_tablet_-40px top_margin_phone_-40px padding-6-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 20px;"></div></div>
<div class="bsb_text_column bsb_content_element">
<p><span style="color: #0000ff;"><strong>Balíček MAXI</strong></span></p>
</div>
<div class="bsb_text_column bsb_content_element">
<h2 class="bs-h1"><strong>Rozšiřte své podnikání<br/>
</strong></h2>
</div>
<div class="bsb_text_column bsb_content_element">
<p>Rozsáhlý web do 10 stránek, který pokryje všechny vaše služby a nabídky.</p>
</div>
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 20px;"></div></div>
<div class="bsb_text_column bsb_content_element vc_custom_1763660665708">
<h2><span style="color: #0000ff;"><strong>od 59 990 Kč</strong></span></h2>
</div>
<div class="bsb_text_column bsb_content_element vc_custom_1773171648356 male" style=" max-width: 360px; display: inline-block;">
<p>+ bonus: správa webu v hodnotě 3 000 Kč na <strong>3 měsíce zdarma</strong></p>
</div>
<a class="nectar-button jumbo regular accent-color regular-button tlacitko-modre tlacitko-full" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" role="button" style="margin-top: 20px; margin-bottom: 40px; color: #ffffff; background-color: #0a0a0a;"><span>Probrat váš projekt</span></a><div class="nectar-circle-images nectar-circle-images--position_overlapping size_40px alignment_left_desktop border_color_ffffff bs-varianta"><div class="nectar-circle-images__inner"><div class="nectar-circle-images__image nectar-circle-images__item" style='z-index: 100; background-image: url("obrazky/klient-lukas-berkovec-143cb1.webp");'></div><div class="nectar-circle-images__image nectar-circle-images__item" style='z-index: 99; background-image: url("obrazky/vyjadreni-klienta-petra-cvrkalova-5d4479.webp");'></div><div class="nectar-circle-images__image nectar-circle-images__item" style='z-index: 98; background-image: url("obrazky/vyjadreni-klienta-ondrej-jirovec-eca1f3.webp");'></div><div class="nectar-circle-images__image nectar-circle-images__item" style='z-index: 97; background-image: url("obrazky/vyjadreni-klienta-vit-pivonka-8eb923.webp");'></div></div><div class="nectar-circle-images__text nectar-circle-images__item">65% klientů vybírá tuto variantu</div></div><div class="divider-wrap height_tablet_10px height_phone_0px" data-alignment="default"><div class="divider" style="height: 10px;"></div></div>
<div class="bsb_text_column bsb_content_element">
<ul>
<li>Web do 10 stránek</li>
<li>Originální grafický návrh webu v ceně</li>
<li>Responzivní design je u nás standard</li>
<li>Detailní rozbor klíčových slov pro SEO</li>
<li>HTTPS a SSL certifikát</li>
<li>Zřízení e-mailů</li>
<li>Kontaktní stránka + formulář</li>
<li>Integrace GDPR a Cookies</li>
<li>Možnost rozšíření o jazykové mutace</li>
<li>Firemní zápis na Google a Seznam</li>
<li>Doména a hosting na 1. rok zdarma</li>
<li>Napojení na Google Analytics 4</li>
<li>Blog, fotogalerie, nabídka služeb</li>
<li>Podpora přes e-mail i telefon</li>
<li>Správa webu na 3 měsíce zdarma</li>
</ul>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-6 vc_col-xs-12 bsb_column column_container vc_column_container col no-extra-padding no-extra-padding_tablet no-extra-padding_phone flex_gap_desktop_10px" data-animation="" data-bg-color="#ffffff" data-bg-opacity="1" data-border-radius="10px" data-delay="0" data-has-bg-color="true" data-padding-pos="all" data-using-bg="true" style="margin-top: 20px; margin-bottom: 20px; ">
<div class="vc_column-inner"><div class="column-bg-overlay-wrap column-bg-layer" data-bg-animation="none"><div class="column-bg-overlay" style="opacity: 1; background-color: #ffffff;"></div></div>
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6ab1a0a97b674" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column padding-8-percent padding-6-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 20px;"></div></div>
<div class="bsb_text_column bsb_content_element">
<p><span style="color: #0000ff;"><strong>Balíček PRO</strong></span></p>
</div>
<div class="bsb_text_column bsb_content_element">
<h2 class="bs-h1"><strong>Ovládněte váš trh</strong></h2>
</div>
<div class="bsb_text_column bsb_content_element">
<p>Kompletní řešení pro 10+ stránek i speciální funkce, které váš web posunou.</p>
</div>
<div class="divider-wrap height_tablet_10px height_phone_10px" data-alignment="default"><div class="divider" style="height: 20px;"></div></div>
<div class="bsb_text_column bsb_content_element vc_custom_1763660676239">
<h2><span style="color: #0000ff;"><strong>od 89 990 Kč</strong></span></h2>
</div>
<div class="bsb_text_column bsb_content_element vc_custom_1759235230946 male" style=" max-width: 360px; display: inline-block;">
<p>+ bonus: správa webu v hodnotě 6 000 Kč na <strong>6 měsíců zdarma</strong></p>
</div>
<a class="nectar-button jumbo regular accent-color regular-button tlacitko-obrys tlacitko-full" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" id="CTAbtnSluzbyWebBalicek3" role="button" style="margin-top: 20px; margin-bottom: 40px; color: #ffffff; background-color: #0a0a0a;"><span>Probrat váš projekt</span></a><div class="divider-wrap height_tablet_10px height_phone_0px" data-alignment="default"><div class="divider" style="height: 10px;"></div></div>
<div class="bsb_text_column bsb_content_element">
<ul>
<li>10+ stránek webu</li>
<li>Originální grafický návrh webu v ceně</li>
<li>Responzivní design je u nás standard</li>
<li>SEO s ohledem na dohledatelnost</li>
<li>HTTPS a SSL certifikát</li>
<li>Zřízení e-mailů</li>
<li>Kontaktní stránka a individuální formuláře</li>
<li>Integrace GDPR a Cookies</li>
<li>Možnost rozšíření o jazykové mutace</li>
<li>Firemní zápis na Google a Seznam</li>
<li>Doména a hosting na 1. rok zdarma</li>
<li>Napojení na Google Analytics 4</li>
<li>Blog, fotogalerie, nabídka služeb</li>
<li>Zaškolení vašich zaměstnanců</li>
<li>Propojení s nástroji pro newsletter</li>
<li>Prémiová podpora i o víkendech</li>
<li>Správa webu na 6 měsíců zdarma</li>
</ul>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col no-extra-padding top_margin_tablet_40px top_margin_phone_40px inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" style="margin-top: 60px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="nectar-icon-list" data-animate="" data-columns="2" data-direction="horizontal" data-icon-color="default" data-icon-size="small" data-icon-style="border"><div class="nectar-icon-list-item content_color_000000"><div class="list-icon-holder" data-icon_type="numerical"><span>1</span></div><div class="content"><h4>Máte zastaralý web nebo žádný nemáte?</h4>Mnoho firem zjistí, že jejich web už neodpovídá tomu, co dnes dělají, nebo jim chybí úplně. Profesionální, moderní web může výrazně zlepšit vaši viditelnost a důvěryhodnost.</div></div><div class="nectar-icon-list-item content_color_000000"><div class="list-icon-holder" data-icon_type="numerical"><span>2</span></div><div class="content"><h4>Web nepřivádí žádné zákazníky</h4>Nestačí mít jen web - musí být efektivním nástrojem, který návštěvníky osloví a promění je v zákazníky. Vytváříme webové stránky, které přináší výsledky.</div></div><div class="nectar-icon-list-item content_color_000000"><div class="list-icon-holder" data-icon_type="numerical"><span>3</span></div><div class="content"><h4>Nechcete už ztrácet čas a plácat se v tom sami?</h4>Pokud jste se pokoušeli vytvořit web sami, možná jste zjistili, že to bere čas a výsledky nejsou ideální. Spolehněte se na profesionály, kteří vše nastaví a ušetří vám starosti.</div></div><div class="nectar-icon-list-item content_color_000000"><div class="list-icon-holder" data-icon_type="numerical"><span>4</span></div><div class="content"><h4>Chcete se odlišit od konkurence?</h4>Šablonové weby často splývají s ostatními. Nabízíme originální řešení, které vystihne podstatu vaší značky a zanechá dojem.</div></div><div class="nectar-icon-list-item content_color_000000"><div class="list-icon-holder" data-icon_type="numerical"><span>5</span></div><div class="content"><h4>Potřebujete web, který poroste s vámi</h4>Firmy se vyvíjejí a web by měl růst s nimi. Ať už plánujete rozšíření o blog, e-shop nebo jazykové mutace, váš web na to bude připravený.</div></div><div class="nectar-icon-list-item content_color_000000"><div class="list-icon-holder" data-icon_type="numerical"><span>6</span></div><div class="content"><h4>Web není jednorázová záležitost</h4>Nabízíme podporu, rady a úpravy i po spuštění, abyste vždy věděli, na koho se obrátit.</div></div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6ab1a0a97d32f" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="divider-wrap height_tablet_20px height_phone_0px" data-alignment="default"><div class="divider-border" data-animate="" data-animation-delay="" data-color="default" data-width="100%" style="margin-top: 20px; height: 1px; margin-bottom: 20px;"></div></div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row top_padding_tablet_60px top_padding_phone_60px bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6ab1a0a97d8f9" style="padding-top: 60px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column centered-text neg-marg no-extra-padding top_margin_tablet_-30px top_margin_phone_-40px inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" style="margin-top: -40px; margin-bottom: 20px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<a class="nectar-button medium regular accent-color regular-button tlacitko-modre" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" id="CTAbtnSluzbyObjednat" role="button" style="color: #ffffff; background-color: #0a0a0a;"><span>Zobrazit časté dotazy</span></a>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row bottom_padding_tablet_20px bottom_padding_phone_20px" data-column-margin="default" data-midnight="" id="fws_6ab1a0a97df75" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column centered-text no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element vc_custom_1755899485699 nejmensi">
<p>Uvedené ceny jsou konečné, nejsme plátci DPH.</p>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Proč my

Nadpis vlevo zůstává při posouvání na místě, důvody jsou vpravo. Třídy: nectar-sticky-column-css, has-global-section.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row has-global-section" data-column-margin="default" data-midnight="dark" id="vyhody" style="padding-top: 0px; padding-bottom: 0px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row full-width-section top_padding_tablet_60px top_padding_phone_20px bottom_padding_tablet_40px bottom_padding_phone_20px" data-column-margin="default" data-midnight="dark" id="spoluprace" style="padding-top: 80px; padding-bottom: 80px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-6 bsb_column column_container vc_column_container col nectar-sticky-column-css no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="n-sticky"><div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74af123be" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="divider-wrap height_tablet_0px height_phone_0px" data-alignment="default"><div class="divider" style="height: 20px;"></div></div>
<div class="bsb_text_column bsb_content_element vc_custom_1756210649220">
<h2 class="bs-h1"><strong>Proč vybrat BLUE STUDIO?</strong></h2>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74af12651" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element" style=" max-width: 700px; display: inline-block;">
<p class="p1">Jsme malé studio dvou bratrů. Díky osobnímu přístupu, promyšlenému procesu a mnohaletým zkušenostem vám ušetříme čas, nervy i peníze. Postaráme se o vaši prezentaci dlouhodobě - od prvního návrhu až po každodenní podporu.</p>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row top_padding_tablet_20px top_padding_phone_20px bottom_padding_tablet_20px bottom_padding_phone_20px" data-column-margin="default" data-midnight="" id="fws_6aef74af127de" style="padding-top: 40px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<a class="nectar-button medium regular accent-color regular-button tlacitko-modre" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" role="button" style="color: #ffffff; background-color: #0a0a0a;"><span>Probrat váš projekt</span></a>
</div>
</div>
</div>
</div></div>
</div>
</div></div>
</div>
<div class="vc_col-sm-6 bsb_column column_container vc_column_container col no-extra-padding top_margin_tablet_20px top_margin_phone_20px inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" style="margin-top: 20px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74af12a99" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 proc-kacer-studio bsb_column column_container vc_column_container col child_column padding-7-percent inherit_tablet inherit_phone tl_br_6px tr_br_6px bl_br_6px br_br_6px flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<h2><b>Postaráme se o vaši značku dlouhodobě</b></h2>
</div>
<div class="bsb_text_column bsb_content_element">
<p><strong>Návrhem loga nebo webu to u nás nekončí.</strong> Navrhujeme veškeré materiály, které budete potřebovat - od letáčků, bannerů a vizuálů kampaní až po design landing pages pro nové služby. Budeme vaším dlouhodobým partnerem, na kterého se můžete spolehnout.</p>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74af12c88" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 proc-kacer-studio bsb_column column_container vc_column_container col child_column padding-7-percent inherit_tablet inherit_phone tl_br_6px tr_br_6px bl_br_6px br_br_6px flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<h2><strong>Navrhujeme funkční řešení</strong></h2>
</div>
<div class="bsb_text_column bsb_content_element">
<p>Vždy hledáme takové řešení, které v praxi opravdu funguje: <strong>design, který je jasný a čitelný, weby, které vedou zákazníka, a marketing, který má konkrétní cíl.</strong> Žádná umělecká abstrakce, jen promyšlené a funkční návrhy, které podpoří váš byznys.</p>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74af12eae" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 proc-kacer-studio bsb_column column_container vc_column_container col child_column padding-7-percent inherit_tablet inherit_phone tl_br_6px tr_br_6px bl_br_6px br_br_6px flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<h2><strong>Budete působit jednotně a profesionálně</strong></h2>
</div>
<div class="bsb_text_column bsb_content_element">
<p class="p1"><strong>Od vizitek přes web až po sociální sítě</strong> - vše bude konečně ladit dohromady. Pomůžeme vám vytvořit<strong> konzistentní vizuální styl,</strong> který posílí důvěru zákazníků a odliší vás od konkurence. Vaše značka začne působit moderně a spolehlivě na každém kroku.</p>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74af130b9" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 proc-kacer-studio bsb_column column_container vc_column_container col child_column padding-7-percent inherit_tablet inherit_phone tl_br_6px tr_br_6px bl_br_6px br_br_6px flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<h2><strong>Bez problémů s autorskými právy </strong></h2>
</div>
<div class="bsb_text_column bsb_content_element">
<p><strong>Postaráme se, aby vaše grafika byla 100 % originální.</strong> Žádné kopie, žádné starosti! Můžete se klidně věnovat svému byznysu, zatímco my zajistíme unikátní design a případně doporučíme registraci ochranné známky.</p>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74af132c4" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 proc-kacer-studio bsb_column column_container vc_column_container col child_column padding-7-percent inherit_tablet inherit_phone tl_br_6px tr_br_6px bl_br_6px br_br_6px flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<h2 class="waves---heading-3-no-margins-2"><strong>Jasné ceny a férový proces</strong></h2>
</div>
<div class="bsb_text_column bsb_content_element">
<p class="p1">U nás přesně víte, co dostanete. <strong>Žádné skryté položky, žádná překvapení nebo hodinová mzda.</strong> Pracujeme rychle, srozumitelně s předstihem a s respektem k vašemu času i rozpočtu.</p>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div>
<style data-type="vc_shortcodes-custom-css" type="text/css">.vc_custom_1756210649220{padding-bottom: 20px !important;}</style>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Časté dotazy

Rozbalovací otázky, otevírá se jedna, ikona plus a mínus. Třídy: toggles, toggle.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row parallax_section zindex-set right_padding_20pct left_padding_20pct top_padding_tablet_30px top_padding_phone_20px right_padding_tablet_0px right_padding_phone_0px left_padding_tablet_0px left_padding_phone_0px" data-column-margin="default" data-midnight="dark" id="dotazy" style="padding-top: 60px; padding-bottom: 0px;  z-index: 10;"><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop using-bg-color" data-parallax-speed="fast" style="background-color: #ffffff; "></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="right">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row bottom_padding_tablet_20px bottom_padding_phone_30px" data-column-margin="default" data-midnight="" id="fws_6ab1a0a988f6f" style="padding-bottom: 40px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column centered-text no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<h2 class="bs-h1"><strong>Časté dotazy</strong></h2>
</div>
</div>
</div>
</div>
</div></div><div class="toggles" data-br="" data-starting="default" data-style="minimal"><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6ab1a0a989f20" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6ab1a0a989f20" role="button"><i class="fa fa-plus" role="presentation"></i>Můžete mi dodat jen grafiku, pokud mám své programátory?</a></h3><div aria-labelledby="toggle-button-6ab1a0a989f20" id="toggle-panel-6ab1a0a989f20" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<p>Pokud máte vlastní vývojáře, můžeme pro vás zpracovat pouze <strong>design webu nebo e-shopu</strong>. Pokud budete potřebovat, zajistíme i dozor nad technickou realizací, abyste měli jistotu, že vše bude správně implementováno podle návrhu designu.</p>
</div>
</div></div></div><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6ab1a0a98a18d" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6ab1a0a98a18d" role="button"><i class="fa fa-plus" role="presentation"></i>Jak dlouho trvá vytvoření webu?</a></h3><div aria-labelledby="toggle-button-6ab1a0a98a18d" id="toggle-panel-6ab1a0a98a18d" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<p><strong>Vytvoření středně velkého webu</strong> obvykle zabere přibližně 4-6 týdnů. Délka realizace závisí na rozsahu projektu a množství práce. Přesnější odhad vám dáme po upřesnění zadání.</p>
</div>
</div></div></div><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6ab1a0a98a376" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6ab1a0a98a376" role="button"><i class="fa fa-plus" role="presentation"></i>Co musím pro vytvoření webu dodat?</a></h3><div aria-labelledby="toggle-button-6ab1a0a98a376" id="toggle-panel-6ab1a0a98a376" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<p>Podklady vždy řešíme individuálně podle potřeb vašeho projektu. Obvykle se hodí (pokud máte k dispozici) vlastní <strong>fotografie, PDF dokumenty, certifikáty, reference nebo jiné materiály, které vaši značku prezentují</strong>.</p>
<p>Pokud nemáte hotové texty, připravíme jena míru tak, aby oslovily vaši cílovou skupinu. A pokud míříte na zahraniční trh,<strong> zajistíme i překlady z češtiny do angličtiny nebo naopak</strong>, a to od rodilého mluvčího, aby vaše sdělení neztratilo svou sílu.</p>
</div>
</div></div></div><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6ab1a0a98a544" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6ab1a0a98a544" role="button"><i class="fa fa-plus" role="presentation"></i>Můžu si upravovat web sám?</a></h3><div aria-labelledby="toggle-button-6ab1a0a98a544" id="toggle-panel-6ab1a0a98a544" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<p>Všechny weby stavíme na WordPressu, což je uživatelsky přívětivá a celosvětově oblíbená platforma. Díky tomu<strong> můžete snadno upravovat texty nebo obrázky</strong>, aniž byste potřebovali znalosti programování. Pokud byste však potřebovali pomoc nebo se chtěli věnovat svému podnikání naplno, <strong>rádi se postaráme o správu webu</strong> za vás.</p>
</div>
</div></div></div><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6ab1a0a98a6f8" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6ab1a0a98a6f8" role="button"><i class="fa fa-plus" role="presentation"></i>Nabízíte i správu webových stránek?</a></h3><div aria-labelledby="toggle-button-6ab1a0a98a6f8" id="toggle-panel-6ab1a0a98a6f8" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<p><strong>Nabízíme pravidelnou údržbu, aktualizace a technickou podporu</strong> pro zajištění bezpečnosti a aktuálnosti webu. Všechny weby, které vytváříme, běží na hostingovém řešení využívajícím servery společnosti Webglobe. Tento hosting je plně přístupný i vám jako klientovi - máte tak plnou kontrolu nad svým webem i hostingem a můžete k němu kdykoliv přistupovat.</p>
<p><strong>Správu webu</strong> poskytujeme pouze v případě, že web běží na našem hostingovém řešení u <a href="#" rel="noopener" target="_blank">Webglobe</a>, protože jen tak můžeme zaručit jeho rychlost, bezpečnost a spolehlivost.</p>
<p><strong>Cena správy webu je 1 000 Kč/měsíc za každý web. </strong>Při objednávce správy více webů lze domluvit individuální ceny.</p>
<ul>
<li>V ceně získáte 2 hodiny technických prací měsíčně</li>
<li>Pravidelnou údržbu webu a hostingu</li>
<li>Pravidelné zálohování s možností bezplatné obnovy dat</li>
<li>Aktualizace pluginů</li>
<li>Rychlé řešení problémů</li>
<li>Kontrolu funkčnosti odkazů a výkonu webu</li>
<li>Pravidelné kontroly zabezpečení a hrozeb</li>
<li>Bezplatné odstranění malware v případě napadení webu</li>
<li>Notifikace v případě výpadku služeb</li>
<li>Správu doménových služeb</li>
</ul>
</div>
<div class="divider-wrap height_tablet_15px height_phone_15px" data-alignment="default"><div class="divider" style="height: 15px;"></div></div></div></div></div><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6ab1a0a98ab32" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6ab1a0a98ab32" role="button"><i class="fa fa-plus" role="presentation"></i>Pomůžete mi s výběrem hostingu?</a></h3><div aria-labelledby="toggle-button-6ab1a0a98ab32" id="toggle-panel-6ab1a0a98ab32" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<p>Všechny weby, které vytváříme, běží na hostingovém řešení, které využívá servery u společnosti <a href="#" rel="noopener" target="_blank">Webglobe</a>. Tento <strong>hosting</strong> je plně přístupný i vám jako klientovi, takže <strong>máte plnou kontrolu nad svým webem i hostingem</strong> a můžete k němu kdykoliv přistupovat.</p>
</div>
</div></div></div><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6ab1a0a98ad81" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6ab1a0a98ad81" role="button"><i class="fa fa-plus" role="presentation"></i>Bude web dobře fungovat na mobilech a tabletech?</a></h3><div aria-labelledby="toggle-button-6ab1a0a98ad81" id="toggle-panel-6ab1a0a98ad81" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<p>Jistě, všechny weby děláme <strong>plně responzivní</strong>. To znamená, že se automaticky přizpůsobí různým zařízením - od mobilů přes tablety až po velké monitory. Vaši zákazníci tak budou mít vždy pohodlný a přehledný zážitek, ať už váš web navštíví odkudkoliv.</p>
</div>
</div></div></div><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6ab1a0a98af89" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6ab1a0a98af89" role="button"><i class="fa fa-plus" role="presentation"></i>Jak probíhá spolupráce?</a></h3><div aria-labelledby="toggle-button-6ab1a0a98af89" id="toggle-panel-6ab1a0a98af89" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<p>Začínáme <a href="#" rel="noopener" target="_blank">krátkou konzultací</a>, kde zjistíme vaše potřeby a představy. Následuje fáze návrhů, ze kterých si vyberete, co vám nejvíce vyhovuje. Celý proces je transparentní a přizpůsobený vašim požadavkům, aby vše probíhalo hladce a bez stresu.</p>
</div>
</div></div></div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Studio a adresa

Obrázek studia, adresa, doprava ikonami a tlačítko. Třídy: iwt-icon, iwt-text.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row full-width-section top_padding_tablet_60px top_padding_phone_40px bottom_padding_tablet_60px bottom_padding_phone_40px" data-column-margin="default" data-midnight="dark" id="studio" style="padding-top: 60px; padding-bottom: 60px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-6 bsb_column column_container vc_column_container col no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="right">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="nectar-responsive-text font_size_desktop_2-3em font_size_tablet_2-1em font_size_phone_1-8em font_line_height_1-2em nectar-link-underline-effect"><div class="bsb_row vc_row-fluid vc_row inner_row right_padding_100px bottom_padding_tablet_20px bottom_padding_phone_20px right_padding_tablet_0px right_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_67bdcac3781cd">
<div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<div class="bsb_wrapper">
<h2 class="bs-h1"><strong>Zastavte se ve studiu v Brně<br/>
</strong></h2>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="vc_col-sm-6 bsb_column column_container vc_column_container col no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row max_width_desktop_820px" data-column-margin="default" data-midnight="" id="fws_6aef74af14a6e" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="iwithtext"><div class="iwt-icon"> <img alt="" decoding="async" src="assets/soubory/2025/03/ikona-mapa.svg"/> </div><div class="iwt-text"> <strong>BLUE STUDIO najdete v centru Brna, </strong>kde se můžeme také osobně setkat a probrat váš projekt.<br/>
<div class="divider-wrap" data-alignment="default"><div class="divider" style="height: 20px;"></div></div>
BLUE STUDIO s.r.o.<br/>
<a href="#" rel="noopener">Modrá 12</a><br/>
602 00, Brno<br/>
<div class="divider-wrap" data-alignment="default"><div class="divider" style="height: 20px;"></div></div>
<a href="#" id="CTAlinkEmailTo">info@blue.example</a><br/>
<a href="#" id="CTAlinkCallTo">+420 234 567 890</a> </div><div class="clear"></div></div><div class="iwithtext"><div class="iwt-icon"> <img alt="Parkoviště Mikulov" decoding="async" src="assets/soubory/2025/03/ikona-parkoviste.svg"/> </div><div class="iwt-text"> Pokud přijedete<strong> autem, můžete bezplatně zaparkovat</strong> přímo v areálu. </div><div class="clear"></div></div><div class="iwithtext"><div class="iwt-icon"> <img alt="" decoding="async" src="assets/soubory/2025/03/ikona-mhd.svg"/> </div><div class="iwt-text"> Do BLUE studia se snadno dostanete i brněnskou šalinou - a to linkami 1 nebo 6, <a href="#" rel="noopener">zastávka Antonínská</a>. </div><div class="clear"></div></div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row top_padding_tablet_10px top_padding_phone_10px" data-column-margin="default" data-midnight="" id="fws_6aef74af15b0e" style="padding-top: 20px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<a class="nectar-button jumbo regular accent-color regular-button tlacitko-modre" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" id="CTAbtnHeroKonzultace" role="button" style="margin-top: 20px; margin-bottom: 20px; color: #ffffff; background-color: #0a0a0a;"><span>Probrat váš projekt</span></a>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Projekty a články

Nejnovější projekty

Mřížka dvou sloupců s obrázkem, názvem a popisem projektu, pod ní odkaz na všechny. Třídy: nectar-post-grid, nectar-post-grid-item.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row top_padding_tablet_20px top_padding_phone_0px" data-column-margin="default" data-midnight="dark" id="fws_6aaec9d60ce0e" style="padding-top: 60px; padding-bottom: 0px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row vc_row-o-equal-height vc_row-flex vc_row-o-content-middle top_padding_tablet_40px top_padding_phone_40px bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6aaec9d60d578" style="padding-top: 40px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding bottom_margin_tablet_-20px bottom_margin_phone_-20px inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" style="margin-bottom: -20px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element vc_custom_1767112410843">
<h2 class="bs-h1">Nejnovější projekty</h2>
</div>
</div>
</div>
</div>
</div></div><div class="nectar-post-grid-wrap text-color-dark spacing-15px" data-el-settings='{"post_type":"portfolio","pagination":"none","image_size":"medium","parallax_scrolling":"","aspect_ratio_image_size":"","category_position":"default","category_display":"default","display_categories":"0","display_excerpt":"yes","excerpt_length":"20","content_next_to_image_excerpt_pos":"default","display_date":"0","display_estimated_reading_time":"0","display_author":"0","author_functionality":"default","author_position":"default","color_overlay":"","color_overlay_opacity":"","color_overlay_hover_opacity":"","card_bg_color":"","grid_style":"content_under_image","hover_effect":"animated_underline","post_title_overlay":"","heading_tag":"default","heading_tag_render":"default","enable_gallery_lightbox":"0","remove_links":"0","category_style":"underline","overlay_secondary_project_image":"","vertical_list_hover_effect":"none","vertical_list_read_more":"","vertical_list_read_more_style":"text","read_more_button":"0","animation":"none","custom_fields":"","custom_fields_location":"before_post_meta","display_type":"grid","text_content_layout":"top_left"}' data-load-more-color="black" data-load-more-text="Zobrazit další" data-query='{"post_type":"portfolio","posts_per_page":"6","order":"DESC","orderby":"date","offset":"1","cpt_name":"post","custom_query_tax":"","ignore_sticky_posts":"","exclude_current_post":""}' data-style="content_under_image"><div class="nectar-post-grid-filters" data-active-color="default" data-align="default" data-animation="none" data-sortable=""><div><a class="active all-filter" data-filter="-1" data-total-count="30" href="#">Vše</a><a data-filter="eshop" data-total-count="3" href="#">E-shop</a><a data-filter="vizualni-identita" data-total-count="23" href="#">Logo a identita</a><a data-filter="marketing" data-total-count="6" href="#">Marketing</a><a data-filter="tiskoviny" data-total-count="22" href="#">Tiskoviny</a><a data-filter="web" data-total-count="14" href="#">Tvorba webu</a><a data-filter="ux-webdesign" data-total-count="20" href="#">Webdesign</a></div></div><div class="nectar-post-grid custom_font_size_28px font_size_tablet_24px font_size_phone_22px custom-aspect-ratio-16-9 excerpt-desktop_only category-position-before-title tablet-cols-1 phone-cols-1" data-animation="none" data-animation-stagger="90" data-border-radius="none" data-card="" data-cat-click="default" data-columns="2" data-grid-item-height="50vh" data-grid-spacing="15px" data-hover-effect="animated_underline" data-indicator="" data-indicator-color="#000" data-indicator-style="default" data-indicator-text="ZOBRAZIT" data-indicator-text-color="#fff" data-lock-aspect="" data-shadow-hover="" data-text-align="left" data-text-color="dark" data-text-hover-color="dark" data-text-layout="top_left" data-text-style="default"><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="12398"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Přírodní kosmetika GINAMI" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1463" sizes="" src="obrazky/ginami-01-1280x732-d0a83e.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Přírodní kosmetika GINAMI</span></a><div class="item-main"><h3 class="post-heading"><span>Přírodní kosmetika GINAMI</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Návrh minimalistické ikonografie a skládacího letáku pro značku přírodní kosmetiky GINAMI. Vizuální styl staví na jemné lineární kresbě, přírodní barevnosti a přehledné prezentaci produktů.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="11899"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="E-shop Nitle.cz - Česká výroba ručně šitých produktů" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="800" sizes="" src="obrazky/nitle-b2fc9c.webp" width="1200"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">E-shop Nitle.cz - Česká výroba ručně šitých produktů</span></a><div class="item-main"><h3 class="post-heading"><span>E-shop Nitle.cz - Česká výroba ručně šitých produktů</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Česká výroba ručně šitých produktů pro pohodlí dětí i dospělých - kompletní rebranding značky NITLE včetně návrhu loga, vizuální identity a realizace e-shopu na platformě Shoptet. Projekt připravený na budoucí rozšíření sortimentu.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="9416"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="E-shop AmartAsia - autentická chuť Asie" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1440" sizes="" src="obrazky/projekt-amartasia-05-1280x720-fb0a28.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">E-shop AmartAsia - autentická chuť Asie</span></a><div class="item-main"><h3 class="post-heading"><span>E-shop AmartAsia - autentická chuť Asie</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Design e-shopu na míru proměnil nákup autentických asijských potravin v jednoduchý a inspirativní zážitek. Přehledné UX řešení, atraktivní produktové stránky a landing page, které okamžitě vtáhnou zákazníka do světa chutí Asie.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="10377"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Úklidová služba 2tahy" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="450" sizes="" src="obrazky/uklidova-sluzba-2tahy-52412e.webp" width="800"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Úklidová služba 2tahy</span></a><div class="item-main"><h3 class="post-heading"><span>Úklidová služba 2tahy</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Pro 2tahy.cz jsme připravili kompletní web od návrhů designu a struktury stránek, přes technickou realizaci a optimalizaci pro různá zařízení, až po implementaci funkcí, které web efektivně zpřístupňují domácnostem i firmám.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="10763"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Pronájem skákacích hradů HRADOLAND" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1707" sizes="" src="obrazky/projekt-hradoland-02-1280x854-61f0e4.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Pronájem skákacích hradů HRADOLAND</span></a><div class="item-main"><h3 class="post-heading"><span>Pronájem skákacích hradů HRADOLAND</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Pro HRADOLAND jsme navrhli vizuální identitu a web od loga a barevného systému, přes design a strukturu stránek, až po katalog atrakcí a rezervační formulář, který umožňuje jednoduchý a rychlý pronájem skákacích hradů.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="8807"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Parkoviště Mikulov" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1440" sizes="" src="obrazky/projekt-parkoviste-mikulov-06-1280x720-b6b290.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Parkoviště Mikulov</span></a><div class="item-main"><h3 class="post-heading"><span>Parkoviště Mikulov</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Cílem projektu Parkoviště Mikulov bylo vytvořit ucelenou a funkční vizuální prezentaci, která usnadní parkování. Výsledkem je čistá a přehledná vizuální identita, která zahrnuje návrh informačních tabulí, orientačních plachet, letáků, ceníků a moderních responzivích webových stránek.</span></div></div></div></div></div></div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d613045" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column centered-text no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Zobrazit všechny projekty</a></p>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Loga klientů

Karusel log s popisem zakázky pod každým. Třídy: nectar-flickity, nectar-carousel.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row full-width-content vc_row-o-equal-height vc_row-flex vc_row-o-content-top nectar-overflow-hidden top_padding_tablet_0px top_padding_phone_0px bottom_padding_tablet_60px bottom_padding_phone_50px" data-column-margin="default" data-midnight="dark" id="fws_6aaec9d6139e7" style="padding-top: 30px; padding-bottom: 80px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div aria-label="Carousel" aria-roledescription="carousel" class="nectar-flickity not-initialized nectar-carousel vertical-alignment-middle ticker-rotate" data-adaptive-height="" data-autoplay="true" data-autoplay-dur="5000" data-border-radius="none" data-centered-cells="false" data-column-border="" data-column-color="" data-column-padding="0" data-control-color="accent-color" data-control-style="material_pagination" data-controls="none" data-desktop-columns="4" data-drag-scale="" data-format="default" data-overflow="visible" data-pagination-alignment="default" data-pause-on-hover="true" data-phone-columns="1" data-r-bottom-total="" data-small-desktop-columns="3" data-spacing="10px" data-tablet-columns="2" data-ticker-direction="default" data-ticker-speed="slow" data-touch-icon-color="default" data-wrap="wrap" role="region"><div class="flickity-viewport"> <div class="flickity-slider"><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="Xiaomi" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="250" src="assets/soubory/2022/06/klient-xiaomi.svg" width="250"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d614d7e" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Marketing a tiskoviny pro spotřební elektroniku Xiaomi</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="DJI" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="250" src="assets/soubory/2022/06/klient-dji.svg" width="250"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d615c5c" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Tiskoviny a design pro sociální sítě bezpilotních dronů DJI</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="2tahy.cz" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="100" src="assets/soubory/2025/10/klient-2tahy.svg" width="100"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d616988" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Grafický návrh a technická realizace webu úklidové služby</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="Excursia" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="1001" src="assets/soubory/2025/08/klient-excursia.svg" width="1001"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d61765a" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Rebrand loga a vizuální identity pro cestovní kancelář</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="Parkoviště Mikulov" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="1251" src="assets/soubory/2025/07/klient-parkoviste-mikulov.svg" width="1251"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d618366" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Funkční vizuální prezentace pro parkoviště v Mikulově</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="VINOCO" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="250" src="assets/soubory/2024/10/klient-vinoco.svg" width="250"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d6191b1" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Logo, etikety na víno a kompletní řešení e-shopu</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="ZM-ELEKTRO" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="100" src="assets/soubory/2025/09/klient-zm-elektro.svg" width="100"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d619e82" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Logo, design a web pro moderní elektroinstalace</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="Liftor" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="250" src="assets/soubory/2022/06/klient-liftor.svg" width="250"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d61aada" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Kompletní redesign značky polohovacích stolů Liftor</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="Konference péče o pozůstalé" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="23" src="assets/soubory/2025/04/klient-konference-pece-o-pozustale.svg" width="23"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d61b79e" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Vizuální identita a webové stránky pro konferenci v Brně</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="Barcamp Kolín" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="250" src="assets/soubory/2024/07/klient-barcamp-kolin.svg" width="250"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d61c5a8" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Boží  vizuály pro boží konferenci o podnikání v Kolíně</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="Vyfakturuj" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="250" src="assets/soubory/2022/06/klient-vyfakturuj.svg" width="250"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d61d608" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Rebranding jednoho z nejlepších fakturačních nástrojů</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="Skinners" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="250" src="assets/soubory/2022/06/klient-skinners.svg" width="250"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d61e66a" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Tiskoviny, které podtrhují unikátní koncept ponožkobot</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="Nadační fond Vrba" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="46" src="assets/soubory/2025/07/klient-vrba.svg" width="46"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d61f696" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Správa webu pro nadaci, která pomáhá ovdovělým rodinám</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div><div class="cell flex_gap_desktop_10px"><div class="inner-wrap-outer"><div class="inner-wrap"><div class="img-with-aniamtion-wrap center custom-width-250px custom-width-tablet-230px custom-width-phone-230px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_self">
<img alt="Festivaly a koncerty EPOQUE" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="250" src="assets/soubory/2025/02/klient-epoque-events.svg" width="250"/>
</a>
</div>
</div>
</div>
</div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d6205e5" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-4-percent force-desktop-text-align-center force-tablet-text-align-center force-phone-text-align-center padding-5-percent_tablet padding-5-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right" style="margin-top: -30px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Brand a nový web pro festivaly a koncerty</a></p>
</div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Výpis článků

Tři náhledy článků s datem a odkazem na všechny. Třídy: nectar-post-grid, meta-date.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row" data-column-margin="default" data-midnight="dark" id="fws_6aaec9d621032" style="padding-top: 0px; padding-bottom: 20px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row vc_row-o-equal-height vc_row-flex vc_row-o-content-middle top_padding_tablet_60px top_padding_phone_40px bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6aaec9d6215f0" style="padding-top: 80px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding bottom_margin_tablet_-20px bottom_margin_phone_-20px inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" style="margin-bottom: -20px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element vc_custom_1733318183388">
<h2 class="bs-h1">Články</h2>
</div>
</div>
</div>
</div>
</div></div><div class="nectar-post-grid-wrap text-color-dark additional-meta-size-small spacing-15px" data-el-settings='{"post_type":"post","pagination":"none","image_size":"full","parallax_scrolling":"","aspect_ratio_image_size":"","category_position":"overlaid","category_display":"default","display_categories":"0","display_excerpt":"0","excerpt_length":"20","content_next_to_image_excerpt_pos":"default","display_date":"yes","display_estimated_reading_time":"0","display_author":"0","author_functionality":"default","author_position":"default","color_overlay":"","color_overlay_opacity":"","color_overlay_hover_opacity":"","card_bg_color":"","grid_style":"content_under_image","hover_effect":"animated_underline","post_title_overlay":"","heading_tag":"h3","heading_tag_render":"default","enable_gallery_lightbox":"0","remove_links":"0","category_style":"underline","overlay_secondary_project_image":"","vertical_list_hover_effect":"none","vertical_list_read_more":"","vertical_list_read_more_style":"text","read_more_button":"0","animation":"none","custom_fields":"","custom_fields_location":"before_post_meta","display_type":"grid","text_content_layout":"top_left"}' data-load-more-color="black" data-load-more-text="Zobrazit další" data-query='{"post_type":"post","posts_per_page":"3","order":"DESC","orderby":"date","offset":"0","cpt_name":"post","custom_query_tax":"","ignore_sticky_posts":"","exclude_current_post":""}' data-style="content_under_image"><div class="nectar-post-grid-filters" data-active-color="default" data-align="default" data-animation="none" data-sortable=""><div><a class="active all-filter" data-filter="-1" data-total-count="27" href="#">Vše</a><a data-filter="design" data-total-count="23" href="#">Design</a><a data-filter="e-shop" data-total-count="3" href="#">E-shop</a><a data-filter="identita" data-total-count="15" href="#">Logo a identita</a><a data-filter="nastroje" data-total-count="3" href="#">Nástroje</a><a data-filter="podnikani" data-total-count="10" href="#">Podnikání</a><a data-filter="pripadova-studie" data-total-count="9" href="#">Případová studie</a><a data-filter="reklamni-kampane" data-total-count="3" href="#">Reklamní kampaně</a><a data-filter="seo" data-total-count="6" href="#">SEO</a><a data-filter="web" data-total-count="14" href="#">Web</a></div></div><div class="nectar-post-grid custom_font_size_24px font_size_tablet_18px font_size_phone_20px custom-aspect-ratio-16-9 category-position-overlaid tablet-cols-1 phone-cols-1" data-animation="none" data-animation-stagger="90" data-border-radius="none" data-card="" data-cat-click="default" data-columns="3" data-grid-item-height="50vh" data-grid-spacing="15px" data-hover-effect="animated_underline" data-indicator="" data-indicator-color="#000" data-indicator-style="default" data-indicator-text="ZOBRAZIT" data-indicator-text-color="#fff" data-lock-aspect="" data-shadow-hover="" data-text-align="left" data-text-color="dark" data-text-hover-color="dark" data-text-layout="top_left" data-text-style="default"><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="12670"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Jak vybrat jméno firmy nebo produktu: čemu se vyhnout a co si pohlídat" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1023" sizes="" src="obrazky/jak-vybrat-jmeno-firmy-nebo-produktu-cemu-se-vyhnout-a-co-si-a289d9.webp" width="1537"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Jak vybrat jméno firmy nebo produktu: čemu se vyhnout a co si pohlídat</span></a><div class="item-main"><h3 class="post-heading"><span>Jak vybrat jméno firmy nebo produktu: čemu se vyhnout a co si pohlídat</span></h3><span class="nectar-post-grid-item__meta-wrap"><span class="meta-date">18. července 2026</span></span></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="12542"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="AI píše a publikuje. A vy se divíte, proč to nefunguje?" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="900" sizes="" src="obrazky/ai-pise-a-publikuje-2e30d5.webp" width="1600"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">AI píše, AI publikuje. A vy se divíte, proč to nefunguje?</span></a><div class="item-main"><h3 class="post-heading"><span>AI píše, AI publikuje. A vy se divíte, proč to nefunguje?</span></h3><span class="nectar-post-grid-item__meta-wrap"><span class="meta-date">1. června 2026</span></span></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="244"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Design není umění na zdi. Buď funguje, nebo ne." class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="823" sizes="" src="obrazky/design-neni-umeni-52795e.webp" width="1500"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Design není umění na zdi. Buď funguje, nebo ne</span></a><div class="item-main"><h3 class="post-heading"><span>Design není umění na zdi. Buď funguje, nebo ne</span></h3><span class="nectar-post-grid-item__meta-wrap"><span class="meta-date">23. května 2026</span></span></div></div></div></div></div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aaec9d62c664" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column centered-text no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element male">
<p><a href="#">Zobrazit všechny články</a></p>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Výpis projektů

Úvod s filtrem oborů a mřížka všech projektů. Třídy: nectar-post-grid-filters, nectar-post-grid-item.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row top-level top_padding_tablet_60px top_padding_phone_20px" data-column-margin="default" data-midnight="dark" id="fws_6ab1a06f0feaf" style="padding-top: 80px; padding-bottom: 0px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row vc_row-o-equal-height vc_row-flex vc_row-o-content-bottom" data-column-margin="default" data-midnight="" id="fws_6ab1a06f115ed" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding padding-1-percent_tablet padding-1-percent_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="top-bottom">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element" style=" max-width: 1560px; display: inline-block;">
<h1>Dvě dekády zkušeností, přes 500 projektů, promyšlený design a obsah, který funguje. Podívejte se, co umíme - a co dokážeme.</h1>
</div>
</div>
</div>
</div>
</div></div><div class="divider-wrap height_tablet_20px height_phone_20px" data-alignment="default"><div class="divider" style="height: 20px;"></div></div><div class="nectar-post-grid-wrap text-color-dark spacing-15px nectar-post-grid-wrap--fl-left" data-el-settings='{"post_type":"portfolio","pagination":"load-more","image_size":"medium","parallax_scrolling":"","aspect_ratio_image_size":"","category_position":"default","category_display":"default","display_categories":"0","display_excerpt":"yes","excerpt_length":"20","content_next_to_image_excerpt_pos":"default","display_date":"0","display_estimated_reading_time":"0","display_author":"0","author_functionality":"default","author_position":"default","color_overlay":"","color_overlay_opacity":"","color_overlay_hover_opacity":"","card_bg_color":"","grid_style":"content_under_image","hover_effect":"animated_underline","post_title_overlay":"","heading_tag":"default","heading_tag_render":"default","enable_gallery_lightbox":"0","remove_links":"0","category_style":"underline","overlay_secondary_project_image":"","vertical_list_hover_effect":"none","vertical_list_read_more":"","vertical_list_read_more_style":"text","read_more_button":"0","animation":"none","custom_fields":"","custom_fields_location":"before_post_meta","display_type":"grid","text_content_layout":"top_left"}' data-load-more-color="accent-color" data-load-more-text="Zobrazit další" data-query='{"post_type":"portfolio","posts_per_page":"20","order":"DESC","orderby":"date","offset":"0","cpt_name":"post","custom_query_tax":"","ignore_sticky_posts":"","exclude_current_post":""}' data-style="content_under_image"><div class="nectar-post-grid-filters" data-active-color="default" data-align="left" data-animation="none" data-sortable="yes"><h4>Vybrat kategorii</h4><div><a class="active all-filter" data-filter="-1" data-total-count="30" href="#">Vše</a><a data-filter="eshop" data-total-count="3" href="#">E-shop</a><a data-filter="vizualni-identita" data-total-count="23" href="#">Logo a identita</a><a data-filter="marketing" data-total-count="6" href="#">Marketing</a><a data-filter="tiskoviny" data-total-count="22" href="#">Tiskoviny</a><a data-filter="web" data-total-count="14" href="#">Tvorba webu</a><a data-filter="ux-webdesign" data-total-count="20" href="#">Webdesign</a></div></div><div class="nectar-post-grid custom_font_size_28px font_size_tablet_24px font_size_phone_22px custom-aspect-ratio-16-9 category-position-before-title tablet-cols-1 phone-cols-1" data-animation="none" data-animation-stagger="90" data-border-radius="none" data-card="" data-cat-click="default" data-columns="2" data-grid-item-height="50vh" data-grid-spacing="15px" data-hover-effect="animated_underline" data-indicator="" data-indicator-color="#000" data-indicator-style="default" data-indicator-text="ZOBRAZIT" data-indicator-text-color="#fff" data-lazy-skip="3" data-lock-aspect="" data-shadow-hover="" data-text-align="left" data-text-color="dark" data-text-hover-color="dark" data-text-layout="top_left" data-text-style="default"><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="9730"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Excursia" class="nectar-post-grid-item-bg__media" decoding="async" fetchpriority="high" height="450" src="obrazky/excursia-video-b097d3.webp" width="800"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Excursia: Nová tvář dobrodružných zájezdů</span></a><div class="item-main"><h3 class="post-heading"><span>Excursia: Nová tvář dobrodružných zájezdů</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Pro cestovní kancelář Excursia jsme připravili kompletní rebrand - od nového loga a vizuální identity přes grafický manuál, polepy kanceláře až po reklamní bannery a šablony dokumentů pro cestovatele.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="12398"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Přírodní kosmetika GINAMI" class="nectar-post-grid-item-bg__media" decoding="async" height="732" src="obrazky/ginami-01-1280x732-d0a83e.webp" width="1280"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Přírodní kosmetika GINAMI</span></a><div class="item-main"><h3 class="post-heading"><span>Přírodní kosmetika GINAMI</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Návrh minimalistické ikonografie a skládacího letáku pro značku přírodní kosmetiky GINAMI. Vizuální styl staví na jemné lineární kresbě, přírodní barevnosti a přehledné prezentaci produktů.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="11899"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="E-shop Nitle.cz - Česká výroba ručně šitých produktů" class="nectar-post-grid-item-bg__media" decoding="async" height="800" src="obrazky/nitle-b2fc9c.webp" width="1200"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">E-shop Nitle.cz - Česká výroba ručně šitých produktů</span></a><div class="item-main"><h3 class="post-heading"><span>E-shop Nitle.cz - Česká výroba ručně šitých produktů</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Česká výroba ručně šitých produktů pro pohodlí dětí i dospělých - kompletní rebranding značky NITLE včetně návrhu loga, vizuální identity a realizace e-shopu na platformě Shoptet. Projekt připravený na budoucí rozšíření sortimentu.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="9416"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="E-shop AmartAsia - autentická chuť Asie" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1440" sizes="" src="obrazky/projekt-amartasia-05-1280x720-fb0a28.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">E-shop AmartAsia - autentická chuť Asie</span></a><div class="item-main"><h3 class="post-heading"><span>E-shop AmartAsia - autentická chuť Asie</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Design e-shopu na míru proměnil nákup autentických asijských potravin v jednoduchý a inspirativní zážitek. Přehledné UX řešení, atraktivní produktové stránky a landing page, které okamžitě vtáhnou zákazníka do světa chutí Asie.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="10377"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Úklidová služba 2tahy" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="450" sizes="" src="obrazky/uklidova-sluzba-2tahy-52412e.webp" width="800"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Úklidová služba 2tahy</span></a><div class="item-main"><h3 class="post-heading"><span>Úklidová služba 2tahy</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Pro 2tahy.cz jsme připravili kompletní web od návrhů designu a struktury stránek, přes technickou realizaci a optimalizaci pro různá zařízení, až po implementaci funkcí, které web efektivně zpřístupňují domácnostem i firmám.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="10763"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Pronájem skákacích hradů HRADOLAND" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1707" sizes="" src="obrazky/projekt-hradoland-02-1280x854-61f0e4.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Pronájem skákacích hradů HRADOLAND</span></a><div class="item-main"><h3 class="post-heading"><span>Pronájem skákacích hradů HRADOLAND</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Pro HRADOLAND jsme navrhli vizuální identitu a web od loga a barevného systému, přes design a strukturu stránek, až po katalog atrakcí a rezervační formulář, který umožňuje jednoduchý a rychlý pronájem skákacích hradů.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="8807"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Parkoviště Mikulov" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1440" sizes="" src="obrazky/projekt-parkoviste-mikulov-06-1280x720-b6b290.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Parkoviště Mikulov</span></a><div class="item-main"><h3 class="post-heading"><span>Parkoviště Mikulov</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Cílem projektu Parkoviště Mikulov bylo vytvořit ucelenou a funkční vizuální prezentaci, která usnadní parkování. Výsledkem je čistá a přehledná vizuální identita, která zahrnuje návrh informačních tabulí, orientačních plachet, letáků, ceníků a moderních responzivích webových stránek.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="7738"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Konference péče o pozůstalé" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1440" sizes="" src="obrazky/projekt-konferencepp-1280x720-a19e5d.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Konference péče o pozůstalé</span></a><div class="item-main"><h3 class="post-heading"><span>Konference péče o pozůstalé</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Konference Péče o pozůstalé přináší nejen inspirativní diskuse a setkání, ale i novou vizuální identitu. Logo, tiskoviny, web i další materiály prošly proměnou, která lépe vyjadřuje důstojnost, empatii a moderní přístup k tématu.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="11948"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1707" sizes="" src="obrazky/lenka-tomek-design-11-1280x854-8f1371.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Logo, vizuální identita a web pro interiérovou designérku Lenku Tomek z Brna</span></a><div class="item-main"><h3 class="post-heading"><span>Logo, vizuální identita a web pro interiérovou designérku Lenku Tomek z Brna</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Kompletní logo, vizuální identita a webdesign pro interiérovou designérku z Brna. Jednotný brand propojující webové stránky a tiskoviny do profesionální prezentace osobní značky.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="3593"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="10. ples Nadačního fondu Vrba v roce 2026" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1707" sizes="" src="obrazky/vrba-ples-01-1-1280x854-df9ae7.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Nadační fond Vrba</span></a><div class="item-main"><h3 class="post-heading"><span>Nadační fond Vrba</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Pro Nadační fond Vrba jsme navrhovali vizuální identitu, která pomáhá vyjadřovat jejich poslání - podporovat ovdovělé rodiny s dětmi. Společně jsme vytvořili logo, tiskoviny, web i řadu dalších materiálů, které působí srozumitelně, citlivě a důvěryhodně.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="6198"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Auto Všechno" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="854" sizes="" src="obrazky/autovsechno-cover-0bb163.webp" width="1280"/><video class="nectar-lazy-video nectar-post-grid-item-bg__media nectar-post-grid-item-bg__video" loop="" muted="" playsinline="" poster="obrazky/video-421b47.webp" preload="auto">
</video></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Autoservis Auto Všechno</span></a><div class="item-main"><h3 class="post-heading"><span>Autoservis Auto Všechno</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Auto Všechno potřebovalo silnější vizuální identitu na trhu. Navrhli jsme minimalistické logo ve tvaru „A“, evokující siluetu auta, které je snadno použitelné v marketingu. Moderní a jednotný design posílil značku a pomohl přilákat nové zákazníky.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="4966"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Brand identity VINOCO" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1707" sizes="" src="obrazky/projekt-vinoco-08-1280x854-52ce21.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">E-shop VINOCO - vína z Pálavy</span></a><div class="item-main"><h3 class="post-heading"><span>E-shop VINOCO - vína z Pálavy</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Pro VINOCO jsme realizovali kompletní vizuální identitu včetně loga, etiket na víno a e-shopu na platformě Shoptet. Logo symbolizuje slunce jako zdroj života a odkazuje na tradici vinařského regionu Pálava. Výsledkem je prémiový vzhled, který podtrhuje kvalitu vín z Mikulovska.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="677"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Polohovací stoly Liftor" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="450" sizes="" src="obrazky/liftor-stoly-ca25a2.webp" width="800"/><video class="nectar-lazy-video nectar-post-grid-item-bg__media nectar-post-grid-item-bg__video" loop="" muted="" playsinline="" poster="obrazky/video-421b47.webp" preload="auto">
</video></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Výškově nastavitelné stoly Liftor</span></a><div class="item-main"><h3 class="post-heading"><span>Výškově nastavitelné stoly Liftor</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Liftor získal svěží vizuální identitu - nové logo, moderní web, stylové katalogy a reklamní materiály. Cíl? Zjednodušit výběr a používání ergonomického nábytku. Součástí projektu byl i intuitivní design ovladače polohovacích stolů, který usnadňuje nastavení výšky a podporuje zdravé pracovní návyky.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="9093"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="HARTOP - specialisté na vodu, topení a plyn" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1440" sizes="" src="obrazky/projekt-hartop-01-1280x720-8dd3d6.webp" width="2560"/><video class="nectar-lazy-video nectar-post-grid-item-bg__media nectar-post-grid-item-bg__video" loop="" muted="" playsinline="" poster="obrazky/video-421b47.webp" preload="auto">
</video></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">HARTOP - specialisté na vodu, topení a plyn</span></a><div class="item-main"><h3 class="post-heading"><span>HARTOP - specialisté na vodu, topení a plyn</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Pro rodinnou firmu HARTOP z Krnova jsme připravili nové typografické logo, sjednotili vizuální styl, vytvořili přehledný web a připravili návrhy na polepy dodávek. Výsledkem je dlouhodobá spolupráce a jasná prezentace, která je vidět online i přímo v terénu.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="5452"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="ZM-ELEKTRO" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1440" sizes="" src="obrazky/projekt-zm-1280x720-1896d9.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Elektroinstalace ZM-ELEKTRO</span></a><div class="item-main"><h3 class="post-heading"><span>Elektroinstalace ZM-ELEKTRO</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Pro ZM-ELEKTRO vznikla v roce 2024 nová vizuální identita zahrnující logo, tiskoviny a web. Design odráží klíčové hodnoty firmy - spolehlivost, odbornost a kvalitu - a podporuje vnímání značky jako specialisty na moderní a bezpečné elektroinstalace.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="3674"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Bezpilotní drony DJI" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1707" sizes="" src="obrazky/dji-09-1280x854-4cc7b9.webp" width="2560"/><video class="nectar-lazy-video nectar-post-grid-item-bg__media nectar-post-grid-item-bg__video" loop="" muted="" playsinline="" poster="obrazky/video-421b47.webp" preload="auto">
</video></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Bezpilotní drony DJI</span></a><div class="item-main"><h3 class="post-heading"><span>Bezpilotní drony DJI</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">DJI je lídrem v oblasti dronů a letecké fotografie. Pro tento projekt vznikly kampaně a tiskoviny, které vizuálně podtrhují inovace a špičkovou kvalitu jejich produktů. Vizuály ukazují drony DJI v akci, zdůrazňují jejich přesnost a využití v profesionálním i kreativním natáčení.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="4016"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="EPOQUE" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="450" sizes="" src="obrazky/epoque-tumb-c239c3.webp" width="800"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Festivaly a koncerty EPOQUE</span></a><div class="item-main"><h3 class="post-heading"><span>Festivaly a koncerty EPOQUE</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Objevte svět exkluzivních eventů s Epoque Events! Nová vizuální identita, včetně moderního loga, elegantních tiskovin a profesionálního webu, dokonale vystihuje jedinečný přístup k organizaci nezapomenutelných akcí.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="3683"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Kouzlo mechu" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1708" sizes="" src="obrazky/brandbook-ukazka-05-1280x854-91f366.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Svatební dekorace Kouzlo mechu</span></a><div class="item-main"><h3 class="post-heading"><span>Svatební dekorace Kouzlo mechu</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Dekorace, které přinášejí kousek přírody do každé akce. Pro tento projekt vzniklologo a design webu, který je svěží a autentický, stejně jako produkty, které nabízejí. Web je jednoduchý a přehledný, takže zapůjčení těchto jedinečných dekorací je otázka okamžiku.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="672"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Spotřební elektronika Xiaomi" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1289" sizes="" src="obrazky/xiaomi-15-1280x645-da02ce.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Spotřební elektronika Xiaomi</span></a><div class="item-main"><h3 class="post-heading"><span>Spotřební elektronika Xiaomi</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Spolupráce s Xiaomi zahrnovala nejen úderné kampaně a webdesign, ale i grafiku pro více než 60 prodejen po celé ČR. Každý vizuál kombinuje inovaci s čistým designem, aby zákazníky vtáhl do světa špičkových technologií a posílil vnímání značky na trhu.</span></div></div></div></div></div><div class="nectar-post-grid-item nectar-underline" data-has-img="true" data-post-id="3687"> <div class="inner"><div class="nectar-post-grid-item-bg-wrap"><div class="nectar-post-grid-item-bg-wrap-inner"><div class="nectar-post-grid-item-bg"><img alt="Upyho svět" class="skip-lazy nectar-post-grid-item-bg__media" data-nectar-img-srcset="" decoding="async" height="1707" sizes="" src="obrazky/upyho-svet-05-1280x854-ce0565.webp" width="2560"/></div></div></div><div class="content"><a class="nectar-post-grid-link" href="#"><span class="screen-reader-text">Květinové dekorace Upyho svět</span></a><div class="item-main"><h3 class="post-heading"><span>Květinové dekorace Upyho svět</span></h3><div class="nectar-post-grid-item__excerpt-wrap item-meta-extra"><span class="meta-excerpt">Vizuální identita a ilustrace, které proměnují květinové dekorace a ručně vyráběné panenky v malá umělecká díla. Design zachycuje kreativitu zakázkové floristiky a jedinečnost produktů, ať už jde o svatební kytice, výzdobu na večírky, nebo speciální dekorace.</span></div></div></div></div></div></div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Případové studie

Výpis studií s obrázkem vlevo a textem vpravo. Třídy: featured_img_left, post-featured-img-wrap.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="post-area col featured_img_left span_12 col_last infinite_scroll" data-ams="8px" data-remove-post-author="1" data-remove-post-comment-number="1" data-remove-post-date="0" data-remove-post-nectar-love="1" role="main"> <div class="posts-container" data-load-animation="none">
<article class="post-12008 post type-post status-publish format-standard has-post-thumbnail category-e-shop category-identita category-pripadova-studie tag-design tag-e-shop tag-marketing tag-podnikani tag-pripadova-studie tag-identita" id="post-12008">
<div class="inner-wrap animated">
<div class="post-content">
<div class="article-content-wrap">
<div class="post-featured-img-wrap">
<a aria-label="Případová studie e-shopu Nitle.cz: Jak rebrand značky pomohl růstu podnikání" href="#"><span class="post-featured-img"><img alt="Nitle.cz" class="bs-post-image skip-lazy" data-nectar-img-srcset="" height="1707" sizes="(min-width: 690px) 40vw, 100vw" src="obrazky/nitle-11-58fe9f.webp" width="2560"/></span></a>
</div>
<div class="post-content-wrap">
<a class="entire-meta-link" href="#"><span class="screen-reader-text">Případová studie e-shopu Nitle.cz: Jak rebrand značky pomohl růstu podnikání</span></a>
<span class="meta-category"><a class="e-shop" href="#">E-shop</a><a class="identita" href="#">Logo a identita</a><a class="pripadova-studie" href="#">Případová studie</a></span>
<div class="post-header">
<h3 class="title"><a href="#"> Případová studie e-shopu Nitle.cz: Jak rebrand značky pomohl růstu podnikání</a></h3>
</div>
<div class="excerpt">Tato případová studie popisuje, jak jsme pomocí rebrandingu vytvořili značce prostor pro další vývoj a připravili e-shop na dlouhodobý růst.</div><div class="grav-wrap"><a href="#"><img alt="Jan Modrý" class="avatar avatar-70 photo" decoding="async" height="70" width="70"/></a><div class="text"><a href="#" rel="author">Jan Modrý</a><span>25. ledna 2026</span></div></div> </div>
</div>
</div>
</div>
</article>
<article class="post-9968 post type-post status-publish format-standard has-post-thumbnail category-design category-e-shop category-pripadova-studie tag-design tag-e-shop tag-pripadova-studie" id="post-9968">
<div class="inner-wrap animated">
<div class="post-content">
<div class="article-content-wrap">
<div class="post-featured-img-wrap">
<a aria-label="Případová studie - jak redesign e-shopu AmartAsia usnadnil zákazníkům nakupování" href="#"><span class="post-featured-img"><img alt="Nový design prodejen AmartAsia" class="bs-post-image skip-lazy" data-nectar-img-srcset="" height="900" sizes="(min-width: 690px) 40vw, 100vw" src="obrazky/amartasia-prodejna-03-cb9fb8.webp" width="1350"/></span></a>
</div>
<div class="post-content-wrap">
<a class="entire-meta-link" href="#"><span class="screen-reader-text">Případová studie - jak redesign e-shopu AmartAsia usnadnil zákazníkům nakupování</span></a>
<span class="meta-category"><a class="design" href="#">Design</a><a class="e-shop" href="#">E-shop</a><a class="pripadova-studie" href="#">Případová studie</a></span>
<div class="post-header">
<h3 class="title"><a href="#"> Případová studie - jak redesign e-shopu AmartAsia usnadnil zákazníkům nakupování</a></h3>
</div>
<div class="excerpt">Chaotický design eshopu AmartAsia.cz se změnil na přehledné místo, kde se dobře nakupuje. Přečtěte si případovou studii a zjistěte, jak může design na míru posunout i váš projekt.</div><div class="grav-wrap"><a href="#"><img alt="Jan Modrý" class="avatar avatar-70 photo" decoding="async" height="70" width="70"/></a><div class="text"><a href="#" rel="author">Jan Modrý</a><span>13. listopadu 2025</span></div></div> </div>
</div>
</div>
</div>
</article>
<article class="post-10405 post type-post status-publish format-standard has-post-thumbnail category-design category-pripadova-studie category-seo category-web tag-design tag-marketing tag-pripadova-studie tag-seo-texty tag-webove-stranky" id="post-10405">
<div class="inner-wrap animated">
<div class="post-content">
<div class="article-content-wrap">
<div class="post-featured-img-wrap">
<a aria-label="Případová studie: Jak jsme udělali pořádek v obsahu a vytvořili nový web pro úklidovou firmu 2tahy" href="#"><span class="post-featured-img"><img alt="Případová studie: Jak jsme vyčistili web pro úklidovou firmu 2tahy" class="bs-post-image skip-lazy" data-nectar-img-srcset="" height="800" sizes="(min-width: 690px) 40vw, 100vw" src="obrazky/pripadova-studie-2tahy-6d874d.webp" width="1200"/></span></a>
</div>
<div class="post-content-wrap">
<a class="entire-meta-link" href="#"><span class="screen-reader-text">Případová studie: Jak jsme udělali pořádek v obsahu a vytvořili nový web pro úklidovou firmu 2tahy</span></a>
<span class="meta-category"><a class="design" href="#">Design</a><a class="pripadova-studie" href="#">Případová studie</a><a class="seo" href="#">SEO</a><a class="web" href="#">Web</a></span>
<div class="post-header">
<h3 class="title"><a href="#"> Případová studie: Jak jsme udělali pořádek v obsahu a vytvořili nový web pro úklidovou firmu 2tahy</a></h3>
</div>
<div class="excerpt">Úklidová firma z Valašského Meziříčí nás oslovila s jasnou a naléhavou prosbou: „Web vypadá jak z devadesátek a nové poptávky nám přes něj skoro nechodí.“</div><div class="grav-wrap"><a href="#"><img alt="Jan Modrý" class="avatar avatar-70 photo" decoding="async" height="70" width="70"/></a><div class="text"><a href="#" rel="author">Jan Modrý</a><span>9. října 2025</span></div></div> </div>
</div>
</div>
</div>
</article>





</div>
</div></div></div></div></div></div></div>

Další článek

Odkazy na předchozí a další článek s obrázkem v pozadí. Třídy: blog_next_prev_buttons.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap no-sidebar"><div class="container main-content"><div class="row"><div class="blog_next_prev_buttons vc_row-fluid bsb_row standard_section" data-midnight="light" data-post-header-style="default" data-style="fullwidth_next_prev"><ul class="controls"><li class="previous-post"><div class="post-bg-img" style='background-image: url("obrazky/landing-page-vyfakturuj-3183fb.webp");'></div><a aria-label="Kudy návštěvníci vstupují na váš web a proč je landing page hlavní cesta" href="#"></a><h3><span>Předchozí</span><span class="text">Kudy návštěvníci vstupují na váš web a proč je landing page hlavní cesta
<svg aria-hidden="true" class="next-arrow" viewbox="0 0 39 12" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><line class="top" stroke="#ffffff;" x1="23" x2="29.5" y1="-0.5" y2="6.5"></line><line class="bottom" stroke="#ffffff;" x1="23" x2="29.5" y1="12.5" y2="5.5"></line></svg><span class="line"></span></span></h3></li><li class="next-post"><div class="post-bg-img" style='background-image: url("obrazky/nitle-11-58fe9f.webp");'></div><a aria-label="Případová studie e-shopu Nitle.cz: Jak rebrand značky pomohl růstu podnikání" href="#"></a><h3><span>Pokračovat</span><span class="text">Případová studie e-shopu Nitle.cz: Jak rebrand značky pomohl růstu podnikání
<svg aria-hidden="true" class="next-arrow" viewbox="0 0 39 12" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><line class="top" stroke="#ffffff;" x1="23" x2="29.5" y1="-0.5" y2="6.5"></line><line class="bottom" stroke="#ffffff;" x1="23" x2="29.5" y1="12.5" y2="5.5"></line></svg><span class="line"></span></span></h3></li></ul>
</div></div></div></div></div></div></div>

Důvěra

Hodnocení klientů

Kruhové fotky, souhrn 4,8 a mřížka recenzí z Google. Třídy: nectar-circle-images, grev_grid.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row top_padding_tablet_40px top_padding_phone_20px bottom_padding_tablet_40px bottom_padding_phone_20px" data-column-margin="default" data-midnight="dark" id="fws_6aef74af15d57" style="padding-top: 60px; padding-bottom: 40px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6aef74af15f2e" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column centered-text no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="nectar-responsive-text nectar-link-underline-effect"><h2 class="bs-h1"><strong>Hodnocení klientů</strong></h2>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74af1614b" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg no-extra-padding top_margin_tablet_-20px top_margin_phone_-10px inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" style="margin-top: -20px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<div class="layout_style-1 grev_grid" id="g-review"><div class="grev_header"><div class="grev_header-inner"><h3 class="grev_business-title">BLUE STUDIO s.r.o.</h3><span class="grev_total-rating">4,8</span><span class="grev_5_stars">Z 5 hvězdiček</span><span class="grev_stars-wrapper"><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/></span><h3 class="grev_overall">Celkové hodnocení z 19 recenzí na Google</h3></div></div><div class="grev_body">
<div class="g-review">
<div class="gr-inner-header">
<img alt="" class="gr-profile" data-imgtype="image/png" decoding="async" height="50" referrerpolicy="no-referrer" width="50"/>
<img alt="" class="gr-google" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/google-logo-svg.svg"/>
<p>
<a href="#" target="_blank">David Vondracek</a>
<br/>
<span class="gr-stars"><span class="stars-wrapper"><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/></span><span class="time">před 4 týdny</span></span>
</p>
</div>
<div class="gr-inner-body">
<p>Pan je rychlý a ochotný.Grafiku zpracoval  a  vše udělal dle naší představy. Domluva na výbornou. Doporučuji a určitě se zase příště na pana obrátíme.</p>
</div>
</div>
<div class="g-review">
<div class="gr-inner-header">
<img alt="" class="gr-profile" data-imgtype="image/png" decoding="async" height="50" referrerpolicy="no-referrer" width="50"/>
<img alt="" class="gr-google" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/google-logo-svg.svg"/>
<p>
<a href="#" target="_blank">Jan Soucek</a>
<br/>
<span class="gr-stars"><span class="stars-wrapper"><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/></span><span class="time">před 4 týdny</span></span>
</p>
</div>
<div class="gr-inner-body">
<p>Studio mohu vřele doporučit. Po mnoha přehmatech jsem se teprve zde setkal s lidmi kteří svému oboru jednak opravdu dobře rozumí, jsou velmi vstřícní a hlavně spolehliví. Děkuji BLUE STUDIO za skvělé služby.</p>
</div>
</div>
<div class="g-review">
<div class="gr-inner-header">
<img alt="" class="gr-profile" data-imgtype="image/png" decoding="async" height="50" referrerpolicy="no-referrer" width="50"/>
<img alt="" class="gr-google" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/google-logo-svg.svg"/>
<p>
<a href="#" target="_blank">Lenka Tomek</a>
<br/>
<span class="gr-stars"><span class="stars-wrapper"><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/></span><span class="time">před 2 měsíci</span></span>
</p>
</div>
<div class="gr-inner-body">
<p>Spolupráce s Romanem byla skvělá od první chvíle a jsem moc ráda, že jsem oslovila právě jeho. Roman je nesmírně talentovaný profesionál s úžasným citem pro grafický design a smyslem pro detail. Navrhl mi logo, web i celou vizuální identitu přesně podle mých představ - výsledek dokonce předčil má očekávání. Jeho práce je na opravdu top úrovni a takového profíka dnes jen tak nenajdete. Romana můžu jedině doporučit!</p>
</div>
</div>
<div class="g-review">
<div class="gr-inner-header">
<img alt="" class="gr-profile" data-imgtype="image/png" decoding="async" height="50" referrerpolicy="no-referrer" width="50"/>
<img alt="" class="gr-google" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/google-logo-svg.svg"/>
<p>
<a href="#" target="_blank">Lukáš B.</a>
<br/>
<span class="gr-stars"><span class="stars-wrapper"><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/><img alt="" decoding="async" src="assets/moduly/embedder-for-google-reviews/dist/images/svg-star.svg"/></span><span class="time">před 5 měsíci</span></span>
</p>
</div>
<div class="gr-inner-body">
<p>Skvělá spolupráce od začátku do konce! BLUE STUDIO s.r.o. odvedlo profesionální práci, skvělá komunikace, rychlé dodání a výborný výsledek. Oceňuji jejich kreativní přístup a smysl pro detail. Určitě doporučuji každému, kdo hledá spolehlivého partnera pro grafiku a design.“</p>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74af18e2f" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column centered-text no-extra-padding el_spacing_10px inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner"><a class="column-link" href="#" target="_self"></a>
<div class="bsb_wrapper">
<a class="bs-circle-link" href="#"><div class="nectar-circle-images nectar-circle-images--position_overlapping size_60px alignment_middle_desktop border_color_ffffff"><div class="nectar-circle-images__inner"><div class="nectar-circle-images__image nectar-circle-images__item" style='z-index: 100; background-image: url("obrazky/vyjadreni-klienta-vit-pivonka-8eb923.webp");'></div><div class="nectar-circle-images__image nectar-circle-images__item" style='z-index: 99; background-image: url("obrazky/vyjadreni-klienta-petra-cvrkalova-5d4479.webp");'></div><div class="nectar-circle-images__image nectar-circle-images__item" style='z-index: 98; background-image: url("obrazky/vyjadreni-klienta-ondrej-jirovec-eca1f3.webp");'></div><div class="nectar-circle-images__image nectar-circle-images__item" style='z-index: 97; background-image: url("obrazky/vyjadreni-klienta-edita-dostalova-987ef1.webp");'></div></div><div class="nectar-circle-images__text nectar-circle-images__item">Příběhy našich klientů</div></div></a>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Výzva k projektu

Nadpis s tlačítkem na konzultaci, sdílená sekce na konci stránek. Třídy: has-global-section, tlacitko-modre.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row has-global-section top_padding_tablet_2em bottom_padding_tablet_2em" data-column-margin="default" data-midnight="dark" id="fws_6aef74d7c765c" style="padding-top: 2em; padding-bottom: 2em; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col neg-marg no-extra-padding top_margin_tablet_-40px top_margin_phone_-40px inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" style="margin-top: -40px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row top_padding_tablet_0px top_padding_phone_0px bottom_padding_tablet_20px top_margin_tablet_-10px top_margin_phone_-10px" data-column-margin="default" data-midnight="dark" id="fws_6aef74d7c7b07" style="padding-top: 0px; padding-bottom: 20px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col centered-text no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element" style=" max-width: 800px; display: inline-block;">
<div class="cta2">
<h3>Chcete i vy originální značku, která bude mluvit za vás a web, který si lidé zapamatují?</h3>
</div>
</div>
<div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74d7c7d17" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<a class="nectar-button jumbo regular accent-color regular-button tlacitko-modre" data-color-override="#000000" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" role="button" style="color: #ffffff; background-color: #000000;"><span>Probrat váš projekt</span></a>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Formuláře

Odběr magazínu

Seznam výhod, pole e-mail a modré tlačítko přes celou šířku. Po odeslání se zobrazí potvrzení. Třídy: ec-v-form-holder, ec-v-forms-form-control.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row top-level full-width-section has-row-bg-color vc_row-o-equal-height vc_row-flex vc_row-o-content-top reverse_columns_desktop top_padding_tablet_100px top_padding_phone_60px bottom_padding_tablet_40px bottom_padding_phone_20px" data-column-margin="default" data-midnight="dark" id="fws_6aef74f4b3bac" style="padding-top: 120px; padding-bottom: 100px; --row-bg-color: #ffffff;"><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop using-bg-color" style="background-color: #ffffff; "></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-6 vc_col-lg-6 vc_col-md-12 bsb_column column_container vc_column_container col padding-3-percent inherit_tablet no-extra-padding_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74f4b4059" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element" style=" max-width: 700px; display: inline-block;">
<h1><strong>Magazín o tom, jak získat zákazníky, šetřit čas a mít design značky pod kontrolou</strong></h1>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row top_padding_tablet_40px top_padding_phone_40px" data-column-margin="none" data-midnight="" id="fws_6aef74f4b42e7" style="padding-top: 40px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" data-t-w-inherits="small_desktop">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element" style=" max-width: 740px; display: inline-block;">
<ul>
<li>Zjistíte, proč váš web neplní svůj účel</li>
<li>Získáte zákulisní vhled do toho, co vaše logo (ne)říká</li>
<li>Dozvíte se, jaká změna vás může posunout před konkurenci</li>
<li>Najdete inspiraci, která má reálný dopad na vaše podnikání</li>
</ul>
</div>
</div>
</div>
</div>
</div></div><div class="divider-wrap height_tablet_20px height_phone_20px" data-alignment="default"><div class="divider" style="height: 20px;"></div></div>
<div class="bsb_text_column bsb_content_element">
<div id="f-1-43c2cd496486bcc27217c3e790fb4088"><style>ul li {
line-height: 1.5em;
}
body.single .post .content-inner ul li::before, .vc_column-inner ul li::before {
position: absolute;
left: 0;
content: '✦' !important;
color: #0000ff;
top: 0;
width: 0;
height: 0;
border-radius: 0;
border: none;
}
/* ECOMAIL FORM */
input[type=date]:focus, input[type=email]:focus, input[type=number]:focus, input[type=password]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=text]:focus, textarea:focus {
box-shadow: none;
}
.material .bsb_content_element, .material .bsb_row {
margin-bottom: 0em!important;
}
input.ec-v-forms-form-control {
box-shadow: none !important;
}
.container-wrap textarea, .container-wrap input[type=text], .container-wrap input[type=email], .container-wrap input[type="tel"] {
font-size: 1.2em !important;
}
@media (max-width: 999px) {
body[data-form-submit=regular] .container-wrap input[type=submit], body[data-form-submit=regular] .container-wrap button[type=submit], body[data-form-submit=regular] .container-wrap input[type=submit] {
padding: 1.2em 2em 1.3em 2em !important;
font-size: 1.0em !important;
border: 2px solid #0000ff !important;
font-weight: 600 !important;
background-color: #0000ff !important;
font-family: 'regular' !important;
letter-spacing: 0.5px;
}
}
@media (min-width: 1000px) {
body[data-form-submit=regular] .container-wrap input[type=submit], body[data-form-submit=regular] .container-wrap button[type=submit], body[data-form-submit=regular] .container-wrap input[type=submit] {
padding: 1.2em 2em 1.3em 2em !important;
font-size: 1.1em !important;
border: 2px solid #0000ff !important;
font-weight: 600 !important;
background-color: #0000ff !important;
font-family: 'regular' !important;
letter-spacing: 0.5px;
}
}
.ec-v-form-text, .ec-v-form-input, .ec-v-form-submit {
line-height: 1.5em!important;
}
.ec-v-forms-form-control, input[type="text"].ec-v-forms-form-control, input[type="email"].ec-v-forms-form-control {
border: 1px solid #e3e3e3!important;
border-radius: 12px!important;
}
@media (max-width: 600px) {
.ec-v-form-text, .ec-v-form-input, .ec-v-form-submit {
margin-left: -25px!important;
margin-right: -25px!important;
}
}
.ec-v-form-step.ec-v-form-step-visible {
overflow: hidden!important;
}
#ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-holder {
margin: unset!important;
}
.ec-v-form-holder *, #ec-v-form-slider-handle *, .ec-v-form-holder {
font-family: 'regular' !important;
}
#ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-holder p {
font-size: 15px!important;
}
.ec-v-form-text {
max-width: 440px!important;
}
.ec-v-form-error {
color: #ff0000!important;
font-size: 15px!important;
padding: 15px 15px!important;
font-weight: 500 !important;
border-radius: 12px!important;
margin-top: 12px!important;
background-color: #fff!important;
border: 1px solid #ff0000!important;
}#ec-v-from-popup-cover { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); z-index: 9999; display: none; } .ec-v-form-holder *, #ec-v-form-slider-handle *, .ec-v-form-holder { animation:none; animation-delay:0; animation-direction:normal; animation-duration:0; animation-fill-mode:none; animation-iteration-count:1; animation-name:none; animation-play-state:running; animation-timing-function:ease; backface-visibility:visible; background:0; background-attachment:scroll; background-clip:border-box; background-color:transparent; background-image:none; background-origin:padding-box; background-position:0 0; background-position-x:0; background-position-y:0; background-repeat:repeat; background-size:auto auto; border:0; border-style:none; border-width:medium; border-color:inherit; border-bottom:0; border-bottom-color:inherit; border-bottom-left-radius:0; border-bottom-right-radius:0; border-bottom-style:none; border-bottom-width:medium; border-collapse:separate; border-image:none; border-left:0; border-left-color:inherit; border-left-style:none; border-left-width:medium; border-radius:0; border-right:0; border-right-color:inherit; border-right-style:none; border-right-width:medium; border-spacing:0; border-top:0; border-top-color:inherit; border-top-left-radius:0; border-top-right-radius:0; border-top-style:none; border-top-width:medium; bottom:auto; box-shadow:none; box-sizing:border-box; caption-side:top; clear:none; clip:auto; color:inherit; columns:auto; column-count:auto; column-fill:balance; column-gap:normal; column-rule:medium none currentColor; column-rule-color:currentColor; column-rule-style:none; column-rule-width:none; column-span:1; column-width:auto; content:normal; counter-increment:none; counter-reset:none; direction:ltr; empty-cells:show; float:none; font:normal; font-style:normal; font-variant:normal; height:auto; hyphens:none; left:auto; letter-spacing:normal; list-style:none; list-style-image:none; list-style-position:outside; list-style-type:disc; margin:0; margin-bottom:0; margin-left:0; margin-right:0; margin-top:0; max-height:none; max-width:none; min-height:0; min-width:0; opacity:1; orphans:0; outline:0; outline-style:none; outline-width:medium; overflow:visible; overflow-x:visible; overflow-y:visible; padding:0; padding-bottom:0; padding-left:0; padding-right:0; padding-top:0; page-break-after:auto; page-break-before:auto; page-break-inside:auto; perspective:none; position:static; right:auto; tab-size:8; table-layout:auto; text-align:inherit; text-align-last:auto; text-decoration:none; text-decoration-color:inherit; text-decoration-line:none; text-decoration-style:solid; text-indent:0; text-shadow:none; text-transform:none; top:auto; transform:none; transform-style:flat; transition:none; vertical-align:baseline; visibility:visible; white-space:normal; width:auto; word-spacing:normal; z-index:auto; font-family: inherit; } .ec-v-form-holder, #ec-v-form-slider-handle{ font-family: "Open Sans", sans-serif; color: #333; font-size: 14px; } .ec-v-form-step { display: none } .ec-v-form-step.ec-v-form-step-visible { display: table } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-holder { margin: 0 auto; background-color: #FFFFFF; width: 641px; border-radius: px; padding-top: 0px; padding-bottom: 0px; background-size: cover; background-position: center top; } .ec-v-form-holder form{ overflow: hidden; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-holder > form { min-height: 200px; } .ec-v-form-has-typo button[type="submit"]{ opacity: 0.4; cursor: not-allowed; } .ec-v-form-regular button, .ec-v-form-close button, .ec-v-form-submit button, .ec-v-form-button button { position: relative; display:inline-block; margin-bottom:0; line-height:1.42857143; text-align:center; white-space:nowrap; vertical-align:middle; touch-action:manipulation; cursor:pointer; user-select:none; background-image:none; border-radius:3px; font-size:13px; font-weight:600; padding:10px 16px; } .ec-v-form-input{ position: relative } .ec-v-form-input label { display:block; max-width:100%; margin-bottom:5px; font-weight:700; font-size:14px; line-height:1.42857143; } .ec-v-forms-form-control,input[type="text"].ec-v-forms-form-control,input[type="email"].ec-v-forms-form-control{ text-align: left; display:block; width:100%; padding: 7px 16px; font-size: 14px; line-height: 24px; color:#555; background-color:#fff; background-image:none; border:1px solid #ccc; border-radius:4px; -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075); box-shadow:inset 0 1px 1px rgba(0,0,0,.075); -webkit-transition:border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; -o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s; height: auto; } input[name="firstname_hnp_ecomail"] { } #ec-v-from-popup-cover .ec-v-form-holder{ position: absolute; overflow: auto; bottom: 50%; transform: translate(-50%, 50%); left: 50%; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 #ec-v-from-mobile-popup-holder { display: none; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 #ec-v-from-mobile-popup-holder .ec-v-form-holder { position: fixed; bottom: 0; left: 0; right: 0; max-height: 30%!important; z-index: 9999; overflow: scroll!important; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; border-radius: px px 0 0!important; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 #ec-v-from-slider-holder .ec-v-form-holder { display: none; position: fixed;  right: 10%;    border-bottom-right-radius: 0px !important; border-bottom-left-radius: 0px !important; z-index: 99999; } #ec-v-from-slider-holder .ec-v-form-holder.ec-v-form-slider-show{ transition: all 0.3s ease-in-out; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 #ec-v-form-slider-handle { position: fixed; bottom: -7px;  right: 10%;    transition: all 0.3s ease-in-out; z-index: 99999; } #ec-v-form-slider-handle a{ display: block; color: white; cursor: pointer; background-color: red; padding: 10px 25px; padding-bottom: 17px; font-size: 14px; border-top-left-radius: 5px; border-top-right-radius: 5px; } #ec-v-form-slider-handle.ec-v-form-slider-show { bottom: -80px; } @-webkit-keyframes hvr-wobble-vertical{ 16.65%{   -webkit-transform:translateY(8px); transform:translateY(8px)  } 33.3%{   -webkit-transform:translateY(-6px); transform:translateY(-6px)  } 49.95%{   -webkit-transform:translateY(4px); transform:translateY(4px);  } 66.6%{   -webkit-transform:translateY(-2px); transform:translateY(-2px);  } 83.25%{   -webkit-transform:translateY(1px); transform:translateY(1px);  } 100%{   -webkit-transform:translateY(0); transform:translateY(0);  } } @keyframes hvr-wobble-vertical{ 16.65%{   -webkit-transform:translateY(8px); transform:translateY(8px)  } 33.3%{   -webkit-transform:translateY(-6px); transform:translateY(-6px)  } 49.95%{   -webkit-transform:translateY(4px); transform:translateY(4px);  } 66.6%{   -webkit-transform:translateY(-2px); transform:translateY(-2px);  } 83.25%{   -webkit-transform:translateY(1px); transform:translateY(1px);  } 100%{   -webkit-transform:translateY(0); transform:translateY(0);  } } .hvr-wobble-vertical{ display:inline-block; vertical-align:middle; -webkit-transform:perspective(1px) translateZ(0); transform:perspective(1px) translateZ(0); box-shadow:0 0 1px transparent } .hvr-wobble-vertical:active,.hvr-wobble-vertical:focus,.hvr-wobble-vertical:hover{ -webkit-animation-name:hvr-wobble-vertical; animation-name:hvr-wobble-vertical; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-timing-function:ease-in-out; animation-timing-function:ease-in-out; -webkit-animation-iteration-count:1; animation-iteration-count:1 } .ec-v-form-cls-mobile { cursor: pointer; width: 45px; height: 45px; position: absolute; top: 10px; right: 10px; display: block!important; z-index: 10; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-cls-mobile:before, #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-cls-mobile:after { position: absolute; right: 22px; content: ' '; height: 45px; width: 4px; border-radius: 3px; background-color: #000; } .ec-v-form-cls-mobile:before { transform: rotate(45deg); } .ec-v-form-cls-mobile:after { transform: rotate(-45deg); } .ec-v-form-cls { cursor: pointer; width: 16px; height: 16px; position: absolute; top: 20px; right: 20px; display: block!important; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-cls:before, #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-cls:after { position: absolute; left: 8px; content: ' '; height: 16px; width: 2px; background-color: #000; } .ec-v-form-cls:before { transform: rotate(45deg); } .ec-v-form-cls:after { transform: rotate(-45deg); } .ec-v-form-holder.ec-v-form-with-shadow{ -webkit-box-shadow: 2px 2px 4px 1px rgba(0,0,0,0.41); -moz-box-shadow: 2px 2px 4px 1px rgba(0,0,0,0.41); box-shadow: 2px 2px 4px 1px rgba(0,0,0,0.41); } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-holder h2{ font-size: 32px; margin-top: 11px; margin-bottom: 11px; font-weight: 500; line-height: 35px; color: #000000; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-holder h3{ font-size: 24px; margin-top: 9px; margin-bottom: 9px; color: #000000; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-holder h4{ font-size: 18px; margin-top: 8px; margin-bottom: 8px; color: #000000; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-holder h5{ font-size: 14px; margin-top: 8px; margin-bottom: 8px; color: #000000; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-holder h6{ font-size: 12px; margin-top: 8px; margin-bottom: 8px; color: #000000; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-holder p{ font-size: 13px; margin-top: 10px; margin-bottom: 10px; color: #000000; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-holder .ec-v-form-input p{ margin-top: 0; margin-bottom: 0; } .ec-v-form-input label.ec-forms-chck-lbl-text{ font-weight:400; cursor: pointer; } .ec-v-form-input input[type=checkbox]{ display:none } .ec-v-form-input input[type=checkbox]+label{ position:relative; display:block; padding-left:30px; cursor:pointer; vertical-align:middle; float:left } .ec-v-form-input input[type=checkbox]+label:before{ position:absolute; top:0; left:0; display:inline-block; width:20px; height:20px; content: ''; border: 1px solid #999; background-color: #efefef; border-radius:3px; transform: none; } .ec-v-form-input input[type=checkbox]+label:after{ position:absolute; display:none; content: ''; top:2px; left:7px; box-sizing:border-box; background-color: transparent; width:6px; height:12px; transform:rotate(45deg); border-width:2px; border-style:solid; border-color:#fff; border-top:0; border-left:0 } .ec-v-form-input input[type=checkbox]:checked+label:after{ display:block } .ec-v-form-input input[type=checkbox]:checked+label:before{ border:#3e97eb; background:#3e97eb } .ec-forms-chck-lbl-text+.ec-v-form-error{ margin-top: 5px; } /* Datepicker input calendar image */ .ec-v-form-input .ec-v-forms-form-control.form-control.input{ background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fad' data-icon='calendar-alt' class='svg-inline--fa fa-calendar-alt fa-w-14' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cg class='fa-group'%3E%3Cpath class='fa-secondary' fill='currentColor' d='M0 192v272a48 48 0 0 0 48 48h352a48 48 0 0 0 48-48V192zm128 244a12 12 0 0 1-12 12H76a12 12 0 0 1-12-12v-40a12 12 0 0 1 12-12h40a12 12 0 0 1 12 12zm0-128a12 12 0 0 1-12 12H76a12 12 0 0 1-12-12v-40a12 12 0 0 1 12-12h40a12 12 0 0 1 12 12zm128 128a12 12 0 0 1-12 12h-40a12 12 0 0 1-12-12v-40a12 12 0 0 1 12-12h40a12 12 0 0 1 12 12zm0-128a12 12 0 0 1-12 12h-40a12 12 0 0 1-12-12v-40a12 12 0 0 1 12-12h40a12 12 0 0 1 12 12zm128 128a12 12 0 0 1-12 12h-40a12 12 0 0 1-12-12v-40a12 12 0 0 1 12-12h40a12 12 0 0 1 12 12zm0-128a12 12 0 0 1-12 12h-40a12 12 0 0 1-12-12v-40a12 12 0 0 1 12-12h40a12 12 0 0 1 12 12zm-80-180h32a16 16 0 0 0 16-16V16a16 16 0 0 0-16-16h-32a16 16 0 0 0-16 16v96a16 16 0 0 0 16 16zm-192 0h32a16 16 0 0 0 16-16V16a16 16 0 0 0-16-16h-32a16 16 0 0 0-16 16v96a16 16 0 0 0 16 16z' opacity='0.4'%3E%3C/path%3E%3Cpath class='fa-primary' fill='currentColor' d='M448 112v80H0v-80a48 48 0 0 1 48-48h48v48a16 16 0 0 0 16 16h32a16 16 0 0 0 16-16V64h128v48a16 16 0 0 0 16 16h32a16 16 0 0 0 16-16V64h48a48 48 0 0 1 48 48z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E"); background-repeat: no-repeat; background-size: 18px 18px; background-position: right 10px center; } .ec-v-form-autocorrect{ position: absolute; color: #ffa60b; background-color: #ffffff; border-color: #ffeeba; font-size: 12px; padding: 10px 15px; border-radius: 2px; margin-top: 5px; display: none; cursor: pointer; z-index: 999; box-shadow: 0px 5px 20px 2px rgba(66,92,121,0.27); } .ec-v-form-autocorrect:before { width: 8px; height: 8px; display: inline-block; background: #fff; content: ""; position: absolute; left: 15px; top: -4px; transform: rotate(45deg); } .ec-v-form-autocorrect b{ cursor: pointer; } .ec-v-form-error{ color: #ffa60b; font-size: 12px; padding: 9px 15px; border-radius: 4px; margin-top: 2px; display: none; cursor: pointer; background-color: rgb(255, 242, 220); font-weight: bold; } .ec-v-form-holder .ec-v-form-input p { margin-top: 0px; margin-bottom: 10px; margin-left: 35px } .ec-v-form-holder .ec-l-circular { position:absolute; left:50%; top:50%; margin-top:-15px; margin-left:-15px; height: 30px; width: 30px; animation: loading-rotate 2s linear infinite; } .ec-l-circular .ec-l-path { animation: loading-dash 1.5s ease-in-out infinite; stroke-dasharray: 90,150; stroke-dashoffset: 0; stroke-width: 2; stroke: #409eff; stroke-linecap: round; } @keyframes loading-rotate { 100% { transform: rotate(360deg); } } @keyframes loading-dash { 0% { stroke-dasharray: 1, 200; stroke-dashoffset: 0; } 50% { stroke-dasharray: 90, 150; stroke-dashoffset: -40px; } 100% { stroke-dasharray: 90, 150; stroke-dashoffset: -120px; } } .ec-v-form-column{ vertical-align: top; display: table-cell; float: none !important; } #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-text a, #ec_form_1-43c2cd496486bcc27217c3e790fb4088 .ec-v-form-input a{ text-decoration: underline; color: #000000 } @media (max-width:767px){ .ec-v-form-column { display: block; } #ec-v-form-slider-handle{ left:0;  right:auto; width: 100%; text-align: center; } #ec-v-form-slider-handle a{ border-top-left-radius:0; border-top-right-radius:0; width: 100%; } #ec-v-from-slider-holder .ec-v-form-holder{ right:auto; left:0;  width:100%!important; height: 100% !important; } .ec-v-form-step { } .ec-v-form-step.ec-v-form-step-visible { display: block; height: 100% !important; overflow: auto; } .ec-v-form-holder > form { min-height: 0; height: 100%; } .ec-v-form-holder-popup{ width: 100% !important; top: auto !important; left: auto !important; } .ec-v-form-holder-basic{ width: 100% !important; } #ec-v-from-popup-cover{ position: absolute; } } .ec-v-forms-animated{ -webkit-animation-duration:.75s; animation-duration:.75s; -webkit-animation-fill-mode:both; animation-fill-mode:both } @-webkit-keyframes ec-v-forms-shake{ from,to{ -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0) } 10%,30%,50%,70%,90%{ -webkit-transform:translate3d(-5px,0,0); transform:translate3d(-5px,0,0) } 20%,40%,60%,80%{ -webkit-transform:translate3d(5px,0,0); transform:translate3d(5px,0,0) } } @keyframes ec-v-forms-shake{ from,to{ -webkit-transform:translate3d(0,0,0); transform:translate3d(0,0,0) } 10%,30%,50%,70%,90%{ -webkit-transform:translate3d(-5px,0,0); transform:translate3d(-5px,0,0) } 20%,40%,60%,80%{ -webkit-transform:translate3d(5px,0,0); transform:translate3d(5px,0,0) } } .ec-v-forms-shake{ -webkit-animation-name:ec-v-forms-shake; animation-name:ec-v-forms-shake } input.ec-v-form-has-error, .ec-v-form-input.ec-v-form-has-error input[type=checkbox]+label:before{ border-color: rgb(255,166,11) !important; } @media only screen and (max-width: 600px) { .ec-v-form-text, .ec-v-form-input, .ec-v-form-submit { padding-left: 25px !important; padding-right: 25px !important; } } .ec-v-form-input-block-label { display:block; max-width:100%; margin-bottom:5px; font-weight:700; font-size:14px; line-height:1.42857143; }</style><div id="ec_form_1-43c2cd496486bcc27217c3e790fb4088"><div class="ec-v-form-holder ec-v-form-holder-basic" style="background-color: #FFFFFF;width:641px;border-radius:px;padding-top:0px;padding-bottom:0px;overflow: auto;"><form style="min-height: 200px"><div class="ec-v-form-step ec-v-form-step-visible" style="height: 200px;width: 100%;"><div class="ec-v-form-column" style="width: 100%"><input autocomplete="false" name="ecmw[firstname_hnp_ecomail]" style="display:none !important" tabindex="-1" type="checkbox" value="1"/><div class="ec-v-form-input" style="padding: 0px 0px;">
<label class="ec-v-forms-label" style="color:##000000"></label>
<input autocomplete="email" class="ec-v-forms-form-control" name="ecmw[email]" placeholder="E-mail" required="required" type="email"/>
<div class="ec-v-form-autocorrect"></div>
<div class="ec-v-form-error ec-v-form-error-email"></div>
</div><div class="ec-v-form-spacer" style="height: 23px"> </div><div class="ec-v-form-submit ec-v-form-btntype-submit" style="padding: 0px 0px; text-align: center">
<button style="border: 0; background-color: #0000FF; color: #ffffff;width: 100%;; text-align: center; font-family: arial,helvetica,sans-serif" type="submit">
			Přihlásit odběr
		</button>
</div><div class="ec-v-form-spacer" style="height: 20px"> </div><div class="ec-v-form-text" style="padding: 0px 0px;color: ##000000;">
<p><span style="font-family: arial, helvetica, sans-serif;">Magazín posíláme zdarma a jen když máme co říct. </span><span style="font-family: arial, helvetica, sans-serif;">Přečtěte si, jak zpracováváme <a draggable="false" href="#" rel="noopener" target="_blank">osobní údaje</a>.</span></p>
</div></div></div><div class="ec-v-form-step ec-v-form-step-send" style="height: 200px;width: 100%;"><div class="ec-v-form-column" style=""><div class="ec-v-form-text" style="padding: 0px 0px;color: #030303;">
<h2 style="text-align: left;"><span style="font-family: arial, helvetica, sans-serif;"><strong>Hotovo!</strong></span></h2>
</div><div class="ec-v-form-text" style="padding: 0px 0px;color: #030303;">
<h4><span style="font-family: arial, helvetica, sans-serif;">Už brzy můžete ve schránce čekat první magazín.</span></h4>
</div></div></div></form></div></div></div>
</div>
</div>
</div>
</div>
<div class="vc_col-sm-6 vc_col-lg-6 vc_col-md-12 bsb_column column_container vc_column_container col centered-text padding-2-percent top_margin_tablet_40px inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="left-right">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="img-with-aniamtion-wrap center custom-width-900px custom-width-tablet-700px custom-width-phone-360px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<img alt="Praktický magazín" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" fetchpriority="high" height="1074" src="obrazky/design-magazin-c59917.webp" width="1500"/>
</div>
</div>
</div>
</div>
<div class="bsb_raw_code bsb_raw_js">
<div class="bsb_wrapper">
</div>
</div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Kontakt

Kontaktní údaje, adresa a otevírací doba vedle obrázku. Třídy: top-level, max-width.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row">
<div class="bsb_row vc_row-fluid vc_row top-level max-width top_padding_tablet_60px top_padding_phone_40px bottom_padding_tablet_60px bottom_padding_phone_60px" data-column-margin="default" data-midnight="dark" id="fws_6aef74e937953" style="padding-top: 100px; padding-bottom: 60px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col centered-text no-extra-padding inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row top_padding_tablet_0px top_padding_phone_0px bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6aef74e937e37" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<h1>Kontaktujte nás</h1>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row vc_row-o-equal-height vc_row-flex vc_row-o-content-top stred-max-width top_padding_tablet_40px top_padding_phone_40px" data-column-margin="30px" data-midnight="" id="fws_6aef74e9380ff" style="padding-top: 60px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-6 vc_col-lg-6 vc_col-md-6 vc_col-xs-12 bsb_column column_container vc_column_container col child_column boxed bottom_margin_phone_30px top_padding_desktop_30px top_padding_tablet_30px top_padding_phone_30px bottom_padding_desktop_50px bottom_padding_tablet_40px bottom_padding_phone_40px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" data-t-w-inherits="small_desktop">
<div class="vc_column-inner"><a class="column-link" href="#" target="_self"></a>
<div class="bsb_wrapper">
<div class="img-with-aniamtion-wrap center custom-width-90px custom-width-tablet-90px custom-width-phone-60px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<img alt="Napište nám" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="100" src="assets/soubory/2026/01/ikona-kontakt-mail.svg" width="100"/>
</div>
</div>
</div>
</div>
<div class="bsb_text_column bsb_content_element">
<h3><a href="#">info@blue.example</a></h3>
</div>
<div class="bsb_text_column bsb_content_element male">
<p>Napište pár vět, stačí stručně</p>
</div>
</div>
</div>
</div>
<div class="vc_col-sm-6 vc_col-lg-6 vc_col-md-6 vc_col-xs-12 bsb_column column_container vc_column_container col child_column boxed bottom_margin_phone_30px top_padding_desktop_30px top_padding_tablet_30px top_padding_phone_30px bottom_padding_desktop_50px bottom_padding_tablet_40px bottom_padding_phone_40px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" data-t-w-inherits="small_desktop">
<div class="vc_column-inner"><a class="column-link" href="#" target="_self"></a>
<div class="bsb_wrapper">
<div class="img-with-aniamtion-wrap center custom-width-90px custom-width-tablet-90px custom-width-phone-60px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<img alt="Volat do BLUE STUDIO" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="100" src="assets/soubory/2026/01/ikona-kontakt-tel.svg" width="100"/>
</div>
</div>
</div>
</div>
<div class="bsb_text_column bsb_content_element">
<h3><strong>+420 234 567 890</strong></h3>
</div>
<div class="bsb_text_column bsb_content_element male">
<p>Po-Pá · 9:00-17:00</p>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row top_padding_tablet_40px top_padding_phone_20px" data-column-margin="default" data-midnight="" id="fws_6aef74e938f01" style="padding-top: 60px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding column_element_direction_desktop_horizontal force-desktop-text-align-center column_element_direction_tablet_horizontal force-tablet-text-align-center column_element_direction_phone_horizontal force-phone-text-align-center el_spacing_10px inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<p>BLUE STUDIO s.r.o.<br/>
<a href="#" rel="noopener" target="_blank">Modrá 12, 602 00 Brno</a><br/>
IČO: 12345678<br/>
Nejsme plátci DPH.</p>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div>
<div class="bsb_row vc_row-fluid vc_row max-width top_padding_tablet_0px top_padding_phone_0px bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="dark" id="fws_6aef74e939179" style="padding-top: 40px; padding-bottom: 40px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="divider-wrap" data-alignment="default"><div class="divider-border" data-animate="" data-animation-delay="" data-color="accent-color" data-width="100%" style="margin-top: 0.5px; height: 1px; margin-bottom: 0.5px;"></div></div>
</div>
</div>
</div>
</div></div>
<div class="bsb_row vc_row-fluid vc_row max-width800 top_padding_tablet_80px top_padding_phone_60px bottom_padding_tablet_40px bottom_padding_phone_20px" data-column-margin="default" data-midnight="dark" id="fws_6aef74e93941b" style="padding-top: 60px; padding-bottom: 60px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col centered-text no-extra-padding inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row top_padding_tablet_0px top_padding_phone_0px bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6aef74e93959a" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<h2 class="bs-h1">Sledujte nás</h2>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row top_padding_tablet_60px top_padding_phone_40px bottom_padding_tablet_20px" data-column-margin="default" data-midnight="" id="fws_6aef74e93975b" style="padding-top: 60px; padding-bottom: 60px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-4 vc_col-xs-4 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="img-with-aniamtion-wrap center custom-width-32px custom-width-tablet-32px custom-width-phone-32px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_blank">
<img alt="Facebook" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="100" src="assets/soubory/2026/01/ikona-facebook.svg" width="100"/>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-4 vc_col-xs-4 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="img-with-aniamtion-wrap center custom-width-32px custom-width-tablet-32px custom-width-phone-32px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_blank">
<img alt="Instagram" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="100" src="assets/soubory/2026/01/ikona-instagram.svg" width="100"/>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-4 vc_col-xs-4 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="img-with-aniamtion-wrap center custom-width-32px custom-width-tablet-32px custom-width-phone-32px" data-animation="none" data-max-width="custom" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="center" href="#" target="_blank">
<img alt="LinkedIn" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="100" src="assets/soubory/2026/01/ikona-linkedin.svg" width="100"/>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div>
</div></div></div></div></div></div>

Průběh konzultace

Kroky konzultace se štítky a krátkým textem. Třídy: nectar-badge, max-width1400.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row max-width1400 top_padding_tablet_20px top_padding_phone_0px bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="dark" id="fws_6aef74ef0181c" style="padding-top: 20px; padding-bottom: 40px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74ef019f0" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column centered-text no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="nectar-responsive-text nectar-link-underline-effect"><h2 class="bs-h1"><strong>Jak konzultace probíhá<br/>
</strong></h2>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row top_padding_tablet_20px top_padding_phone_20px bottom_padding_tablet_40px bottom_padding_phone_40px" data-column-margin="default" data-midnight="" id="fws_6aef74ef01b75" style="padding-top: 20px; padding-bottom: 60px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column centered-text no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element">
<p>Jednoduše a bez zbytečného natahování. Naším cílem je rychle získat jasno, ne vám něco prodávat.</p>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row vc_row-o-equal-height vc_row-flex vc_row-o-content-top" data-column-margin="50px" data-midnight="" id="fws_6aef74ef01cb8" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-4 vc_col-xs-12 bsb_column column_container vc_column_container col child_column centered-text no-extra-padding bottom_margin_tablet_40px inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" data-t-w-inherits="small_desktop" style="margin-bottom: 40px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="nectar-badge nectar-inherit-h4 nectar-display-block text-color-FFFFFF padding-amount-medium badge-style-default border-radius-100px"><div class="nectar-badge__inner nectar-bg-extra-color-1">1.</div></div>
<div class="bsb_text_column bsb_content_element">
<p><strong>Ozvete se</strong></p>
</div>
<div class="bsb_text_column bsb_content_element vc_custom_1768042190421 male" style=" max-width: 400px; display: inline-block;">
<p>Telefonem nebo e-mailem podle toho, co vám více vyhovuje.</p>
</div>
</div>
</div>
</div>
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-4 vc_col-xs-12 bsb_column column_container vc_column_container col child_column centered-text no-extra-padding bottom_margin_tablet_40px inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" data-t-w-inherits="small_desktop" style="margin-bottom: 40px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="nectar-badge nectar-inherit-h4 nectar-display-block text-color-FFFFFF padding-amount-medium badge-style-default border-radius-100px"><div class="nectar-badge__inner nectar-bg-extra-color-1">2.</div></div>
<div class="bsb_text_column bsb_content_element">
<p><strong>Ujasníme si situaci</strong></p>
</div>
<div class="bsb_text_column bsb_content_element vc_custom_1768042611371 male" style=" max-width: 400px; display: inline-block;">
<p>Co dnes nefunguje, kam míříte a jaké máte cíle vašeho projektu a značky.</p>
</div>
</div>
</div>
</div>
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-4 vc_col-xs-12 bsb_column column_container vc_column_container col child_column centered-text no-extra-padding bottom_margin_tablet_40px inherit_tablet inherit_phone" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all" data-t-w-inherits="small_desktop" style="margin-bottom: 40px; ">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="nectar-badge nectar-inherit-h4 nectar-display-block text-color-FFFFFF padding-amount-medium badge-style-default border-radius-100px"><div class="nectar-badge__inner nectar-bg-extra-color-1">3.</div></div>
<div class="bsb_text_column bsb_content_element">
<p><strong>Dostanete doporučení<br/>
</strong></p>
</div>
<div class="bsb_text_column bsb_content_element vc_custom_1768042201439 male" style=" max-width: 400px; display: inline-block;">
<p>Navrhneme konkrétní kroky a na rovinu řekneme, jestli dává smysl spolupracovat.</p>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Ke stažení

Balíčky ke stažení

Karty balíčků ikon se štítkem a tlačítkem. Třídy: nectar-badge, img-with-animation.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row full-width-section has-row-bg-color vc_row-o-equal-height vc_row-flex top_margin_60px bottom_margin_0px top_padding_tablet_60px top_padding_phone_40px bottom_padding_tablet_60px bottom_padding_phone_40px right_padding_tablet_0px right_padding_phone_0px left_padding_tablet_0px left_padding_phone_0px top_margin_tablet_40px top_margin_phone_20px bottom_margin_tablet_0px bottom_margin_phone_0px" data-column-margin="40px" data-midnight="dark" id="ikony-balicky" style="padding-top: 120px; padding-bottom: 100px; --row-bg-color: #E6EFFD;"><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop using-bg-color" style="background-color: #E6EFFD; "></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col centered-text no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row top_padding_tablet_40px top_padding_phone_40px bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6aef74faa6f92" style="padding-bottom: 60px; "><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="bsb_text_column bsb_content_element nadpis" style=" max-width: 1200px; display: inline-block;">
<h3><strong>Aktuální balíčky ikon</strong></h3>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-6 vc_col-xs-12 bsb_column column_container vc_column_container col no-extra-padding no-extra-padding_tablet no-extra-padding_phone flex_gap_desktop_10px" data-animation="" data-bg-color="#ffffff" data-bg-opacity="1" data-border-radius="10px" data-delay="0" data-has-bg-color="true" data-padding-pos="all" data-using-bg="true" style="margin-top: 20px; margin-bottom: 20px; ">
<div class="vc_column-inner bs-card"><div class="column-bg-overlay-wrap column-bg-layer" data-bg-animation="none"><div class="column-bg-overlay" style="opacity: 1; background-color: #ffffff;"></div></div>
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6aef74faa722b" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding no-extra-padding_tablet no-extra-padding_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="img-with-aniamtion-wrap tl_br_10px tr_br_10px bl_br_0px br_br_0px" data-animation="none" data-border-radius="custom" data-max-width="100%" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="" href="#" target="_blank">
<img alt="Originální sady vektorových ikon a ilustrací - Formáty souborů - Filetypes" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="900" src="obrazky/donwload-ikony-flaticon-e94f29.webp" width="1600"/>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74faa7461" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-8-percent top_margin_tablet_-40px top_margin_phone_-40px padding-6-percent_tablet padding-5-percent_phone bl_br_10px br_br_10px" data-animation="" data-bg-color="#FFFFFF" data-bg-opacity="1" data-delay="0" data-has-bg-color="true" data-padding-pos="all" data-using-bg="true" style="margin-top: -40px; ">
<div class="vc_column-inner bs-card"><div class="column-bg-overlay-wrap column-bg-layer" data-bg-animation="none"><div class="column-bg-overlay" style="opacity: 1; background-color: #FFFFFF;"></div></div>
<div class="bsb_wrapper">
<div class="nectar-badge nectar-inherit-body nectar-display-block text-color-ffffff padding-amount-small badge-style-default border-radius-20px" data-bg-color-custom="#ff9800" style="margin-right: 0px; margin-bottom: 20px; margin-left: 0px;"><div class="nectar-badge__inner">IKONY</div></div>
<div class="bsb_text_column bsb_content_element">
<h2><a href="#" target="_blank"></a><a href="#" target="_blank"><strong>Formáty souborů<br/>
</strong></a></h2>
</div>
<div class="bsb_text_column bsb_content_element">
<p>Balíček 32 ikon pro typy souborů - ve třech stylových provedeních. Skvělý doplněk pro organizaci a značení dokumentů.</p>
</div>
<a class="nectar-button large regular accent-color regular-button tlacitko-obrys tlacitko-full" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" role="button" style="margin-top: 20px; margin-bottom: 20px; color: #ffffff; background-color: #0a0a0a;" target="_blank"><span>Zobrazit balíček</span></a>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-6 vc_col-xs-12 bsb_column column_container vc_column_container col no-extra-padding no-extra-padding_tablet no-extra-padding_phone flex_gap_desktop_10px" data-animation="" data-bg-color="#ffffff" data-bg-opacity="1" data-border-radius="10px" data-delay="0" data-has-bg-color="true" data-padding-pos="all" data-using-bg="true" style="margin-top: 20px; margin-bottom: 20px; ">
<div class="vc_column-inner bs-card"><div class="column-bg-overlay-wrap column-bg-layer" data-bg-animation="none"><div class="column-bg-overlay" style="opacity: 1; background-color: #ffffff;"></div></div>
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6aef74faa7761" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding no-extra-padding_tablet no-extra-padding_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="img-with-aniamtion-wrap tl_br_10px tr_br_10px bl_br_0px br_br_0px" data-animation="none" data-border-radius="custom" data-max-width="100%" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="" href="#" target="_blank">
<img alt="Originální sady vektorových ikon a ilustrací - Hotely a turismus" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="900" src="obrazky/donwload-ikony-hotel-3bbfad.webp" width="1600"/>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74faa7df1" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-8-percent top_margin_tablet_-40px top_margin_phone_-40px padding-6-percent_tablet padding-5-percent_phone bl_br_10px br_br_10px" data-animation="" data-bg-color="#FFFFFF" data-bg-opacity="1" data-delay="0" data-has-bg-color="true" data-padding-pos="all" data-using-bg="true" style="margin-top: -40px; ">
<div class="vc_column-inner bs-card"><div class="column-bg-overlay-wrap column-bg-layer" data-bg-animation="none"><div class="column-bg-overlay" style="opacity: 1; background-color: #FFFFFF;"></div></div>
<div class="bsb_wrapper">
<div class="nectar-badge nectar-inherit-body nectar-display-block text-color-ffffff padding-amount-small badge-style-default border-radius-20px" data-bg-color-custom="#ff9800" style="margin-right: 0px; margin-bottom: 20px; margin-left: 0px;"><div class="nectar-badge__inner">IKONY</div></div>
<div class="bsb_text_column bsb_content_element">
<h2><a href="#" target="_blank"></a><a href="#" target="_blank"><strong>Hotely a turismus<br/>
</strong></a></h2>
</div>
<div class="bsb_text_column bsb_content_element">
<p>Sada 20 symbolů a ikon hotelových a ubytovacích služeb - ideální nejen pro hoteliéry, ale i pro rezervační systémy a weby.</p>
</div>
<a class="nectar-button large regular accent-color regular-button tlacitko-obrys tlacitko-full" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" role="button" style="margin-top: 20px; margin-bottom: 20px; color: #ffffff; background-color: #0a0a0a;" target="_blank"><span>Zobrazit balíček</span></a>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
<div class="vc_col-sm-4 vc_col-lg-4 vc_col-md-6 vc_col-xs-12 bsb_column column_container vc_column_container col no-extra-padding no-extra-padding_tablet no-extra-padding_phone flex_gap_desktop_10px" data-animation="" data-bg-color="#ffffff" data-bg-opacity="1" data-border-radius="10px" data-delay="0" data-has-bg-color="true" data-padding-pos="all" data-using-bg="true" style="margin-top: 20px; margin-bottom: 20px; ">
<div class="vc_column-inner bs-card"><div class="column-bg-overlay-wrap column-bg-layer" data-bg-animation="none"><div class="column-bg-overlay" style="opacity: 1; background-color: #ffffff;"></div></div>
<div class="bsb_wrapper">
<div class="bsb_row vc_row-fluid vc_row inner_row bottom_padding_tablet_0px bottom_padding_phone_0px" data-column-margin="default" data-midnight="" id="fws_6aef74faa81d6" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column no-extra-padding no-extra-padding_tablet no-extra-padding_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="img-with-aniamtion-wrap tl_br_10px tr_br_10px bl_br_0px br_br_0px" data-animation="none" data-border-radius="custom" data-max-width="100%" data-max-width-mobile="default" data-shadow="none">
<div class="inner">
<div class="hover-wrap">
<div class="hover-wrap-inner">
<a class="" href="#" target="_blank">
<img alt="Originální sady vektorových ikon a ilustrací - Elektřina a zabezpečení" class="img-with-animation skip-lazy" data-animation="none" data-delay="0" decoding="async" height="900" src="obrazky/donwload-ikony-elektro-b7afb1.webp" width="1600"/>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div></div><div class="bsb_row vc_row-fluid vc_row inner_row" data-column-margin="default" data-midnight="" id="fws_6aef74faa87a3" style=""><div class="row-bg-wrap"> <div class="row-bg"></div> </div><div class="row_col_wrap_12_inner col span_12 left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col child_column neg-marg padding-8-percent top_margin_tablet_-40px top_margin_phone_-40px padding-6-percent_tablet padding-5-percent_phone bl_br_10px br_br_10px" data-animation="" data-bg-color="#FFFFFF" data-bg-opacity="1" data-delay="0" data-has-bg-color="true" data-padding-pos="all" data-using-bg="true" style="margin-top: -40px; ">
<div class="vc_column-inner bs-card"><div class="column-bg-overlay-wrap column-bg-layer" data-bg-animation="none"><div class="column-bg-overlay" style="opacity: 1; background-color: #FFFFFF;"></div></div>
<div class="bsb_wrapper">
<div class="nectar-badge nectar-inherit-body nectar-display-block text-color-ffffff padding-amount-small badge-style-default border-radius-20px" data-bg-color-custom="#ff9800" style="margin-right: 0px; margin-bottom: 20px; margin-left: 0px;"><div class="nectar-badge__inner">IKONY</div></div>
<div class="bsb_text_column bsb_content_element">
<h2><a href="#" target="_blank"></a><a href="#" target="_blank"><strong>Elektřina a zabezpečení<br/>
</strong></a></h2>
</div>
<div class="bsb_text_column bsb_content_element">
<p>Ikony elektřiny, osvětlení a bezpečnosti - vhodné pro profesionální i edukativní účely, technická schémata, prezentace a weby.</p>
</div>
<a class="nectar-button large regular accent-color regular-button tlacitko-obrys tlacitko-full" data-color-override="#0a0a0a" data-hover-color-override="false" data-hover-text-color-override="#fff" href="#" role="button" style="margin-top: 20px; margin-bottom: 20px; color: #ffffff; background-color: #0a0a0a;" target="_blank"><span>Zobrazit balíček</span></a>
</div>
</div>
</div>
</div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Podmínky

Právní text rozdělený do rozbalovacích bloků. Třídy: toggles, toggle.

HTML kód

<div class="ocm-effect-wrap"><div class="ocm-effect-wrap-inner"><div id="ajax-content-wrap"><div class="container-wrap"><div class="container main-content"><div class="row"><div class="bsb_row vc_row-fluid vc_row top_padding_tablet_40px top_padding_phone_20px bottom_padding_tablet_40px bottom_padding_phone_20px" data-column-margin="default" data-midnight="dark" id="fws_6aef84f75aaf0" style="padding-top: 60px; padding-bottom: 60px; "><div class="row-bg-wrap" data-bg-animation="none" data-bg-animation-delay="" data-bg-overlay="false"><div class="inner-wrap row-bg-layer"><div class="row-bg viewport-desktop" style=""></div></div></div><div class="row_col_wrap_12 col span_12 dark left">
<div class="vc_col-sm-12 bsb_column column_container vc_column_container col no-extra-padding inherit_tablet inherit_phone flex_gap_desktop_10px" data-animation="" data-bg-color="" data-bg-opacity="1" data-delay="0" data-has-bg-color="false" data-padding-pos="all">
<div class="vc_column-inner">
<div class="bsb_wrapper">
<div class="toggles" data-br="" data-starting="default" data-style="minimal"><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6aef84f75bc75" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6aef84f75bc75" role="button"><i class="fa fa-plus" role="presentation"></i>Objednávka</a></h3><div aria-labelledby="toggle-button-6aef84f75bc75" id="toggle-panel-6aef84f75bc75" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<ol>
<li>Objednávky přijímáme pouze na e-mailu info@blue.example</li>
<li>Objednávka je platná po odsouhlasení cenové nabídky a těchto podmínek. Odsouhlasením se rozumí: (a) Výslovný písemný souhlas zaslaný e-mailem (např. „Souhlasím s nabídkou a podmínkami spolupráce uvedenými na https://blue.example/vop“), nebo (b) Úhrada vystavené faktury, přičemž úhradou potvrzujete, že jste se seznámili s těmito podmínkami i se zásadami ochrany <a href="#" rel="noopener" target="_blank">osobních údajů</a> a souhlasíte s nimi.</li>
<li>Poté vystavíme první fakturu, jejíž úhradou je objednávka definitivně potvrzená.</li>
<li>Tyto podmínky jsou součástí každé objednávky. Přijetím cenové nabídky, úhradou faktury nebo zahájením spolupráce potvrzujete, že jste se s nimi seznámili a souhlasíte s nimi. Podmínky platí automaticky i pro každou další objednávku v rámci opakující se spolupráce, pokud není písemně dohodnuto jinak.</li>
<li>Objednávku můžeme odmítnout, pokud by souvisela s něčím nelegálním, neetickým nebo jednoduše nebyla v souladu s našimi hodnotami.</li>
</ol>
</div>
</div></div></div><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6aef84f75bed2" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6aef84f75bed2" role="button"><i class="fa fa-plus" role="presentation"></i>Ceny a platba</a></h3><div aria-labelledby="toggle-button-6aef84f75bed2" id="toggle-panel-6aef84f75bed2" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<ol>
<li>Naše spolupráce začíná po zaplacení 50 % ceny za dohodnuté služby. Zbývající část ceny fakturujeme před předání finálních výstupů.</li>
<li>U nových klientů můžeme požadovat celou platbu předem.</li>
<li>U stálých klientů platby předem nepožadujeme. Naopak při dlouhodobé spolupráci nabízíme možnost fakturace až po dokončení projektu.</li>
<li>Faktury jsou splatné do 7 dnů, pokud se nedohodneme jinak.</li>
<li>Finální cenu a podmínky si vždy dohodneme předem.</li>
</ol>
</div>
</div></div></div><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6aef84f75c0b7" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6aef84f75c0b7" role="button"><i class="fa fa-plus" role="presentation"></i>Podklady a tvorba</a></h3><div aria-labelledby="toggle-button-6aef84f75c0b7" id="toggle-panel-6aef84f75c0b7" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<ol>
<li><strong>Váš projekt a podklady budeme průběžně konzultovat</strong> prostřednictvím e-mailu, telefonicky nebo dohodnuté online schůzky.</li>
<li>Konečnou podobu projektu si odsouhlasíme prostřednictvím e-mailu.</li>
<li><strong>V případě, že budeme řešit tiskovou grafiku</strong>, předáme vám výstupní soubory odpovídající rozsahu projektu. Standardně se jedná o:
<ul>
<li>Tisková data ve formátu PDF</li>
<li>PDF pro publikování a distribuci v online prostředí</li>
<li>JPG/PNG náhledy pro sdílení a prezentaci</li>
<li>V případě tvorby logotypu či vizuální identity navíc kompletní brand balíček obsahující soubory <a class="napoveda" href="#" rel="prettyPhoto[gallery-n2zo]" target="_blank">EPS</a>, <a class="napoveda" href="#" rel="prettyPhoto[gallery-n2zo]" target="_blank">SVG</a>, <a class="napoveda" href="#" rel="prettyPhoto[gallery-n2zo]" target="_blank">PDF</a>, <a class="napoveda" href="#" rel="prettyPhoto[gallery-n2zo]" target="_blank">PNG</a>, <a class="napoveda" href="#" rel="prettyPhoto[gallery-n2zo]" target="_blank">JPG</a> a všechna použitá písma, fotografie a ilustrace/ikony</li>
</ul>
</li>
<li><strong>V případě tvorby grafiky pro digitální prostředí</strong> (web, sociální sítě, online materiály) předáme výstupy ve formátech odpovídajících požadavkům projektu. Podle zvoleného nástroje tvorby to může být:
<ul>
<li>Exportované soubory JPG, PNG nebo SVG v požadovaných rozměrech</li>
<li>PDF pro online distribuci</li>
<li>Sdílený odkaz nebo přístup ke zdrojovému souboru (Canva nebo Adobe)</li>
<li>V případě zpracování responzivní verze designu (mobilní zařízení, tablety) si cenu specifikujeme individuálně - běžně se jedná o navýšení o 30 % oproti ceně základního designu</li>
</ul>
</li>
<li>Pokud projekt zpracováváme v nástroji <a class="napoveda" href="#" rel="noopener" target="_blank">Canva.com</a>, předáme vám sdílený přístup k šabloně nebo projektu v rámci vaší vlastní Canva licence. Podmínkou je, že disponujete aktivním Canva účtem (bezplatný i placený). Obsah v Canva zůstává editovatelný, takže si materiály můžete sami upravovat i po předání.</li>
<li><strong>Předání výstupů proběhne zasláním odkazu prostřednictvím e-mailu</strong> - nejčastěji přes Google Drive, Dropbox, Canva sdílení nebo jiný dohodnutý způsob. V případě tvorby webové stránky bude obsah stránky předán přesunutím na hosting a doménu uvedenou v objednávce.</li>
</ol>
</div>
</div></div></div><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6aef84f75c4aa" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6aef84f75c4aa" role="button"><i class="fa fa-plus" role="presentation"></i>Práva a povinnosti</a></h3><div aria-labelledby="toggle-button-6aef84f75c4aa" id="toggle-panel-6aef84f75c4aa" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<ol>
<li><strong>Pracujeme za dohodnuté ceny a podmínky</strong>. Slevy neposkytujeme. Pracujeme zdarma pouze na projektech, které nás zaujmou a inspirují.</li>
<li><strong>Důvěrnost komunikace:</strong> Vaše soukromí respektujeme. Veškeré informace, které nám poskytnete, považujeme za důvěrné a nesdílíme je s třetími stranami bez vašeho souhlasu. Vaše osobní údaje zpracováváme v souladu s nařízením GDPR. Podrobné informace o tom, jaké údaje zpracováváme, za jakým účelem, jak dlouho je uchováváme a jaká máte práva, najdete v našich <strong><a href="#">Zásadách ochrany osobních údajů</a></strong>.</li>
<li><strong>Propagace: </strong>Zhotovitel je oprávněn po dokončení díla uvádět objednatele mezi své reference a prezentovat vytvořené dílo pro účely vlastní propagace (např. na webových stránkách, sociálních sítích či v portfoliu).</li>
<li><strong>Odpovědnost:</strong> Neneseme žádnou odpovědnost za obsah na vašich stránkách. Za dodané materiály (fotografie, písma, atd.) nesete plnou právní odpovědnost (pokud nejsou předmětem tvorby), zejména pokud jde o autorská práva a ochranné známky.</li>
<li><strong>Termíny plnění:</strong> Veškeré termíny dodání díla nebo jeho jednotlivých částí jsou orientační. Zhotovitel je oprávněn tyto termíny přiměřeně prodloužit, zejména v důsledku změn zadání, prodlení objednatele při poskytování součinnosti, opakovaného připomínkování, nebo z jiných provozních či organizačních důvodů. Prodloužení termínu se nepovažuje za porušení smluvních povinností. Změny zadání požadované objednatelem po odsouhlasení návrhu mohou být zpoplatněny a mohou vést k prodloužení dohodnutého termínu.</li>
<li><strong>Ukončení spolupráce z naší strany:</strong> Jsme oprávněni spolupráci jednostranně ukončit zejména v případě, že budete opakovaně porušovat domluvené podmínky, neodborně nebo neúměrně zasahovat do díla, opakovaně a bezdůvodně požadovat změny nad rámec původního zadání, odmítat schvalovat jednotlivé fáze bez uvedení relevantního důvodu, nebo jiným způsobem bránit řádnému dokončení díla.</li>
<li><strong>Předání díla třetím stranám:</strong> Pokud objednatel předá rozpracované dílo třetí straně bez písemného souhlasu zhotovitele, je zhotovitel oprávněn spolupráci ukončit. V takovém případě nevzniká objednateli nárok na vrácení již uhrazených plateb.</li>
<li><strong>Finanční vypořádání:</strong> V případě ukončení spolupráce z jakékoliv strany nemá objednatel nárok na vrácení již uhrazených plateb. Tyto platby představují odměnu za dosud provedené práce a rezervaci kapacity zhotovitele.</li>
<li><strong>Neodvratitelné události:</strong> Pokud nastane válka, přírodní katastrofa nebo jiná neodvratná událost, domluvíme se na dalším postupu.</li>
<li><strong>Přerušení komunikace:</strong> Pokud dojde k přerušení komunikace na více než 30 dní, máme právo od společné dohody odstoupit.</li>
<li><strong>Odmítnutí převzetí díla:</strong> Pokud dílo odmítnete převzít, sdělte nám prosím konkrétní důvody a vady (technické či estetické) e-mailem do 30 dnů od předání díla. Prokazatelné vady díla odstraníme v přiměřené lhůtě po jejich oznámení. Odpovědnost za vady se řídí příslušnými ustanoveními občanského zákoníku.</li>
<li><strong>Sporové řešení:</strong> Tyto podmínky spolupráce se vztahují výhradně na smluvní vztahy mezi podnikateli. Veškeré spory řeší soudy v místě sídla Zhotovitele, podle § 89a Občanského soudního řádu.</li>
</ol>
</div>
</div></div></div><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6aef84f75c876" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6aef84f75c876" role="button"><i class="fa fa-plus" role="presentation"></i>Licence a autorská práva</a></h3><div aria-labelledby="toggle-button-6aef84f75c876" id="toggle-panel-6aef84f75c876" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<ol>
<li><strong>Originální grafika bez problémů s autorskými právy</strong> - Postaráme se o to, aby všechny grafické návrhy byly 100 % originální. Můžete se tedy soustředit na rozvoj svého podnikání, aniž byste se museli obávat problémů s autorskými právy.</li>
<li><strong>Vlastnictví díla</strong> - Veškeré grafické návrhy a realizace (dále jen „dílo“) zůstávají naším majetkem, dokud nebudou uhrazeny všechny vaše finanční závazky. Do té doby není dovoleno dílo ani jeho části používat či s nimi jakkoli nakládat.</li>
<li><strong>Poskytnutí licence</strong> - Po uhrazení celé částky za projekt poskytuje zhotovitel objednateli licenci k užití díla v rozsahu odpovídajícím účelu projektu, a to bez územního a časového omezení. Dodatečné poplatky za poskytnutí licence nepožadujeme.</li>
<li><b>Ochranná známka</b>- Licence k užívání díla nezahrnuje registraci ochranné známky, kterou však po dohodě můžeme zajistit.</li>
</ol>
</div>
</div></div></div><div class="toggle default" data-inner-wrap="true"><h3 class="toggle-title"><a aria-controls="toggle-panel-6aef84f75caa9" aria-expanded="false" class="toggle-heading" href="#" id="toggle-button-6aef84f75caa9" role="button"><i class="fa fa-plus" role="presentation"></i>Správa webu</a></h3><div aria-labelledby="toggle-button-6aef84f75caa9" id="toggle-panel-6aef84f75caa9" role="region"><div class="inner-toggle-wrap">
<div class="bsb_text_column bsb_content_element">
<ol>
<li><strong>Volitelná služba - Správa webu</strong> (údržba, aktualizace, technická podpora) se sjednává na období 12 měsíců.</li>
<li><strong>Všechny weby, které vytváříme, běží na hostingovém řešení</strong> využívajícím servery společnosti <a href="#" rel="noopener" target="_blank">Webglobe</a>. Tento hosting je plně přístupný i vám jako klientovi - máte tak plnou kontrolu nad svým webem i hostingem a můžete k němu kdykoliv přistupovat.</li>
<li><strong>Správu webu</strong> poskytujeme pouze v případě, že web běží na hostingovém řešení doporučeném nebo spravovaném zhotovitelem, protože jen tak můžeme garantovat rychlost, bezpečnost a spolehlivost.</li>
<li><strong>Cena je 1 000 Kč/měsíc za každý web.</strong> Platba probíhá předem za celé období. Při objednávce správy více webů si můžeme domluvit individuální ceny.</li>
<li><strong>V ceně nabízíme 2 hodiny technických prací měsíčně.</strong> Tyto hodiny můžete využít pouze v rámci daného měsíce, ale nevyužité hodiny se nepřevádí do následujícího měsíce.</li>
<li><strong>Správa webu zahrnuje:</strong>
<ul>
<li>Rychlou podporu - v 90 % případů začínáme pracovat na vyřešení situace do 1 hodiny.</li>
<li>Pravidelnou údržbu WordPress webu, webhostingu a PHP.</li>
<li>Pravidelné zálohování s možností bezplatné obnovy dat.</li>
<li>Aktualizace pluginů, šablon a jádra WordPressu.</li>
<li>Kontrolu funkčnosti odkazů a výkonu webu.</li>
<li>Pravidelné kontroly zabezpečení.</li>
<li>Bezplatné odstranění malware v případě napadení webu.</li>
<li>Notifikaci v případě výpadku služeb.</li>
<li>Telefonickou a e-mailovou podporu.</li>
</ul>
</li>
<li>Za funkčnost DNS záznamů ručíme jen tehdy, pokud jsme uvedeni jako technický správce domény.</li>
<li>Můžeme vám nabídnout i další služby nad rámec dohody, například doporučení ohledně změn v legislativě nebo technologické modernizace.</li>
</ol>
</div>
<div class="bsb_text_column bsb_content_element nejmensi">
<p>Tyto podmínky nabývají platnosti dnem 1. 1. 2025</p>
</div>
</div></div></div></div>
</div>
</div>
</div>
</div></div></div></div></div></div></div></div>

Blue Studio

Základ

Tlačítka

Obrázky

Navigace

Barvy

Typografie

Rozměry

Mezery a šířky

Rádiusy

Komponenty

Hlavička

Podmenu Služby

Mobilní menu

Patička

Úvod domovské stránky

Úvod služby

Úvod projektu

Úvod článku

Karty služeb

Postup v krocích

Ceník

Proč my

Časté dotazy

Studio a adresa

Nejnovější projekty

Loga klientů

Výpis článků

Výpis projektů

Případové studie

Další článek

Hodnocení klientů

Výzva k projektu

Odběr magazínu

Kontakt

Průběh konzultace

Balíčky ke stažení

Podmínky

Stránky ukázkového webu