/*
Theme Name: 	optyk-theme
Version: 		1.0
*/

* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

body {
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 17px;
    color: #1c244a;
    background: #f7f7f7;
    font-weight: 300;
}

.overflow {
    overflow: hidden;
    position: relative;
}

.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}

h1,
h2,
h3,
h4 {
    display: block;
    color: #0174ad;
    font-weight: 400;
    font-size: 30px;
    margin-bottom: 40px;
}

h2 span {
    font-size: 50px;
    font-weight: 800;
}

p {
    margin-bottom: 30px;
}

.center {
    width: 1157px;
    margin: 0 auto;
}

header {
    position: relative;
    z-index: 900;
}

header .top-bar .logo-box img {
    max-width: 200px;
}

.subpage-image {
    height: 25vw;
    background: url(images/header-sub.jpg) center center no-repeat;
    position: relative;
    background-size: cover;
}

body.okulary .subpage-image {
    background: url(images/header-sub2.jpg) center center no-repeat;
    background-size: cover;
}

body.soczewki .subpage-image {
    background: url(images/header-sub3.jpg) center center no-repeat;
    background-size: cover;
}

body.okulary-przeciwsloneczne .subpage-image {
    background: url(images/header-sub4.jpg) center center no-repeat;
    background-size: cover;
}

body.okulista .subpage-image,
body.page-id-354 .subpage-image {
    background: url(images/header-sub5.jpg) center center no-repeat;
    background-size: cover;
}

.subpage-image h2 span {
    font-size: 4rem;
    color: #fff;
}

.subpage-image {
    display: flex;
    justify-content: center;
    align-items: center;
}

header h2 span {
    font-size: 75px;
}

header img.hand {
    width: 850px;
    position: absolute;
    left: 0;
    bottom: 10vh;
    z-index: 500;
}

header .word {
    position: absolute;
    font-size: 100px;
    color: #3f4e95;
    z-index: 500;
}

header .word.one {
    font-weight: 800;
    left: 49vw;
    top: 35vh;
}

header .word.two {
    color: #7caf01;
    left: 57vw;
    top: 46vh;
}

header .word.tree {
    color: #e89901;
    left: 57vw;
    top: 57vh
}

header .top-bar {
    position: relative;
    z-index: 900;
    padding-left: 4vw;
    padding-right: 4vw;
}

header .logo-box {
    float: left;
    width: 20%;
    position: relative;
}

header .logo-box h1 {
    position: absolute;
    top: -999px;
}

header .logo-box a {
    display: block;
    text-decoration: none;
    color: #fff;
    font-weight: 800;
    font-size: 50px;
    padding-left: 35px;
    margin-top: 10px;

}

header nav {
    float: left;
    width: 70%;
    text-align: right;
    position: relative;
}

/*

nav ul {
    list-style: none;
}

nav a {
    color: #3f4e95;
    text-decoration: none;
}

nav ul li {
    display: inline-block;
}

nav ul li a {
    display: block;
    padding: 35px 22px;
    font-weight: 600;
}

nav ul li.catalog a {
    color: #e89901;
}

nav ul li.current_page_item a,
nav ul li a:hover,
.navbar-content ul li.current_page_item a,
nav ul li.current-page-ancestor a {
    background: #0174ad;
    color: #fff;
}

*/
nav#rbxNav ul.menu li ul.sub-menu,
.gallery .item .imgLiquidFill {
    -webkit-transition: all 300ms ease-out;
    -moz-transition: all 300ms ease-out;
    -ms-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    transition: all 300ms ease-out;
}

nav#rbxNav ul {
    list-style: none;
}

nav#rbxNav ul.menu {
    display: flex;
}

nav#rbxNav ul.menu li {
    flex-grow: 1;
    position: relative;
}

nav#rbxNav ul.menu li ul.sub-menu {
    position: absolute;
    left: 0;
    background: #0174ad;
    display: none;
}

nav#rbxNav ul.menu li a {
    display: block;
    padding: 35px 0;
    text-align: center;
    text-decoration: none;
    color: #1f1f1f;
    font-weight: 600;
}

nav#rbxNav ul.menu li ul.sub-menu li a {
    padding: 20px 35px;
    text-align: left;
    color: #fff;
}

nav#rbxNav ul.menu li a:hover,
nav#rbxNav ul.menu li.current-menu-item a,
nav#rbxNav ul.menu li.current-menu-ancestor a,
nav#rbxNav ul.menu li.current-menu-parent a {
    background: #0174ad;
    color: #fff;
}

nav#rbxNav ul.menu li:hover ul.sub-menu {
    display: inline-block;
}

