@import url(https://fonts.googleapis.com/css?family=Milonga|Open+Sans|Krona+One|Ubuntu+Condensed&subset=latin-ext);
@import url(https://fonts.googleapis.com/css?family=Exo+2:ital,wght@0,700;1,800&display=swap);
body {
    background: #f5f5f5;
    color: #797979
}

.container {
    max-width: 80%
}

.container.center .cn_title {
    text-align: center
}

section .container {
    margin: 1rem auto;
    padding: 2rem
}

section .container p {
    margin: 2rem;
    font-size: 1.8rem
}

.nav {
    margin-top: 5rem
}

.nav-item a {
    color: #797979;
    text-decoration: none
}

svg.w-5.h-5 {
    width: 1rem;
    height: 1rem
}

.nav-item a:hover {
    cursor: pointer;
    color: #4d4a4a;
    border: none
}

.hero {
    color: #363636;
    height: 80vh
}

.hero div {
    margin-bottom: 5rem
}

.hero h3 {
    font-family: Edelsans, sans-serif;
    font-size: 3rem;
    margin-bottom: 0
}

.hero h5 {
    margin-top: 1rem;
    margin-bottom: 0;
    font-weight: 200
}

.grid-demo-col {
    background: #e4e4e4
}

.header {
    font-weight: 200
}

.content {
    font-size: 1.8rem
}

.card {
    background: #FAFAFA
}

.string {
    color: #02C1A7
}

.special {
    color: #AC2EC5
}

.global {
    color: #db9114
}

.method {
    color: #00A2CD
}

.comment {
    color: #989898
}

.mb_thumb {
    width: 24rem;
    max-width: 32rem !important;
    text-align: center
}

.mb_thumb a:not('.button') {
    color: #6a6 !important;
    text-align: center
}

.mb_thumb cite {
    font-family: "Krona One";
    text-align: center;
    display: block;
    width: 100%
}

.mb_thumb cite a {
    color: #6a6 !important
}

.mb_thumb p {
    font-family: "Exo 2";
    color: #666
}

.mb_thumb p em {
    font-family: "Exo 2" !important;
    color: #222 !important;
    font-weight: 700
}

.mb_thumb p cite {
    display: inline
}

.mb_thumb img {
    width: 70%;
    max-width: 70%;
    margin: .2rem auto;
    display: block;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .12), 0 2px 2px rgba(0, 0, 0, .12), 0 4px 4px rgba(0, 0, 0, .12), 0 8px 8px rgba(0, 0, 0, .12), 0 16px 16px rgba(0, 0, 0, .12)
}

.mb_thumb>a {
    color: #6a6 !important
}

.mb_thumb .un_flex_even a.button {
    width: 80%;
    font-size: 80%
}

.mb_thumb_2 {
    width: 24rem;
    max-width: 32rem !important;
    text-align: center
}

.mb_thumb_2 a:not('.button') {
    color: #6a6 !important;
    text-align: center
}

.mb_thumb_2 cite {
    font-family: "Ubuntu Condensed";
    text-align: center;
    display: block;
    width: 100%
}

.mb_thumb_2 cite a {
    color: #6a6 !important
}

.mb_thumb_2 p {
    font-family: "Exo 2";
    color: #666;
    font-size: .9rem
}

.mb_thumb_2 p em {
    font-family: "Exo 2" !important;
    color: #222 !important;
    font-weight: 700
}

.mb_thumb_2 p cite {
    display: inline
}

.mb_thumb_2 img {
    width: 70%;
    max-width: 70%;
    margin: .2rem auto;
    display: block;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .12), 0 2px 2px rgba(0, 0, 0, .12), 0 4px 4px rgba(0, 0, 0, .12), 0 8px 8px rgba(0, 0, 0, .12), 0 16px 16px rgba(0, 0, 0, .12)
}

.mb_thumb_2>a {
    color: #6a6 !important
}

.mb_thumb_2 .button {
    width: 80%;
    font-size: 1rem;
    border: 0
}

[rel=pagination] ul.pagination {
    text-align: center;
    justify-content: center
}

.mb_ad_plate {
    margin: 1rem auto;
    width: 62rem;
    border: 2px solid #669;
    border-radius: 5px;
    background: #fff;
    color: #555
}

