@charset "UTF-8";

* { margin: 0; padding: 0; }
body, html { height:100%; }
html { min-width: 996px; }
body { background: #212121; word-wrap: break-word; overflow-x: hidden; }

h1, h2, h3, h4, h5, .hing, .joomla-nav, .button { line-height: normal; font-weight: normal; font-family: Cuprum, Tahoma, Helvetica, sans-serif; }
h1, h2, h3, h4, h5 { margin-bottom: .3em; }
h1 { font-size: 2.2em; } h2 { font-size: 1.8em; } h3 { font-size: 1.5em; } h4 { font-size: 1.2em; } h5 { font-size: 1.1em; }

a { color: #7fb832; text-decoration: none; }
a:hover {  }
a img  { border: 0 none; }


input, textarea, select, button, body { color: #2c2c2c; font: 14px/20px Tahoma, Arial, Helvetica, sans-serif; }
input, textarea, select, button, a { outline: none; }

p { margin-bottom: .4em; }
hr { border: 0 none; border-top: 1px solid #dbe8ed; height: 1px; }

ul, ol { list-style: none; padding: 0; margin: 0; }
#cside ul { //padding-left: 16px; //list-style: disc outside; } 
#cside ol { list-style-image: none; list-style-position: outside; list-style-type: decimal; margin-left: 2.2em; }

.clr, .item-separator, .row-separator { clear: both; }
.thide, #head h1 a, #hicons a, .ihome, .ionline, .ioffline, .cishostfoot { overflow: hidden; display: block; height: 0; line-height: normal; }
.lcol, .rcol, form { display: inline; }
.lcol { float: left; } .rcol { float: right; }
.small { font-size: 0.85em; }

#topmenu, .block, .tip-wrap, fieldset { -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; }

.body-wrap { min-width: 996px; width: 80%; text-align: left; margin: 0 auto; }
.wrap { max-width: 1120px; min-width: 996px; width: 92%; text-align: left; margin: 0 auto; }
.wrpad { padding: 0 8px; }

/* header */
#head { background: #80b933 url("../images/headbg.png") repeat-x 50% 0;
    position: absolute;
    width: 100%;
    top:0;
 }
  #head .wrap { height: 225px; }
    #header { overflow: hidden; color: #fff; padding: 0 44px; height: 108px; }
    #logoh1 {width:600px; display:block;}
      #header .hing { display:block; margin: 52px 0 0 24px; float: left; font-size: 2em; padding-left: 28px; background: url("../images/hdot.png") no-repeat 0 100%; }
    #logoh1  img {
    float: left;
    display:block;
    padding-top: 38px;
    }
    #logoh1  {
    
    color:#ffffff; 
    text-decoration:none;
    float: left;
    display:block;
    width:700px;
    }
    
    
    #hicons { float: right; }
      #hicons a { float: right; width: 15px; padding-top: 15px; margin: 22px 0 0 5px; background: url("../images/hicons.png"); }
      #hicons .itwit { background-position: 0 -15px; }
      #hicons .irss { background-position: 0 0; }
    
/* topMenu */
#topmenu { height: 51px; background: #fff url("../images/topmenu.png") repeat-x; }
  .ihome { float: left; padding-top: 51px; width: 44px; background: #292929 url("../images/ihome.png") no-repeat; }
    .ihome:hover { background-position: 0 -51px; }

  #topmenu ul, #topmenu ul li, #topmenu ul li a, #topmenu ul li a b { float: left; }
    #topmenu ul li a { text-decoration: none; line-height: 50px; font-size: 1.2em; color: #212121; display: block; height: 51px; }
      #topmenu ul li a b { height: 51px; padding: 0 14px; }
      #topmenu ul li.parent a b { padding-right: 29px; background: url("../images/topsubmenu.png") no-repeat 100% 23px; }
        #topmenu ul li.parent a:hover b, #topmenu ul .parent.hilite a b { background-position: 100% -371px; }
        .joomla-nav a b { font-weight: normal; cursor: pointer; }
    
    #topmenu ul li a:hover b { height: 63px; }
    #topmenu ul li a:hover, #topmenu ul .hilite a { background: #212121 url("../images/topmenu.png") repeat-x 0 -51px; margin-top: -6px; height: 63px; line-height: 62px; color: #fff;
      -moz-box-shadow: 1px 1px 2px 0 #6e6e6e;
      -webkit-box-shadow: 0 1px 2px 0 #6e6e6e;
      box-shadow: 1px 1px 2px 0 #6e6e6e;
    }
    
    #topmenu ul li.selected a { color: #80b933; }
    #topmenu ul li.hilite { position: relative; }
    #topmenu ul li ul { display: none; position: absolute; left: 0; top: 57px; z-index: 100; width: 212px; padding: 8px 0; background: #212121; }
    #topmenu ul ul li, #topmenu ul li.hilite ul li a, #topmenu ul li.hilite ul a b { background: none; float: none; height: auto; line-height: normal; margin: 0; padding: 0; }
      #topmenu ul li.hilite ul li a { color: #fff; width: 100%; padding: 3px 0;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;
      }
      #topmenu ul li.hilite ul li a b { padding: 0 14px; }
      #topmenu ul li.hilite ul li a:hover { background: #80b933; }

    #topmenu ul li.hilite ul { display: block; }

