/*@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:wght@300;400;700;900&display=swap');*/
@import url(engine.css);

*{box-sizing:border-box; margin:0; padding:0;}
body {background:#F0F2F5; font:14px/1.4em 'Arial', sans-serif; display:flex; flex-direction:column; min-height:100vh;}
img {max-width:100%;}
p {margin-bottom:1em;}
a {outline:none; color:#0180FF;}

table {width:100%; border-collapse:collapse;}
table tr:nth-child(odd) {background:#F0F2F5;}
table td {padding:1em; border:1px solid #eee; vertical-align:top;}

.width {width:1100px; max-width:95%; margin:0 auto;}
.flex {display:flex;}
.center {text-align:center;}
.table {display:table; width:100%; border-collapse:collapse;}
.table .tr {display:table-row;}
.table .tr:nth-child(odd) {background:#f4f4f4;}
.table .tr .td {display:table-cell; padding:1em;}

.h1, .h2 {font-weight:700; font-size:1.2em;}

.button {position:relative; overflow:hidden; display:inline-block; padding:0.5em 1.5em; margin:1px 2px; background:#0180FF; font-weight:700; color:#fff; border:2px transparent; border-radius:5px; text-decoration:none; cursor:pointer;}
.button.lite {background:none; color:#0180FF; border:2px solid #0180FF;}
.button:hover:before {z-index:1; content:""; position:absolute; left:-40px; top:-150px; width:30px; height:300px; display:block; background:rgba(255,255,255,.4); transform:rotate(45deg); transition:.1s all; animation:buttonanim 2s .05s ease-in-out infinite;}
@keyframes buttonanim{0%{left:-30px; margin-left:0;}30%{left:110%; margin-left:80px;}to{left:110%; margin-left:80px;}}

.header {flex:0 0 auto; position:sticky; top:0; transition:.5s all; z-index:1; box-shadow:0 0 10px #ccc; background:#fff;}
.header.out {transform:translateY(-100%);}

.top {position:relative; display:flex; justify-content:space-between; align-items:center; padding:1em 0;}
.logo {font-size:2em; font-weight:900; text-transform:uppercase; text-decoration:none; line-height:1.2em; color:#000; align-items:center;}
.logo img {width:auto; height:1.25em; margin-right:0.5em;}
.sitename {position:relative;}
.logo b {position:absolute; bottom:0.2em; right:-1.2em; font-size:0.65em; font-weight:400; color:#0180FF;}

.slogan {font-size:1.25em; color:#555;}
.slogan a {text-decoration:none;}

.sbox {display:flex; height:2em;}
.sbox > button {margin-right:0.5em; border:0; border-radius:3px; cursor:pointer;}

.infscr {width:2.5em; height:2.5em; background:#eee url(../images/infin.svg) no-repeat center center / 20px;}
.infscr.on {background:#0180FF url(../images/infin_light.svg) no-repeat center center / 20px;}

.showloc {width:2.5em; height:2.5em; background:url(../images/loc.svg) no-repeat center center / 20px;}

.showsearch {width:2.5em; height:2.5em; background:url(../images/search.svg) no-repeat center center / 20px;}

.shownav {display:flex; position:relative; width:2.5em; height:2.5em; justify-content:center; align-items:center; background:#0180FF; border-radius:5px;}
.shownav b, .shownav b:before, .shownav b:after {display:block; position:absolute; right:0; width:1.25em; height:2px; background:#FFF; content:''; transition:.25s all;}
.shownav b {position:relative;}
.shownav b:before {top:-6px;}
.shownav b:after {bottom:-6px;}
.shownav.active b {background-color:transparent;}
.shownav.active b:before {top:0; transform:rotate(-45deg);}
.shownav.active b:after {top:0; transform:rotate(45deg);}
	
.nav {position:absolute; top:100%; right:0; background:#fff; padding:1em; visibility:hidden; opacity:0; transform:translate(0,30%); transition:0.5s all; z-index:3; box-shadow:3px 5px 10px rgba(0,0,0,0.15);}
.nav.active {visibility:visible; opacity:1; transform:translate(0,0); transition:0.5s opacity ease, 0.25s transform ease;}
.nav .menu {columns:2; column-gap:0;}
.nav .menu a {display:block; padding:0.5em 1.5em; text-decoration:none; color:#111; font-weight:700;}
.nav .menu a:hover {color:#0180FF;}

.searchform {width:100%; margin-bottom:1em;}
.searchform form {display:flex; justify-content:center;}
.searchform input {width:85%; padding:.75em 1em; border:1px solid #ccc; border-radius:5px 0 0 5px; outline:none;}
.searchform button {width:15%; text-align:center; border:1px solid #ccc; border-left:0; border-radius:0 5px 5px 0; background:#eee url(../images/search.svg) no-repeat center center / 15px; color:#fff; cursor:pointer; outline:none;}

.loc {position:absolute; top:100%; right:0; background:#fff; padding:1em; visibility:hidden; opacity:0; transform:translate(0,30%); transition:0.5s all; z-index:3; box-shadow:3px 5px 10px rgba(0,0,0,0.15);}
.loc ul {/*columns:6;*/ list-style:none;}
.loc li {display:inline-block; padding:0.25em 1em; width:15%;}
.loc li.loctitle {display:block; width:100%; font-weight:700; border-bottom:1px dashed #ccc;}
.loc li.loctitle.r {margin-top:1em;}
.loc.active {visibility:visible; opacity:1; transform:translate(0,0); transition:0.5s opacity ease, 0.25s transform ease;}
.loc .sf {position:relative; width:500px; max-width:100%; margin:0 auto;}
.loc .sf .reset {position:absolute; top:0; bottom:0; right:0; width:2em; background:url(../images/x.svg) no-repeat center center / 1em; cursor:pointer;}
.loc input {display:block;width:100%; margin-bottom:1em; padding:0.5em 1em; border:1px solid #ccc; border-radius:5px; outline:none;}

.main {flex:1 0 auto; padding:2em 0;}

.speedbar {display:flex; flex-wrap:wrap; align-items:center; margin-bottom:1em; font-size:0.9em; color:#555;}
.speedbar a {text-decoration:none; padding:0 0.25em;}
.speedbar span.home {width:24px; height:24px; background:url(../images/home.svg) no-repeat left top / 1.5em;}

.pages {padding:0 0 2% 0;}

.posts {display:flex; flex-wrap:wrap; justify-content:space-between;}
.posts > a, .posts > div {width:49%; margin:0 0 2%; text-decoration:none; color:#333; box-shadow:0 5px 15px #ddd; background:#fff; overflow:hidden;}

.post .text {padding:1em; font-size:1.2em;}
.post .inform {font-size:.8em; color:#999; margin-bottom:0.5em;}
.post .title {text-decoration:none; color:#555; font-size:1.1em;}
.post .views {display:block; margin-top:1em; font-size:.75em; font-style:normal; color:#555; text-align:right;}

.post .flex {display:flex; align-items:stretch;}
.post .flex .img {overflow:hidden; width:40%; height:180px; flex-shrink:0; /*border-radius:0.5em 0 0 0.5em;*/}
.post .flex .img img {width:100%; height:180px; display:block; object-fit:cover; transition:0.5s all;}
.post:hover .flex .img img {transform:scale(1.05);}

.post.big {width:32%; height:250px; position:relative; overflow:hidden;}
.post.big .flex .img {position:absolute; top:0; width:100%; height:auto;}
.post.big .flex .img img {height:100%;}
.post.big .text {display:flex; flex-wrap:wrap; align-content:flex-end; position:absolute; top:0; bottom:0; width:100%; height:auto; font-size:1.25em; background:linear-gradient(rgba(0,0,0,0), rgba(0,0,0,1));}
.post.big .title, .post.big .inform {color:#fff !important;}
.post.big .title {line-height:1.4em;}
.post.big .views {width:100%; color:#fff;}

.relatedtitle {margin:2em auto; font-size:1.4em; text-align:center;}

.post.full .text {background:#fff; padding:0 0 1em;}
.post.full .textfull {padding:0 1.5em; font-size:1em;}
.post.full .title {font-size:2.2em; font-weight:700; line-height:1.1em; color:#555;}
.post.full .title.small {font-size:1.8em;}
.post.full .inform, .post.full .inform a {font-size:14px; font-weight:400; line-height:1.4em; color:#777; margin-top:1em; text-decoration:none;}
.post.full .inform i {display:inline-block; margin:0 0.35em 0 1em;}
.post.full .inform span {display:inline-block; margin-right:1em;}
.post.full .inform i:first-child {margin-left:0;}
.post.full .text {font-size:1.2em; line-height:1.6em;}
.post.full .text .image {display:block; margin:0 auto; text-align:center; background-size:150%; background-repeat:no-repeat;}
.post.full .text .image a {display:block; background:rgba(255,255,255,0.25); backdrop-filter:blur(10px);}
.post.full .text .linkfoto {display:block; margin:0 auto; text-align:center; font-size:.8em; color:#777;}
.post.full .newsinfo {margin-top:1em; padding:1em 0; border-top:1px solid #eee; font-size:0.85em;}
.post.full .newsinfo a {text-decoration:none;}
.post.full .newsinfo i {margin-right:1em;}

.nextprev {padding:1em 0; justify-content:center;}


.post.full ol, .post.full ul {margin:0; padding-left:1em;}

.post.full .share {margin-top:2em; align-items:center; justify-content:center;}
.post.full .share > span {padding-right:1em; text-transform:uppercase; font-weight:300;}

.icon {padding-left:1.4em; font-style:normal; background:no-repeat left center / 1em;}
.icon.autor {background-image:url(../images/icon_autor.svg);}
.icon.date {background-image:url(../images/icon_date.svg);}
.icon.cats {background-image:url(../images/icon_cats.svg);}
.icon.read {background-image:url(../images/icon_read.svg);}
.icon.link {background-image:url(../images/icon_link.svg);}
.icon.edit {background-image:url(../images/icon_edit.svg);}
.icon.locinf {background-image:url(../images/loc.svg);}
.post.big .icon.date {background-image:url(../images/icon_date_light.svg);}
.post.big .icon.cats {background-image:url(../images/icon_cats_light.svg);}
.post.big .icon.read {background-image:url(../images/icon_read_light.svg);}


#fullsearch {width:100%; flex-grow:1; margin-bottom:2em;}
.full .searchform {display:flex; margin-top:1em;}
.full .searchform input {width:50%; padding:1em; border:1px solid #ddd; border-radius:5px 0 0 5px; outline:none;}
.full .searchform button {width:60px; height:43.66px; align-items: center; text-align:center; border:0; border-radius:0 5px 5px 0; background:#0180FF url(../images/search_lite.svg) no-repeat center center / 20px; color:#fff; cursor:pointer; outline:none;}
.searchresult {margin-top:2em;}

.full.info {margin-bottom:2em;}

.navigation {display:flex; flex-wrap:wrap; justify-content:center; margin-top:2em; font-size:1.2em;}
.navigation span, .navigation a {width:35px; height:35px; line-height:35px; text-align:center; text-decoration:none; background:#fff; transition:0.5s all; border-radius:100px; margin:0 0.25em;}
.navigation span {color:#ccc;}
.navigation span.current, .navigation a:hover {background:#0180FF; color:#fff;}
.navigation b {font-size:2em; font-weight:300; line-height:30px;}
.next {padding:0.5em 2em; border:2px solid #0180FF; border-radius:5px; color:#000; text-decoration:none; transition:0.25s all;}
.next:hover {background:#0180FF; color:#FFF;}

.footer {flex:0 0 auto; padding:2em 0; background:#FFF; border-top:3px solid #eee;}
.footer .flex {justify-content:space-between;}
.footer .logo {margin-right:3em; align-items:start;}
.footer .seo {width:60%; font-size:0.9em; color:rgba(0,0,0,0.5); line-height:1.2em; margin-bottom:1em;}
.footer .copy {margin-top:1em;}

.weather {flex-wrap:wrap; align-items: center; align-content: center; margin-right:2em; height:2.5em;}
.weather img {display:block; height:2em; padding-right:0.5em;}

.err404 {font-size:5em; color:#777; font-weight:300; line-height:1.5em; margin-bottom:0;}

@media only screen and (max-width:769px) {
	.header {padding:0;}
	.logo, .sbox {padding:0 10px;}
	.logo {font-size:1.5em;}
	
	.showsearch {display:none;}
	
	.slogan {display:none;}
	
	.nav {left:0;}
	.nav a {font-size:1.2em;}
	
	.loc {max-height:100vh; overflow:scroll; padding-bottom:2em;}
	.loc li {width:45%;}
	
	.full.searchform input {width:calc(100% - 4em);}
	
	.section .width {max-width:95%;}
	
	.speedbar {display:none;}

	.posts {width:95%; margin:0 auto;}
	.posts > a, .posts > div {display:block; width:100%; margin:0 auto 1em;}

	.post .flex {display:block;}
	.post .flex .img {display:block; width:100%; height:250px; overflow:hidden; padding-right:0;}
	.post .flex .img img {height:300px;}
/*
	.post {width:100%; height:250px; position:relative; overflow:hidden;}
	.post .flex .img {position:absolute; top:0; width:100%; height:auto;}
	.post .text {display:flex; flex-wrap:wrap; align-content:flex-end; position:absolute; top:0; bottom:0; width:100%; height:auto; font-size:1.25em; background:linear-gradient(rgba(0,0,0,0), rgba(0,0,0,1));}
	.post .title, .post .inform {color:#fff !important;}
	.post .title {line-height:1.4em;}
	.post .views {width:100%; color:#fff;}
	
	.icon.date {background-image:url(../images/icon_date_light.svg);}
	.icon.cats {background-image:url(../images/icon_cats_light.svg);}
	.icon.read {background-image:url(../images/icon_read_light.svg);}
*/
	.post.big {width:100%;}
	
	.post.full {width:95%; margin:0 auto;}
	.post.full .title {font-size:1.8em;}
	.post.full .textfull {padding:0 1em;}
	
	.post.related {width:100%;}
	.post.related .flex {display:flex;}
	.post.related .img {overflow:hidden; width:40%; height:100%; margin:0; padding:0;  flex-shrink:0; border-radius:0.5em 0 0 0.5em; object-fit:cover;}
	.post.related .img img {display:block; height:140px;}
	.post.related .title {font-size:0.85em;}
	
	.share {text-align:center;}
	
	.next {width:95%; margin:0 auto;}
	
	.footer {padding:1em;}
	.footer .width {flex-direction:column;}
	.footer .logo {width:100px; padding:0;}
	.footer .seo {width:100%; margin:1em 0;}
	
	.weather {text-align:center; font-size:0.85em; justify-content: center;}
	.weather img {margin:0 auto 5px; padding:0;}
}