.mb_ad_plate p {
    margin: .1rem auto !important
}

.mb_ad_plate>div:last-of-type {
    padding: .3rem
}

.mb_ad_plate img {
    width: 12rem
}

.mb_ad_plate cite,
.mb_ad_plate h3 {
    font-family: "Exo 2";
    font-weight: 700;
    font-size: 2rem;
    color: #444;
    margin: .1rem auto
}

.mb_ad_plate a i {
    margin-left: -2.8rem !important
}

footer {
    display: block;
    width: 100%;
    max-width: 100%;
    padding: 2rem;
    margin: 0 !important;
    background: #ccc;
    color: #444;
}

footer>h2 {
    color: #333
}

footer>div {
    max-width: 90%;
    width: 90%
}

footer>p {
    font-size: 2rem;
    text-align: left;
    margin: .2rem auto;
    width: 90%;
}

footer h4 {
    font-size: 2rem;
    font-family: "Exo 2";
    font-weight: 700
}

footer a {
    display: block;
    text-decoration: none;
    color: #555
}

footer .un_flex>div {
    text-align: left
}

footer #copyright {
    max-width: 90%;
    text-align: center
}

#footer-link {
    font-size: 16px;
    color: #111;
    text-decoration: none
}

#footer-logo,
#footer-made,
#footer-name {
    margin-top: 0;
    margin-bottom: 0;
    vertical-align: middle
}

#footer-name {
    font-weight: 700
}

#footer-logo {
    height: 25px;
    width: 25px;
    margin-left: 10px;
    margin-right: 10px;
    border-radius: 3px
}

.pagination {
    display: flex;
    flex-direction: row
}

.pagination>* {
    display: inline-block;
    margin: .5rem;
    padding: .3rem .6rem;
    border: 2px solid rgba(153, 153, 153, .51);
    border-radius: 3px
}

.btn-group label {
    margin: .2rem 1rem;
    padding: .3rem .6rem;
    background: #797979;
    color: #ddd
}

.btn-group input {
    display: none
}

.btn-group input:checked+label {
    background: #6a6;
    color: #fff
}

[rel=mybooks] {
    width: 100%;
    display: flex;
    background: #ddd
}

.gv_book,
[rel=mybooks]>* {
    display: inline-block;
    background: rgba(153, 153, 153, .4);
    margin: 1rem;
    border-radius: 5px;
    width: 26rem;
    max-width: 36rem;
    flex: 1 1 32rem
}

.gv_book img,
[rel=mybooks]>* img {
    width: 5rem;
    height: 10rem
}

.gv_book>div,
[rel=mybooks]>*>div {
    padding: .5rem
}

.gv_book p,
[rel=mybooks]>* p {
    margin: .3rem 1rem
}

.gv_book p em,
[rel=mybooks]>* p em {
    color: #444;
    font-family: Montserrat
}

.gv_book quote,
.gv_book quote attribution,
.gv_book quote circumstances,
[rel=mybooks]>* quote,
[rel=mybooks]>* quote attribution,
[rel=mybooks]>* quote circumstances {
    font-size: .9rem;
    padding: 1.3rem 2rem .5rem
}

.gv_book quote attribution,
.gv_book quote circumstances,
[rel=mybooks]>* quote attribution,
[rel=mybooks]>* quote circumstances {
    padding: .5rem
}

.gv_book div>cite,
[rel=mybooks]>* div>cite {
    font: italic normal 800 1.6rem/120% Montserrat, sans-serif;
    color: rgba(0, 84, 204, .8)
}

.gv_book quote:before,
[rel=mybooks]>* quote:before {
    position: absolute;
    display: inline-block;
    top: 2px;
    left: 2px;
    font-size: .7rem;
    padding: .15rem;
    color: #888;
    content: "Motto książki:"
}

.gv_book a,
[rel=mybooks]>* a {
    margin: .1rem;
    display: inline-block;
    text-decoration: none
}

.gv_book span[rel=year],
[rel=mybooks]>* span[rel=year] {
    width: 100%;
    display: block;
    padding: .3rem;
    font: italic normal 400 1rem Montserrat, sans-serif;
    color: #888
}

