.clear { clear: both;height: 1px; line-height: 1px; overflow: hidden; margin-bottom: -1px; }
.chyba { background-color:#c81816; color:#ffffff; text-align:center; font-size:14px; padding:5px 0px 5px 0px; margin:2px auto 0px auto; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }

/*------------------------RESET---------------------------*/
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, ul,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%; font: inherit; text-decoration:none; list-style-type: none;}
article, aside, details, figcaption, figure, hgroup, menu, nav, section { display: block; }
/*------------------------------------------------------*/

#rMobPodMenu { margin-top:1em; margin-bottom:1em; }

.TFseznamAd--wrapper                                  { position:fixed; bottom:0px; width:100%; z-index:999999; }
.TFseznamAd--wrapper .TFseznamAd--cButton               { background-color:Black; width:160px; cursor:pointer; line-height:52px; text-align:center; font-size:18px; position:absolute; right:0px; color:White; }
.TFseznamAd--wrapper .content                         { /*height:120px;*/ width:100%; background-color:Black; margin-top:52px; }
.TFseznamAd--wrapper .content > div                   { width:320px; /*height:100px;*/ margin:0px auto; display:block; position:relative; top:10px; }

.rCenter  { display:block; width:100%; }
.rCenter > div { margin:0.5em auto; }


/*#discussion > iframe { min-height:3200px; }*/

.clcont > img,
.clcont a > img,
.clcont a > span > img,
.clcont p img { max-width:100%; width:100%; height:auto !important; }  
.clcont iframe { max-width:100%; width:100%; } 
.clcont > p:first-child { margin-top:0px; }
@media screen and (max-width: 768px) {
  .nomobile { display:none !important; }
  .onlymobile { display:flex !important; }
} 
@media screen and (min-width: 769px) {
  .nomobile { display:flex !important; }
  .onlymobile { display:none !important; }  
} 

