/* ----- G ----- */
/*Default css rewrite*/
.carousel-caption {
  width:100%;
  left: 0;
  right: 0;
}
/*rewrite END <<*/

/* kapcsolat */
.our_contacts{
  display: flex;
  flex-direction: row;
  width: 100%;
}
.our_contacts div {
    width: 100%;
    background-color: var(--main-background); /*w*/
    margin: 1rem 1rem 1rem 0px; /*W*/
    padding: 1rem; /*W*/
}

.our_contacts div:last-child {margin-right:0;}

@media(max-width: 768px){
  .our_contacts{
    flex-direction: column;
  }

}
/* kapcsolat END<<*/

/*hamburger nav*/
@media(max-width: 991px){
  .container-header .container-nav {  
    display: block;
    text-align: center;
    margin: 0 auto;
  }
  nav.navbar.navbar-expand-lg {
    margin: 10px auto;
    justify-content: center;
  }
  .grid-child.container-nav ul.mod-menu.mod-menu_dropdown-metismenu.metismenu.mod-list {
    justify-content: center;
    display: grid;
  }
  .grid-child.container-nav li.metismenu-item {
    text-align: center;
    justify-content: center;
}
  
}
/*nav END <<*/

/*our services page*/
.ourservices_alcontainer {
    display: flex;
    flex-direction: row;
}
.ourservices_alcontainer div {
    margin: 10px 25px;
}
@media(max-width: 991px){
  .ourservices_alcontainer {
    flex-direction: column;
  } 
  .ourservices_alcontainer div {
    margin: 10px 0;
}
}
/*our services page END<<*/

/*slider*/
.carousel-caption.d-none.d-md-block{
      height: -webkit-fill-available;
}
.carousel-caption {
  height: 100%;
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
.carousel-li{
  padding-right: 20px;
  padding-left: 0;
}
.carousel-li li{
    list-style: none;
    font-size: 34px;
    text-shadow: 0 0 15px #b00314;
    color: #fff;
    font-weight: 500;
    padding: 15px;
  list-style: inside;
  line-height: 75%;
}
/*slider contact*/
._main_page .contact a {
    font-size: 20px;
    border: 1px solid red;
    background-color: #bf0013;
    border-radius: 30px;
    padding: 5px 15px;
    text-decoration: none;
    color: white;
    -webkit-transform: skewX( -10deg );
    -moz-transform: skewX( -10deg );
    -o-transform: skewX( -10deg );
    transform: skewX( -10deg );
}

._main_page .contact {
    display: flex;
    margin: 0 auto;
    width: 100%;
    grid-template-columns: repeat(12,1fr);
    grid-template-rows: auto;
    position: absolute;
    bottom: 30px;
    text-align: center;
    flex-direction: row;
    align-items: center;
    padding: 0 40px;
    justify-content: center;
}
._main_page .contact a {
  /*width: 260px;*/
  padding: 5px 10px;
  margin: 0 2%;
}
._main_page a.contactTel1 {
/*grid-column: span 4;*/
  opacity: 1;
  animation: opac 4s;
}
._main_page a.contactTel2 {
/*grid-column: span 4;*/
  opacity: 1;
  animation: opac 4s;
}
._main_page a.contactEmail {
/*grid-column: span 4;*/
  opacity: 1;
  animation: opac 4s;
}

#carouselKonyveles{
  height:600px;
}
#carouselKonyveles h1{
  color: #8c000e;
  padding: 15px;
  text-align: center;
  font-size: xxx-large;
  text-shadow: 0 0 15px #ffffff;
  opacity: 1;
  animation: opac 4s;
}
._main_page .carousel-item {
    height: 600px;
}
/*first list animation*/
/*._main_page .carousel-li .first1{
  padding-right: 32px;
  margin-right: -8000px;
  animation: slideinout3 8s infinite 1s;
}
._main_page .carousel-li .first2{
  padding-right: 32px;
  margin-left: -8000px;
  animation: slideinout2 8s infinite 2s;
}
._main_page  .carousel-li .first3{
  padding-right: 32px;
  margin-right: -8000px;
  animation: slideinout3 8s infinite 3s;
}*/
._main_page .carousel-li li.first1{
  animation-name: animateIn;
  animation-duration: 2s;
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}
._main_page .carousel-li li.first3 {
  animation-name: animateIn;
  animation-duration: 2s;
  animation-delay: calc(var(--animation-order) * 500ms);
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}

li.first2 {
  animation-name: animateLe;
  animation-duration: 2s;
  animation-delay: calc(var(--animation-order) * 500ms);
  animation-fill-mode: both;
  animation-timing-function: ease-in-out;
}

