/**
* custom.css file created by Yougrids Template
* @package Yougrids Template
* @author Youjoomla.com
* @website Youjoomla.com 
* @copyright  Copyright (c) since 2007 Youjoomla.com.
* @license PHP files are released under GNU/GPL V2 Copyleft License.CSS / LESS / JS / IMAGES are Copyrighted material
**/
/*
 ADD ALL YOUR CUSTOM CSS OVERRIDES TO THIS FILE.
 THIS WAY IF YOU MAKE A MISTAKE YOU CAN ALWAYS TURN CUSTOM CSS FILE OFF
 AND REVERT BACK TO ORIGINAL TEMPLATE CSS
 THIS FILE WILL LOAD VERY LAST AFTER ALL TEMPLATE CSS FILES.
 SO YOU CAN OVERRIDE ANY CSS PART OF THE TEMPLATE YOU NEED.
*/

body,
#stylef6 {
  font-family: verdana, geneva;
  font-size: 10pt;
}

@media (min-width:1281px) {
.sconline {
  margin-top: -20px;
  }
    }
@media (min-width:1281px) {
.socseti {
  padding: 0 0 0 20px;
}
}

.shgln {
    background: url(../images/glsh_21.png) left / cover no-repeat;
    width: 950px;
    position: absolute;
    height: 210px;
}
table, th, td {
  border: 1px solid!important;
  border-collapse: collapse!important;
  
}
td {
  padding: 10px;
  }
.table-header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: nowrap;
    align-items: center;
  }

.button-hrv {
  display: inline-block;
  padding: .75rem 1.25rem;
  border-radius: 10rem;
  color: #fff;
  text-transform: uppercase;
  font-size: 1rem;
  letter-spacing: .15rem;
  transition: all .3s;
  position: relative;
  overflow: hidden;
  z-index: 1;
  &:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #a55749;
    border-radius: 10rem;
    z-index: -2;
  }
  &:before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 100%;
    background-color: brown;
    transition: all .3s;
    border-radius: 10rem;
    z-index: -1;
  }
  &:hover {
    color: #fff;
    &:before {
      width: 100%;
    }
  }
}

.image-block {
  padding: 60px 0 0 5px;
}

.serviceBox{
 display: flex;
 flex-direction: column;
 justify-content: center;
 border: 1px solid #8a716a;
 border-radius: 10px;
 margin-top: 20px;
 padding: 20px 20px;
 position: relative;
 text-align: center;
 background-color: #8faadd;
 min-height: 170px;
 
}

.serviceBox .title{
 font-size: 24px;
 color: #787472;
 background-color: aliceblue;
}
.serviceBox .description{
 font-size: 16px;
 color: #8a716a;
 line-height: 25px;
}
@media only screen and (max-width: 990px){
 .serviceBox{ margin-bottom: 30px; }
}
@media only screen and (max-width: 767px){
 .serviceBox{ margin-bottom: 40px; }
}

.shgln1 {
  background: url(../images/glsh_1.png) left / cover no-repeat;
  width: 950px;
  height: 210px;
}

.shgln2 {
  background: url(../images/glsh_2.png) left / cover no-repeat;
  width: 950px;
  height: 210px;
}

.shgln3 {
  background: url(../images/glsh_3.png) left / cover no-repeat;
  width: 950px;
  position: absolute;
  height: 210px;
}

.shgln1, .shgln2, .shgln3 {
  display: flex;
  align-items: center;
}

img.imggl {
  min-width: 320px;
}

.onas {
  width: auto;
  float: unset;
  text-indent: unset; 
  text-align: center;
  padding: 30px;
}

:root {
  --color-primary: #800000;
}

/**
 * Header
 */
.h-buttons {
  position: absolute;
  right: 0;
}

@media screen and (max-width: 1024px) {
  .h-buttons {
    display: none;
    right: unset;
    bottom: -120px;
  }

  .h-buttons .yjsquare_in {
    display: flex;
    gap: 10px;
  }
}

.h-buttons a:hover {
  color: #fff;
  opacity: 0.8;
}