nav#rbxNav ul.menu li ul.sub-menu li a:hover {
    background: #1f1f1f;
}

nav#rbxNav ul.menu ul.sub-menu li a:hover,
nav#rbxNav ul.menu ul.sub-menu li.current-menu-item a,
nav#rbxNav ul.menu ul.sub-menu li.current-menu-ancestor a {
    background: #1f1f1f;
    color: #fff;
}

header .lang-module {
    float: left;
    width: 10%;
    padding-top: 30px;
}

header .lang-module a {
    text-decoration: none;
}

header .lang-module img {
    display: inline-block;
    width: 40px;
    margin-left: 5px;
}

section.aboutus-module {
    position: relative;
    z-index: 1;
}

section.aboutus-module .txt {
    -moz-column-count: 2;
    -moz-column-gap: 40px;
    -webkit-column-count: 2;
    -webkit-column-gap: 40px;
    column-count: 2;
    column-gap: 40px;
    text-align: justify;
    margin-bottom: 30px;
}

section.aboutus-module .inside {
    width: 66.6666%;
}

.more-box {
    text-align: center;
    padding: 50px 0;
}

body.home .more-box {
    text-align: right;
    padding: 0;
}

a.more-button,
span.button {
    background: #1f1f1f;
    font-size: 16px;
    color: #fff;
    text-decoration: none;
    padding: 18px 35px;
}

a.more-button:hover,
span.button:hover {
    background: #0174ad;
    color: #fff;
}

.txt {
    line-height: 150%;
}

.txt ul {
    margin-left: 50px;
}

section {
    margin-bottom: 80px !important;
}

section.atut-module {
    background: #0174ad url(images/atut-bg.jpg) 50% 50% no-repeat;
    background-attachment: fixed;
    padding: 50px 0;
    position: relative;
    z-index: 2;
    overflow: hidden;
}

section.atut-module .center {
    position: relative;
}

section.atut-module .item,
section.contact-module .item {
    float: left;
    width: 33.3333%;
    color: #fff;
    text-align: center;
    padding: 0 40px;
    position: relative;
    z-index: 4;
}

section.atut-module .item img {
    max-width: 130px;
}

section.atut-module .item h3 {
    font-weight: 700;
    margin-bottom: 20px;
    color: #fff;
    font-size: 25px;
}

main {
    padding-top: 40px;
}

section.offer-module {
    position: relative;
}

section.offer-module .offer-list {
    position: relative;
    z-index: 2;
}

section.offer-module .offer-list .item {
    float: left;
    width: 48%;
    margin-bottom: 20px;
    background: #e9edf0;
    position: relative;
}

section.offer-module .offer-list .item:first-child {
    background: none;
    padding: 0 40px;
}

section.offer-module .offer-list .item:nth-child(2n) {
    margin-right: 0;
}

section.offer-module .offer-list .item:nth-child(4) {
    width: 48%;
    margin-right: 2%;
    margin-left: -2%;
}

section.offer-module .offer-list .item h3 {
    font-weight: 800;
    font-size: 40px;
    line-height: 40px;
    padding-top: 40px;
    position: relative;
    z-index: 2;
}

section.offer-module .offer-list .item h3 span {
    font-size: 20px;
    font-weight: 400;
}

section.offer-module .offer-list .item h3 {
    color: #0174ad;
}

section.offer-module .offer-list .item:nth-child(2) h3,
section.offer-module .offer-list .item:last-child h3 {
    color: #1a1a1a;
}

section.offer-module .item img {
    display: block;
    width: 100%;
}

section.offer-module .item .name {
    position: absolute;
    bottom: 50px;
    left: 40px;
}

section.offer-module .item a.more-button {
    position: relative;
    z-index: 2;
}

section.catalog-module {
    background: #3f4e95 url(images/catalog-bg.jpg) 50% 50% no-repeat;
    background-attachment: fixed;
    padding: 40px 0;
    color: #fff;
    margin-bottom: 140px !important;
}

section.catalog-module .img-box,
section.catalog-module .inside {
    float: left;
    width: 48%;
}

section.catalog-module .img-box {
    margin-right: 4%;
    position: relative;
    min-height: 50px;
}

section.catalog-module .img-box img {
    position: absolute;
    width: 500px;
    left: 50px;
}

section.catalog-module .inside {
    padding: 40px;
}

section.catalog-module h2 {
    color: #fff;
    margin-bottom: 15px;
}

section.catalog-module .txt {
    margin-bottom: 40px;
}

section.catalog-module a.more-button {
    color: #fff;
    border-color: #fff;
}