@keyframes animateIn {
  from {
    margin-left: 3000%;
    width: 300%;
  }

  to {
    margin-left: 0%;
    width: 100%;
  }
}
@keyframes animateLe {
  from {
    margin-left: -3000%;
    width: 300%;
  }

  to {
    margin-left: 0%;
    width: 100%;
  }
}
/**/
@keyframes opac{ 
  0% { opacity: 0;}
  100% { opacity: 1;} 
} 
@keyframes slideinout2{ 
  0% { opacity: 0; margin-left: -8000px;}
  20% { opacity: 1; margin-left: 0;}
  30% { margin-left: 0;}
  80% {opacity: 1;}
  100% { opacity: 0; margin-left: 0;} 
}
@keyframes slideinout3{ 
  0% { opacity: 0; margin-right: -8000px;}
  20% { opacity: 1; margin-right: 0;}
  30% { margin-right: 0;}
  80% {opacity: 1;}
  100% { opacity: 0; margin-right: 0;} 
} 
/*animáció end*/

/*slider nézet mobilon maxwidth<1025*/
@media (max-width: 1025px){
  ._main_page .carousel-item {
    height: 450px;
}
  #carouselKonyveles {
    height: 450px;
}
  #carouselKonyveles h1{
  padding: 0;
  text-align: center;
  font-size: 29px;
}
  ._main_page .carousel-li li{
    font-size: 24px;
    padding: 5px;
    line-height: normal;
}
  ._main_page a.contactTel1 {
  /*grid-area: 1/3/2/11;*/
}
._main_page a.contactTel2 {
  /*grid-area: 2/3/3/11;*/
  margin: 0 0;
}
._main_page a.contactEmail {
  /*grid-area: 3/3/4/11;*/
}
  ._main_page .contact a {
    font-size: 14px;
    margin: 2% 0;
}
  ._main_page .contact {
    display: flex;
    flex-direction: column;
    max-width: 991px;
    margin: 0 auto;
    width: 100%;
    position: absolute;
    bottom: 30px;
}
  /*._main_page .contact {
    display: grid;
    max-width: 991px;
    margin: 0 auto;
    width: 100%;
    grid-template-columns: repeat(12,1fr);
    grid-template-rows: auto;
    gap: 0px;
    position: absolute;
    bottom: 30px;
    padding-left: 0;
  }*/
}

/*szakterületeink blokk*/
.wecanhelpBody, .our_expertiseBody{
    display: grid;
    grid-template-columns: repeat(12,1fr);
    grid-template-rows: auto;
    margin-bottom: 50px;
}
._main_page .com-content-article__body h2, .our_expertise_h2 {
    grid-column: span 12;
    text-align: center;
   margin-bottom: 20px;
}
._main_page .wecanhelp_img, .our_expertise {
    grid-area: 2/1/3/7;
    height: 100%;
    width: 100%;
}
._main_page ul.wecanhelp_ul, ul.our_expertise_ul {
    grid-area: 2/7/3/13;
    font-size: 18px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    padding: 0 30px;
    margin: 0;
    margin-left: 10px;
    list-style: inside;
}
@media (max-width: 1025px){
  ._main_page .wecanhelp_img, .our_expertise {
    grid-area: 2/1/3/13;
  }
  ._main_page ul.wecanhelp_ul, ul.our_expertise_ul {
    grid-area: 3/1/4/13;
    margin-left: 0;
    flex-wrap: wrap;
    align-content: space-around;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 0;
    list-style: inside;
  }
}
/*szakterületeink blokk END <<*/

/*send email*/
._send_email .form-control {
  background-color: #ffffff;
  border: 1px solid #b3b2b2;
  color: black;
  border-radius: 10px;
}
._send_email .com-contact__container {
    display: none;
}
._send_email .grid-child.container-component {
    max-width: 970px;
}
._send_email .page-header, ._send_email h2 {
    text-align: center;
}