article .cols2 { margin-top:0.7rem; }
article .clcont .img span { display: block; width: 100%; font-size: 0.8em; color: #999999; font-style: italic; margin-top: 0.1rem; text-decoration:underline !important; text-decoration-color: white !important; }

.news-detail { width: 500px !important; text-align:left !important; float:left; border:1px solid black; margin:10px 0px 0px 10px !important; }

html                                            {display: block; width: 100%; height: 100%; background: rgb(240,240,240);}
body                                            {display: block; width: 100%; position: relative; font-family: 'Roboto', sans-serif; overflow-x: hidden; overflow-y: auto;}
body.fixed                                      {overflow: hidden;}
form                                            {display: block; width: 100%; overflow-x: hidden;}
.wrapper                                        {display: block; width: 100%; background: white; margin: 0 auto; position: relative; border-radius: var(--border-radius) var(--border-radius) 0 0; overflow: hidden; z-index: 1;}
.content                                        {display: block; width: 100%; position: relative; padding: 0 var(--gap1); box-sizing: border-box; overflow: hidden;}
  @media screen and (min-width: 1081px)         {
  .wrapper                                      {max-width: 1079px;}
  }
  @media screen and (min-width: 769px)          {
  body                                          {font-size: 17px;}
  } 
  @media screen and (max-width: 768px)          {
  body                                          {font-size: 16px;}
  }     
  @media screen and (max-width: 440px)          {
  body                                          {font-size: 15px;}
  }  

:root                                           {
                                                --color1:       #050f28;
                                                --color1b:      #010613;
                                                --color1c:      #5c70a1;
                                                --color1d:      #91a3ce;
                                                --color2:       #ee1700;
                                                --color2b:      #bd1300;
                                                --color3:       rgba(0,0,0,0.06);
                                                --color3b:      rgba(0,0,0,0.12);

                                                --gap1:           1.1rem;
                                                --border-radius:  0.3rem;
                                                --margin-top:     em;
                                                }

.background                                     {display: block; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center top; background-size: 2560px 1440px; position: fixed; left: 0; top: 0;}
  @media screen and (min-width: 960px)          {
  .background                                   {background-image: URL('images/background.jpg');}
  }
  @media screen and (max-width: 960px)          {
  .background                                   {background-image: URL('images/background-mobile.jpg');}
  }

.banner-2000x1400                               {display: block; width: 2000px; position: fixed; left: calc(50% - 1000px); top: 0;}
.banner-2000x1400 img                           {display: block; width: 2000px;}
  @media screen and (max-width: 1080px)         {
  .banner-2000x1400                             {display: none !important;}
  }

.banner-200h                                    {display: block; width: 100%; height: 259px;}
.banner-200h > div                              { margin:0px auto; }
  @media screen and (max-width: 1080px)         {
  .banner-200h                                  {display: none;}
  }

/* HEADER ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ */
.header                                                 {display: flex; width: calc(100% + 2 * var(--gap1)); justify-content: flex-end; align-items: center; flex-wrap: wrap; background: var(--color1); margin: 0 calc(0px - var(--gap1)) calc(0.5 * var(--gap1)); box-sizing: border-box; position: relative; z-index: 1000;}
.header .logo                                           {display: block; height: auto; position: absolute; z-index: 5;}
.header .logo img                                       {display: block; width: 100%; height: auto; transition: .15s ease-in-out;} 
.header .logo:hover img                                 {filter: brightness(0.85);}
.header #navicon                                        {display: none;}
.header > div.soc                                       {display: flex; justify-content: flex-end; align-items: center; position: relative;}
.header > div.soc span                                  {display: block; font-size: 1.15em; color: var(--color1c); font-weight: 400; margin-right: 0.8rem;}
.header > div.soc ul                                    {display: flex;}
.header > div.soc ul li                                 {display: block; width: 1.4em; height: 1.4em; margin-right: 0.5rem;}
.header > div.soc ul li a                               {display: flex; width: 100%; height: 100%; align-items: center;} 
.header > div.soc ul li a img                           {display: block; width: 100%; transition: .15s ease-in-out;}
.header > div.soc ul li a:hover img                     {filter: brightness(1.5);}
.header .collapse                                       {display: block; width: 100%; background: white;}
.header .collapse .search                               {display: flex; position: relative;}
.header .collapse .search button                        {display: block; width: 1.4em; height: 1.4em; background: none; border: none; outline: none; cursor: pointer; padding: 0; position: absolute; left: 2em; top: calc(50% - 0.7em);}
.header .collapse .search button svg                    {display: block; width: 100%; height: 100%; fill: var(--color1c); transition: .15s ease-in-out;}
.header .collapse .search button:hover svg              {fill: white;}
.header .collapse .search input                         {display: block; width: 100%; font-size: 1.15em; color: white; font-weight: 400; background: none; border: none; outline: solid 1px transparent; border-radius: var(--border-radius); box-sizing: border-box; font-family: 'Roboto', sans-serif; transition: .15s ease-in-out;}
.header .collapse .search input::placeholder            {color: var(--color1c); opacity: 1;}
.header .collapse .search input:-ms-input-placeholder   {color: var(--color1c);}     
.header .collapse .search input::-ms-input-placeholder  {color: var(--color1c);}
.header .collapse .search .whisperer                    {display: none; height: 200px; background: white; border-radius: 0 0 var(--border-radius) var(--border-radius); position: absolute; top: 100%; left: 0; z-index: 10000; box-shadow: 0 0 0.4em rgba(0,0,0,0.25);}
.header .collapse nav                                   {display: flex; width: 100%;}
.header .collapse nav > ul                              {display: flex; width: 100%; justify-content: center; align-items: center;}
.header .collapse nav > ul > li                         {display: block; position: relative;}                                       
.header .collapse nav > ul > li > a                     {display: flex; align-items: center; color: var(--color1); font-weight: 700; line-height: 1em; padding: 0.3em 0.3em 0.1em; text-transform: uppercase; border-radius: var(--border-radius); box-sizing: border-box; position: relative; font-family: 'Teko', sans-serif; transition: .15s ease-in-out;}
.header .collapse nav > ul > li:hover > a               {color: var(--color2);}
.header .collapse nav > ul > li > a.sel                 {color: white; background: var(--color2);}
.header .collapse nav > ul > li > a svg                 {display: block; width: 0.6em; height: 0.6em; fill: var(--color1); margin: -0.1em -0.1em 0.1em 0.2em; transform: rotate(-90deg); transition: .15s ease-in-out;}
.header .collapse nav > ul > li > a:hover svg,
.header .collapse nav > ul > li.show > a svg            {fill: var(--color2); transform: rotate(0);}
  @media screen and (min-width: 769px)                  {
  .header                                               {padding: 1rem 1rem 5em;}
  .header #navicon                                      {display: none;}
  .header .logo                                         {width: 10.4em; left: calc(50% - 5.2em); top: 1.2em;}
  .header > div.soc                                     {height: 3rem;}
  .header .collapse                                     {height: 4em; position: absolute; left: 0; bottom: 0;}
  .header .collapse .search                             {width: 50%; height: 5rem; position: absolute; left: 0; top: -5rem;}
  .header .collapse .search input                       {height: 100%; padding: 0 9rem 0 2.8em;}
  .header .collapse .search input:focus                 {background: linear-gradient(to right, var(--color1b) 0%, transparent 100%);}
  .header .collapse .search .whisperer                  {width: calc(100% - 5rem);}
  .header .collapse nav                                 {height: 100%; align-items: center;}
  .header .collapse nav > ul > li:nth-child(-n+4)       {margin-right: 0.6em;}
  .header .collapse nav > ul > li:nth-child(5)          {margin-right: 12em;}
  .header .collapse nav > ul > li:nth-child(n+6)        {margin-right: 1.2em;}
  .header .collapse nav > ul > li > a                   {font-size: 1.6em;}
  .header .collapse nav > ul > li > ul                  {display: inline-block; width: 14.6em; background: var(--color1); border-radius: var(--border-radius); margin-top: 1em; opacity: 0; position: absolute; left: -200vw; top: calc(100% + 0.5em); box-shadow: 0 0 0.4em rgba(0,0,0,0.25); transition: margin-top .25s ease-in-out, opacity .25s ease-in-out;}
  .header .collapse nav > ul > li > ul:before           {display: block; width: 100%; height: 0.5em; position: absolute; left: 0; top: -0.5em; content: "";}
  .header .collapse nav > ul > li > ul > li             {display: flex; width: 100%; align-items: center; z-index: 2; border-bottom: solid 1px black;}
  .header .collapse nav > ul > li > ul > li:last-child  {border: none;}
  .header .collapse nav > ul > li > ul > li a           {display: flex; width: 100%; align-items: center; font-size: 1.15em; font-weight: 600; line-height: 1em; color: white; padding: 0.8em 3em 0.6em 0.8em; box-sizing: border-box; position: relative; font-family: 'Teko', sans-serif; transition: .15s ease-in-out;}
  .header .collapse nav > ul > li > ul > li a:hover     {background: rgba(255,255,255,0.12);}
  .header .collapse nav > ul > li > ul > li a svg       {display: block; width: auto; height: 0.6em; fill: white; position: absolute; right: 0.8em; top: calc(50% - 0.3em); transform: rotate(-90deg);}
  .header .collapse nav > ul > li > ul > li a.sel       {background: var(--color2);}
  .header .collapse nav > ul > li > ul > li a.sel svg   {display: none;}
  .header .collapse nav > ul > li.show ul               {left: -0.38em; margin-top: 0; opacity: 1;}
  .header .collapse nav > ul > li.show.hide ul          {margin-top: -1em; opacity: 0;}
  }
  @media screen and (min-width: 769px) and (max-width: 1080px){
  .header                                               {padding: 1rem 1rem 4em;}
  .header .logo                                         {width: 8.6em; left: calc(50% - 4.3em); top: 0.8em;}
  .header > div.search input                            {padding: 1.2em 5rem 1.2em 2.8em;}
  .header .collapse                                     {height: 3em;}
  .header .collapse nav > ul > li:nth-child(-n+4)       {margin-right: 0.1em;}
  .header .collapse nav > ul > li:nth-child(5)          {margin-right: 8em;}
  .header .collapse nav > ul > li:nth-child(n+6)        {margin-right: 0.6em;}
  .header .collapse nav > ul > li > a                   {font-size: 1.3em;}
  }
  @media screen and (max-width: 768px)                  {
  .header                                               {justify-content: flex-end; padding: 1.8rem 0.5rem;}
  .header .logo                                         {width: 6em; left: calc(50% - 3em); top: 0.4em;}
  .header #navicon                                      {display: block; width: 1.8em; height: calc(100% - 3em); font-size: 1.2em; background: var(--color2); border-radius: var(--border-radius); position: absolute; left: 1rem; top: 1.7rem; cursor: pointer; z-index: 10002;}
  .header #navicon:after                                {display: flex; height: 100%; align-items: center; font-size: 1.15em; color: var(--color1c); position: absolute; left: 2.1em; top: 0; content: "Kategorie"; transition: .2s ease-in-out;}
  .header #navicon span                                 {display: block; width: 50%; height: 3px; background: white; position: absolute; left: 25%; z-index: 1; transition: .2s ease-in-out;}
  .header #navicon:hover                                {background: var(--color2b);}
  .header #navicon:hover::after                         {color: white;}
  .header #navicon span:nth-child(1)                    {top: 0.55rem;}
  .header #navicon span:nth-child(2),
  .header #navicon span:nth-child(3)                    {top: calc(50% - 1.5px); opacity: 0;}
  .header #navicon span:nth-child(4)                    {bottom: 0.55rem;}
  .header.show #navicon span:nth-child(2)               {transform: rotate(45deg); opacity: 1;}
  .header.show #navicon span:nth-child(3)               {transform: rotate(-45deg); opacity: 1;}
  .header.show #navicon span:nth-child(1), 
  .header.show #navicon span:nth-child(4)               {opacity: 0 !important;}
  .header > div.soc                                     {font-size: 1.2em;}
  .header .collapse                                     {height: 100%; overflow: auto; opacity: 0; padding: 7rem calc(5vw + 1rem) 4em; position: fixed; left: -9999px; top: 0; background: var(--color1); z-index: -1; box-sizing: border-box; overflow-y: auto; transition: opacity 0.4s;}
  .header .collapse .search                             {width: 100%; margin-bottom: 1.5rem;}
  .header .collapse .search input                       {background: var(--color1b); padding: 1.1em 1.1rem 1.1em 3em; outline: solid 2px transparent;}
  .header .collapse .search input:focus                 {outline-color: var(--color2);}
  .header .collapse .search .whisperer                  {width: 100%;}
  .header .collapse nav                                 {justify-content: space-between; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; overflow: auto;}
  .header .collapse nav > ul                            {display: flex; width: 100%; height: auto; flex-wrap: wrap; position: relative; z-index: 5000;}
  .header .collapse nav > ul > li                       {display: block; width: 50%; height: auto; padding: 0.5em 0; box-sizing: border-box;}                                       
  .header .collapse nav > ul > li:last-child            {width: 100%; padding-top: 1rem; margin-top: 1rem; border-top: solid 2px black;}
  .header .collapse nav > ul > li > a                   {display: inline-block; text-transform: none; font-size: 2em; color: white;}
  .header .collapse nav > ul > li > ul                  {display: flex; width: 100%; flex-wrap: wrap; margin: -0.8rem 0 0;}
  .header .collapse nav > ul > li > ul > li             {display: block; width: 50%;}
  .header .collapse nav > ul > li > ul > li a           {display: inline-block; font-size: 1.15em; font-weight: 600; line-height: 1em; color: white; margin-top: 0.1em; padding: 0.5em 0.6em; border-radius: var(--border-radius); box-sizing: border-box; font-family: 'Teko', sans-serif; transition: .15s ease-in-out;}
  .header .collapse nav > ul > li > ul > li a:hover     {color: var(--color2);}
  .header .collapse nav > ul > li > ul > li a svg       {display: none;}
  .header .collapse nav > ul > li > ul > li a.sel       {background: var(--color2);}
  .header.show .collapse                                {left: 0; opacity: 1;}
  }
  @media screen and (min-width: 541px) and (max-width: 768px){
  .header .collapse nav > ul > li > ul > li             {width: 33.33%;}
  }
  @media screen and (max-width: 540px)                  {
  .header #navicon:after,  
  .header > div.soc span                                {display: none;}
  }

.footer                                         {display: flex; width: calc(100% + 2 * var(--gap1)); flex-wrap: wrap; gap: 1.6rem; background: var(--color1); padding: 2rem; margin: var(--gap1) calc(0px - var(--gap1)) 0; box-sizing: border-box;}
.footer > div                                   {display: flex; width: 100%; gap: 1.6rem;}
.footer h2                                      {display: block; font-size: 1.5rem; color: white; font-weight: 700; line-height: 1em; margin: 0 0 0.5rem; font-family: 'Teko', sans-serif;}
.footer p,
.footer li                                      {display: block; font-size: 0.9em; color: var(--color1d); font-weight: 400; line-height: 1.6em;}
.footer p strong,   
.footer li strong                               {font-weight: 700;}
.footer p a,
.footer li a                                    {color: var(--color1d); text-decoration: underline; transition: .15s ease-in-out;}
.footer p a:hover,
.footer li a:hover                              {color: white; text-decoration-color: transparent;}
.footer ul                                      {display: block;}
.footer ul.arrow-bullets li a                   {padding-left: 0.7em; box-sizing: border-box; position: relative;}
.footer ul.arrow-bullets li a:before            {display: block; width: 0.36em; height: 1em; opacity: 0.7; background: URL('images/arrow-bullet-white.svg') no-repeat left center; background-size: contain; position: absolute; left: 0; top: 0.1em; content: ""; transition: .15s ease-in-out;}
.footer ul.arrow-bullets li a:hover:before      {opacity: 1;}
.footer .upper                                  {justify-content: space-between;}
.footer .upper > div                            {display: block;}
.footer .upper p                                {text-align: justify; font-size: 0.8em;}
.footer .soc                                    {justify-content: center; align-items: center; flex-wrap: wrap; row-gap: 0.8em; background: rgba(255,255,255,0.04); padding: 1em; border-radius: var(--border-radius); box-sizing: border-box;}
.footer .soc a                                  {display: flex; align-items: center; flex-wrap: wrap; font-size: 0.9em; color: var(--color1c);; font-weight: 700; text-decoration: none; transition: .15s ease-in-out;}
.footer .soc a img,
.footer .soc a svg                              {display: block; width: 1.2em; height: 1.2em; margin: 0 0.4em 0 0;}
.footer .soc a svg                              {fill: var(--color2); border-radius: var(--border-radius); overflow: hidden; transform: rotate(-90deg);}
.footer .soc a svg polygon                      {fill: white;}
.footer .soc a:hover                            {color: white;}
.footer .bottom                                 {justify-content: space-between;}
.footer .bottom p                               {font-size: 0.75em;}
.footer .bottom ul                              {display: flex; flex-wrap: wrap;}
.footer .bottom ul li                           {font-size: 0.75em; white-space: nowrap;}
.footer .copyright                              {width: calc(100% + 4rem); justify-content: center; background: var(--color1b); margin: 0 -2rem -2rem; padding: 1rem 2rem; box-sizing: border-box;}
.footer .copyright ul                           {display: flex; justify-content: center; flex-wrap: wrap; font-size: 0.8em;}
  @media screen and (min-width: 961px)          {
  .footer .upper > div:nth-child(2) ul          {display: flex; width: 18em; flex-wrap: wrap;}
  .footer .upper > div:nth-child(2) ul li       {width: 50%;}  
  }
  @media screen and (max-width: 960px)          {
  .footer .upper                                {flex-wrap: wrap;}
  .footer .upper > div:nth-child(3)             {width: 100%;}
  .footer .bottom                               {justify-content: center; flex-wrap: wrap; gap: 0;}
  .footer .bottom p                             {width: 100%; text-align: center; margin-bottom: 0.5rem;}
  .footer .bottom ul                            {justify-content: center;}
  } 
  @media screen and (min-width: 769px) and (max-width: 960px){
  .footer .upper > div:nth-child(2)             {width: calc(100% - 12em);}
  .footer .upper > div:nth-child(2) ul          {display: flex; width: 100%; flex-wrap: wrap;}
  .footer .upper > div:nth-child(2) ul li       {width: 9em;}  
  }
  @media screen and (max-width: 768px)          {
  .footer .upper > div                          {display: flex; width: 100%; justify-content: center; flex-wrap: wrap;}
  .footer .upper > div h2                       {width: 100%; text-align: center;}
  .footer .upper > div  ul                      {column-count: 2;}
  .footer .upper p                              {text-align: center;}
  }
  @media screen and (min-width: 541px)          {
  .footer .bottom ul li:not(:last-child)        {margin-right: 1.2em; position: relative;}
  .footer .bottom ul li:not(:last-child):after  {display: block; width: 1px; height: 0.9em; background: var(--color1c); position: absolute; right: -0.6em; top: 0.28em; content: "";}
  .footer .copyright ul li:first-child          {margin-right: 1.2em; position: relative;}
  .footer .copyright ul li:first-child:after    {display: block; width: 1px; height: 0.9em; background: var(--color1c); position: absolute; right: -0.6em; top: 0.28em; content: "";}
  }
  @media screen and (max-width: 540px)          {
  .footer .soc a                                {display: block;}
  .footer .soc a img,
  .footer .soc a svg                            {margin: 0 auto 0.5em;}
  .footer .bottom ul                            {display: block;}
  .footer .bottom ul li                         {width: 100%; text-align: center; margin-top: 0.2em;}
  }   

.main                                           {display: block; width: 100%; margin: 0 auto; box-sizing: border-box;}
.main h1, .main h2, .main h3                    {display: block; width: 100%; color: var(--color1); font-weight: 700; line-height: 1em; font-family: 'Teko', sans-serif;}
.main h1                                        {width: 100%; text-align: center; font-size: 3rem; margin: 0;}
.main h2                                        {font-size: 2.2rem; margin: var(--gap1) 0 -0.35rem;}
.main h3                                        {font-size: 1.2rem; margin-top:1.5em;}
.main p, .main li                               {display: block; font-size: 1em; color: var(--color1); line-height: 1.4em; font-weight: 400;}
.main p strong, .main li strong                 {font-weight: 700;;}
.main p a, .main li a                           {color: var(--color1); text-decoration: underline; text-decoration-color: var(--color2); transition: .15s ease-in-out;}
.main p a:hover, .main li a:hover               {color: var(--color2); text-decoration-color: transparent;}
  @media screen and (min-width: 769px) and (max-width: 1080px){
  .main                                         {padding: 1rem 2vw 0;}
  }
  @media screen and (max-width: 768px)          {
  .main                                         {padding-top: 2vw;}
  }

.section                                        {display: flex; width: 100%; flex-wrap: wrap; gap: calc(0.6 * var(--gap1)); padding-bottom: calc(0.6 * var(--gap1));}

.flex                                           {display: flex !important; width: 100%; flex-wrap: wrap;}
.flex.width100 > *                              {width: 100%;}

.button                                         {display: flex; justify-content: center; align-items: center; outline: none; cursor: pointer; text-transform: uppercase; font-weight: 600; position: relative; border: none; padding: 0.5em 1em 0.3em; border-radius: var(--border-radius); box-sizing: border-box; white-space: nowrap; font-family: 'Teko', sans-serif; transition: .15s ease-in-out;}
.button svg                                     {display: block; width: auto; height: 0.7em; fill: white; margin: -0.1em 0 0.1em 0.3em; transform: rotate(-90deg);}
.button.gray                                    {background: var(--color3); color: rgba(0,0,0,0.3);}
.button.gray:hover                              {background: var(--color3b); color: rgba(0,0,0,0.5);}
.button.color2                                  {background: var(--color2); color: white !important;}
.button.color2:hover                            {background: var(--color2b);}

.banner-480x480                                 {display: block; width: 100%;}
.banner-480x480 img                             {display: block; width: 100%; max-width: 480px;}
  @media screen and (min-width: 1080px)         {
  .banner-480x480                               {display: none !important;}
  }

.banner-970x310                                 {display: block; width: 100%;}
.banner-970x310 > div                           { margin:0px auto; }
.banner-970x310 img                             {display: block; width: 100%; max-width: 970px;}
  @media screen and (max-width: 1080px)         {
  .banner-970x310                               {display: none !important;}
  }

.banner-300x600                                 {display: block; width: 100%;}
.banner-300x600 img                             {display: block; width: 100%;}
  @media screen and (max-width: 1080px)         {
  .banner-300x600                               {display: none !important;}
  }

.blog-article-info                              {display: flex; width: 100%; align-items: center; flex-wrap: wrap; gap: 0.5rem;}
.blog-article-info > *                          {display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem; position: relative; z-index: 5;}
.blog-article-info .date                        {color: var(--color2); font-weight: 700;}
.blog-article-info .tags a                      {color: var(--color1); font-weight: 700; text-decoration: underline; transition: .15s ease-in-out;}
.blog-article-info .tags a:hover                {color: var(--color1b); text-decoration-color: transparent;}

.blog-article-preview                           {display: flex; width: 100%; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; border-radius: var(--border-radius); position: relative;}
.blog-article-preview .img                      {display: block; position: relative; border-radius: var(--border-radius); overflow: hidden; order: 0;}
.blog-article-preview .img span                 {display: flex; width: 100%; height: 100%; justify-content: center; align-items: center; position: absolute; left: 0; top: 0;}
.blog-article-preview .img span img             {display: block; width: 100%; transition: .15s ease-in-out;}
.blog-article-preview .info                     {display: block; order: 1;}
.blog-article-preview .info .title              {font-size: 1.6rem; font-weight: 600; margin: 0;}
.blog-article-preview .info .title a            {color: var(--color1); text-decoration: none; transition: .15s ease-in-out;}
.blog-article-preview .info .blog-article-info  {font-size: 0.8em; margin-top: 0.2rem;}
.blog-article-preview .info p                   {width: 100%; font-size: 0.85em; margin-top: 0.3rem;}
.blog-article-preview .info > a                 {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2;}
.blog-article-preview .info:hover .title a      {color: var(--color2);}
.blog-article-preview:hover .img span img,
.blog-article-preview .img:hover span img       {opacity: 0.8;}
  @media screen and (max-width: 1080px)         {
  .blog-article-preview                         {margin-top: 0.5rem;}
  }
  @media screen and (min-width: 960px) and (max-width: 1080px){
  .blog-article-preview                         {width: calc(50% - 0.3 * var(--gap1));}
  }
  @media screen and (min-width: 541px)          {
  .blog-article-preview .img                    {width: 12em; height: 8em;}
  .blog-article-preview .info                   {width: calc(100% - 12.8em);}
  }
  @media screen and (max-width: 540px)          {
  .blog-article-preview .img                    {width: 100%; height: auto; padding-top: 56%;}
  .blog-article-preview .info                   {width: 100%; margin-top: 0.7em;}
  }

.blog-articles                                                                {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: calc(0.6 * var(--gap1));}
  @media screen and (min-width: 441px)                                        {
  .blog-articles.cover-images .blog-article-preview                           {margin: 0;}
  .blog-articles.cover-images .blog-article-preview .img                      {width: 100%; height: auto; padding: 0;}
  .blog-articles.cover-images .blog-article-preview .info                     {display: flex; width: 100%; height: 100%; align-items: flex-end; align-content: flex-end; flex-wrap: wrap; background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%); margin: 0; border-radius: var(--border-radius); overflow: hidden; box-sizing: border-box; position: absolute; left: 0; top: 0; z-index: 2;}
  .blog-articles.cover-images .blog-article-preview .info .title              {margin-bottom: 0.3rem;}
  .blog-articles.cover-images .blog-article-preview .info .title,
  .blog-articles.cover-images .blog-article-preview .info .title a,
  .blog-articles.cover-images .blog-article-preview .blog-article-info .tags a{color: white;}
  .blog-articles.cover-images .blog-article-preview .info p                   {display: none;}
  }
  @media screen and (min-width: 1081px)                                       {
  .blog-articles.cover-images .blog-article-preview .img                      {padding-top: 65%;}
  }
  @media screen and (min-width: 769px) and (max-width: 1080px)                {
  .blog-articles.cover-images .blog-article-preview .img                      {padding-top: calc(30% + 9em);}
  }
  @media screen and (min-width: 769px)                                        {
  .blog-articles.cover-images .blog-article-preview                           {width: calc(50% - 0.3 * var(--gap1));}
  .blog-articles.cover-images .blog-article-preview .info                     {padding: calc(1.5 * var(--gap1));}
  }
  @media screen and (min-width: 441px) and (max-width: 768px)                 {
  .blog-articles.cover-images .blog-article-preview .info                     {padding: calc(0.5rem + 4%);}
  .blog-articles.cover-images .blog-article-preview .img                      {padding-top: calc(30% + 10em);}
  }

