@import url("main-vars.css");

html, body, div, span, applet, object, iframe, table, caption, tbody, tfoot, thead, tr, th, td, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend { vertical-align: top; font-family: inherit; font-weight: inherit; font-style: inherit; font-size: 0; outline: 0; padding: 0; margin: 0; border: 0; }

body                                    { background: var(--color-back); font-family: Arial, Helvetica, Sans-Serif; color: var(--color-text); }


a:link                                  { text-decoration: none; color: var(--color-href); font-weight: bold; }
a:visited                               { text-decoration: none; color: var(--color-href); font-weight: bold; }
a:active                                { text-decoration: none; color: var(--color-href); font-weight: bold; }
a:hover                                 { text-decoration: underline; color: var(--color-href-hover); font-weight: bold; }

h1                                      { color: var(--color-h1); font-size: var(--font-big); font-weight: bold; font-style: normal; text-align: center; }
h2                                      { display: inline-block; color: var(--color-h2); font-size: var(--font-normal); font-weight: bold; }
h3                                      { display: inline-block; color: var(--color-text); font-size: var(--font-very-small); }

.p-normal                               { font-size: var(--font-normal); padding-bottom: var(--padding-normal) !important; }
.p-small                                { font-size: var(--font-normal); padding-bottom: var(--padding-small) !important; }
.p-very-small                           { font-size: var(--font-normal); padding-bottom: var(--padding-very-small) !important; }

.main-content                           { box-sizing: border-box; padding-top: max(10px, 0.8%); padding-left: 2%; padding-right: 2%;  margin: auto; max-width: 1558px; min-width: 380px; width: calc(100% - 20px); }
.main-content p                         { font-size: var(--font-normal); padding-bottom: var(--padding-normal); }
.main-content ul                        { font-size: var(--font-normal); padding-left: max(20px, 2%); padding-bottom: var(--padding-normal); }
.main-content ol                        { font-size: var(--font-normal); padding-left: max(20px, 2%); padding-bottom: var(--padding-normal); }
.main-content li                        { font-size: var(--font-normal); padding-bottom: max(8px, 0.8%); }
.main-content li:only-child             { padding-bottom: 0; }
.main-content li:last-child             { padding-bottom: 0; }
.main-content img                       { max-width: 98%; }
.main-content-mark                      { display: inline-block; color: var(--color-h1); font-size: var(--font-big); font-weight: bold; }
.main-content-text                      { font-family: Verdana, Arial, Helvetica, Sans-serif; font-size: var(--font-normal); color: var(--color-text); }
.main-content-text a                    { font-size: var(--font-normal); text-decoration: underline; color: var(--color-href); }
.main-content-text-small                { font-family: Verdana, Arial, Helvetica, Sans-serif; font-size: var(--font-small); color: var(--color-text); }
.main-content-text-small a              { font-size: var(--font-small); text-decoration: underline; color: var(--color-href); }
.main-content-text-very-small           { font-family: Verdana, Arial, Helvetica, Sans-serif; font-size: var(--font-very-small); color: var(--color-text); }
.main-content-text-very-small a         { font-size: var(--font-very-small); text-decoration: underline; color: var(--color-href); }
.main-content-photo-div                 { width: 100%; }
.main-content-photo-img                 { display: inline-block; padding-bottom: 7px; }
.main-content-photo-img img { max-width: 98%; }