/* ----- W ----- */
/* new color variables */
   :root {
            --heading-color: #93000e;
            --dark-color: #454545;
            --light-color:#c7c7c7;
            --main-background: #FBF4E9;
            --primary-background: #A42826;
	        --primary-textColor: #FFFFFF;
            --secondary-background: #890101;
            --secondary-textColor: #FFFFFF;
            --accent-background: #FFE1D1;
            --accent-textColor: #FFFFFF;
            --primary-gradient: linear-gradient(180deg, #99000F, #520008);
            --secondary-gradient: linear-gradient(180deg, #520008, #99000F);
            
        } 

        body {
            background: var(--main-background); 		/* background of your website */
            color: var(--main-color); 		/* color of your website */
        }

        a {
            color: var(--secondary-background); /* color of your links */
        }

        .container-header {
            background-color: var(--primary-background); /* Solid background of your header */
            background-image: var(--primary-gradient);  /* Set to none if you want to disable the gradient */
        }


        .mod-articlesnews-horizontal li, .no-card .newsflash-horiz li {
            background-color: var(--primary-background); /* Solid background of your articlesnews or newsflash modules */
            color: var(--primary-color);  /* Color of your articlesnews or newsflash modules */
			border: 1px solid var(--primary-background); /* Border of your articlesnews or newsflash modules */
        }

        .btn.btn-primary {
            background-color: var(--primary-background); /* background of your primary buttons */
            border-color: var(--primary-background); /* border color of your primary buttons */
            color: var(--primary-textColor); /* text color of your primary buttons */
        }

        .mod-articlesnews-horizontal li .btn.btn-secondary, .no-card .newsflash-horiz li .btn.btn-secondary {
            background-color: var(--accent-background); /* background of your primary buttons */
            border-color: var(--accent-background); /* border color of your primary buttons */
            color: var(--dark-color); /* text color of your primary buttons */
        }

        .btn.btn-secondary {
            background-color: var(--secondary-background); /* background of your secondary buttons */
            border-color: var(--secondary-background); /* border color of your secondary buttons */
            color: var(--secondary-textColor); /* text color of your secondary buttons */
        }

        .bg-info {
            color: var(--accent-textColor);
            background-color: var(--accent-background) !important;
        }

        .card {
            border: none; /* border color of your cards */
	        border-radius: 0; /* border radius of your cards */
	        background-color: var(--primary-background); /* background color of your cards */
        }

        .card-header {
            background-color: var(--primary-background); /* background color of your card headers */
            border-bottom: 1px solid var(--primary-background); /* border color of your card headers */
            color: var(--primary-textColor); /* text color of your card headers */
        }

        .card-body {
            background-color: var(--primary-background); /* background color of your card bodies (Joomla Modules) */
            border-bottom: 0 solid var(--accent-background);  border color of your card bodies */
            color: var(--primary-textColor); /* text color of your card bodies */
        }

        .card-body a {
            color: var(--primary-textColor); /* text color of your card body links */
        }

        .card.secondary {
            border: 1px solid var(--secondary-background); /* border color of your secondary cards */
            border-radius: 0; /* border radius of your secondary cards */
            background-color: var(--secondary-background); /* background color of your secondary cards */
        }

        .card-header.secondary {
            background-color: var(--secondary-background); /* background color of your secondary card headers */
            border-bottom: 1px solid var(--secondary-background); /* border color of your  secondary card headers */
            color: var(--secondary-textColor); /* text color of your card headers */
        }

        .card-body.secondary {
            background-color: var(--secondary-background); /* background color of your secondary card bodies (Joomla Modules) */
            border-bottom: 3px solid var(--secondary-background); /* border color of your secondary card bodies */
            color: var(--secondary-textColor); /* text color of your secondary card bodies */
        }

        .card-body.secondary a {
            color: var(--secondary-textColor); /* text color of your secondary card body links */
        }

        .plg_system_webauthn_login_button svg {
            fill: var(--primary-color); /* color of your webauthn login button icon */
        }

        .footer {
            background-color: var(--secondary-background); /* background color of your footer */
            background-image: var(--secondary-gradient);  /* Set to none if you want to disable the gradient */
            color: var(--secondary-textColor:); /* text color of your footer */
        }

        ::selection {
	        background-color: var(--accent-background); /* background color of your text selection */
			color: var(--dark-color); /* text color of your text selection */
        }

        .metismenu.mod-menu .metismenu-item > ul {
			background-color: var(--secondary-background); /* background color of your dropdown menu */
			border: 1px solid var(--secondary-background); /* border color of your dropdown menu */
	        color: var(--secondary-color); /* text color of your dropdown menu */
		}

        .metismenu.mod-menu .metismenu-item > ul a {
	        color: var(--secondary-color); /* text color of your dropdown menu links */
        }

        .main-top.card.colorpicker-module {
	        background-color: var(--main-background); /* if you want to change the background color of a specific module add a Module Class in the advanced module settings and define it in your css */
	        color: var(--dark-color); /* if you want to change the background color of a specific module add a Module Class in the advanced module settings and define it in your css */
            border: none;
        }

        .colorpicker-module .card-header, .colorpicker-module .card-body  {
            background-color: var(--main-background); /* if you want to change the background color of a specific module add a Module Class in the advanced module settings and define it in your css */
            color: var(--dark-color); /* if you want to change the background color of a specific module add a Module Class in the advanced module settings and define it in your css */
        }

        .article-info {
	        background-color: var(--main-background); /* background color of your article info */
	        padding: 15px 20px; /* padding of your article info */
        }

        .article-info dd {
	        color: var(--main-color); /* text color of your article info */
		}

        .btn.btn-info {
	        background-color: var(--primary-background); /* background color of your info buttons */
            border: 1px solid var(--main-background); /* border width, style and color of your info buttons */
	        color: var(--primary-color); /* text color of your info buttons */
        }

        .btn-primary .icon-white:before {
	        color: var(--primary-textColor); /* text color of your info buttons in primary */
        }

        .btn-secondary .icon-white:before {
            color: var(--secondary-textColor); /* text color of your info buttons in primary */
        }

        .form-control {
	        background-color: var(--main-background); /* background color of your form controls */
	        border: 1px solid var(--main-color); /* border color of your form controls */
	        color: var(--primary-color); /* text color of your form controls */
	        border-radius: 0; /* border radius of your form controls */
        }

        label {
	        font-weight: bold; /* font weight of your labels */
        }

     /* W    generate a clamp font size for h1, in small viewports it should have 18px in large viewports 28px 
		h1, .h1 {
			font-size: clamp(18px, 5vw, 28px);
		} 

		
		h2, .h2 {
			font-size: clamp(16px, 5vw, 26px);
		} 

		
		h3, .h3 {
			font-size: clamp(14px, 5vw, 24px);
		}

		
		h4, .h4 {
			font-size: clamp(12px, 5vw, 22px); */
		}


/* W */ 

h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
    color: var(--heading-color);
    margin-top: 0;
    margin-bottom: 0.5rem;
    font-weight: 500;
    line-height: 1.2;
    padding: 1.5rem;
    background-color: #FBF4E9 !important;
}
.ourservices_alcontainer div {
    background-color: #fbf4e9;
    padding: 1rem;
}
.terkepem {width: 100%;}