.blog-articles.first-two-special .blog-article-preview:nth-child(-n+2) .img,
.blog-articles.all-special .blog-article-preview .img                         {width: 100%; height: auto; padding-top: 56%;}
.blog-articles.first-two-special .blog-article-preview:nth-child(-n+2) .info,
.blog-articles.all-special .blog-article-preview .info                        {width: 100%; margin-top: 0.7em;}
  @media screen and (min-width: 641px)                                        {
  .blog-articles.first-two-special .blog-article-preview:nth-child(-n+2),
  .blog-articles.all-special .blog-article-preview:nth-child(-n+2)            {margin: 0;}   
  .blog-articles.first-two-special .blog-article-preview:nth-child(-n+2),
  .blog-articles.all-special .blog-article-preview                            {width: calc(50% - 0.3 * var(--gap1));}
  }

.blog-articles.latest                                                         {gap: 0; background: var(--color3); box-sizing: border-box;}
.blog-articles.latest h2                                                      {font-size: 1.5rem; margin: 0 0 0.6rem;}
.blog-articles.latest .blog-article-preview:not(:first-of-type)               {margin-top: 0.8rem;}
.blog-articles.latest .blog-article-preview .img                              {width: 100%; padding-top: 56%; height: auto;}
.blog-articles.latest .blog-article-preview .info                             {width: 100%; margin-top: 0.4rem;}
.blog-articles.latest .blog-article-preview .info .title                      {font-size: 1.15rem;}
.blog-articles.latest .blog-article-preview .info .blog-article-info .date    {width: 100%; font-size: 0.75em;}
.blog-articles.latest .blog-article-preview .info .blog-article-info .tags    {margin-top: -0.2em;}
.blog-articles.latest .blog-article-preview .info .blog-article-info .tags a  {font-size: 0.8em;}
  @media screen and (min-width: 1081px)                                       {
  .blog-articles.latest                                                       {padding: 0.8em;}
  }
  @media screen and (min-width: 641px) and (max-width: 1080px)                {
  .blog-articles.latest                                                       {padding: var(--gap1);}
  .blog-articles.latest .blog-article-preview                                 {width: calc(33.33% - 0.4rem);}
  .blog-articles.latest .blog-article-preview:nth-of-type(-n+3)               {margin-top: 0;}
  }
  @media screen and (min-width: 381px) and (max-width: 640px)                 {
  .blog-articles.latest                                                       {padding: var(--gap1);}
  .blog-articles.latest .blog-article-preview                                 {width: calc(50% - 0.4rem);}
  .blog-articles.latest .blog-article-preview:nth-of-type(-n+2)               {margin-top: 0;}
  }
  @media screen and (max-width: 380px)                 {
  .blog-articles.latest                                                       {padding: var(--gap1);}
  .blog-articles.latest .blog-article-preview                                 {width: 100%;}
  .blog-articles.latest .blog-article-preview:nth-of-type(1)                  {margin-top: 0;}
  }