.gv_unpublished cite {
    font-size: 1.4rem;
    color: #0d3333
}

.cn_minigallery>* {
    text-align: center;
    margin: 1rem
}

.cn_minigallery img {
    width: 70%;
    max-width: 100%;
    margin: .4rem
}

.d-block {
    display: block
}

.csch_subtle_3 {
    background: rgba(147, 128, 108, .1)
}

.un_wide8 {
    width: 8rem !important;
    max-width: 8rem !important;
    min-width: 8rem !important
}

.un_wide12 {
    width: 12rem !important;
    max-width: 12rem !important;
    min-width: 12rem !important
}

.un_wide16 {
    width: 16rem !important;
    max-width: 16rem !important;
    min-width: 16rem !important
}

.un_wide18 {
    width: 18rem !important;
    max-width: 18rem !important;
    min-width: 18rem !important
}

.un_wide20 {
    width: 20rem !important;
    max-width: 20rem !important;
    min-width: 20rem !important
}

.un_wide24 {
    width: 24rem !important;
    max-width: 24rem !important;
    min-width: 24rem !important
}

.un_wide16>img,
.un_wide24>img {
    width: 24rem !important;
    max-width: 24rem !important
}

.un_wide16>a,
.un_wide16>button {
    display: block;
    width: 100%;
    max-width: 100%;
    margin: .3rem auto
}

.un_widefull {
    width: 100%;
    max-width: 100%
}

.un_widehalf>div {
    min-width: 45%;
    max-width: 50% margin:0;
    padding: 1rem
}

.un_feedback,
.un_meta {
    padding: .3rem;
    margin: 3rem auto;
    display: block;
    width: 50%;
    min-width: 30rem;
    border: 2px dashed #36f;
    border-left: 6px solid #36f;
    color: #fff !important;
    background: #444
}

.un_feedback em,
.un_feedback span,
.un_meta em,
.un_meta span {
    font: italic 700 1.3rem 'Open Sans' !important
}

.un_feedback:before,
.un_meta:before {
    display: inline-block;
    content: "Komunikat: "
}

.un_feedback.needrefine {
    border: 2px dashed #ff0;
    border-left: 6px solid #ff0
}

.un_feedback.admin,
.un_meta {
    color: #f90;
    border: 2px dashed #f90;
    border-left: 6px solid #f90
}

.un_feedback.error {
    border: 2px dashed #f30;
    border-left: 6px solid #ff3700
}

.un_feedback.welldone {
    border: 2px dashed #00b400;
    border-left: 6px solid #00b400
}

.un_feedback:before {
    display: inline-block;
    background: #777;
    padding: .1rem .3rem;
    font-family: "Ubuntu Condensed";
    content: "Feedback: "
}

.un_feedback.admin:before {
    color: #f90;
    border: 2px dashed;
    content: "Okienko Admina: "
}

.corner {
    display: block;
    position: absolute;
    top: .3rem;
    left: .3rem;
    background: #777;
    color: #fff;
    padding: .1rem .3rem;
    font-family: "Ubuntu Condensed";
    content: "Treść twojej wiadomości: "
}

.un_plate {
    position: relative;
    z-index: 6;
    width: 80%;
    min-height: 240px;
    padding: 3rem 1rem 0;
    font-size: 1rem
}

.un_plate .un_title {
    display: block;
    font: 400 2.8rem Dosis, sans-serif;
    margin: .3rem auto;
    text-align: center;
    text-decoration: none;
    color: rgba(235, 103, 91, .94)
}

.un_plate .un_title:hover {
    color: rgba(243, 49, 49, .89)
}

.un_plate img {
    width: 8rem;
    float: left;
    margin: 1rem
}

.un_flex {
    display: flex !important;
    flex-wrap: nowrap
}

.un_flex_vt {
    flex-direction: column;
    justify-content: flex-start;
    align-self: start
}

.un_flex_vc {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center
}

.un_flex_vs {
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch
}

.un_flex_hc {
    flex-direction: row;
    justify-content: center;
    text-align: center;
    align-items: center
}

.un_flex_ht {
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start
}