.table-content                          { }
.table-content td, .table-content th    { font-family: Verdana, Arial, Helvetica, Sans-serif; font-size: var(--font-normal); color: var(--color-text); padding: 10px; }
.table-content a                        { font-size: var(--font-normal); }
.table-content-small { }
.table-content-small td, .table-content-small th { font-family: Verdana, Arial, Helvetica, Sans-serif; font-size: var(--font-normal); color: var(--color-text); padding: 10px; }
.table-content-small a                  { font-size: var(--font-normal); }
.table-row-marked                       { background: #CCCCCC; }

.sq-buttons-div                         { margin: auto; max-width: 1558px; min-width: 350px; width: 99%; padding-top: max(10px, 0.8%); padding-bottom: max(10px, 0.8%); }
.sq-buttons                             { display: inline-block; box-sizing: border-box; padding-top: max(3px, 0.4%); padding-bottom: max(3px, 0.4%); padding-left: max(3px, 0.2%); padding-right: max(3px, 0.2%); }
.sq-buttons-div-img                     { }
.sq-buttons-img                         { width: 100%; border: 1px solid #C0C0C0;  }
.sq-buttons-img:hover                   { border: 1px solid #FF0000;  }
.sq-buttons-div-txt                     { padding-top: 2px; text-align: center;  }
.sq-buttons-text                        { font-family: Verdana, Arial, Helvetica, Sans-serif; font-size: 14px; color: #4C9CC2; font-weight: bold; }
.sq-buttons-text a                      { text-decoration: underline; }
.sq-buttons-text:hover                  { color: #FF0000; }

.sq-buttons2-div                        { margin: auto; max-width: 1558px; min-width: 350px; width: 99%; padding-top: max(10px, 0.8%); padding-bottom: max(10px, 0.8%); }
.sq-buttons2                            { display: inline-block; box-sizing: border-box; padding-top: max(3px, 0.4%); padding-bottom: max(3px, 0.4%); padding-left: max(3px, 0.2%); padding-right: max(3px, 0.2%); }
.sq-buttons2-div-img                    { }
.sq-buttons2-img                        { width: 100%; border: 1px solid #C0C0C0;  }
.sq-buttons2-img:hover                  { border: 1px solid #FF0000; }
.sq-buttons2-div-txt                    { padding-top: 2px; padding-left: 2px; }
.sq-buttons2-div-txt:hover              { background-color: rgba(255, 0, 0, 0.2); }
.sq-buttons2-div-txt-2                  { height: 100px; overflow: hidden; }
.sq-buttons2-div-txt-21                 { padding-top: 2px; }
.sq-buttons2-text1                      { font-family: Arial, Verdana, Helvetica, Sans-serif; font-size: 14px; color: #4C9CC2; font-weight: bold; }
.sq-buttons2-text1 a                    { text-decoration: underline; }
.sq-buttons2-text1:hover                { color: #FF0000; }
.sq-buttons2-div-txt-22                 { padding-top: 5px; }
.sq-buttons2-text2                      { font-family: Verdana, Arial, Helvetica, Sans-serif; font-size: 12px; color: #000000; }
.sq-buttons2-div-txt-3                  { padding-top: 5px; }
.sq-buttons2-div-txt-3 a                { text-decoration: none; }
.sq-buttons2-text3                      { font-family: Verdana, Arial, Helvetica, Sans-serif; font-size: 12px; color: #000000; font-weight: bold; }

ul.breadcrumb                           { display: flex; flex-wrap: wrap;  list-style: none; padding-top: max(10px, 0.8%); }
ul.breadcrumb *                         { box-sizing: border-box; }
ul.breadcrumb li                        { position: relative;  border: 1px solid var(--bread-border-color); border-right: 0; padding-bottom: 0; }
ul.breadcrumb li:last-child             { border: 1px solid var(--bread-border-color);  border-right: 0; }
ul.breadcrumb li:first-child:after,
ul.breadcrumb li:first-child a:after
ul.breadcrumb li:first-child span:after { display: none; }
ul.breadcrumb li:after,
ul.breadcrumb li a:after,
ul.breadcrumb li span:after             { content: '';   position: absolute;  border: 0;  top: 50%; }
ul.breadcrumb li:after                  { z-index: 1; border-top: 13px solid transparent; border-bottom: 13px solid transparent; border-left: 13px solid var(--bread-arrow-color); margin-top: -13px; right: -13px; }
ul.breadcrumb li:last-child:after       { border-left: 15px solid var(--bread-arrow-color); }
ul.breadcrumb li a,
ul.breadcrumb li span                   { position: relative; transition: all 0.3s ease-in; text-decoration: none;  color: var(--bread-text-color-a);  text-align: center; overflow: hidden;
                                          display: block; line-height: 22px; padding-top: 0; padding-right: 15px; padding-bottom: 0; padding-left: 20px;
                                          font-family: Verdana, sans-serif; font-size: 13px; font-weight: normal; text-decoration: none; background-color: var(--bread-back-color-a); }
ul.breadcrumb li span                   { color: var(--bread-text-color-span); background-color: var(--bread-back-color-span); text-decoration: none; }
xxxul.breadcrumb li a:after,
xxxul.breadcrumb li span:after          { transition: all 0.3s ease-in; z-index: 2; border-top: 13px solid transparent; border-bottom: 13px solid transparent; border-left: 13px solid var(--bread-arrow-color); margin-top: -13px; right: -13px; }
ul.breadcrumb li a:hover                { background-color: var(--bread-back-color-hover); color: var(--bread-text-color-hover); }
ul.breadcrumb li a:hover:after,
ul.breadcrumb li span:after             {  border-left: 15px solid var(--bread-back-color-span); }

@media screen and (min-width: 1580px)
            {
             .sq-buttons                      { width: 14.28%; }
             .sq-buttons-text                 { font-size: 14px; }
             .sq-buttons2                     { width: 14.28%; }
             .sq-buttons2-div-txt-2           { height: 100px; }
             .sq-buttons2-text1               { font-size: 14px; }
             .sq-buttons2-text2               { font-size: 12px; }
             .sq-buttons2-text3               { font-size: 12px; }
            }

@media screen and (min-width: 1380px) and (max-width: 1579px)
            {
             .sq-buttons                      { width: 14.28%; }
             .sq-buttons-text                 { font-size: 14px; }
             .sq-buttons2                     { width: 14.28%; }
             .sq-buttons2-div-txt-2           { height: 100px; }
             .sq-buttons2-text1               { font-size: 14px; }
             .sq-buttons2-text2               { font-size: 12px; }
             .sq-buttons2-text3               { font-size: 12px; }
            }

@media screen and (min-width: 1260px) and (max-width: 1379px)
            {
             .sq-buttons                      { width: 16.66%; }
             .sq-buttons-text                 { font-size: 14px; }
             .sq-buttons2                     { width: 16.66%; }
             .sq-buttons2-div-txt-2           { height: 100px; }
             .sq-buttons2-text1               { font-size: 14px; }
             .sq-buttons2-text2               { font-size: 12px; }
             .sq-buttons2-text3               { font-size: 12px; }
            }

@media screen and (min-width: 1000px) and (max-width: 1259px)
            {
             .sq-buttons                      { width: 16.66%; }
             .sq-buttons-text                 { font-size: 12px; }
             .sq-buttons2                     { width: 16.66%; }
             .sq-buttons2-div-txt-2           { height: 85px; }
             .sq-buttons2-text1               { font-size: 12px; }
             .sq-buttons2-text2               { font-size: 10px; }
             .sq-buttons2-text3               { font-size: 10px; }
            }

@media screen and (min-width: 780px) and (max-width: 999px)
            {
             .sq-buttons                      { width: 20%; }
             .sq-buttons-text                 { font-size: 12px; }
             .sq-buttons2                     { width: 20%; }
             .sq-buttons2-div-txt-2           { height: 100px; }
             .sq-buttons2-text1               { font-size: 12px; }
             .sq-buttons2-text2               { font-size: 10px; }
             .sq-buttons2-text3               { font-size: 10px; }
            }

@media screen and (min-width: 620px) and (max-width: 779px)
            {
             .about-line1                     { display: block; }
             .about-line1c1                   { display: block; padding-top: max(10px, 0.8%); text-align: center; }
             .about-line1c2                   { display: block; padding-top: max(10px, 0.8%); padding-left: 0; }
             .about-line2                     { display: block; }
             .about-line2c1                   { display: block; padding-top: max(10px, 0.8%); }
             .about-line2c2                   { display: block; padding-top: max(10px, 0.8%); padding-left: 0; text-align: center; }

             .sq-buttons                      { width: 25%; }
             .sq-buttons-text                 { font-size: 12px; }
             .sq-buttons2                     { width: 25%; }
             .sq-buttons2-div-txt-2           { height: 100px; }
             .sq-buttons2-text1               { font-size: 12px; }
             .sq-buttons2-text2               { font-size: 10px; }
             .sq-buttons2-text3               { font-size: 10px; }
            }

@media screen and (max-width: 619px)
            {
             .table-content td, .table-content th             { font-size: var(--font-small); }
             .table-content a                                 { font-size: var(--font-small); }
             .table-content-small td, .table-content-small th { font-size: var(--font-very-small); padding-left: 5px; padding-right: 5px; padding-top: 10px; padding-bottom: 10px; }
             .table-content-small a                           { font-size: var(--font-very-small); }

             .about-line1                     { display: block; }
             .about-line1c1                   { display: block; padding-top: max(10px, 0.8%); text-align: center; }
             .about-line1c2                   { display: block; padding-top: max(10px, 0.8%); padding-left: 0; }
             .about-line2                     { display: block; }
             .about-line2c1                   { display: block; padding-top: max(10px, 0.8%); }
             .about-line2c2                   { display: block; padding-top: max(10px, 0.8%); padding-left: 0; text-align: center; }

             .sq-buttons                      { width: 50%; }
             .sq-buttons-text                 { font-size: 12px; }
             .sq-buttons2                     { width: 50%; }
             .sq-buttons2-div-txt-2           { height: 110px; }
             .sq-buttons2-text1               { font-size: 14px; }
             .sq-buttons2-text2               { font-size: 12px; }
             .sq-buttons2-text3               { font-size: 12px; }
            }

.bottom-div          { padding-top: max(20px, 5%); padding-bottom: max(20px, 2%); margin: auto; max-width: 1558px; min-width: 380px; width: calc(100% - 20px); }
.bottom-hr           { border: 0; height: 1px; background: #C9E6F4; margin-bottom: max(20px, 2%); width: calc(100% - 20px); }
.bottom-copyrights   { display: inline-block; box-sizing: border-box; width: calc(100% - 20px); text-align: right; padding-right: 0;  font-family: Arial, Helvetica, Sans-Serif; font-size: var(--bottom-text); color: #000000; font-weight: bold; white-space: nowrap; overflow: hidden; }
.bottom-copyrights a { font-size: var(--bottom-text); color: #537CBB; font-weight: bold; text-decoration: underline;  }