.show-more                                                            {display: flex; width: 100%; justify-content: center; margin: 1rem 0;}

.cols                                                                 {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: calc(0.6 * var(--gap1));}
.cols > div                                                           {display: flex; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; gap: calc(0.6 * var(--gap1));}
.cols > div > *:first-child                                           {margin-top: 0;}
.cols > aside                                                         {display: flex; align-items: flex-start; align-content: flex-start; flex-wrap: wrap; gap: calc(0.6 * var(--gap1));}
.cols > aside h2                                                      {margin-bottom: calc(0.2 * var(--gap1));}
.cols > aside .flex                                                   {margin-top: 0.6rem;}
.cols > aside .fixing-area                                            {display: block; width: 100%; flex-grow: 2; /*background: red;*/ position: relative;}
.cols > aside .fixing-area .fixing-element                            {display: block;}
  @media screen and (min-width: 1081px)                               {
  .cols > div                                                         {width: calc(100% - 300px - 0.6 * var(--gap1)); align-self: flex-start;}
  .cols > aside                                                       {width: 300px; flex-direction: column;}
  .cols > aside .fixing-area                                          {top: -1rem;/* z-index: -1;*/}
  .cols > aside .fixing-area.no-fixing                                {margin-bottom: -2rem;}
  .cols > aside .fixing-area .fixing-element                          {width: 300px; padding: 1rem 0; box-sizing: border-box;}
  .cols > aside .fixing-area .fixing-element.fixed                    {position: fixed; top: 0;}
  .cols > aside .fixing-area .fixing-element.fixed-middle             {position: fixed; bottom: 0; top: auto;}
  .cols > aside .fixing-area .fixing-element.fixed.fixed-end,
  .cols > aside .fixing-area .fixing-element.fixed-middle.fixed-end   {position: absolute; top: auto; bottom: -2rem;}
  }
  @media screen and (max-width: 1080px)                               {
  .cols > div                                                         {width: 100%;}
  .cols > aside                                                       {width: 100%;}
  }