.un_flex_hs {
    flex-direction: row;
    justify-content: space-around;
    align-items: stretch;
    align-content: flex-start
}

.un_flex_even>* {
    width: 0;
    flex: 1 1 auto
}

.un_flex_even {
    justify-content: spaced-between;
    width: 100%
}

.un_flex_wrap {
    flex-wrap: wrap
}

.un_flex_sc {
    align-self: center
}

.un_flex>div {
    flex: 1 1 auto;
    max-width: 90%
}

.un_flex>img {
    flex: 1 1 16rem
}

.un_flex>h2,
.un_flex>h3 {
    width: 100%;
    text-align: center;
    padding: 1rem
}

.un_flex_c20>* {
    flex: 1 1 20rem !important
}

.un_flex>.un_presenter_2 {
    flex: 1 2 42rem
}

.un_flex>.un_presenter_3 {
    flex: 1 1 20rem
}

.un_flex>i {
    flex: 1 1 16rem;
    font-size: 3rem;
    align-self: center;
    color: #fff;
    text-align: center;
    text-indent: 0;
    text-shadow: 4px 5px 5px rgba(111, 103, 103, .56)
}

.flex_cent {
    display: flex;
    position: relative;
    margin: 0 auto !important;
    height: 100vh;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.flex_cent>* {
    display: block;
    width: 70vw;
    font-weight: 700
}

.m0 {
    margin: 0
}

.mt0 {
    margin-top: 0
}

.mr0 {
    margin-right: 0
}

.mb0 {
    margin-bottom: 0
}

.ml0,
.mx0 {
    margin-left: 0
}

.mx0 {
    margin-right: 0
}

.my0 {
    margin-top: 0;
    margin-bottom: 0
}

.m1 {
    margin: .5rem
}

.mt1 {
    margin-top: .5rem
}

.mr1 {
    margin-right: .5rem
}

.mb1 {
    margin-bottom: .5rem
}

.ml1,
.mx1 {
    margin-left: .5rem
}

.mx1 {
    margin-right: .5rem
}

.my1 {
    margin-top: .5rem;
    margin-bottom: .5rem
}

.m2 {
    margin: 1rem
}

.mt2 {
    margin-top: 1rem
}

.mr2 {
    margin-right: 1rem
}

.mb2 {
    margin-bottom: 1rem
}

.ml2,
.mx2 {
    margin-left: 1rem
}

.mx2 {
    margin-right: 1rem
}

.my2 {
    margin-top: 1rem;
    margin-bottom: 1rem
}

.m3 {
    margin: 2rem
}

.mt3 {
    margin-top: 2rem
}

.mr3 {
    margin-right: 2rem
}

.mb3 {
    margin-bottom: 2rem
}

.ml3,
.mx3 {
    margin-left: 2rem
}

.mx3 {
    margin-right: 2rem
}

.my3 {
    margin-top: 2rem;
    margin-bottom: 2rem
}

.m4 {
    margin: 4rem
}

.mt4 {
    margin-top: 4rem
}

.mr4 {
    margin-right: 4rem
}

.mb4 {
    margin-bottom: 4rem
}

.ml4,
.mx4 {
    margin-left: 4rem
}

.mx4 {
    margin-right: 4rem
}

.my4 {
    margin-top: 4rem;
    margin-bottom: 4rem
}

.mxn1 {
    margin-left: -.5rem;
    margin-right: -.5rem
}

.mxn2 {
    margin-left: -1rem;
    margin-right: -1rem
}

.mxn3 {
    margin-left: -2rem;
    margin-right: -2rem
}

.mxn4 {
    margin-left: -4rem;
    margin-right: -4rem
}

.ml-auto {
    margin-left: auto
}

.mr-auto,
.mx-auto {
    margin-right: auto
}

.mx-auto {
    margin-left: auto
}

.p0 {
    padding: 0
}

.pt0 {
    padding-top: 0
}

.pr0 {
    padding-right: 0
}

.pb0 {
    padding-bottom: 0
}

.pl0,
.px0 {
    padding-left: 0
}

.px0 {
    padding-right: 0
}

.py0 {
    padding-top: 0;
    padding-bottom: 0
}

.p1 {
    padding: .5rem
}

.pt1 {
    padding-top: .5rem
}

.pr1 {
    padding-right: .5rem
}

.pb1 {
    padding-bottom: .5rem
}

.pl1 {
    padding-left: .5rem
}

.py1 {
    padding-top: .5rem;
    padding-bottom: .5rem
}

.px1 {
    padding-left: .5rem;
    padding-right: .5rem
}

.p2 {
    padding: 1rem
}

.pt2 {
    padding-top: 1rem
}

.pr2 {
    padding-right: 1rem
}

.pb2 {
    padding-bottom: 1rem
}

.pl2 {
    padding-left: 1rem
}

.py2 {
    padding-top: 1rem;
    padding-bottom: 1rem
}

.px2 {
    padding-left: 1rem;
    padding-right: 1rem
}

.p3 {
    padding: 2rem
}

.pt3 {
    padding-top: 2rem
}

.pr3 {
    padding-right: 2rem
}

.pb3 {
    padding-bottom: 2rem
}

.pl3 {
    padding-left: 2rem
}

.py3 {
    padding-top: 2rem;
    padding-bottom: 2rem
}

.px3 {
    padding-left: 2rem;
    padding-right: 2rem
}

.p4 {
    padding: 4rem
}

.pt4 {
    padding-top: 4rem
}

.pr4 {
    padding-right: 4rem
}

.pb4 {
    padding-bottom: 4rem
}

.pl4 {
    padding-left: 4rem
}

.py4 {
    padding-top: 4rem;
    padding-bottom: 4rem
}

.px4 {
    padding-left: 4rem;
    padding-right: 4rem
}

.centered {
    text-align: center
}

h1,
h2 {
    color: #6a6;
    font: normal normal 700 4rem/140% "Exo 2", cursive, serif;
    letter-spacing: .3px;
    text-align: center
}

H2 {
    font-size: 3rem
}

h3 {
    color: #6a6;
    font: normal normal 400 2rem/120% "Exo 2", cursive, serif
}

[rel=navigate]+h3 {
    margin: 1rem auto;
    font-size: 3rem !important
}

h1 {
    margin: 0 auto
}

h4 {
    color: #6a6;
    font: normal normal 400 2rem/120% "Exo 2", cursive, serif
}

h4 a {
    color: #6a6
}

h5 {
    font: normal normal 400 1.4rem/120% "Ubuntu Condensed", cursive, serif;
    color: rgba(102, 102, 102, .8);
    font-size: 80%
}

[rel=title] span,
h1 span {
    display: block;
    font-size: 60%
}

.cn_nav {
    color: #999;
    font: normal normal 400 1.3rem/120% "Ubuntu Condensed", sans-serif
}

.cn_nav a {
    color: #777
}

h1[rel=title] {
    margin-bottom: .5rem !important;
    text-align: center !important
}

[rel=object] strong {
    color: #444
}

[rel=object] strong.muted {
    color: #777
}

a[href="#top"] {
    display: block;
    margin: 1rem auto;
    text-align: center
}

a[href="#top"] jpg {
    text-align: center;
    margin: .2rem auto
}

nav[rel=metainfo] {
    text-align: center;
    color: #999
}

nav[rel=metainfo] * {
    color: #888
}

nav[rel=metainfo] :hover {
    color: #444
}

nav[rel=metainfo] a+a {
    margin-left: 1rem
}

nav[rel=navigate] {
    font: normal normal 400 1.3rem/120% "Ubuntu Condensed", sans-serif;
    color: #888
}

nav[rel=navigate] a {
    color: #888;
    text-decoration: none
}

nav[rel=navigate] a+a {
    margin-left: 1rem
}

nav[rel=navigate] a+a:nth-of-type(odd) {
    color: #222
}

.cn_adaside {
    text-align: center
}

.cn_adaside>div {
    max-width: 100%
}

.cn_nav a,
.nav-item a {
    font: normal normal 400 1.6rem/120% "Ubuntu Condensed", sans-serif
}

.nav-item a.red {
    color: red !important
}

.minisection {
    display: block;
    background: #aaa
}

[rel=admin] {
    color: #f88 !important
}

[rel=admin]:before {
    content: "Admin: "
}

article {
    margin-bottom: 15rem
}

article h5 {
    font: normal normal 600 1.7rem/120% "Exo 2", sans-serif;
    color: #6a6
}

article p {
    font: normal normal 400 2rem/140% "Open Sans", sans-serif;
    text-indent: 2rem
}

article p a {
    color: #6a6
}

.summary,
article p:first-of-type {
    font: bold normal 600 1.5rem/120% "Josefin Sans", sans-serif
}

.summary {
    width: 70%;
    font: normal normal 600 1.7rem/120% "Josefin Sans", sans-serif
}

article>p:last-of-type:after {
    display: block;
    margin-top: 2rem;
    color: #6a6;
    text-indent: 0;
    font-size: 3rem;
    content: "■"
}

article,
article>p {
    font-size: 1.7rem !important;
    text-align: justify !important
}

article iframe {
    margin: 1rem auto;
    width: 90% ''
}

article figure {
    background: 0 0;
    background-image: none !important
}

article figure.un_fullwide {
    display: block;
    float: none;
    margin: 2rem auto;
    max-height: auto !important;
    height: auto !important;
    width: 100% !important
}

article figure.un_flex_hs {
    display: block;
    float: none;
    margin: 2rem auto;
    max-height: auto !important;
    height: auto !important;
    width: 100% !important;
    max-width: 70% !important
}

article figure.un_flex_hs figcaption {
    align-self: center;
    text-align: left;
    padding: 1rem
}

article cite {
    color: #558a9b;
    text-align: justify
}

article blockquote {
    background: #f9f9f9;
    border-left: 10px solid #ccc;
    margin: 1.5em 10px;
    padding: .5em 10px;
    quotes: "\201C" "\201D" "\2018" "\2019";
    font-size: 1.4rem
}

article blockquote:before {
    color: #ccc;
    content: open-quote;
    line-height: .1em;
    margin-right: .25em;
    vertical-align: -.4em
}

article blockquote p {
    display: inline
}

.block {
    display: block;
    margin: 2rem auto
}

figure {
    text-align: center
}

figure img {
    margin: 1rem auto
}

.cn_quote {
    padding: 1rem;
    font: normal 300 1.4rem 'Exo 2', sans-serif
}

.cn_quote p {
    font: normal 300 1.4rem 'Exo 2', sans-serif;
    width: 80%;
    margin: .4rem auto !important
}

.cn_quote attribution {
    display: block;
    color: #555;
    font-size: 80%;
    text-align: right;
    margin-right: 1rem
}

.cn_widgetpresenter {
    display: block;
    background: rgba(221, 221, 221, .9);
    width: 70%;
    margin: 4rem auto;
    padding: 1rem
}

.cn_widgetpresenter img {
    max-height: 12rem
}

.cn_widgetpresenter .cn_title>div {
    max-height: 12rem;
    background-color: #c9c9c9
}

.cn_widgetpresenter>.csch_subtle_3 {
    padding: 2rem
}

.cn_widgetpresenter h3 {
    text-align: center;
    font-size: 2rem
}

.cn_widgetpresenter h3 a {
    color: #6a6;
    font-size: 2rem;
    font-family: "Exo 2";
    font-weight: 700
}

.cn_widgetpresenter h3 span {
    display: block;
    font-size: 70%;
    color: #888
}

.cn_widgetpresenter a {
    text-decoration: none
}

.cn_widgetpresenter h4 {
    font-size: 2rem;
    margin: 0;
    color: #676 !important
}

.cn_widgetpresenter p.sample {
    font-size: 1.4rem;
    line-height: 1.3;
    text-align: justify;
    color: #444;
    font-family: "Open Sans"
}

.cn_pp_1 {
    width: 100%;
    background: #ccc
}

.cn_ip_1 {
    width: 100%;
    background: #ccc;
    padding: 1rem
}

.cn_ip_1>div:nth-of-type(2) {
    padding: 1rem
}

.cn_ip_1 h4 {
    color: #6a6;
    margin: 1rem auto .5rem
}

.cn_ip_1 img {
    width: 12rem;
    max-width: 100%
}

.un_plate {
    display: block;
    margin: 1rem auto;
    background: rgba(204, 204, 204, .9)
}

.un_entry {
    width: 100%;
    margin: .5rem auto;
    background: rgba(170, 170, 170, .2);
    justify-content: center;
    align-items: center
}

.un_entry .un_wide16 {
    width: 16rem;
    max-width: 16rem;
    text-align: center
}

.un_entry h2 {
    font: normal normal 700 3rem/120% "Exo 2", sans-serif
}

.un_entry h3 {
    color: #333;
    font: normal normal 400 2rem/120% "Josefin Sans", sans-serif
}

.un_entry h3 a {
    color: #6a6;
    font-size: 3rem !important;
    text-decoration: none
}

.un_entry p span {
    color: rgba(70, 70, 70, .6)
}

.h-bar {
    background-color: #34c2e3;
    height: 25px;
    padding: 5px;
    width: 350px;
    margin: 50px 0;
    border-radius: 5px;
    box-shadow: 0 1px 5px #000 inset, 0 1px 0 #444
}

.h-bar span {
    display: inline-block;
    height: 100%;
    border-radius: 3px;
    transition: width .4s ease-in-out;
    box-shadow: 0 5px 5px rgba(255, 255, 255, .7) inset, 0 -5px 5px rgba(255, 255, 255, .7) inset;
    animation: animate-glow 1s ease-out infinite
}

@keyframes animate-glow {
    0% {
        box-shadow: 0 5px 5px rgba(255, 255, 255, .7) inset, 0 -5px 5px rgba(255, 255, 255, .7) inset
    }
    50% {
        box-shadow: 0 5px 5px rgba(255, 255, 255, .3) inset, 0 -5px 5px rgba(255, 255, 255, .3) inset
    }
    100% {
        box-shadow: 0 5px 5px rgba(255, 255, 255, .7) inset, 0 -5px 5px rgba(255, 255, 255, .7) inset
    }
}

.un_flxpg>div:first-of-type,
[rel=main]>div:first-of-type {
    padding: 1rem
}

.un_flxpg .aside,
.un_flxpg>aside,
.un_flxpg>div:nth-of-type(2),
[rel=main] .aside,
[rel=main]>aside,
[rel=main]>div:nth-of-type(2) {
    background: rgba(170, 170, 170, .6);
    padding: 1rem
}

.un_flxpg h4,
[rel=main] h4 {
    display: block;
    margin: .2rem auto;
    width: 100%;
    text-align: center;
    font-size: 2rem;
    font-family: 'Exo 2', cursive;
    font-weight: 700;
    color: rgba(41, 122, 169, .8)
}

.un_flxpg h4 span,
[rel=main] h4 span {
    display: block;
    font-size: 90%
}

.un_flxpg p,
[rel=main] p {
    text-decoration: none
}

.un_dialog {
    display: block;
    position: relative;
    width: 80%;
    margin: 1rem;
    padding: 1rem;
    background: #fff;
    box-shadow: 2px 2px 3px 1px rgba(18, 11, 11, .3)
}

.un_dialog h3 {
    text-align: center;
    font-size: 2rem
}

.un_dialog div.content,
.un_dialog p {
    font-size: 3.5rem
}

.cn_adaside img {
    max-width: 100%
}

.cn_adaside a {
    text-decoration: none !important
}

.cn_adaside p {
    color: rgba(0, 84, 204, .8)
}

.cn_adaside>div {
    width: 100%
}

.cn_list a {
    font-size: 2rem;
    text-decoration: none
}

.chinese {
    font-size: 2rem;
    color: #777
}

.button {
    display: inline-block;
    padding: .3rem .6rem !important;
    margin: .1rem .6rem !important;
    text-decoration: none;
    background: rgba(85, 85, 85, .6);
    border: 2px solid rgba(85, 85, 85, .6);
    border-radius: 3px;
    color: rgba(255, 255, 255, .81)
}

.button i {
    color: #fff
}

.button.secondary {
    background: rgba(170, 170, 170, .6);
    border: 2px solid rgba(170, 170, 170, .6)
}

.button.act {
    display: inline-block
}

.button.mini {
    display: inline-block;
    border: 1px solid #eee !important;
    padding: .2rem .4rem !important;
    font-size: .9rem !important;
    font: normal normal 600 1.2rem/120% "Open Sans", sans-serif
}

.button:hover {
    color: #fff;
    background: #797979
}

.un_object {
    padding: 2rem
}

.m-1 {
    margin: .5rem
}

.m-2 {
    margin: 1rem
}

.p-1 {
    padding: .5rem
}

.p-2 {
    padding: 1rem
}

.cn_choicecontainer>div {
    flex: 1 1 auto;
    font-family: "Open Sans", sans-serif;
    padding: 0;
    margin: 1rem;
    background: #fff;
    box-shadow: 4px 4px 10px 2px rgba(18, 11, 11, .3);
    border-radius: 5px;
    overflow: hidden
}

.cn_choicecontainer>div h3 {
    text-align: center
}

.cn_choicecontainer.un_flex_hs>div {
    width: 30%
}

.cn_choicecontainer>div h2 {
    height: 7rem;
    font-family: "Open Sans", sans-serif !important;
    font-weight: 700 !important;
    margin: 0 !important;
    background: rgba(17, 19, 59, .42);
    color: #fff;
    max-width: 100%;
    overflow: hidden
}

.cn_choicecontainer>div h2:last-of-type {
    font-weight: 700;
    padding: 1rem;
    background: rgba(65, 63, 61, .84);
    color: #fff;
    border-radius: 0 0 5px 5px
}

.cn_choicecontainer ul,
ul.list {
    width: 90%;
    margin: .5rem auto
}

.cn_choicecontainer ul+p {
    font-size: 80%
}

.cn_choicecontainer ul li,
ul.list li {
    font-size: 110% !important;
    color: #558a9b;
    font-family: "Exo 2"
}

.un_box.m-x-auto,
nav.m-1 {
    text-align: center
}

nav a {
    color: rgba(41, 122, 169, .8)
}

.un_nav2,
.un_plate .un_attitude_icons2 {
    background: red;
    display: none !important
}

.nav_emp {
    background: #0d6efd;
    color: #fff !important
}

.nav_emp a {
    color: #fff !important
}


  article p {
    width: 80%;
    margin: .5rem auto;
  }

#chiny-scroll {
  width: 20rem;
  max-width: 20rem;
}
#chiny-scroll > * {
  width: 20rem;
  max-width: 20rem;
}
    @media screen and (max-width: 55.5em) {

    }