.ioffline, .ionline { margin: -14px 0 0 1em; float: right; padding-top: 75px; width: 180px; background: url("../images/online.png"); }
.ioffline { background-position: 0 -75px; }
  
#pagebg { padding-top: 30px; width: 100%; min-height: 500px; background: #fbfbfb; 
    padding-top: 235px;
} 
  #pagebg .wrpadrsls { padding: 0px 55px 20px 55px; }
    #pagebg .wrpadrs { padding-right: 265px; }
    #pagebg .wrpadls { padding-left: 221px; }

      #rside { width: 224px; padding: 0 8px 0 33px; margin-right: -225px; }
      #lside { width: 180px; padding: 0 33px 0 8px; margin-left: -221px; }

        .mside, #cside { width: 100%; }
        #cside { padding-top: 12px; }

    #lside .block { width: 180px; background: #f6f5f2 url("../images/lside.png") no-repeat 90% 18px; }
      .block { padding: 14px 0; margin-bottom: 20px; }
      .block .dpad { margin: 0 16px; }
      .vmenu .dpad, #lside .gmenu .dpad { margin: 0; }
      .block .hing { padding: 0 16px; font-size: 1.8em; margin-bottom: .3em; }

        .block .joomla-nav { font-size: 1.2em; }
          .block .joomla-nav li a { display: block; width: 100%; padding: 3px 0; }

    .vmenu li *, .gmenu li * { display: block; cursor: pointer; }
    .vmenu li a { width: 100%; text-decoration: none !important; border-top: 1px solid #f6f5f2; }
      .vmenu li a:hover { color: #212121; background-color: #eeebe2; }
        .vmenu li.selected a { color: #212121; }
          .vmenu li.selected ul a { font-size: 0.9em; }
          .vmenu li.selected ul a b { padding-left: 24px; }
      .vmenu li a b, .gmenu li a b { font-weight: normal; padding: 0 16px; }
      .vmenu li ul { background-color: #e0dcd1; }

    #lside .gmenu { color: #fff; background: #80b933 url("../images/gmenu.png") no-repeat 100% 0; }

    .gmenu li a { padding: 4px 0; text-decoration: none !important; color: #212121; }
      .gmenu li a b { padding: 0 16px; }
      .gmenu li.parent a b { padding-right: 20px; background: url("../images/vvmenu.png") no-repeat 162px 50%; }
        
        .gmenu li a:hover, .gmenu li.hilite a { background-color: #212121; color: #fff; }
        .gmenu li.selected a { color: #fff; }

      .gmenu li.hilite { width: 188px; position: relative; }
      .gmenu li ul { display: none; position: absolute; left: 188px; top: 0; z-index: 100; width: 180px; background: #212121; }
        .gmenu li.hilite ul { display: block; }
      
      .gmenu li.hilite ul a b { padding: 0 16px; background: none; }
        .gmenu li.hilite ul a:hover { background-color: #80b933; }

    #rside .block { width: 222px; border: 1px solid #dedede; background: #fff;}

  #rside .gtype { padding-top: 0; }
  .gtype .hing { position: relative; margin: -1px 0 .3em -1px; padding: 9px 17px 0 17px; color: #fff; width: 190px; height: 38px; background: #86bc3c url("../images/gtype.png") no-repeat; }

/* Content */
ul.actions, ul.actions li, ul.pagenav, ul.pagenav li { list-style: none; padding: 0; margin: 0; float:right; }
ul.actions li { margin-left: 10px; }
  .row-separator { display: block; }
  
  .tip-wrap { background-color: #212121; color: #fff; font-size: 14px; line-height: normal; padding: 10px; }

  .items-row, .item, .items-leading { margin-bottom: 2em; }
  .item { display: block; }
  .cols-1 .item { display: block; }
  .cols-2 .item { float: left; width: 48%; }
    .cols-2 .column-1 {  }
    .cols-2 .column-2 { float: right; }

  .cols-3 .item { float: left; width: 29%; margin-right: 6%; }
    .cols-3 .column-2 { margin: 0; }
    .cols-3 .column-3 { float: right; margin: 0; }

    .image-left { float: left; margin: 0 1em 1em 0; }
    .image-right { float: right; margin: 0 0 1em 1em; }

  #cside h2, #cside h2 a { color: #73b21c }
  a.zlink  { color: #73b21c; font-weight:bold; text-decoration:underline; }

  .article-info { font-size: .8em; line-height: 1.3em; color: #979797; margin: 0 0 1em 1em; }

  ul.pagenav { float: none; clear: both; height: 21px; padding: 1em 0 !important; }
  ul.pagenav li { float: left; margin-right: 1em; }

  /* Contacts */
  .contact h3 { padding-bottom: .3em; margin-bottom: .8em; color: #827f77; border-bottom: 1px solid #DEDEDE; }
  .contact-links, .contact-address, .contact-contactinfo, .contact-form { margin-bottom: 1.6em; }
    .jicons-icons { float: left; margin: 3px 6px 0 0; }

  .contact-image { float: right; width: 120px; height: 120px; overflow: hidden; }
    .contact-image img { float: right; max-width: 120px; }

  fieldset { padding: 0; border: 0 none; }
    fieldset legend { display: none; }

    .form { width: 100%; }
    .form th, form td { text-align: left; vertical-align: top; padding: 3px 0; }
      .form th { width: 25%; font-weight: normal; padding-right: 10px; } 
      .form th label { padding-top: 4px; }
      .field input { width: 250px; }
      .field input, .field textarea, .field select { padding: 4px; background: #fff; border: 1px solid #ababab;
        -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;
        -moz-box-shadow: inset 0 1px 2px 0 #dbdbdb;
        -webkit-box-shadow: inset 0 1px 2px 0 #dbdbdb;
        box-shadow: inset 0 1px 2px 0 #dbdbdb;
      }
      .field textarea { width: 392px; }

      .star { color: #ef6500; }

    .checkbox { padding: 4px 0; line-height: 1em; }
      .checkbox input { margin: -2px .4em 0 0; vertical-align: middle; }



.button {
text-decoration: none;
-webkit-transition: all 0.35s ease-in-out;
transition: all 0.35s ease-in-out;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
letter-spacing: 1px;
text-align: center;
display: block;
position: relative;
padding: 10px 28px;
line-height: 12px;
border: 1px solid #80b933;
color: #80b933;
border-radius: 8px;
margin-top: 10px;
background: #fff;
}

.button:hover {
  background: #7fb832;
  color: #fff;
  border-color: #7fb832;
}


.login-button {
text-decoration: none;
-webkit-transition: all 0.35s ease-in-out;
transition: all 0.35s ease-in-out;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
letter-spacing: 1px;
text-align: center;
display: block;
position: relative;
padding: 10px 28px;
line-height: 12px;
border: 1px solid #80b933;
color: #fff;
border-radius: 8px;
margin-top: 10px;
background: #80b933;
}

.login-button:hover {
  background: rgba(143, 191, 78, 0.89);
  color: #fff;
  border-color: rgba(143, 191, 78, 0.89);
}



  /* categories-list */
  #cside .categories-list ul, #cside .profile ul { list-style: none; padding: 0; margin: 0; }
    .categories-list dl { color: #979797; font-size: .8em; margin-bottom: 1em; }
    .categories-list dl dt { float: left; margin-right: 5px; }
    #cside .categories-list ul ul { padding-left: 20px; border-left: 5px dotted #eeebe2;}
      #cside .categories-list ul li { padding: 0 0 10px 0; }

  #cside #users-profile-core { margin-bottom: 1.6em; }

  /* foot */
  #foot { border-top: 1px solid #8DC34C; margin: 0 8px; padding: 14px 0; }
  .copyright { float: left;  line-height: normal; font-weight: normal; font-family: Cuprum, Tahoma, Helvetica, sans-serif; font-size:16px;
  }
   
  .counts { display: inline; }
    .counts ul { float: right; }
      .counts ul li { float: left; width: 88px; height: 31px; margin-left: 5px; opacity:0.5; -moz-opacity:0.5; filter:alpha(opacity=50); }
      .counts ul li:hover { opacity: 1.0; -moz-opacity: 1.0; filter:alpha(opacity=100); }

#footer { color: #fff; padding: 30px 0 80px; background: #212121 url("../images/footer.png") repeat-x 50% 0; }
  #footer .joomla-nav { font-size: 1.1em; float: left; }
    #footer .joomla-nav li { float: left; padding-right: 12px; background: url("../images/fmenu.png") no-repeat 100% 6px; margin-right: 6px; }
    #footer .joomla-nav li ul { display: none; }

  .cishostfoot { float: right; background: url("../images/footlogo.png"); padding-top: 44px; width: 38px; margin-left: 10px; }


/* ----////// Эффект прозрачности /////------- */    

#banners a img {    
opacity:0.9; -moz-opacity:0.9; filter:alpha(opacity=10);
}    

#banners a:hover img {    
opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);
}


/* Базовые стили модального окна  */
.overlay {
    background-color: rgba(0, 0, 0, 0.7);
    bottom: 0;
    cursor: default;
    left: 0;
    opacity: 0;
    position: fixed;
    right: 0;
    top: 0;
    visibility: hidden;
    z-index: 1;
    -webkit-transition: opacity .5s;
    -moz-transition: opacity .5s;
    -ms-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s;
}
.overlay:target {
    visibility: visible;
    opacity: 1;
}
.popup {
    background-color: #fff;
    border: 3px solid #fff;
    display: inline-block;
    left: 30%;
    opacity: 0;
    padding: 15px;
    position: fixed;
    text-align: justify;
	font: 14px Helvetica, Arial, Sans-Serif;
    top: 25%;
    visibility: hidden;
    z-index: 10;
	
    -webkit-transform: translate(-17%, -17%);
    -moz-transform: translate(-17%, -17%);
    -ms-transform: translate(-17%, -17%);
    -o-transform: translate(-17%, -17%);
    transform: translate(-17%, -17%);

    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;

    -webkit-box-shadow: 0 1px 1px 2px rgba(0, 0, 0, 0.4) inset;
    -moz-box-shadow: 0 1px 1px 2px rgba(0, 0, 0, 0.4) inset;
    -ms-box-shadow: 0 1px 1px 2px rgba(0, 0, 0, 0.4) inset;
    -o-box-shadow: 0 1px 1px 2px rgba(0, 0, 0, 0.4) inset;
    box-shadow: 0 1px 1px 2px rgba(0, 0, 0, 0.4) inset;

    -webkit-transition: opacity .5s, top .5s;
    -moz-transition: opacity .5s, top .5s;
    -ms-transition: opacity .5s, top .5s;
    -o-transition: opacity .5s, top .5s;
    transition: opacity .5s, top .5s;
}
.overlay:target+.popup {
    top: 25%;
    opacity: 1;
    visibility: visible;
}
.close {
    background-color: rgba(0, 0, 0, 0.8);
    height: 30px;
    line-height: 30px;
    position: absolute;
    right: 0;
    text-align: center;
    text-decoration: none;
    top: -15px;
    width: 30px;

    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
    border-radius: 15px;
}
.close:before {
    color: rgba(255, 255, 255, 0.9);
    content: "X";
    font-size: 24px;
    text-shadow: 0 -1px rgba(0, 0, 0, 0.9);
}
.close:hover {
    background-color: rgba(64, 128, 128, 0.8);
}
.popup p, .popup div {
    padding: 0px 5px 0px 5px;
}
.lic1 { cursor: zoom-in; cursor: -moz-zoom-in; cursor: -webkit-zoom-in; position: absolute; right:130px ;}
.lic2 { cursor: zoom-in; cursor: -moz-zoom-in; cursor: -webkit-zoom-in; position: absolute; right:180px ;}



.lightbox {
  display: none;
  height: 100%; width: 100%;
  position: absolute; top: 0%; left: 0%;}

.lightbox:target {display: table;}

.lightbox > div {
  vertical-align: middle;
  display: table-cell;
  text-align: center;
}

.lightbox > div > div {
  display: inline-block;
  position: relative;
}

.lightbox > div > div, .video {
  padding: 8px;
  background: #fff;
  text-align: left;
  box-shadow: 0 0 5px #fff;
  z-index: 101;
}

.lightbox img {width: 100%; padding: 0px; display: block;}

.strikethrough {
    position: relative;
    font-size: 14px;
 	font-weight: lighter;
}

.strikethrough:before {
    border-bottom: 2px solid red;
    position: absolute;
    content: "";
    width: 100%;
    height: 50%;
    transform: rotate(-3deg);
}

a[href="#close"] {
  position: fixed; top: 0; bottom: 0; right: 0; left: 0;
  z-index: 100;
  cursor: zoom-out; cursor: -moz-zoom-out; cursor: -webkit-zoom-out;
  background: rgba(0, 0, 0, 0.6);
  text-align: right;
  font-size: 200%; 
  padding-right: 7px;
  text-decoration: none;
  color: #cccccc;
  display: none;}

a[href="#close"]:hover {color: #fff;}

.video:target, .video:target ~ a[href="#close"], .lightbox:target ~ a[href="#close"] {display: block;}

.click-btn {
  display: flex;
  width: $button-width;
  height: 40px;
  justify-content: center;
  align-items: center;
  margin: 0.5rem;
  line-height: 35px;
  border: 1px solid;
  border-radius: $border-radius;
  text-align: center;
  font-size: 16px;
  color: #000;
  text-decoration: none;
  transition: all 0.35s;
  box-sizing: border-box;
}

.btn-style504 {
  border-color: #dd7e2a;;
  color: #dd7e2a;
  transition: all 0.5s;
  &:hover {
    box-shadow: inset 0 1.5em 0em 0em #dd648a,
      inset 0 -1.5em 0em 0em #dd648a;
    border-color: #dd648a;
    color: #fff;
  }
}


.owl-item:hover .caption svg .st3,
.owl-item:hover  {
   fill: #73b21c;
}

.owl-item:hover .caption svg .st1,
.owl-item:hover  {
   fill: #73b21c;
}
:active, :hover, :focus {
    outline: 0;
    outline-offset: 0;
}


.dtr1:hover  svg,
.dtr1:hover  {
   fill: #73b21c;
}

.dtr3:hover p svg,
.dtr3:hover  {
   fill: #73b21c;
}


/*
  https://developer.mozilla.org/en/docs/Web/CSS/box-shadow
  box-shadow: [inset?] [top] [left] [blur] [size] [color];

  Tips:
    - We're setting all the blurs to 0 since we want a solid fill.
    - Add the inset keyword so the box-shadow is on the inside of the element
    - Animating the inset shadow on hover looks like the element is filling in from whatever side you specify ([top] and [left] accept negative values to become [bottom] and [right])
    - Multiple shadows can be stacked
    - If you're animating multiple shadows, be sure to keep the same number of shadows on hover/focus as non-hover/focus (even if you have to create a transparent shadow) so the animation is smooth. Otherwise, you'll get something choppy.
*/

// Animate the size, inside
.fill:hover,
.fill:focus {
  box-shadow: inset 0 0 0 2em var(--hover);
}

// Animate the size, outside
.pulse:hover, 
.pulse:focus {
  animation: pulse 1s;
  box-shadow: 0 0 0 2em transparent;
}

@keyframes pulse {
  0% { box-shadow: 0 0 0 0 var(--hover); }
}

// Stack multiple shadows, one from the left, the other from the right
.close:hover,
.close:focus {
  box-shadow: 
    inset -3.5em 0 0 0 var(--hover),
    inset 3.5em 0 0 0 var(--hover);  
}

// Size can also be negative; see how it's smaller than the element
.raise:hover,
.raise:focus {
  box-shadow: 0 0.5em 0.5em -0.4em var(--hover);
  transform: translateY(-0.25em);
}

// Animating from the bottom
.up:hover,
.up:focus {
  box-shadow: inset 0 -3.25em 0 0 var(--hover);
}

// And from the left
.slide:hover,
.slide:focus {
  box-shadow: inset 6.5em 0 0 0 var(--hover);
}

// Multiple shadows, one on the outside, another on the inside
.offset {  
  box-shadow: 
    0.3em 0.3em 0 0 var(--color),
    inset 0.3em 0.3em 0 0 var(--color);
  
  &:hover,
  &:focus {
    box-shadow: 
      0 0 0 0 var(--hover),
      inset 6em 3.5em 0 0 var(--hover);
  }
}

//=== Set button colors
// If you wonder why use Sass vars or CSS custom properties...
  // Make a map with the class names and matching colors
$colors: (
  fill: #a972cb,
  pulse: #ef6eae, 
  close: #ff7f82, 
  raise: #ffa260, 
  up: #e4cb58, 
  slide: #8fc866, 
  offset: #19bc8b
);

// Sass variables compile to a static string; CSS variables are dynamic and inherited
  // Loop through the map and set CSS custom properties using Sass variables
@each $button, $color in $colors {
  .#{$button} {
    --color: #{$color};
    --hover: #{adjust-hue($color, 45deg)};
  }
}

// Now every button will have different colors as set above. We get to use the same structure, only changing the custom properties.
button {  
  color: var(--color);
  transition: 0.25s;
  
  &:hover,
  &:focus { 
    border-color: var(--hover);
    color: #fff;
  }
}

//=== Pen styling, ignore
body {
  color: #fff;
  background: hsl(227, 10%, 10%);
  font: 300 1em 'Fira Sans', sans-serif;
  
  // Center everything ever
  justify-content: center;
  align-content: center;
  align-items: center;
  text-align: center;
  min-height: 100vh;
  display: flex;
}

// Basic button styles
button {
  background: none;
  border: 2px solid;
  font: inherit;
  line-height: 1;
  margin: 0.5em;
  padding: 1em 2em;
}

h1 { font-weight: 400; }

code { 
  color: #e4cb58;
  font: inherit;
}

sm1{float:left;width:370px;color:#fff}
sm1 .ttl{font-size:22px;font-weight:700;text-transform:uppercase;padding-bottom:20px}
.sm1 .desc{font-size:14px;text-transform:uppercase}
footer ul{list-style:none}
footer ul li{display:block;margin-bottom:3px}
footer ul li a{display:block;font-size:16px;color:#fff;font-weight:700;text-transform:uppercase;text-decoration:none}
footer ul li a:hover{color:#ffc601}
.sm2{float:left;margin-left:60px}
.sm3{float:left;margin-left:30px}
.sm4{float:left;margin-left:30px}


.footer-block {
  display: inline-block;
  font-size: 20px;
}

.footer-block a {
 padding:10px;
}

.footer-block2 {
  display: inline-block;
  margin-left: 268px;
  font-size: 20px;
}

.footer-block3 {
  display: inline-block;
  position: absolute;
  margin-left: 10px;
  margin-top: -5px;
  font-size: 20px;
}

.footer-links {
  margin-top: 20px;
}

.footer-links .footer-block {
  margin-right: 0;
}


.copyright {
  text-align: left;
  margin-top: 20px;
  color: #999999;
}


.columns {
  display: flex;
  padding-top: 20px;
}

.column {
  flex: 1;
}

.column ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.column ul li {
  margin-bottom: 10px;
  color: gray;
}

.column-title {
  color: #999999;
  margin-left: 0;  /* Исправлено */
}

.column ul li a {
    color: gray; /* Цвет ссылок */
    text-decoration: none; /* Удаляем подчеркивание */
}

.column ul li a:hover {
    color: white; /* Цвет ссылок при наведении */
}

.yaradius {
    border-radius: 6px;
    border: 5px solid #fff;
}

.btn-up {
  /* фиксированное позиционирование */
  position: fixed;
  /* цвет фона */
  /* расстояние от правого края окна браузера */
  right: 20px;
  /* расстояние от нижнего края окна браузера */
  bottom: 0;
  /* скругление верхнего левого угла */
  /* скругление верхнего правого угла */
  /* вид курсора */
  cursor: pointer;
  /* отображение элемента как flex */
  display: flex;
  /* выравниваем элементы внутри элемента по центру вдоль поперечной оси */
  align-items: center;
  /* выравниваем элементы внутри элемента по центру вдоль главной оси */
  justify-content: center;
  z-index: 999999;

}

.btn-up::before {
  content: "";
  width: 40px;
  height: 40px;
  background: transparent no-repeat center center;
  background-size: 100% 100%;
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2264px%22%20height%3D%2264px%22%20viewBox%3D%220%200%2064%2064%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20aria-hidden%3D%22true%22%20role%3D%22img%22%20class%3D%22iconify%20iconify--emojione%22%20preserveAspectRatio%3D%22xMidYMid%20meet%22%20fill%3D%22%23000000%22%3E%3Cg%20id%3D%22SVGRepo_bgCarrier%22%20stroke-width%3D%220%22%3E%3C%2Fg%3E%3Cg%20id%3D%22SVGRepo_tracerCarrier%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3C%2Fg%3E%3Cg%20id%3D%22SVGRepo_iconCarrier%22%3E%3Ccircle%20cx%3D%2232%22%20cy%3D%2232%22%20r%3D%2230%22%20fill%3D%22%2380b933%22%3E%3C%2Fcircle%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M48%2030.3L32%2015L16%2030.3h10.6V49h10.3V30.3z%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  z-index: 999999;
}

.btn-up_hide {
  display: none;
}

#search-div {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index:10;
}

#head-div {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}