.h-button {
  color: #fff;
  background-color: var(--color-primary);
  display: flex;
  padding: 5px 20px;
}

@media screen and (max-width: 480px) {
  #header1 {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  .h-buttons {
    display: block;
    z-index: -1;
  }

  .h-buttons .yjsquare_in {
    flex-direction: column;
  }
}

/**
 * Columns
 */

.columns {
  padding: 15px;
}

@media screen and (min-width: 768px) {
  .column-left {
    width: 60%;
    float: left;
  }

  .column-right {
    width: 35%;
    float: right;
    border-left: 1px solid #d1b47a;
    padding-left: 20px;
  }
}

/**
 * Videos
 */
 .videos {
   display: flex;
   flex-wrap: wrap;
   gap: 20px;
 }

 .video {
   position: relative;
   padding-bottom: 18.75%;
   flex: 0 0 33.333%;
   max-width: calc(33.333% - 20px);
 }

 @media screen and (max-width: 600px) {
  .video {
    flex-basis: 100%;
    max-width: 100%;
    padding-bottom: 56.25%;
  }
 }

 .video iframe {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
 }

.resp-table img {
  min-width: 100px;
}

@media screen and (max-width: 600px) {
  .table-header {
    flex-direction: column;
    text-align: center;
  }
}

.h3 {
  font-size: 1.4em;
  font-weight: 700;
  line-height: 1.5;
  margin: 20px 0;
}

.color-primary {
  color: var(--color-primary);
}

.text {
  font-family: verdana, geneva, sans-serif;
}

.text p,
.text li  {
  color: #000;
  font-size: 1.1em;
  line-height: 1.6em;
  text-align: justify;
  margin-bottom: 10px;
}

.resp-tab th {
  text-align: left;
}

.resp-table td {
  vertical-align: middle;
}

@media screen and (max-width: 480px) {
  ul.menutt {
    margin-top: 40px;
  }  
}

.title-2 {
  font-family: verdana, geneva;
  font-size: 21px;
  font-weight: 700;
  color: #800000;
  line-height: 1.5;
  text-wrap: balance;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  #holder {
    display: grid;
  }

  #midblock {
    order: 1;
  }

  #leftblock {
    order: 2;
  }

  .tableWrapper {
    overflow-x: auto;
  }  
}

.table {
  font-size: 10pt;
  color: #000;
  line-height: 20px;
}

.table h3,
.table .h3 {
  font-family: verdana, geneva;
}

.table th {
  padding: 10px;
}

.table__heading {
  font-size: 18px;
  font-weight: 700;
}

.table__annotation {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 20px;
}

@media screen and (max-width: 480px) {
  .table__annotation {
    grid-template-columns: 1fr;
  }
}

.table__date {
  font-weight: 700;
}

.table__image {
  width: 350px;
  height: auto;
}

.contentBox .h3 {
  text-align: center;
}

.contentBox p,
.contentBox li {
  font-family: verdana, geneva;
  font-size: 10pt;
  color: #000;
  margin-bottom: 10px;
  text-align: justify;
  line-height: 1.5;
}

.info p {
  font-size: 13pt;
}

.contentBox .info__price {
  text-align: center;
  font-weight: bold;
}

.contentBox ol {
  list-style: none;
  counter-reset: li;
}
.contentBox ol li:before {
  counter-increment: li; 
  content: counters(li,".") ". ";
}

.contentBox li li {
  margin-bottom: 5px;
}

.notStylized li {
  background: unset;
  padding-left: 0;
}

.certificates {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;  
  gap: 20px;
  margin: 20px 0;
}

.hero-image {
  text-align: center;
}

img {
  max-width: 100%;
  height: auto;
}

.info__phones {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}

.phone {
  font-size: 13pt;
  color: #000;
  display: flex;
  align-items: center;
  gap: 5px;
}

.email p {
	text-align: center;
}

/**
 * Utilities
 */
.text-center,
p.text-center {
	text-align: center;
}

.u-spacer-sm { padding: 25px 0; }