@media screen and (max-width: 55.5em) {

	.container {
	    max-width: 100%;
	    margin: 0 auto;
	    width: 100%;
	}
	[rel="main"] {
		flex-direction: column;
		width: 100%!important;
		max-width: 100%!important;
/*		background: red;*/
	}
	.cn_title {
		flex-direction: column;
		text-align: center;
		margin: 2rem auto;
		> div {
			width: 95%;
		}
	}

.un_plate {
	margin: .2rem 0;
	width: 100%;
}
#list_articles {
	width: 95%!important;
	min-width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
}
article {
	max-width: 100%!important;
	width: 95%;
	margin: 1rem auto!important;
	padding: 0!important;
	overflow: hidden;
}
article > p {
    max-width: 95%;
    width: 95%!important;
    margin: .5rem auto;
}

p.wing {
	width: 95%;
}


.cn_title {
	width: 95%;
	max-width: 100%;
	a {
		width: 80%;
		margin: 0 auto;
		text-align: center;
	}
	a img {
		width: 40%;
	max-width: 100%;
	margin: 1rem;
	}
	> div {
		width: 100%;
		margin: 0 auto;
		text-align: center;
	}

}


footer {
	width: 100%;
	max-width: 100%;
	padding: 0;
	> p {
/*	background: red;		*/
    text-align: center;
	}	
}
footer .un_flex_hs {
	max-width: 90%;
	margin: 0;
	flex-direction: column;
	> div {
		width: 100%;
	}

}

#copyright {
	width: 90%;
}

.cn_widgetpresenter {
	max-width: 100%;
	width: 80%;
}


[rel="search"] {
	max-width: 100%;
	width: 95%;
}

#chiny-scroll {
	width: 100%;
	max-width: 100%;
	padding: 0;
	> div {
		width: 90%;
		margin: 1rem auto;
	}
}











}