.fighters                                                     {display: flex; width: 100%; flex-wrap: wrap; gap: 0 !important;}

.fighter-preview                                              {display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 1rem;}
.fighter-preview .img                                         {display: block; position: relative; overflow: hidden; border-radius: var(--border-radius);} 
.fighter-preview .img > span                                  {display: flex; width: 100%; height: 100%; justify-content: center; align-items: flex-start; position: absolute; left: 0; top: 0;}
.fighter-preview .img > span img                              {display: block; width: 100%; height: auto; transition: .15s ease-in-out}
.fighter-preview .img:hover > span img                        {opacity: 0.8;}
.fighter-preview .info                                        {display: block;}
.fighter-preview .info .title                                 {font-size: 1.7em; font-weight: 600;}
.fighter-preview .info .title a                               {color: var(--color1); transition: .15s ease-in-out;}
.fighter-preview .info .title a:hover                         {color: var(--color2);}
.fighter-preview .info .nick                                  {display: block; width: 100%; font-size: 1.3em; color: var(--color2); font-weight: 700; line-height: 1em; font-family: 'Teko', sans-serif;}
.fighter-preview .info .basics                                {display: flex; width: 100%; align-items: center; flex-wrap: wrap; margin-top: 0.3rem;}
.fighter-preview .info .basics span                           {font-size: 0.8em; line-height: 1em;}
.fighter-preview .info .basics span:nth-child(2)              {padding-right: 0.5em; margin-right: 0.5em; border-right: solid 1px var(--color2);}
.fighter-preview .info .basics span.flag                      {display: block; width: 1.4em; margin-right: 0.6em;}
.fighter-preview .info .basics span.flag img                  {display: block; width: 100%;}
.fighter-preview .info .flex                                  {margin-top: 0.7rem;}
.fighter-preview .info .flex .button                          {font-size: 0.8em;}
  @media screen and (min-width: 1081px)                       {
  .fighter-preview                                            {width: calc(50% - 0.4rem); min-height: 7rem;}
  .fighter-preview:not(:nth-of-type(even))                    {margin-right: 0.8rem;}
  .fighter-preview:nth-of-type(-n+2)                          {margin-top: 0;}
  .fighter-preview .img                                       {width: 7rem; height: 7rem;}
  .fighter-preview .info                                      {width: calc(100% - 7.8rem);}
  aside .fighter-preview                                      {width: 100%; min-height: auto;}
  aside .fighter-preview:not(:first-of-type)                  {margin-top: 0.6rem;}
  aside .fighter-preview .img                                 {width: 4.5rem; height: auto;}
  aside .fighter-preview .info                                {width: calc(100% - 5.1rem);}
  aside .fighter-preview .info .title                         {font-size: 1.6em;}
  aside .fighter-preview .info .nick                          {font-size: 1.1em;}
  aside .fighter-preview .info .flex                          {display: none;}
  }
  @media screen and (min-width: 961px) and (max-width: 1080px){
  .fighter-preview                                            {width: calc(33.33% - 0.6rem); min-height: 7rem;}
  .fighter-preview:not(:nth-of-type(3n+3))                    {margin-right: 0.9rem;}
  .fighter-preview:nth-of-type(-n+3)                          {margin-top: 0;}
  .fighter-preview .img                                       {width: 7rem; height: 7rem;}
  .fighter-preview .info                                      {width: calc(100% - 7.8rem);}
  }
  @media screen and (min-width: 641px) and (max-width: 960px) {
  .fighter-preview                                            {width: calc(50% - 0.5rem); min-height: 7rem;}
  .fighter-preview:not(:nth-of-type(even))                    {margin-right: 1rem;}
  .fighter-preview:nth-of-type(-n+2)                          {margin-top: 0;}
  .fighter-preview .img                                       {width: 7rem; height: 7rem;}
  .fighter-preview .info                                      {width: calc(100% - 7.8rem);}
  }
  @media screen and (max-width: 640px)                        {
  .fighter-preview .img                                       {width: 7rem; height: 7rem;}
  .fighter-preview .info                                      {width: 100%; margin-top: 0.6rem;}
  }
  @media screen and (min-width: 541px) and (max-width: 640px) {
  .fighter-preview                                            {width: calc(33.33% - 0.6rem);}
  .fighter-preview:not(:nth-of-type(3n+3))                    {margin-right: 0.9rem;}
  .fighter-preview:nth-of-type(-n+3)                          {margin-top: 0;}
  }
  @media screen and (max-width: 540px)                        {
  .fighter-preview                                            {width: calc(50% - 0.4rem);}
  .fighter-preview:not(:nth-of-type(even))                    {margin-right: 0.8rem;}
  .fighter-preview:nth-of-type(-n+2)                          {margin-top: 0;}
  }