section.catalog-module a.more-button:hover {
    background: #fff;
    color: #3f4e95;
}

section.contact-module .item {
    color: #1c244a;
}

footer .copyright-box {
    border-top: 1px solid #d2d5e3;
    padding: 15px 40px;
    font-size: 14px;
}

footer a {
    color: #1c244a;
    text-decoration: none;
}

footer .copyright-box span:first-child {
    float: left;
}

footer .copyright-box span:last-child {
    float: right;
}

footer .copyright-box a:hover {
    text-decoration: underline;
}

.frame {
    border: 25px solid #cccccc;
    position: absolute;
    width: 500px;
    height: 500px;
}

section.aboutus-module .frame {
    right: -175px;
    bottom: -110px;
}

section.atut-module .frame {
    border-color: #30799d;
    top: -80px;
    right: -175px;
    height: 200px;
    z-index: 3;
}

section.offer-module .frame {
    top: -550px;
    left: -400px;
    height: 650px;
}

main.subpage section.offer-module .frame {
    top: 175px;
}

a.more-button,
nav ul li a,
nav ul li a,
.news-module-rbx .list .item .img-box .inside {
    -webkit-transition: all 300ms ease-out;
    -moz-transition: all 300ms ease-out;
    -ms-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    transition: all 300ms ease-out;
}

a.arrow,
a.fb {
    position: absolute;
    bottom: 3vh;
    right: 4vw;
    z-index: 1200;
}

a.arrow img,
a.fb img {
    width: 40px;
}

a.fb {
    top: 3vh;
}

section.product-box h3 {
    border-bottom: 1px solid #d2d5e3;
    padding: 20px 40px;
}

section.product-box .products-list .item {
    float: left;
    display: block;
    width: 22%;
    margin-right: 4%;
    text-align: center;
    text-decoration: none;
}

section.product-box .products-list .item:nth-child(4n) {
    margin-right: 0;
}

section.product-box .products-list .item .img-box {
    height: 275px;
    background: #e9edf0;
    overflow: hidden;
}

section.product-box .products-list .item h4 {
    font-size: 17px;
    font-weight: 300;
    border-bottom: 1px solid #d2d5e3;
    height: 50px;
    line-height: 50px;
    overflow: hidden;
}

main.category section {
    margin-bottom: 0 !important;
}

.category-nav {
    border-top: 1px solid #d2d5e3;
    padding: 20px 40px;
    margin-bottom: 80px;
}

.category-nav nav {
    float: left;
    width: 80%;
}

.category-nav nav ul li a {
    padding: 15px 20px;
}

.category-nav nav ul li a:hover,
.category-nav nav ul li.current-menu-item a {
    color: #1c244a;
}

.category-nav .back {
    float: left;
    width: 20%;
    padding-top: 15px;
    text-align: right;
}

#map {
    height: 500px;
    overflow: hidden;
}

#map iframe {
    width: 100%;
    height: 100%;
}

main.subpage {
    padding-top: 80px;
    padding-bottom: 80px;
}

body.kontakt main.subpage {
    padding-bottom: 0;
}

.hidden {
    opacity: 0;
}

.visible {
    opacity: 1;
}

.error {
    text-align: center;
    padding-bottom: 80px;
}

.imgLiquidFill {
    width: 100%;
    height: 100%;
}

section.aboutus-module.two {
    margin-bottom: 0px !important;
}

/* ----- MOBILE NAV ----- */

.navbar {
    display: none;
    position: absolute;
    top: 30px;
    right: 15vw;
    width: 50px;
    height: 45px;
    z-index: 2000;
    cursor: pointer;
}

.bar1,
.bar2,
.bar3 {
    width: 100%;
    height: 6px;
    margin-bottom: 6px;
    background-color: #202328;
    transition: all 0.3s ease-in-out;
}

.navbar-on .bar1,
.navbar-on .bar2,
.navbar-on .bar3 {
    background: #fff;
}

.navbar-on .bar1 {
    transform-origin: 10% 60%;
    transform: rotate(45deg);
}

.navbar-on .bar3 {
    transform-origin: 20% 80%;
    transform: rotate(-45deg);
}

.navbar-on .bar2 {
    background-color: transparent;
}

.navbar-content {
    position: fixed;
    background: rgba(32, 35, 40, 0.98);
    width: 100vw;
    height: 100vh;
    z-index: 800;
    display: none;
}

.navbar-content ul.menu {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100vh;
    align-content: center;
    justify-content: center;
    list-style: none;
    font-weight: 800;
    text-transform: uppercase;
}

.navbar-content ul.menu li {
    flex-basis: 10%;
    text-align: center;
}

