@charset "utf-8";

body {font-family: 'Fira Sans', sans-serif; margin: 0px; padding: 0px; font-size: 16px; font-weight: 300; line-height: 20px; letter-spacing: -0.5px; color: black; background: white; text-align: justify; overflow-x: hidden;}
@media (min-width: 550px) {body {font-size: 18px; line-height: 24px; transition: 0.1s;}}
@media (min-width: 800px) {body {font-size: 1.4vw; line-height: 2vw;}}

img {width: 100%; height: auto; object-fit: cover;}
.imgs {width: 100%; height: auto; margin-bottom: 5%;}
@media (min-width: 800px) {.imgs {margin-bottom: 2%;}}

.tbl {width: 100%; height: auto; text-align: justify;}
@media (min-width: 800px) {.tbl {width: 70%;}}

.tube {width: 89vw; height: 50vw; max-width: 1000px; max-height: 563px; border: 0px;}

.right {width: 100%; height: auto; text-align: right; font-style: italic;}

a {color: #987; text-decoration: none; border: solid; border-width: 0px 0px 1px 0px; transition: 0.3s;}
a:hover {color: #df0000; text-decoration: underline; border: 0px; transition: 0.1s;}

.a {color: #fff; text-decoration: none; border: 0px;}
.a:hover {color: #fff; text-decoration: none;}

strong {color: #543;}

b {font-weight: 400;}

hr {margin: 50px 0px; border-width: 0px 0px 1px 0px; border-color: #df0000;}

h1 {font-size: 2em; font-weight: 300; line-height: 1em; margin-top: 0px; text-align: left; letter-spacing: -2px; color: #df0000; transition: 0.3s;}

h2 {font-size: 1.4em; font-weight: 400; line-height: 1em; margin-top: 0px; text-align: left; letter-spacing: -1px; color: #df0000; transition: 0.3s;}

h3 {font-size: 1.1em; font-weight: 400; line-height: 1em; margin-top: 0px; text-align: left; letter-spacing: -0.5px; color: #df0000; transition: 0.3s;}

h4 {font-size: 1.8em; font-weight: 300; line-height: 1em; margin-top: -15px; text-align: left; letter-spacing: -0.5px; color: #df0000; transition: 0.3s;}


#citena {position: static; top: 0px; left: 0px; width: 100%; height: 340px; color: #df0000; font-size: 14vw; line-height: 1em; text-align: center; text-shadow: #790000 0px 2px 1px; background: url(cover.jpg); background-size: cover; background-position: center center; transition: 0.7s;}
@media (min-width: 800px) {#citena {font-size: 10vw;}}

#prices {position: fixed; top: 0px; left: 0px; width: 100%; height: 50px; box-shadow: #aa3333 0px 10px 15px; display: flex; align-items: center; z-index: 1;}
@media (min-width: 1800px) {#prices {height: 70px;}}

#price {position: relative; top: 0px; left: 0px; width: 100%; height: 50px; box-shadow: #aa3333 0px 10px 15px; display: flex; align-items: center; z-index: 1;}
@media (min-width: 1800px) {#price {height: 70px;}}

#line {position: absolute; width: 100%; height: 50px; background: #ce0000; opacity: 0.8;}
@media (min-width: 1800px) {#line {height: 70px;}}

.pnt {position: relative; width: 21%; padding: 2%; padding-top: 2.7%; color: white; text-align: center; font-size: 3.4vw; font-weight: 400; text-decoration: none; transition: 0.3s;}
@media (min-width: 550px) {.pnt {font-size: 1em; padding: 5px 2% 2px 2%; transition: 0.3s;}}
.pnt:hover {background: linear-gradient(#bd0000 15%, #ce0000); transition: 0.1s;}

#full {position: absolute; left: 3vw; width: 67vw; height: auto; margin-top: 35px; color: white; text-align: left; line-height: 1.2em; box-shadow: #aa3333 0px 10px 15px; display: none;}
@media (min-width: 580px) {#full {width: 60vw; line-height: 1.2em;}}
@media (min-width: 800px) {#full {width: 47vw;}}
@media (min-width: 1400px) {#full {width: 48vw;}}
@media (min-width: 1800px) {#full {margin-top: 55px;}}

#fill {position: absolute; width: 70vw; height: auto; margin-top: 35px; color: white; text-align: left; box-shadow: #aa3333 0px 10px 15px; display: none;}
@media (min-width: 800px) {#fill {width: 40vw;}}
@media (min-width: 1800px) {#fill {margin-top: 55px;}}

.fbg {position: inherit; width: 100%; height: 100%; background: #ce0000; opacity: 0.8;}

.gfm {color: #efd; text-decoration: none; border: 0px; transition: 0.3s;}
.gfm:hover {color: #fff; text-decoration: none; border: solid; border-width: 0px 0px 1px 0px; transition: 0.1s;}
.gfmact {color: #fff; text-decoration: none; border: 0px; text-shadow: #fff 0px 0px 3px; transition: 0.3s;}
.gfm:visited {color: #ebb; text-decoration: none; transition: 0.3s;}

#socialhost {position: absolute; top: 10px; right: 10px; width: 98%; height: auto; text-align: right; transition: 0.5s;}
@media (min-width: 800px) {#socialhost {width: 10%; right: 5%; transition: 0.5s;}}

.socban {height: auto; width: 28vw; margin: 1%; box-shadow: #777 0px 5px 7px;}
@media (min-width: 650px) {.socban {width: 15%;}}
@media (min-width: 800px) {.socban {width: 100%;}}
.socban:hover {box-shadow: #777 0px 3px 3px;}

.content {width: 90%; height: auto; padding: 5%; margin-top: 10px;}
@media (min-width: 1700px) {.content {width: 80%; padding: 10%;}}

.cont {width: 90%; height: auto; padding: 5%; margin-top: 70px;}
@media (min-width: 1700px) {.cont {width: 80%; padding: 10%;}}

#butup {position: fixed; right: 4vw; bottom: -12vw; padding: 3vw 4vw; border-radius: 8vw; cursor: pointer; color: white; background: #ce0000; box-shadow: #aa3333 0px 5px 10px; opacity: 0.8; transition: 1s;}
@media (min-width: 500px) {#butup {padding: 2vw 2.3vw; transition: 1s;}}
#butup:hover {box-shadow: #aa3333 0px 2px 5px; opacity: 0.9; transition: 0.5s;}


footer {position: relative; width: 100%; height: 100vh; color: white; text-align: center; background: #ce0000;}
#footer {position: relative; bottom: -10px; width: 100%; height: 80px; border: 0px;}
@media (min-width: 560px) {#footer {bottom: -1vw; height: 100px;}}
@media (min-width: 990px) {#footer {bottom: -1.5vw; height: 9vw;}}

.rip {position: relative; color: white; text-decoration: none; border: 0px;}
.rip:hover {color: white; text-decoration: none; border: solid; border-width: 0px 0px 1px 0px;}
.rips {position: relative; color: #fff; text-decoration: none; border: solid; border-width: 0px 0px 1px 0px; text-shadow: #fff 0px 0px 5px;}
.rip:visited {color: #fcc;}

.grnd {color: white; text-decoration: none; border: 0px;}
.grnd:hover {color: white; text-decoration: none; border: solid; border-width: 0px 0px 1px 0px;}