.fighter                                                      {display: flex; width: 100%; min-height: 7rem; justify-content: space-between; flex-wrap: wrap;}
.fighter .img                                                 {display: block; position: relative; overflow: hidden; border-radius: var(--border-radius);} 
.fighter .img > span                                          {display: flex; width: 100%; height: 100%; justify-content: center; align-items: flex-start; position: absolute; left: 0; top: 0;}
.fighter .img > span img                                      {display: block; width: 100%; height: auto; border-radius: var(--border-radius); transition: .15s ease-in-out}
.fighter .img:hover > span img                                {opacity: 0.8;}
.fighter .info                                                {display: block;}
.fighter .info .title                                         {text-align: left;}
.fighter .info .nick                                          {display: block; width: 100%; font-size: 1.3em; color: var(--color2); font-weight: 700; line-height: 1em; margin: -0.1rem 0 0; font-family: 'Teko', sans-serif;}
.fighter .info .basics                                        {display: flex; width: 100%; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.5rem;}
.fighter .info .basics > div                                  {display: flex; flex-wrap: wrap; padding: 0.8em 0.8em 0.6em; box-sizing: border-box; border-radius: var(--border-radius);}
.fighter .info .basics > div:nth-child(6)                     {padding-left: 0; padding-right: 0;}
.fighter .info .basics > div h2                               {font-size: 0.8rem; font-weight: 300; margin: 0; font-family: 'Roboto', sans-serif;}
.fighter .info .basics > div p                                {width: 100%; font-size: 1.1rem; font-weight: 600; margin: 0.1em 0 0;}
.fighter .info .basics > div:nth-child(-n+3)                  {background: var(--color1);}
.fighter .info .basics > div:nth-child(-n+3) h2               {text-align: center; color: var(--color1d);}
.fighter .info .basics > div:nth-child(6) h2                  {text-align: center;}
.fighter .info .basics > div:nth-child(-n+3) p                {text-align: center; color: white;}
.fighter .info .basics > div:nth-child(6) p                   {text-align: center;}
.fighter .info .basics > div:nth-child(n+4)                   {background: var(--color3);}
.fighter .info .basics > div > div                            {display: block; flex-grow: 1; box-sizing: border-box;}
.fighter .info .basics > div > div:not(:last-child)           {border-right: solid 1px var(--color3b);}
  @media screen and (min-width: 641px)                        {
  .fighter .img                                               {width: 9rem;}
  .fighter .info                                              {width: calc(100% - 9.8rem);}
  .fighter .info .basics > div:nth-child(-n+3)                {width: calc(16.67% - 0.34rem);}
  .fighter .info .basics > div:nth-child(n+4)                 {width: calc(50% - 0.2rem);}
  }  
  @media screen and (min-width: 441px) and (max-width: 640px) {
  .fighter .img                                               {width: calc(50% - 0.4rem);}
  .fighter .info                                              {width: calc(50% - 0.4rem);}
  .fighter .info .basics                                      {justify-content: space-between;}
  .fighter .info .basics > div:nth-child(-n+3)                {width: calc(33.33% - 0.27rem);}
  .fighter .info .basics > div:nth-child(n+4)                 {width: 100%;}
  }
  @media screen and (max-width: 440px)                        {
  .fighter .img                                               {width: 100%; padding-top: 100%;}
  .fighter .info                                              {width: 100%; margin-top: 1rem;}
  .fighter .info .basics                                      {justify-content: space-between;}
  .fighter .info .basics > div:nth-child(-n+3)                {width: calc(33.33% - 0.27rem);}
  .fighter .info .basics > div:nth-child(n+4)                 {width: 100%;}
  }

.cta                                                {display: flex; width: 100%; background: var(--color1); padding: 1.2em 9em 1.2em 1.2em; margin: 0.5rem 0; border-radius: var(--border-radius); box-sizing: border-box; position: relative;}
.cta p                                              {display: block; width: 100%; font-size: 1.5rem; line-height: 1em; color: white; margin: 0 0 -0.1em !important; font-family: 'Teko', sans-serif;}
.cta .button                                        {width: 6em; height: 100%; font-size: 1.3em; padding-left: 0; padding-right: 0; position: absolute; right: 0; top: 0; border-top-left-radius: 0; border-bottom-left-radius: 0;}
  @media screen and (max-width: 768px)              {
  .cta                                              {padding: 1em 8em 1em 1em;}
  .cta p                                            {font-size: 1.3rem;}
  .cta .button                                      {width: 5.4em; font-size: 1.15em;}
  }

.contacts                                           {display: flex; width: 100%; flex-wrap: wrap; row-gap: 1em;}
.contacts > *                                       {box-sizing: border-box;}
  @media screen and (min-width: 481px)              {
  .contacts > *                                     {width: 50%;}
  .contacts > *:first-child                         {padding-right: 1.5em;}
  }
  @media screen and (max-width: 480px)              {
  .contacts > *                                     {width: 100%;}
  }

.map                                                {display: block; width: 100%; height: 18rem; position: relative; border-radius: var(--border-radius); margin-top: var(--gap1); overflow: hidden; box-sizing: border-box;}
.map iframe                                         {display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0;}