.navbar-content ul.menu li a {
    display: block;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    padding: 15px 0;
    border-top: 1px solid #fff;
}

.navbar-content ul li.current-menu-item a,
.navbar-content ul li.current-page-ancestor a {
    color: #7cdc3d;
}

.navbar-content ul.menu li ul.sub-menu {
    display: none;
}

.navbar-content ul.menu li:hover ul.sub-menu {
    display: block;
}

section.aboutus-module {
    padding: 40px 0;
}

.news-module-rbx .list {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.news-module-rbx .list .item {
    flex-basis: 31.333333%;
    margin-bottom: 50px;
    margin-left: 1%;
    margin-right: 1%;
}

.news-module-rbx .list .item .img-box {
    height: 30vh;
    position: relative;
    overflow: hidden;
}

.news-module-rbx .list .item .img-box .inside {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
}

.news-module-rbx .list .item .img-box:hover .inside {
    opacity: 1;
}

.news-module-rbx .list .item h3 {
    margin: 20px 0;
    font-size: 1rem;
}

.news-module-rbx .list .item h3 a {
    font-weight: 600;
    text-decoration: none;
    font-size: 1.5rem;
    color: #0174ad;
}

.salon-block h2 {
    text-align: center;
}

.head-salon,
.salony-block {
    display: flex;
}

.head-salon {
    border: 1px solid #0174ad;
}

.head-salon .left,
.head-salon .right {
    flex-basis: 50%;
}

.head-salon .right {
    height: 350px;
    overflow: hidden;
}

.head-salon .right iframe,
.salony-block .item .map iframe {
    width: 100%;
    height: 100%;
}

.head-salon .left {
    background: #0174ad;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.head-salon .left a {
    color: #fff;
}

.salony-block {
    padding: 50px 0;
    justify-content: space-between;
}

.salony-block .item {
    flex-basis: 23%;
    text-align: center;
}

.salony-block .item .txt span {
    font-size: 2rem;
    font-weight: 700;
    color: #0174ad;
}

.salony-block .item:nth-child(2n) .txt span {
    color: #1f1f1f;
}

.salony-block .item .map {
    height: 350px;
    border: 1px solid #0174ad;
    overflow: hidden;
}

.salony-block .item:nth-child(2n) .map {
    border-color: #1f1f1f;
}

main.subpage.contact {
    margin-bottom: 0;
}

body.page-id-10 main.subpage {
    padding-bottom: 0;
}

.logos-block,
.logos-gallery {
    padding: 50px 0;
    background: #e9edf0;
    margin-bottom: 80px;
}

.owl-carousel .owl-item img {
    width: 90%;
}

strong {
    font-weight: 600;
}

.logos-gallery .inside {
    display: flex;
    flex-wrap: wrap;
}

.logos-gallery .item {
    flex-basis: 25%;
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
}

.logos-gallery .item img {
    width: 60%;
}

.gallery {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    justify-content: center;
    padding: 100px;
    background: #e9edf0;
    margin-top: 80px;
}

.gallery .item {
    flex-basis: 32%;
    margin-bottom: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: #f7f7f7;
    background-position: center center;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

.gallery .item {
    height: 15vw;
    margin-left: 0.66%;
    margin-right: 0.66%;
    margin-bottom: 25px;
}

.gallery .item .imgLiquidFill {
    opacity: 0.5;
}

.gallery .item:hover .imgLiquidFill {
    opacity: 1;
}

.gallery .item .inside {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 999;
}

.txt a {
    font-weight: 700;
    text-decoration: underline;
    color: #0174ad;
}

.subpage.salony .txt {
    font-size: 1.5rem;
}

#slideshow {
    position: relative;
    overflow: hidden;
}

#slideshow .motto {
    position: absolute;
    text-align: right;
    right: 15vw;
    bottom: 8vw;
    z-index: 1000;
    color: #0174ad;
}

#slideshow .motto .first {
    font-size: 7rem;
    font-weight: 800;
    color: #fff;
}

#slideshow .motto .line {
    display: inline-block;
    width: 300px;
    height: 5px;
    background: #fff;
    margin: 20px 0;
    color: #fff;
}

#slideshow .motto .last {
    font-size: 2rem;
    font-weight: 600;
    color: #fff;
}

main.subpage .news-module-rbx {
    margin-bottom: 0 !important;
}

#slideshow .ins-mobile {
    display: none;
}

#main-nav {
    display: none;
}

.moby-menu nav ul.menu {
    display: block;
}

section.news-module-rbx {
    margin-bottom: 0px !important;
}

body.home section.aboutus-module p {
    margin-bottom: 0;
}
