/*
Theme Name: Lvivport
Author: Ruslan Ratych
Version: 1.0
*/

:root{
	--primary: #2abf31;
    --orange: #ff8562;
}

body{ font-size:18px; line-height:1.45; font-family:'Roboto', Arial, sans-serif; font-weight: 300; color:#000; background:#fff;}
a { color:var(--orange); transition: all .2s ease;}
a:hover { color:var(--orange); text-decoration:none;}
a:focus {outline: none;}
img { max-width:100%; height:auto;}
#wrapper { width:100%; min-width:320px; position:relative;}
.clearfix:after { display:table; content:''; clear:both;}
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0;}
input[type=number] { -moz-appearance: textfield;}
b, strong { font-weight: 500;}
#wpadminbar { position: fixed;}
.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl { padding-right:20px; padding-left:20px;}
@media screen and (min-width: 1200px) {
    .container { width: 100%; max-width: 1200px;}
}
.row { margin-left: -20px; margin-right:-20px;}
.row>[class^="col"], .row>[class*=" col"] { padding-left:20px; padding-right: 20px;}

.btn { font-size:14px; line-height: 21px; font-weight:700; padding:12px 30px; border:none; border-radius:0; box-shadow:none !important; transition: all .2s ease;}
.btn-primary { color:#fff; background: var(--primary);}
.btn-primary:hover, .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle, .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus { color:#fff; background: var(--primary);}
.btn-bordered { font-size: 16px; line-height: 24px; padding: 18px 60px; border:3px solid #000; color:#000; background:transparent;}
.btn-bordered:hover, .btn-bordered:not(:disabled):not(.disabled).active, .btn-bordered:not(:disabled):not(.disabled):active, .btn-bordered:focus, .btn-bordered:not(:disabled):not(.disabled).active:focus, .btn-bordered:not(:disabled):not(.disabled):active:focus { color:#fff; background:#000; border-color:#000;}

.item-thumb { display: block; position: relative; padding-bottom: 72%;}
.item-thumb:before, .item-thumb img { display: block; position: absolute; left:0; top:0; width: 100%; height: 100%; object-fit: cover; object-position: center;}
h1, h2, h3, h4, h5, h6 { font-weight: bold; margin: 0 0 20px;}
h1 { font-size: 48px;}
h2 { font-size: 32px;}
h3 { font-size: 28px;}
h4 { font-size: 24px;}
h5 { font-size: 20px;}
h6 { font-size:18px;}

/* header */
#header { position:relative; background: url(img/header-bg.jpg) no-repeat center; background-size: cover; background-attachment: scroll; z-index:99;}
#header:before { content:''; display: block; position: absolute; left:0; top:0; width: 100%; height: 100%; background:rgba(0, 0, 0, 0.70);}
.header-main { height: 100px; position: relative; z-index: 1;}
.header-inner { height: 100px;}
.navbar-brand { padding: 0; width: 140px; margin-right: 30px;}
#navi { flex-grow:0;}
@media screen and (min-width: 992px) {
    .navi-inner { padding: 0;}
}
.main-menu li+li { margin-left: 30px;}
.main-menu li a { display: block; font-size: 16px; font-weight: 600; text-transform: uppercase; color:#fff;}
.main-menu li a:hover { color:var(--orange);}
.navbar-toggler { position: relative; padding:0; width: 32px; height: 32px; border:none; border-radius:0;}
.navbar-toggler span { display:block; position:absolute; width:28px; opacity:1; left:50%; transform:translateX(-50%); transition:.25s ease-in-out; height:3px; background-color:#fff}
.navbar-toggler span:nth-child(1){ top:6px;width:0%;}
.navbar-toggler span:nth-child(2){ top:14px;transform: translateX(-50%) rotate(45deg);}
.navbar-toggler span:nth-child(3){ top:14px;transform: translateX(-50%) rotate(-45deg);}
.navbar-toggler span:nth-child(4){ top:22px;width:0%;}
.navbar-toggler.collapsed span:nth-child(1), .navbar-toggler.collapsed span:nth-child(4){ width:28px;}
.navbar-toggler.collapsed span:nth-child(2), .navbar-toggler.collapsed span:nth-child(3){ transform:rotate(0) translateX(-50%);}
.header-title { position: relative; z-index: 1; padding:50px 0;}
.page-title { margin: 0; font-size: 36px; line-height: 1.45; font-weight:bold; color:#d7d7d7; text-transform: uppercase;}
.page-title a { color:inherit;}
#header.fixed .header-fixed { position:fixed; top:-100px; left:0; width: 100%; visibility: hidden; opacity: 0; box-shadow: 0 1px 3px rgba(0, 0, 0, 0);}
.admin-bar #header.fixed .header-fixed { margin-top: 32px;}
@media screen and (min-width: 992px) {
    #header.fixed .header-fixed { background-color: rgba(33, 33, 33, 0.95); height: 90px; transition: background-color 300ms linear;}
    #header.float .header-fixed { visibility: visible !important; opacity: 1 !important; top:0 !important;}
    #header.fixed .header-inner { height: 90px;}
    #header.fixed .navbar-brand { width:120px;}
}

/* layout */
.section { padding: 120px 0;}
.section.padding-small { padding: 75px 0;}
.aero-projects-section { padding: 45px 0;}
.section-title { font-size: 42px; line-height: 1.25; font-weight: bold; margin:0 0 50px;}
.section-title a, .section-title a:hover { color:#000;}
.section-info { font-size: 24px;}
.section-inner { margin-top: 100px;}

.single-content { max-width: 800px; margin: 0 auto;}
.entry-content p, .entry-content ul, .entry-content ol { margin: 10px 0;}
.entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6 { margin: 20px 0;}
.entry-content ul, .entry-content ol { list-style-position: inside; padding-left: 0;}
.entry-content table { margin: 20px 0; border: 1px solid #cecece;}
.entry-content table th, .entry-content table td { border: 1px solid #cecece; padding: 4px;}
.entry-content img { margin: 20px 0;}
.entry-content .alignleft { float:left; margin: 5px 24px 10px 0;}
.entry-content .alignright { float:right; margin: 5px 0 10px 24px;}
.entry-content .aligncenter { display: block; margin:20px auto;}
.entry-content a:hover { text-decoration: underline;}
div#ez-toc-container { background:none; border:none; border-radius: 0; -webkit-box-shadow:none; box-shadow:none; padding:0; margin-bottom: 20px;}
div#ez-toc-container ul li, div#ez-toc-container ul li a { font-weight:400;}
div#ez-toc-container ul li a { color:var(--orange);}
div.ez-toc-counter nav ul li a::before { color:#000;}

/* portfolio */
#portfolio_section { padding: 75px 0;}
.portfolio-list  { margin-bottom: -40px;}
.portfolio-item { display: block; position: relative; height: 290px; color:#fff; margin-bottom: 40px;}
.portfolio-item .item-thumb { display: block; position: absolute; left:0; top:0; width: 100%; height: 100%; padding: 0; overflow: hidden;}
.portfolio-item .item-thumb:before { content:''; transition:all 0.25s ease-in-out; background:linear-gradient(to bottom, rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.3)); opacity: 1; z-index: 1;}
.portfolio-item .item-thumb img { object-fit: cover; object-position: center; transform: scale(1); transition:all 0.25s ease-in-out;}
.portfolio-item .item-inner { display: flex; flex-direction: column; position: absolute; z-index: 2; left:0; bottom:0; width: 100%; max-height: 100%; padding: 50px 40px;}
.portfolio-item .item-entry { transform: translate3d(0, 85px, 0); transition:all 0.25s ease-in-out;}
.portfolio-item .item-caption { font-size:24px; line-height: 1.35; font-weight: bold;}
.portfolio-item .item-desc { margin-top: 20px; font-size: 16px; line-height: 1.55;}
.portfolio-item .item-button { margin-top: 40px; transition:all 0.25s ease-in-out; opacity: 0;}
.portfolio-item:hover { color:#fff;}
.portfolio-item-big { height: 400px;}
.portfolio-item.portfolio-item-big .item-caption { font-size:36px;}
@media screen and (min-width: 991px) {    
    .portfolio-item:hover .item-thumb img { transform:scale(1.05);}
    .portfolio-item:hover .item-thumb:before { opacity: 0.8;}
    .portfolio-item:hover .item-entry { transform: translate3d(0, 0, 0);}
    .portfolio-item:hover .item-button { opacity: 1;}
}

/* photo title */
.photo-title-block { display: flex; flex-direction: column; justify-content: flex-end; position: relative; height: 500px;}
.photo-title-block .block-bg { position: absolute; top:0; left:0; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover;}
.photo-title-block .block-bg:before { content:''; display: block; position: absolute; top:0; left:0; width: 100%; height: 100%; background:linear-gradient(to bottom, rgba(0, 0, 0, 0.0), rgba(0, 0, 0, 0.7)); z-index: 1;}
.photo-title-block .block-title { position: relative; z-index: 2; padding: 50px 0 48px;}
.photo-title-block .block-title h2 { font-size: 36px; color:#d7d7d7; text-transform: uppercase; font-weight: 300; margin: 0;}

/* reklama & forums */
#reklama_section .section-info { max-width: 560px;}
.forums-list { margin-bottom: -40px;}
.forum-item { margin-bottom: 40px;}
.forum-item .item-thumb { margin-bottom: 20px;}
.forum-item .item-caption { font-size: 22px; line-height: 1.35; font-weight: bold; margin-bottom: 4px; text-transform: uppercase;}
.forum-item .item-link { font-size: 14px;}

/* partners */
.partners-list { margin-bottom: -40px;}
.partner-item { display: block; text-align: center; color:#000; text-decoration: none; margin-bottom: 40px;}
.partner-item:hover { color:#000;}
.partner-item .item-icon { width: 100px; margin: 0 auto 14px;}
.partner-item .item-icon img { width: 100px; height: 100px; object-fit: contain; object-position: center;}
.partner-item .item-entry { padding-top: 18px;}
.partner-item .item-caption { font-size: 24px; line-height: 30px; font-weight: bold;}
.partner-item .item-text { font-size: 16px; margin-top: 25px;}

/* articles */
.posts-list { margin-bottom: -40px;}
.post-item { display: block; color:#000; margin-bottom: 40px;}
.post-item .item-thumb { overflow: hidden; margin-bottom: 20px;}
.post-item .item-thumb img { transition: all 0.2s ease;}
.post-item .item-title { font-size: 28px; line-height: 1.2; font-weight: bold;}
.post-item .item-excerpt { margin-top: 14px; font-size: 16px;}
.post-item:hover { color:#000;}
.post-item:hover .item-thumb img { transform:scale(1.05);}
.post-item:hover .item-title { color:var(--orange);}
div.wp-pagenavi { margin-top: 50px; display: flex; justify-content: center;}
div.wp-pagenavi a, div.wp-pagenavi span { width: 40px; height: 40px; border:1px solid #000; color:#000; padding: 0; line-height: 38px; font-weight: bold; text-align: center; border-radius:0; margin: 0 4px 8px;}
div.wp-pagenavi a:hover, div.wp-pagenavi span.current { color:var(--orange); border-color:var(--orange)}
div.wp-pagenavi a.last-page-link { width: auto; padding: 0 10px; font-size: 16px;}

/* #footer */
#footer {position:relative; background:#1a1a1a; padding: 180px 0; color:#fff; text-align: center;}
.footer-title { font-size: 42px; line-height: 1.25; font-weight:bold; margin-bottom: 70px; text-transform: uppercase;}
.footer-contacts a:hover { text-decoration: underline;}
.footer-socials { display: flex; justify-content: center; flex-wrap: wrap; margin-top: 45px;}
.footer-socials a { margin:3px; color:var(--primary);}
.footer-socials a svg { display: block; width: 30px; height: 30px;}
.footer-socials a svg path { fill:currentColor;}
.footer-socials a:hover { color:#fff;}

@media screen and (max-width: 991px) {
    body { font-size: 16px;}
    h1 { font-size: 36px;}
    h2 { font-size: 28px;}
    h3 { font-size: 24px;}
    h4 { font-size: 20px;}
    h5 { font-size: 18px;}
    h6 { font-size:16px;}
    
    #header { background: #111;}
    #header:before { display: none;}
    .header-main, .header-inner { height: auto;}
    .header-mobile { height: 64px;}
    .header-fixed { background: #111; top:0 !important; height: auto; visibility: visible !important; opacity: 1 !important;}
    .navbar-brand { width: 100px;}
    .header-title { background: url(img/header-bg.jpg) no-repeat center; background-size: cover; background-attachment: scroll;}
    .header-title:before { content:''; display: block; position: absolute; left:0; top:0; width: 100%; height: 100%; background:rgba(0, 0, 0, 0.70);}
    .header-title .page-title { position: relative; z-index: 2;}
    #navi { width:100vw; background: #212121; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); padding: 30px 0;}
    .main-menu li { text-align: center;}
    .main-menu li+li { margin-left: 0;}
    .main-menu li a { padding: 10px;}
    
    .section { padding: 75px 0;}
    .section-title { font-size: 38px; margin-bottom: 20px;}
    .section-info { font-size: 22px;}
    .section-inner { margin-top: 45px;}
    
    .portfolio-item { height: 350px;}
    .portfolio-item .item-inner { height:auto;}
    .portfolio-item .item-entry { transform: translate3d(0, 0, 0);}
    .portfolio-item .item-button { opacity: 1;}
    .portfolio-item.portfolio-item-big .item-caption { font-size:28px;}
    
    .forum-item .item-caption { font-size: 20px;}
    
    .post-item .item-title { font-size: 24px;}
    .post-item .item-excerpt { font-size: 14px;}
    
    .footer-title { font-size: 38px;}
}

@media screen and (max-width: 782px) {
    .admin-bar #header.fixed .header-fixed { margin-top: 46px;}
}

@media screen and (max-width: 767px) {
    h1 { font-size: 32px;}
    h2 { font-size: 26px;}
    
    .posts-list { margin-bottom: -30px;}
    .post-item { margin-bottom: 30px;}
    .post-item .item-title { font-size: 22px;}
    div.wp-pagenavi { margin-top: 35px;}
    
    #footer { padding: 120px 0;}
    .footer-title { font-size: 30px; margin-bottom: 50px;}
    .footer-socials { margin-top: 30px;}
}
@media screen and (max-width: 576px) {
    .btn-bordered { padding: 18px 30px;}
    
    .section-title { font-size: 30px;}
    .section-info { font-size: 20px;}
    
    .portfolio-list  { margin-bottom: -20px;}
    .portfolio-item { margin-bottom: 20px;}
}
@media screen and (max-width: 480px) {        
    .portfolio-item { height:290px;}
    .portfolio-item .item-inner { padding-left: 20px; padding-right: 20px;}
    .portfolio-item .item-caption { font-size:20px;}
    .portfolio-item .item-desc { font-size: 14px;}
    .portfolio-item.portfolio-item-big .item-caption { font-size:24px;}
}