.form                                               {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap;}
.form > div                                         {display: block;}
.form > div:nth-child(4)                            {width: 100%; height: 15rem;}
.form label                                         {display: block; width: 100%; font-size: 0.9em; color: var(--color1); font-weight: 700; margin: 0 0 0.35rem;}
.form input,
.form textarea                                      {display: block; width: 100%; background: var(--color3); font-size: 1rem; color: var(--color1); outline: none; border: solid 1px transparent; border-radius: var(--border-radius); font-family: 'Roboto', sans-serif; padding: 1em; box-sizing: border-box; transition: .2s ease-in-out;}
.form input:focus,
.form textarea:focus                                {background: white; border-color: var(--color2);}
.form textarea                                      {height: 100%; cursor: auto;}
.form input:focus                                   {border-color: var(--color2);}
.form input::placeholder                            {color: #666666; font-weight: 300;}
.form input:-ms-input-placeholder                   {color: #666666; font-weight: 300;}     
.form input::-ms-input-placeholder                  {color: #666666; font-weight: 300;}
.form textarea::placeholder                         {color: #666666; font-weight: 300;}
.form textarea:-ms-input-placeholder                {color: #666666; font-weight: 300;}     
.form textarea::-ms-input-placeholder               {color: #666666; font-weight: 300;}
.form textarea::-webkit-scrollbar                   {width: 10px; border-radius: 6px; background-color: rgba(255,255,255,0.15);}
.form textarea::-webkit-scrollbar-thumb             {border-radius: 5px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1); background-color: var(--color1); cursor: pointer;}
.form .flex                                         {justify-content: space-between; margin: 0.5rem 0 0;}
.form .flex p                                       {font-size: 0.9em; color: #666666 !important;}
.form .flex .button                                 {font-size: 1em;}
  @media screen and (min-width: 769px)              {                                                   
  .form > div:nth-child(-n+3)                       {width: calc(33.33% - 0.4rem);}
  .form > div:nth-child(4)                          {margin-top: 0.6rem;}
  .form .flex p                                     {width: calc(100% - 12rem);}
  }
  @media screen and (max-width: 768px)              {                                                   
  .form                                             {gap: 0.6rem;}
  .form > div:nth-child(-n+3)                       {width: 100%;}
  .form .flex                                       {justify-content: center;}
  .form .flex p                                     {width: 100%; text-align: center; margin-bottom: 0.8rem;}
  }

.cols2                                                                  {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: var(--gap1); margin-top: var(--gap1);}
.cols2 > div                                                            {display: block;}
.cols2 > div > *:first-child                                            {margin-top: 0;}
.cols2 > aside                                                          {display: flex; align-items: flex-start; align-content: flex-start; flex-wrap: wrap;}
.cols2 > aside .fixing-area2                                            {display: block; width: 100%; flex-grow: 2; /*background: red;*/ position: relative;}
.cols2 > aside .fixing-area2 .fixing-element2                           {display: block;}
.cols2 > aside .fixing-area2 .fixing-element2 > *:first-child           {margin-top: 0;}
.cols2 > aside .show-more                                               {margin-bottom: 0;}
  @media screen and (min-width: 1081px)                                 {                                                   
  .cols2 > *:first-child                                                {order: 1; width: calc(100% - 10rem - var(--gap1));}    
  .cols2 > aside                                                        {order: 0; width: 10rem; flex-direction: column;}    
  .cols2 > aside .fixing-area2                                          {top: -1rem; z-index: 1;}
  .cols2 > aside .fixing-area2.no-fixing                                {margin-bottom: -2rem;}
  .cols2 > aside .fixing-area2 .fixing-element2                         {width: 10rem; padding: 1rem 0; box-sizing: border-box;}
  .cols2 > aside .fixing-area2 .fixing-element2.fixed                   {position: fixed; top: 0;}
  .cols2 > aside .fixing-area2 .fixing-element2.fixed-middle            {position: fixed; bottom: 0; top: auto;}
  .cols2 > aside .fixing-area2 .fixing-element2.fixed.fixed-end,
  .cols2 > aside .fixing-area2 .fixing-element2.fixed-middle.fixed-end  {position: absolute; top: auto; bottom: -2rem;}
  .cols2 > aside .show-more .button                                     {width: 100%; font-size: 0.8em;}
  }
  @media screen and (max-width: 1080px)                                 {
  .cols2 > div                                                          {width: 100%;}
  .cols2 > aside                                                        {width: 100%;}
  }

.article                                            {display: block; width: 100%;}
.article h1                                         {text-align: left;}
.article .blog-article-detail-info                  {display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap; gap: 0.5rem 1.5rem; font-size: 0.9em; margin-top: 0.2rem;}
.article .blog-article-detail-info > div            {width: auto;}
.article .blog-article-info2                        {display: flex; align-items: center; flex-wrap: wrap; gap: 0.3em 0.8em;}
.article .blog-article-info2 > *                    {display: flex; align-items: center; font-size: 1em; color: #999999;}
.article .blog-article-info2 > * svg                {display: block; width: auto; height: 1em; fill: var(--color1); margin: 0 0.4em 0 0;}
.article .blog-article-info2 a                      {transition: .15s ease-in-out;}
.article .blog-article-info2 a:hover                {color: var(--color1);}
.article .image                                     {display: block; width: 100%; padding-top: 56%; position: relative; overflow: hidden; margin-top: var(--gap1); border-radius: var(--border-radius); box-sizing: border-box;} 
.article .image > span                              {display: flex; width: 100%; height: 100%; justify-content: center; align-items: flex-start; position: absolute; left: 0; top: 0;}
.article .image > span img                          {display: block; width: 100%; height: auto; border-radius: var(--border-radius); transition: .15s ease-in-out;}
.article .image:hover > span img                    {opacity: 0.8;}
.article .source                                    {display: block; width: 100%; font-size: 0.8em; color: #999999; font-style: italic; margin-top: 0.5rem;}
.article p                                          {margin-top: calc(0.6 * var(--gap1));}
.article strong                                     {font-weight: 700;}
.article em                                         {font-style: italic;}
.article a                                          {color: var(--color1); text-decoration: underline; text-decoration-color: var(--color2); transition: .15s ease-in-out;}
.article a:hover                                    {color: var(--color2); text-decoration-color: transparent;}
.article ul                                         {margin-top: calc(0.6 * var(--gap1));}
.article ul li                                      {padding-left: 1.55em; box-sizing: border-box; position: relative; margin-bottom: 0.4em;}
.article ul li:before                               {display: block; width: 0.3em; height: 0.3em; background: var(--color2); position: absolute; left: 0.8em; top: 0.56em; content: "";}
.article ul li:last-child                           {margin-bottom: 0;}
.article .embed                                     {display: block; width: 100%; margin-top: calc(0.6 * var(--gap1)); border-radius: var(--border-radius);}
.article .embed iframe                              {display: block; width: 100%;}
  @media screen and (max-width: 768px)              {
  .article h1                                       {font-size: 2em;}
  .article h2                                       {font-size: 1.6em;}
  }

.embedBlok                                          {display: block; width: 100%;}

.article .blog-articles                                         {margin-top: calc(0.6 * var(--gap1));}
.article .blog-articles.shorts                                  {background: var(--color3); padding: calc(1.2 * var(--gap1)); margin-top: calc(0.6 * var(--gap1)); box-sizing: border-box;}
.article .blog-articles.shorts .blog-article-preview            {font-size: 0.9em; margin: 1em 0 0; padding: 0; border: none;}
.article .blog-articles.shorts .blog-article-preview:first-child{margin-top: 0;}
.article .blog-articles.shorts .blog-article-preview .title     {font-size: 1.5em;}

.share-bar                                          {display: flex; width: 100%; align-items: center; flex-wrap: wrap; gap: 1em; background: var(--color3); padding: 0.8em; border-radius: var(--border-radius); margin-top: calc(0.6 * var(--gap1)); box-sizing: border-box; position: relative;}
.share-bar > div                                    {display: flex; align-items: center; gap: 1em;}
.share-bar > div > *                                {display: block; position: relative;}
.share-bar > div img                                {height: 1em;}
.share-bar > div p                                  {display: flex; flex-wrap: wrap; font-size: 0.95em; color: #990000; margin: 0; font-family: 'Arial', sans-serif;}
.share-bar > div p span                             {display: inline-block; color: #990000; margin-left: 0.3em;}
.share-bar > div p svg                              {width: 1em; height: 1em; fill: #990000; margin: 0.25em 0.4em 0 0;}
.share-bar .discussion-promo                        {font-size: 0.8em;}
.share-bar > div.share-buttons                      {justify-content: center; gap: 0.3em;}
.share-bar > div.share-buttons span                 {color: #999999;}
.share-bar > div.share-buttons a                    {display: block; width: 1em; height: 1em; cursor: pointer;}
.share-bar > div.share-buttons a img                {display: block; width: 100%; height: auto; filter: grayscale(1); transition: .15s ease-in-out}
.share-bar > div.share-buttons a:hover img          {filter: grayscale(0);}
  @media screen and (min-width: 1081px)             {
  .share-bar                                        {justify-content: space-between;}
  .share-bar > div.share-buttons                    {/*width: 100%;*/}
  }
  @media screen and (min-width: 641px) and (max-width: 1080px){
  .share-bar > div.share-buttons                    {position: absolute; right: 0.8em; top: 0.8em;}
  }
  @media screen and (max-width: 640px)              {
  .share-bar                                        {justify-content: space-between;}
  .share-bar > div.share-buttons                    {/*width: 100%;*/}
  }
  @media screen and (max-width: 640px)              {
  .share-bar,
  .share-bar > div                                  {width: 100%; justify-content: center;}
  }

.article .blog-articles                             {margin-top: calc(0.6 * var(--gap1));}

.swiper-button-prev,
.swiper-button-next                                   {display: block; width: 1.8em; height: 1.8em; font-size: 1em; background: var(--color2); border-radius: var(--border-radius); padding: 0.5em; box-sizing: border-box; position: absolute; top: calc(50% - 0.9em); z-index: 5; margin: 0; cursor: pointer;;} 
.swiper-button-prev                                   {left: 0; right: auto; transform: rotate(90deg);}
.swiper-button-next                                   {right: 0; left: auto; transform: rotate(-90deg);}                                 
.swiper-button-prev svg,
.swiper-button-next svg                               {display: block; width: 100%; height: 100%; fill: white;}
.swiper-button-prev:after,
.swiper-button-next:after                             {display: none;}
.swiper-button-disabled                               {opacity: 0.2 !important;}

.gallery                                              {display: block; width: 100%; position: relative; margin-top: calc(0.6 * var(--gap1));}
.gallery .swiper-container                            {display: block; width: 100%; overflow: hidden;}
.gallery .swiper-slide                                {display: block; width: auto; height: auto; background: var(--color1); border-radius: var(--border-radius); overflow: hidden; position: relative; -webkit-flex-shrink: 0; -ms-flex: 0 0 auto; flex-shrink: 0;}
.gallery .swiper-slide a                              {display: flex; width: 100%; height: 100%; justify-content: center; align-items: center; position: absolute; left: 0; top: 0;}     
.gallery .swiper-slide a img                          {display: block; width: 100%; transition: .15s ease-in-out;}     
.gallery .swiper-slide:hover a img                    {opacity: 0.8;}
.gallery .swiper-button-prev                          {left: -0.3em;}
.gallery .swiper-button-next                          {right: -0.3em;}
.gallery.i1 .swiper-slide                             {padding-top: 56%;}
.gallery.i2 .swiper-slide                             {padding-top: 33%;}

.gallery-detail .banner-970x310                       {width: calc(100% + 2 * var(--gap1)); margin: 0 calc(0px - var(--gap1));} 
  @media screen and (max-width: 1080px)               {
  .gallery-detail .content                            {padding: 0;}
  .gallery-detail .main                               {padding: 0 var(--gap1);}
  .gallery-detail .footer                             {margin-top: 0;}
  }

.gallery-head                                         {display: flex; width: calc(100% + 2 * var(--gap1)); gap: 1em; background: var(--color1); align-items: center; padding: 1em; margin: 0 calc(0px - var(--gap1)); box-sizing: border-box;}
.gallery-head .logo                                   {display: block; width: 5em; height: auto;}
.gallery-head .logo img                               {display: block; width: 5em; height: auto;}
.gallery-head h1                                      {text-align: left; font-size: 1.6em; color: white;}
.gallery-head .close                                  {display: block; width: 1.6em; height: 1.6em; margin-right: 0.3em; position: relative;}
.gallery-head .close:before,
.gallery-head .close:after                            {display: block; width: 100%; height: 3px; background: var(--color1d); position: absolute; left: 0; top: calc(50% - 2px); content: ""; transition: .15s ease-in-out;}
.gallery-head .close:before                           {transform: rotate(-45deg);}
.gallery-head .close:after                            {transform: rotate(45deg);}
.gallery-head .close:hover:before,
.gallery-head .close:hover:after                      {background: white;}

.gallery-detail .gallery .title                       {display: block; width: 100%; text-align: center; font-size: 1.4em;color: var(--color1); font-weight: 700; line-height: 1em; margin: 0 0 0.5rem; font-family: 'Teko', sans-serif;}
.gallery-detail .gallery .source                      {display: block; width: 100%; text-align: center; font-size: 0.8em; color: #999999; font-style: italic; margin-top: 0.5rem;}
  @media screen and (min-width: 769px)                {
  .gallery-detail .gallery                            {padding: 1.5em; background: var(--color3); border-radius: var(--border-radius); box-sizing: border-box;}
  .gallery-detail .gallery .swiper-button-prev        {left: 0.6em;}
  .gallery-detail .gallery .swiper-button-next        {right: 0.6em;}
  }
  
  
.article .embedBlok.anketa { width:100%; }
.article .poll {display: block; width: 100%; font-family: 'Arial', sans-serif; margin-top:1em;}
.article .poll > div {display: flex; width: 100%; height: 2.5em; justify-content: space-between; align-items: center; background: #050f28; margin-bottom: 8px; padding: 0 1.2em; box-sizing: border-box; position: relative; transition: .2s ease-in-out; border-radius: 6px; box-shadow: 0 1px 3px rgba(0,0,0,0.1);}
.article .poll > div:hover {background: #e8e8e8; transform: translateY(-2px); height: calc(2.5em + 4px);}
.article .poll > div:last-of-type {margin-bottom: 0;}
.article .poll > div > div {display: block; height: 100%; background: #ee1700; position: absolute; left: 0; top: 0; z-index: 1; border-radius: 6px;}
.article .poll > div > p {display: block; width: calc(100% - 4.5em); font-size: 0.9em; font-weight: 500; position: relative; z-index: 2; color:#fff; margin-top:0px !important; }
.article .poll > div > span {display: block; width: 4.5em; font-weight: 700; color: #201341; text-align: right; position: relative; z-index: 2; color:#fff;}
.article .poll > div > a {display: block; width: 100%; height: 100%; position: absolute; border: none; left: 0; top: 0; z-index: 3; cursor: pointer; color:#5c70a1; }
.article .poll > p {font-size: 0.85em; color: #777; margin-top: 0.8em; text-align:right; }