#mod-custom111 {padding: 5px 0 0 0;} /* W logó helyzete*/

ul.mod-menu.mod-list.nav {margin-top: 8px;}



/*@media (max-width:  992px){*/
.container-header .mod-menu>li:after { bottom: unset;} /* menupont aláhuzás */

.item-content, .com-content-article__body   {
    background-color: rgb(255 255 255 / 59%);
    padding: 69px;
   border: solid 1px #f7a7af;
    border-radius: 2.5rem;
}
/*}*/
@media (max-width: 768px){
  .item-content, .com-content-article__body {
    padding: 69px 20px;
  }
}

/* W  kategória blog nézet, minden páratlan blog 
body > div > div > main > div > div > div:nth-child(odd) > div{
    background-color: #fff2db;
} */

/* W blog nézet közti logók */
.com-content-category-blog__item.blog-item::after {
    content: url(/images/headers/SzP-Revizor_logo_gray_60.png);
    margin: 100px auto 100px;
}

.fifty-fifty {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin: 1em 0;
}

.fifty-fifty img {
    width: 47%;
}

@media(max-width: 991px){
  .fifty-fifty {
    flex-direction: column;
  }
  .fifty-fifty img {
    width: 100%;
    margin: 1em auto;
  }
}

.card-body {
    background-color: #fbf4e9 !important;
}

blockquote {
    margin: 1rem;
    font-style: italic;
    border: solid 1px pink;
    padding: 20px 20px 0 20px;
    color: #91000f;
    background-color: #fbf4e9;
    border-radius: 2rem;
    font-weight: 700;
    font-size: large;
}
.btn {
  border-radius: 1.5rem; 
  -webkit-transform: skewX( -10deg );
    -moz-transform: skewX( -10deg );
    -o-transform: skewX( -10deg );
    transform: skewX( -10deg );
}
.our_contacts img {margin-bottom: 1rem;}

a:not(.btn):hover, a:not(.btn):focus {
    color: #f8b9c4;
}

a:not([class]) {
    text-decoration: none;
}

.footer .grid-child {
    justify-content: space-evenly;
  }
/* W footerben a logó */
#mod-custom119 img {
    margin-bottom: 2rem;
}
/* W az impresszumban levő szövegek sortávolsága */
div#mod-custom117 p {
    line-height: normal;
}

/* W designed by profnet helye */
div#mod-custom120 {
    position: absolute;
    bottom: 0;
}