@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,600i,700,800&subset=latin-ext');

:root {
  --color-primary: #2d7da2;
  --color-primary-light: #54a9d0
}

html {
  font-size: 16px;
}
@media(max-width: 768px) {
  html {
    font-size: 16px;
  }
}


body.custom-background {background-color: #fff !important}
html {height: 100%}
body {min-height: 100%; position: relative}
footer {position: absolute; bottom: 0; left: 0; right: 0;}
#main {padding-bottom: 50px;}


h1, h2, h3, h4, h5, h6, a, p {  font-family: 'Open Sans';}
h1, .h1 {font-size: 2rem}
h2, .h2 {font-size: 1.75rem}
h3, .h3 {font-size: 1.5rem}
h4, .h4 {font-size: 1.125rem}
h5, .h5 {font-size: 1rem}
h6, .h6 {font-size: 1rem} 

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5 {
  font-weight: 700;
  text-align: 1.2
}

h1, h2 {
  text-transform: uppercase;
}
body.home h1 > span, h2, h3 {
  color: var(--color-primary)
}



p, a {
  font-size: 1rem;
}

a {color: var(--color-primary); font-weight: 600; transition: 0.2s;}
a:hover {color: var(--color-primary-light)}

.text-white, .text-white * {
  color: white;
  text-shadow: 2px 2px 2px black;
}

/*  ==== BUTTONY ==== */


/*  ======== HEADER ========  */
/*	Tekst na sliderze	*/
#featured-slider .slider-title-head a, #featured-slider .entry-content p {
	font-weight: bold;
  text-shadow: 0px 0px 5px black, 0px 0px 5px black, 0px 0px 5px black;
}
#featured-slider .slider-title-head a {font-size: 40px; line-height: 1.2}
#featured-slider .entry-content p {font-size: 24px; line-height: 1.2}

@media(max-width: 768px) {
  #featured-slider .entry-description-container {display: none}
}

/*	Header	*/

#header-logo-image img {
  margin-bottom: 0px;
  max-width: 400px;
  padding: 10px 0;
}
#header-text-nav-container {box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5)}
#header-text-nav-wrap {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 10px 0;
}

@media(max-width: 768px) {
  #header-text-nav-wrap {flex-direction: column; justify-content: center;}
  #header-left-section {margin: auto;}
}

@media(max-width: 640px) {#header-logo-image img {max-width: 200px;}}

#header-left-section {
  margin-right: auto;
}

#site-navigation ul#menu-main-menu > li.menu-item a {
  padding: 20px;
}

#site-navigation ul#menu-main-menu > li.current-menu-item a {
  font-weight: 600;
}

/* ======== MENU ========*/
#site-navigation ul#menu-main-menu > li.menu-item > a {color: #000; transition: all 0.3s; position: relative; text-transform: uppercase}
#site-navigation ul#menu-main-menu > li.menu-item > a::after {
  content: '';
  width: 0;
  height: 3px;
  position: absolute;
  bottom: 5px;
  left: 50%;
  background: #227cca;
  transition: all 0.3s;
}

#site-navigation ul#menu-main-menu > li.menu-item > a:hover:after,
#site-navigation ul#menu-main-menu > li.current-menu-item > a::after{
  left: 10%;
  width: 80%;
}

#site-navigation ul#menu-main-menu > li.current-menu-item > a {font-weight: bold;}


/*  ======== SEKCJA Z BOXAMI ======== */
#box-section .box-cell h3, 
#box-section .box-cell p {
  color: #fff; 
  display: flex;
  align-items: center;
  justify-content: flex-start
}
#box-section .box-cell h3 {height: 82px; text-transform: uppercase;}
#box-section .box-cell p {height: 75px; font-size: 16px; font-weight: 600}

#box-section .box-cell span.box {
  display: block;
  border-top: 1px solid #000;
  padding: 3px 0;
}
#box-section .box-cell span.box:hover {border-top: 1px solid #000}

#box-section .box-cell a {
  background: #fff;
  color: #000;
  position: relative;
  padding: 3px 20px;
  box-sizing: border-box;
  transition: 0.25s;
}

#box-section .box-cell a::after {
  content: '';
  position: absolute;
  height: 100%;
  width: 5px;
  top: 0;
  left: 100%;
  border-style: solid;
  border-width: 28px 15px 0px 0px;
  border-color: #fff transparent transparent;
  transition: 0.25s;
}

#box-section .box-cell a:hover:after {
  width: 25px;
  border-color: #e1e1e1 transparent transparent;
}

#box-section .box-cell a:hover {background: #e1e1e1;}


/*  ======== FOOTER ========  */
.footer-socket-wrapper {padding: 15px 0; background: #000; box-shadow: 0 -3px 5px rgba(0, 0, 0, 0.5); border-top: solid 5px var(--color-primary);}
.footer-socket-wrapper * {
  color: #fff !important;
  font-size: 12px;
}

/*  ======== DEV ======== */

.soua-main > .soua-accordion > a.soua-accordion-title > div {
    background: var(--color-primary);
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 26px;
    text-shadow: 2px 2px 2px black;
    border-radius: 10px 10px 50% 50%;
    padding-bottom: 25px;
    box-shadow: 0px 7px 5px -4px rgba(0, 0, 0, 0.85);
    margin-bottom: 15px;
    transition: 0.2s;
}

.soua-main > .soua-accordion > a.soua-accordion-title > div:hover {background: var(--color-primary-light)}
.soua-main > .soua-accordion > a.soua-accordion-title > div:active {transform: translateY(4px); box-shadow: 0 0 0 0;}
.soua-main > .soua-accordion > a.soua-accordion-title.active > div {    height: 70px;
    border-radius: 10px 10px 20% 20%;
    padding-bottom: 10px;
}

.header-post-title-container > div {display: none;}

#gallery-2 img {
  padding: 10px;
  background: #fff;
  box-shadow: 0 0 5px black;
  transition: 0.2s
}

#gallery-2 img:hover {
  background: #333;
  padding: 3px;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.6);
}

#gallery-2 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#wpcf7-f5-p8-o1 > form > p:nth-child(6){float:left; margin-right:5px;}