@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,300i,400,400i,500,500i,700,700i&subset=latin-ext');


input:focus, select:focus, textarea:focus, button:focus, *:focus {outline: none;}
input[type=email], input[type=text], input[type=password], textarea, .select-wrapper {color: #717171; font-size: 14px; font-family: 'Roboto'; font-weight: 300;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; line-height: normal; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {height: 100%; margin: 0; width: 100%; overflow-x: hidden;}
blockquote, q {quotes: none; }
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
html, body {margin: 0; padding: 0; font-family: 'Roboto', sans-serif; font-size: 14px; color: #464249; font-weight: 300;}
body {background: #fff;}
a, p, li, span, h1, h2, h3, td {font-size: 14px; color: #464249; text-decoration: none; font-weight: 300; font-family: 'Roboto', sans-serif; line-height: 150%;}
.clear {clear: both; float: none;}
.col-left {float: left;}
.col-right {float: right;}
.wrapper {max-width: 96%; margin: 0 auto; padding: 0 2%; width: 1200px;}
strong {font-weight: 600;}
sup {font-size: 10px; vertical-align: top;}
h2 {font-size: 16px; font-family: 'Roboto'; text-transform: uppercase;}
h3 {font-size: 24px; font-family: 'Roboto'; text-transform: uppercase;}

::-webkit-input-placeholder {color: #717171;}
:-moz-placeholder {color: #717171; opacity:  1;}
::-moz-placeholder {color: #717171; opacity: 1;}
:-ms-input-placeholder {color: #717171;}

.header {
    background: #464249;
    padding: 20px 0;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
    position: fixed;
    top: 40px;
    left: 0;
    right: 0;
    z-index: 99;
}
.header .logo {width: 15%;  line-height: 0;}
.header .logo a {background: url('/assets/images/logo_meysztowicz.svg') no-repeat center center; width: 115px; height: 110px; display: inline-block;  -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;}
.header .menu {width: 80%; text-align: center; padding-top: 80px; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;}
.header .menu li {list-style: none; display: inline-block; margin: 0 25px;}
.header .menu li a {text-transform: uppercase;}

.header.top {
    position: fixed;
    top: 0;
}
.header.top .menu {width: 80%; text-align: right; padding-top: 75px;}
.header.top .menu li a {font-size: 14px;}
.header.top .logo a {background: url('/assets/images/logo_meysztowicz_sign.svg') no-repeat center center; width: 76px; height: 92px;}
.header.top .wrapper {width: 1200px;}

.header .languages li {display: block; list-style-type: none; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;}
.header .languages li a {color: #ffffff; font-size: 16px; text-transform: uppercase;}
.header .languages li.active a {font-weight: 500;}
.header .col-right {padding-top: 56px;}

.header.top .languages {width:5%; text-align: right;}
.header.top .languages li a {color: #ffffff; font-size: 14px; text-transform: uppercase;}
.header.top .languages li.active a {font-weight: 500;}
.header.top .col-right { padding-top: 54px;}

.main-img {
    background: url('/assets/images/mainImg.jpg') no-repeat center center;
    height: 590px;
    background-size: 100% auto;
    margin-top: 150px;
    box-shadow: inset 0 -5px 15px rgba(0,0,0,0.3);
}

.main-img-2 {
    background: url('/assets/images/mainImg.jpg') no-repeat center top;
    height: 250px;
    background-size: 100% auto;
    margin-top: 150px;
    box-shadow: inset 0 -5px 15px rgba(0,0,0,0.3);
}

@media screen and (max-width: 1600px){
    .main-img {background-size: auto 100%;}
}

@media screen and (max-width: 1300px){
    .main-img {height: 500px;}
}

@media screen and (max-width: 1000px){
    .main-img {height: 400px;}
}

@media screen and (max-width: 800px){
    .main-img {height: 300px;}
}

@media screen and (max-width: 600px){
	.main-img-2 {background-size: auto 100%;}
}

.content #about {padding: 120px 0 0; text-align: center;}
.content #about .wrapper {width: 890px;}
.content #about h1 {text-transform: uppercase; font-weight: 200; font-size: 40px; line-height: 110%;}
.content #about h1 span {color: #cccccc; font-size: 40px; display: block; font-weight: 200; line-height: 110%;}  .content #about p {line-height: 200%; text-align: justify; padding: 15px 0;}

.content #people .wrapper {width: 1200px;}
.content #people {background: url('/assets/images/cracowBg.jpg') no-repeat center center; margin-top: 40px; padding: 50px 0;}
.content #people .col:first-child {width: 30%; line-height: 0; padding: 0;}
.content #people .col {width: 38%; vertical-align: top; display: inline-block;}
.content #people .col:nth-child(3) {width: 20%; float: right;}
.content #people h2 {font-size: 24px; line-height: 120%;}
.content #people h2 strong {display: block; font-weight: 500;}
.content #people .col:nth-child(2) p {line-height: 180%; padding-top: 25px; font-weight: 400; text-align:justify;}
.content #people .col:nth-child(2) p strong, .content #people .col:nth-child(2) p strong a {font-weight: 500;}
.content #people .col:nth-child(3) p {text-transform: uppercase; font-size: 18px; line-height: 110%;}
.content #people .col:nth-child(3) img {margin-bottom: 5px;}
.content #people .col:nth-child(3) p span {color: #898989;}
.content #people .col:nth-child(3) > .col-right > div:nth-child(2) {margin-top: 10px;}

.content #questions {padding: 120px 0 120px 0; margin: 0 auto;}
.content #questions h2 {text-transform: uppercase; font-weight: 200; font-size: 40px; line-height: 110%; margin-bottom: 60px;  text-align: center;}
.content #questions #accordion .accordion-title {font-size: 18px; font-weight: 300; margin: 10px 0 0 0; padding: 0.25em 1em; padding-left: 25%;}
.content #questions #accordion .ui-accordion-header-active{color: #ffb74d;-webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;}
.content #questions #accordion .ui-accordion-header-collapsed{color: #464249;-webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;}
.content #questions #accordion .accordion-box {padding: 0.25em 0.5em 0.25em 2.5em; text-align: justify; padding-left: 28%; padding-right:24%;}

#content ul {list-style-type: disc; padding-left: 20px; color: #ffb74d !important; margin-bottom: 0px;}
#content ul li {padding-bottom: 0px; margin-bottom: 0px; margin-top: 0px; padding-top: 0px;}

.footer #copy {background: #111; padding: 10px 0; text-align: center;}
.footer #copy p, .footer #copy span {font-size: 10px; text-transform: uppercase; color: #fff; letter-spacing: 2px;}
.footer #copy span {color: #ffb74d;}

.footer #map-iframe {height: 460px; width: 100%; position: absolute; top: 0; left: 0;}
.footer #contact {position: relative; top: 0; left: 0; height: 460px;}
.footer #contact .text-box {float: right; position: relative; z-index: 9; background: #fff; padding: 30px; margin-top: 105px;}
.footer #contact .text-box h3 {color: #c2c2c2; font-size: 18px; line-height: 120%; padding-bottom: 20px; letter-spacing: 1px;}
.footer #contact .text-box p {padding: 2px 0;}


.content-not h1 {text-transform: uppercase; font-weight: 200; font-size: 40px; line-height: 110%; margin-bottom: 25px;  text-align: center;}

.subpage-content .section {padding: 60px 0 100px;}
.subpage-content .section .wrapper {width: 890px;}
.subpage-content .section h1 {text-transform: uppercase; font-weight: 200; font-size: 40px; line-height: 110%; margin-bottom: 25px;  text-align: center;}
.subpage-content .section a, .subpage-content .section p, .subpage-content .section li {line-height: 200%; padding: 5px 0; text-align: justify;}
.subpage-content .section a:hover {text-decoration: underline;}
.subpage-content .section p {padding: 10px 0;}


.section#contact .col-left, .section#contact .col-right {width: 46%;}
.subpage-content #contact.section h1 {margin-bottom: 50px;}
#contact.section h2 {text-transform: uppercase; font-weight: 200; font-size: 20px; line-height: 130%; margin-bottom: 30px;}
#contact.section h2 span {text-transform: uppercase; font-weight: 200; font-size: 20px; line-height: 130%; color: #cccccc;}
#contact>.wrapper{display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}
#contact h1{width: 100%}

.subpage-content #contact.section .message-box-success, .subpage-content #contact.section .message-box-error {
    background: #bdccbd;
    padding: 10px;
    margin-top: 15px;
    text-align: center;
    font-weight: 400;
}
.subpage-content #contact.section .message-box-error {
    background: #ddaaaa;
}

.subpage-content #contact.section a {padding: 0;}
.subpage-content #contact.section p {padding: 0;}
.subpage-content #contact.section .col-left-2, .subpage-content #contact.section .col-right-2 {padding-top: 40px;}
/*.subpage-content #contact.section .phone-icon {display: inline-block; vertical-align: -18px; margin-right: 15px;}
.subpage-content #contact.section .mail-icon {display: inline-block; vertical-align: -9px; margin-right: 15px;}
.subpage-content #contact.section .phone_number2 {padding-left: 47px;}*/

.subpage-content #contact.section form input {display: block; width: 96%; padding: 0 2%; height: 35px; border: 1px solid #c2c2c2; margin: 4px 0; display: block;}
.subpage-content #contact.section form textarea {display: block; width: 96%; padding: 10px 2%; height: 138px; border: 1px solid #c2c2c2; margin: 4px 0; display: block;}
.subpage-content #contact.section form button {background: #464248; border: 0; color: #fff; text-transform: uppercase; padding: 7px 30px; font-size: 14px; font-family: 'Roboto'; font-weight: 300; margin-right: -1px; cursor: pointer;}
.subpage-content strong {font-weight: 500;}
.subpage-content #contact.section .wifi {margin-top: 30px; text-align:center;}
.subpage-content #contact.section .wifi p{text-align:center;}

.popup-wrapper{transition: 1s cubic-bezier(0.250, 0.460, 0.450, 0.940); position: fixed; left: 0; top: 0; bottom: 0; right: 0; background-color: rgba(0,0,0,0.5); z-index: 1000;}
.popup-wrapper .popup-content{transition: 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940); box-sizing: border-box; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 630px; height: 480px; background-color: #fff; text-align: center; padding: 30px 30px 45px 30px;}
.popup-wrapper .popup-content .close-button{cursor: pointer; width: 60px; height: 60px; border: 1px solid #cca454; position: absolute; right: 0; top: -1px; display: flex; align-items: center; justify-content: center}
.popup-wrapper .popup-content .text-wrapper p{color: #464249; font-size: 18px; font-weight: 100;}
.popup-wrapper .popup-content .text-wrapper .color{font-size: 36px; color: #cca454; font-weight: 100;}
.popup-wrapper .popup-content .text-wrapper .uppercase{font-size: 36px; font-weight: 100; text-transform: uppercase;}
.popup-wrapper.fade{opacity: 0; transition: 1s cubic-bezier(0.250, 0.460, 0.450, 0.940); visibility: hidden;}
.popup-wrapper.fade .popup-content{opacity: 0; transform: translate3d(-50%, -30%, 0); transition: 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940);}

.g-recaptcha{margin: 10px 0;}

.rodo{padding-top:50px}
.rodo ol{list-style-position: inside;}
.rodo li{padding: 2px 0 !important}
.rodo li,.rodo p, .rodo li a{font-size: 11px; line-height: 140% !important;}

.pay-cards img{margin-right: 5px;}

@media screen and (max-width: 1200px){
    .content #people .col:first-child img {margin-left: 0; max-width: 100%;}
    .content #people .col:nth-child(3) {margin-top: 0;}
    .content #people .col:nth-child(2) p {max-width: 100%; margin-left: 0;}
    .header .menu {text-align: right; width: 80%;}
    .header .menu li {margin: 0 7px;}
    .content #people .col:first-child {width: 35%;}
}

@media screen and (max-width: 1000px){
    .content #about {padding-top: 80px;}
	.content #questions {width: 700px; padding: 80px 2%; max-width: 96%; margin: 0 auto;}
	.content #questions h2 {text-align: center;text-transform: uppercase; font-weight: 200; font-size: 24px; line-height: 110%; margin-bottom: 25px;}
	.content #questions #accordion .accordion-title {padding-left: 5%; font-size:18px;}
	.content #questions #accordion .accordion-box {padding-left: 10%;padding-right:0;}
    .content #people {padding: 30px 0 20px;}
    .content #people .col:first-child img {max-width: 100%; margin: 0;}
    .content #people .col:nth-child(2) p {padding-top: 20px;}
    .content #people .col:first-child {width: 25%; padding: 0;}
    .content #people .col:nth-child(2) {width: 70%; padding: 0;}
    .content #people .col:nth-child(2) {padding-left: 4%;}
    .content #people .col:nth-child(3) .col-right > div {display: inline-block; vertical-align: top; width: auto;  text-align: center;}
    .content #people .col:nth-child(3) > .col-right > div:nth-child(2) {margin-top: 0; margin-left: 20px;}
    .content #people .col:nth-child(3) {width: 100%; margin-top: 20px;}
	.header .menu li a {font-size: 14px;}
	.subpage-content #contact.section .full-width div {margin-top: 60px;font-size: 16px; line-height:80px;}
	.subpage-content #contact.section .full-width img {max-height:80px;}
	.header .col-right {padding-top: 56px;}
	.header.top .col-right {padding-top: 52px;}
	.header.top .languages li a, .header .languages li a  {font-size: 15px; padding-right: 3px;}
}

@media screen and (max-width: 760px){
	.section#contact .col-left, .section#contact .col-right{width: 100%; margin-top:10px}
    .footer #copy p, .footer #copy span {letter-spacing: 1px}
    .footer #map-iframe {position: relative; height: 300px;}
    .footer #contact {height: auto;}
    .footer #contact .text-box {float: none; margin: 20px auto; padding: 20px;}
    .content #people .col, .content #people .col:first-child, .content #people .col:nth-child(2), .content #people .col:nth-child(3) {width: 100%; float: none; display: block; padding: 0; margin: 0;}
    .content #people .col:first-child img {margin: 0 auto; max-width: 100%; display: block;}
    .content #people {background: none;}
    .content #people .col:nth-child(2) {background: url(/assets/images/cracowBg.jpg) no-repeat center center; padding: 30px; width: auto;}
    .content #people .col:nth-child(2) p:last-child {padding: 20px 0 0; padding-top: 0 !important;}
    .content #people .col:nth-child(2) p {text-align: justify;}
    .content #people .col:nth-child(3) .col-right {float: none; padding: 20px 0; text-align: center;}
    .content #people .wrapper {padding: 0; max-width: 100%;}
    .content #about h1, .content #about h1 span {font-size: 32px;}
    .content #about {padding: 30px 0;}  .content #people .col:nth-child(3) img {max-width: 100%;}
    .content #people .col:nth-child(3) p {font-size: 16px;}
    .menu > ul {display: none; position: absolute; top: 100%; left: 0; right: 0; background: #464249; padding: 10px 0; z-index: 99;}
    .header .menu ul li {display: block; margin: 3px 0; padding: 3px 0; float: none;}
    .header .menu ul li a {font-size: 14px;}
    .menu-button {display: block; cursor: pointer; background: url('/assets/images/menuOpen.png') no-repeat right center; height: 22px; margin-right: 10px; width: 22px; float: right; margin-top: 10px;}
    .menu-button.shown {background: url('/assets/images/menuClose.png') no-repeat right center;}
    .header.top .menu {padding-top: 0; width: 40%; text-align: center;}
	.header .menu {padding-top: 0; width: 35%; text-align: center;}
    .header.top .logo a {width: 30px; background-size: 30px auto; height: 42px; background: url('/assets/images/logo_meysztowicz_sign.svg') no-repeat center center;}
    .header .logo {width: 50%;}
    .header {
        position: fixed;
        top: 0;
        padding: 10px 0;
    }

    .main-img {
        margin-top: 125px;
    }

    .main-img-2 {
        margin-top: 125px;
    }

    .content #people {margin-top: -20px;}
	.header.top .languages{width:10%; margin-top: 10px;}
	.header .languages {width:10%; margin-top: 10px;}
	.header.top .languages li, .header .languages li{display: inline-block;}
	.header.top .col-right, .header .col-right{padding-top: 0px;}
	.subpage-content #contact.section .full-width div {margin-top: 60px;font-size: 16px; line-height:80px;}
	.subpage-content #contact.section .full-width img {display: block;}

	.content #questions #accordion .accordion-title {padding-left: 1%; font-size: 17px;}
	.content #questions #accordion .accordion-box {padding: 0 2% 0 2%;}

    .contact-bar {
        display: none;
    }
}

@media screen and (max-width: 640px){
    .popup-wrapper .popup-content{max-width: 98%; width: 100%; height: 80vh;}
    .popup-wrapper .popup-content .text-wrapper p{font-size: 14px;}
    .popup-wrapper .popup-content .text-wrapper .color, .popup-wrapper .popup-content .text-wrapper .uppercase{font-size: 20px;}
}
@media screen and (max-width: 500px){
    .content #about p {text-align: justify;}
    .content #people h2, .content #about h1, .content #about h1 span {font-size: 21px;}
    .content #people h2 {font-size: 22px;}
    .content #people .col:nth-child(2) {padding: 20px;}
    .footer #contact .text-box {padding: 20px 10px;}
    .content #about {padding: 30px 10px;}
    .main-img {height: 250px;}
    .footer #copy p, .footer #copy span {font-size: 9px;}
     .content #people .col:nth-child(3) .col-right > div {display: inline-block; vertical-align: top; width: 48%; text-align: center;}

    .content #people .col:nth-child(3) .col-right {float: none;}
    .content #people .col:nth-child(3) {float: none; margin: 0 auto;}
	.content #people .col:nth-child(3) > .col-right > div:nth-child(2)  {margin-left: 0;}
/*	.subpage-content #contact.section .phone-icon {display: block; margin-left: 40%;}
	.subpage-content #contact.section .mail-icon {display: block; margin-left:40%;}
	.subpage-content #contact.section .phone_number2 {padding-left: 0px;}*/

	.content #questions #accordion .accordion-title {text-align:center;}
}

.subpage-content .section a {
    color: #000;
    text-decoration: underline;
    font-weight: 400;
}

.subpage-content .section a:hover {
    color: #5c5c5c;
    text-decoration: underline;
    font-weight: 400;
}

.contact-bar {
    background-color: #ffb74d;
    padding: 10px 0;
    position: relative;
    z-index: 1000;
}

.contact-bar .contact-link {
    color: #464249;
    text-decoration: none;
    margin-right: 30px;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    transition: color 0.3s ease;
}

.contact-bar .contact-link:hover {
    color: #000;
}

.contact-bar .contact-link svg {
    width: 16px;
    height: 16px;
    margin-right: 8px;
    stroke: #464249;
}

.contact-bar .contact-link:hover svg {
    stroke: #000;
}