/**
* Template Name: HeroBiz
* Updated: Sep 18 2023 with Bootstrap v5.3.2
* Template URL: https://bootstrapmade.com/herobiz-bootstrap-business-template/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
*/
/**
* Check out variables.css for easy customization of colors, typography, and other repetitive properties
*/
/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
:root {
 scroll-behavior: smooth;
}
html {
 scroll-behavior: smooth;
}
a {
 color: var(--color-links);
 text-decoration: none;
}

a:hover {
 color: var(--color-links-hover);
 text-decoration: none;
}
/* verificare*/

.primary { color: var(--color-primary);}
.colore_primary { color: var(--color-primary) !important ;}
.colore_bi {color: DarkGreen !important ;}
h1,
h2,
h3,
h4,
h5,
h6 {
 font-family: var(--font-primary); 
}
/*
body {
	
background: rgb(238,255,236);
background: linear-gradient(90deg, rgba(238,255,236,1) 0%, rgba(203,249,221,1) 50%, rgba(238,255,236,1) 100%);

}
*/

body {
 background-image: url("../img/body-img.jpg");
 background-repeat: no-repeat;
 background-size: cover;
 background-attachment: fixed;
}

/*--------------------------------------------------------------
# Preloader

#preloader {
 position: fixed;
 inset: 0;
 z-index: 9999;
 overflow: hidden;
 background: var(--color-white);
 transition: all 0.6s ease-out;
 width: 100%;
 height: 100vh;
}

#preloader:before,
#preloader:after {
 content: "";
 position: absolute;
 border: 4px solid var(--color-primary);
 border-radius: 50%;
 animation: animate-preloader 2s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}

#preloader:after {
 animation-delay: -0.5s;
}

@keyframes animate-preloader {
 0% {
 width: 10px;
 height: 10px;
 top: calc(50% - 5px);
 left: calc(50% - 5px);
 opacity: 1;
 }

 100% {
 width: 72px;
 height: 72px;
 top: calc(50% - 36px);
 left: calc(50% - 36px);
 opacity: 0;
 }
}


# Sections & Section Header
--------------------------------------------------------------*/
section {
 padding: 0 0;
 overflow: hidden;

}

.section-header {
 text-align: center;
 /*padding-bottom: 25px;*/
}

.section-header h2 {
 font-size: 48px;
 font-weight: 300;
 margin-bottom: 20px;
 color: var(--color-secondary);
}
.section-header p {
 margin: 0 auto;
 color: var(--color-secondary-light);
}

@media (min-width: 1280px) {
 .section-header p {
 max-width: 80%;
 }
}


/*--------------------------------------------------------------
# Breadcrumbs
--------------------------------------------------------------*/
.breadcrumbs {
 padding: -20px 0 0 0;
 /*background: rgba(var(--color-secondary-rgb), 0.05);*/
 min-height: 40px;
 margin-top: 86px;
}
.breadcrumbs h2 { font-size: 30px; font-weight: 300; margin: 0;}
.breadcrumbs ol { display: flex; flex-wrap: wrap; list-style: none; padding: 0; margin: 0; font-size: 14px; }
.breadcrumbs ol li+li { padding-left: 10px;}
.breadcrumbs ol li+li::before {
 display: inline-block;
 padding-right: 10px;
 color: var(--color-secondary-light);
 content: "/";
}







/*--------------------------------------------------------------
# Scroll top button
--------------------------------------------------------------*/
.scroll-top {
 position: fixed;
 visibility: hidden;
 opacity: 0;
 right: 15px;
 bottom: 120px;
 z-index: 995;
 background: var(--color-primary);
 width: 40px;
 height: 40px;
 border-radius: 4px;
 transition: all 0.4s;
}
/* 31 luglio
 @media (max-width: 992px) {
 .scroll-top {  bottom: 100px;
 width: 30px !important ;
 height: 30px !important ; right: 7px; }
 }
*/

.scroll-top i {
 font-size: 24px; 
 color: var(--color-white);
 line-height: 0;
}

.scroll-top:hover {
background: OliveDrab ;
color : black ;

}

.scroll-top.active {
 visibility: visible;
 opacity: 1;
}

/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
 [data-aos-delay] {
 transition-delay: 0 !important;
 }
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
.header {
 padding: 5px 0 15px 0 !important ; 
 transition: all 0.5s;
 z-index: 997; 
background: linear-gradient(#fff 0% , #fff 20% , #fff 70% ,transparent 100% );
 
}

.header.sticked {
 /* background: var(--color-white);
 box-shadow: 0px 2px 20px rgba(var(--color-secondary-rgb), 0.1);*/
}

.header .logo img {
 max-height: 60px;
 margin-right: 6px;
}

.header .logo h1 {
 font-size: 32px;
 font-weight: 300;
 color: var(--color-secondary);
 font-family: var(--font-primary); 
}
.header .logo h1 span {
 color: var(--color-primary);
 font-weight: 500; 
}
 @media (max-width: 992px) {
.header .logo h1 span , .header .logo h1 { font-size: 19px !important ;} 
 }



.header .btn-getstarted,
.header .btn-getstarted:focus {
 font-size: 16px;
 color: var(--color-white);
 background: var(--color-primary);
 padding: 8px 23px;
 border-radius: 4px;
 transition: 0.3s;
 font-family: var(--font-primary);
}

.header .btn-getstarted:hover,
.header .btn-getstarted:focus:hover {
 color: var(--color-white);
 background: rgba(var(--color-primary-rgb), 0.85);
}
/* §§ */
@media (max-width: 1449px) {

 .header .btn-getstarted,
 .header .btn-getstarted:focus {
 margin-right: 50px;
 }
}

/*--------------------------------------------------------------
# Desktop Navigation 
--------------------------------------------------------------*/
/* §§ */
@media (min-width: 1450px) {
 .navbar {
 padding: 0; padding-right:50px ;
 position: relative;
 }

 .navbar ul {
 margin: 0;
 padding: 0;
 display: flex;
 list-style: none;
 align-items: center;
 }

 .navbar li {
 position: relative;
 }

 .navbar>ul>li {
 white-space: nowrap;
 }

 .navbar a,
 .navbar a:focus {
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 14px 10px;
 font-family: var(--font-primary);
 font-size: 16px;
 font-weight: 400;
 color: #000000 /* rgba(var(--color-secondary-dark-rgb), 1)*/ ;
 white-space: nowrap;
 transition: 0.3s;
 position: relative;
 }

 .navbar a i,
 .navbar a:focus i {
 font-size: 12px;
 line-height: 0;
 margin-left: 5px;
 }

 .navbar>ul>li>a:before {
 content: "";
 position: absolute;
 width: 100%;
 height: 2px;
 bottom: 0;
 left: 0;
 background-color: var(--color-primary);
 visibility: hidden;
 transition: all 0.3s ease-in-out 0s;
 transform: scaleX(0);
 transition: all 0.3s ease-in-out 0s;
 }

/* nav sottolineatura dinamica*/
 .navbar a:hover:before,
 .navbar li:hover>a:before,
 .navbar .active:before {
 visibility: visible;
 transform: scaleX(0.7);
 }

 .navbar a:hover,
 .navbar .active,
 .navbar .active:focus,
 .navbar li:hover>a {
 color: var(--color-primary); 
 }

 .navbar .dropdown a:hover:before,
 .navbar .dropdown:hover>a:before,
 .navbar .dropdown .active:before {
 visibility: hidden;
 }
/* preso */
 .navbar .dropdown a:hover,
 .navbar .dropdown .active,
 .navbar .dropdown .active:focus,
 .navbar .dropdown:hover>a ,
 .navbar .dropdown:hover .icon-nav 
 {
 color: var(--color-white) ; 
 background: #6CC289 ; border-radius: 13px 13px 0 0; color: white !important ;
 }
 /* preso eventi */
 .navbar .dropdown ul {
 display: block;
 position: absolute;
 left: 0;
 top: 100%;
 margin: 0;
 padding: 0 0 10px 0;
 z-index: 99;
 opacity: 0;
 visibility: hidden;
 background: #6BC088 ; 
 transition: 0.3s; border-radius: 0 13px 13px 13px ; color: white !important ;
 }
 .navbar .dropdown ul li {
 min-width: 200px; color : var(--color-primary); color: white !important ;
 }
/* preso */
 .navbar .dropdown ul a {
 padding: 10px 20px;
 font-size: 15px;
 text-transform: none;
 font-weight: 400;
 color: DarkGreen;
 }

 .navbar .dropdown ul a i {
 font-size: 12px; 
 }
/* preso eventi in corso */
 .navbar .dropdown ul a:hover, .navbar .dropdown ul li .bi-bookmark-fill , 
 .navbar .dropdown ul .active,
 .navbar .dropdown ul .active:hover,
 .navbar .dropdown ul li:hover>a i {
 color: var(--color-white);
 background: var(--color-primary); font-size: 22px; border-radius: 13px ;
 }

 .navbar .dropdown:hover>ul {
 opacity: 1;
 visibility: visible;
 }

 .navbar .megamenu {
 position: static;
 }

 .navbar .megamenu ul {
 right: 0;
 padding: 10px;
 display: flex;
 }

 .navbar .megamenu ul li {
 flex: 1;
 }

 .navbar .megamenu ul li a,
 .navbar .megamenu ul li:hover>a {
 color: rgba(var(--color-white-rgb), 0.5);
 background: none;
 }

 .navbar .megamenu ul li a:hover,
 .navbar .megamenu ul li .active,
 .navbar .megamenu ul li .active:hover {
 color: var(--color-white);
 background: var(--color-primary);
 }

 .navbar .dropdown .dropdown ul {
 top: 0;
 left: calc(100% - 30px);
 visibility: hidden;
 }

 .navbar .dropdown .dropdown:hover>ul {
 opacity: 1;
 top: 0;
 left: 100%;
 visibility: visible;
 }
}

@media (min-width: 1450px) and (max-width: 1550px) {
 .navbar .dropdown .dropdown ul {
 left: -90%;
 }

 .navbar .dropdown .dropdown:hover>ul {
 left: -100%;
 }
}

/*--------------------------------------------------------------
# Mobile Navigation
--------------------------------------------------------------*/
@media (max-width: 1449px) {
 .navbar {
 position: fixed;
 top: 0;
 left: -100%;
 width: calc(100% );
 bottom: 0;
 transition: 0.3s;
 z-index: 9997;
 }

 .navbar ul {
 position: absolute;
 inset: 0;
 padding: 10px 0;
 margin: 0;
 background: rgba(var(--color-secondary-rgb), 0.9);
 overflow-y: auto;
 transition: 0.3s;
 z-index: 9998;
 }

 .navbar a,
 .navbar a:focus {
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 2px 0px 2px 770px ;
 font-size: 16px;
 font-weight: 500;
 color: rgba(var(--color-white-rgb), 0.7);
 white-space: nowrap;
 transition: 0.3s;
 }

 .navbar a i,
 .navbar a:focus i {
 font-size: 12px;
 line-height: 0;
 margin-left: 5px;
 }


 .navbar a:hover,
 .navbar .active,
 .navbar .active:focus,
 .navbar li:hover>a {
 color: var(--color-white); 
 }
/* settaggio sub eventi */
 .navbar .dropdown ul,
 .navbar .dropdown .dropdown ul {
 position: static;
 display: none; /* */
 padding: 4px 0;
 margin: 0px 0px 0px 35px;
 transition: all 0.5s ease-in-out;
 border: 0px solid white !important ; 
 }

 .navbar .dropdown>.dropdown-active,
 .navbar .dropdown .dropdown>.dropdown-active {
 display: block;
 }

 .mobile-nav-toggle {
 display: block !important;
 color: var(--color-secondary);
 font-size: 28px;
 cursor: pointer;
 line-height: 0;
 transition: 0.5s;
 position: fixed;
 top: 20px;
 z-index: 9999;
 right: 20px;
 }

 .mobile-nav-toggle.bi-x {
 color: var(--color-white);
 }

 .mobile-nav-active {
 overflow: hidden;
 z-index: 9995;
 position: relative;
 }

 .mobile-nav-active .navbar {
 left: 0;
 }

 .mobile-nav-active .navbar:before {
 content: "";
 position: fixed;
 inset: 0;
 background: rgba(var(--color-secondary-rgb), 0.8);
 z-index: 9996;
 }
}

/*--------------------------------------------------------------
# Index Page
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Animated Hero Section
--------------------------------------------------------------*/
.hero-animated {
 width: 100%;
 min-height: 50vh;
 background: url("../img/hero-bg.png") center center;
 background-size: cover;
 position: relative;
 padding: 120px 0 60px;
}

.hero-animated h2 {
 margin: 0 0 10px 0;
 font-size: 48px;
 font-weight: 300;
 color: var(--color-secondary);
 font-family: var(--font-primary);
}

.hero-animated h2 span {
 color: var(--color-primary);
}

.hero-animated p {
 color: rgba(var(--color-secondary-rgb), 0.8);
 margin: 0 0 30px 0;
 font-size: 20px;
 font-weight: 400;
}

.hero-animated .animated {
 margin-bottom: 60px;
 animation: up-down 2s ease-in-out infinite alternate-reverse both;
}

@media (min-width: 992px) {
 .hero-animated .animated {
 max-width: 45%;
 }
 
 
}

@media (max-width: 991px) {
 .hero-animated .animated {
 max-width: 60%;	 }
}
	 h2.titolo {
 font-size: 32px !important ; 
 }
 	 h2.titolocrumbs {
 font-size: 32px !important ;
 }
 .header .logo h1 {
 font-size: 22px;
 }
}

@media (max-width: 575px) {
 .hero-animated .animated {
 max-width: 80%;
 }
}

.hero-animated .btn-get-started {
 font-size: 16px;
 font-weight: 400;
 display: inline-block;
 padding: 10px 28px;
 border-radius: 4px;
 transition: 0.5s;
 color: var(--color-white);
 background: var(--color-primary);
 font-family: var(--font-primary);
}

.hero-animated .btn-get-started:hover {
/* background: rgba(var(--color-primary-rgb), 0.8); */
 color: #0f8a30 /* var(--color-primary) */ ;
 background: var(--color-white);
}

.hero-animated .btn-watch-video {
 font-size: 16px;
 transition: 0.5s;
 margin-left: 25px;
 font-family: var(--font-primary);
 color: var(--color-secondary);
 font-weight: 600;
}

.hero-animated .btn-watch-video i {
 color: var(--color-primary);
 font-size: 32px;
 transition: 0.3s;
 line-height: 0;
 margin-right: 8px;
}

.hero-animated .btn-watch-video:hover {
 color: var(--color-primary);
}

.hero-animated .btn-watch-video:hover i {
 color: rgba(var(--color-primary-rgb), 0.8);
}

@media (max-width: 640px) {
 .hero-animated h2 {
 font-size: 32px;
 }

 .hero-animated p {
 font-size: 18px;
 margin-bottom: 30px;
 }

 .hero-animated .btn-get-started,
 .hero-animated .btn-watch-video {
 font-size: 14px;
 }
}

@keyframes up-down {
 0% {
 transform: translateY(10px);
 }

 100% {
 transform: translateY(-10px);
 }
}

/*--------------------------------------------------------------
# Carousel Hero Section
--------------------------------------------------------------*/
.hero {
 width: 100%;
 padding: 0;
 background: var(--color-black);
 background: url("../img/hero-bg.png") center center;
 background-size: cover;
 background-position: center;
 background-repeat: no-repeat;
 position: relative;
 display: flex;
 flex-direction: column;
 justify-content: center;
 padding: 140px 0 60px 0;
}

.hero .carousel-item {
 overflow: hidden;
}

@media (max-width: 640px) {
 .hero .container {
 padding: 0 60px;
 }
}

.hero h2 {
 color: var(--color-secondary);
 margin-bottom: 25px;
 font-size: 48px;
 font-weight: 300;
 animation: fadeInDown 1s both 0.2s;
}

@media (max-width: 768px) {
 .hero h2 {
 font-size: 30px;
 }
}

.hero p {
 color: var(--color-secondary-light);
 animation: fadeInDown 1s both 0.4s;
 font-weight: 500;
 margin-bottom: 30px;
}

.hero .img {
 margin-bottom: 40px;
 animation: fadeInDownLite 1s both;
}

.hero .btn-get-started {
 font-family: var(--font-primary);
 font-weight: 400;
 font-size: 16px;
 letter-spacing: 1px;
 display: inline-block;
 padding: 8px 32px;
 border-radius: 5px;
 transition: 0.5s;
 animation: fadeInUp 1s both 0.6s;
 color: var(--color-primary);
 border: 2px solid var(--color-primary);
}

.hero .btn-get-started:hover {
 background: var(--color-primary);
 color: var(--color-white);
}

.hero .carousel-control-prev {
 justify-content: start;
}

@media (min-width: 640px) {
 .hero .carousel-control-prev {
 padding-left: 15px;
 }
}

.hero .carousel-control-next {
 justify-content: end;
}

@media (min-width: 640px) {
 .hero .carousel-control-next {
 padding-right: 15px;
 }
}

.hero .carousel-control-next-icon,
.hero .carousel-control-prev-icon {
 background: none;
 font-size: 26px;
 line-height: 0;
 background: rgba(var(--color-secondary-rgb), 0.4);
 color: rgba(var(--color-white-rgb), 0.98);
 border-radius: 50px;
 width: 54px;
 height: 54px;
 display: flex;
 align-items: center;
 justify-content: center;
}

.hero .carousel-control-next-icon {
 padding-left: 3px;
}

.hero .carousel-control-prev-icon {
 padding-right: 3px;
}

.hero .carousel-control-prev,
.hero .carousel-control-next {
 transition: 0.3s;
}

.hero .carousel-control-prev:focus,
.hero .carousel-control-next:focus {
 opacity: 0.5;
}

.hero .carousel-control-prev:hover,
.hero .carousel-control-next:hover {
 opacity: 0.9;
}

.hero .carousel-indicators li {
 list-style-type: none;
 cursor: pointer;
 background: rgba(var(--color-secondary-rgb), 0.5);
 overflow: hidden;
 border: 0;
 width: 12px;
 height: 12px;
 border-radius: 50px;
 opacity: 0.6;
 transition: 0.3s;
}

.hero .carousel-indicators li.active {
 opacity: 1;
 background: var(--color-primary);
}

@keyframes fadeIn {
 from {
 opacity: 0;
 }

 to {
 opacity: 1;
 }
}

@keyframes fadeInUp {
 from {
 opacity: 0;
 transform: translate3d(0, 100%, 0);
 }

 to {
 opacity: 1;
 transform: translate3d(0, 0, 0);
 }
}

@keyframes fadeInDown {
 from {
 opacity: 0;
 transform: translate3d(0, -100%, 0);
 }

 to {
 opacity: 1;
 transform: translate3d(0, 0, 0);
 }
}

@keyframes fadeInDownLite {
 from {
 opacity: 0;
 transform: translate3d(0, -10%, 0);
 }

 to {
 opacity: 1;
 transform: translate3d(0, 0, 0);
 }
}

/*--------------------------------------------------------------
# Fullscreen Hero Section
--------------------------------------------------------------*/
.hero-fullscreen {
 width: 100%;
 min-height: 100vh;
 background: url("../img/hero-fullscreen-bg.jpg") center center;
 background-size: cover;
 position: relative;
 padding: 80px 0 20px;
}

.hero-fullscreen:before {
 content: "";
 background: rgba(var(--color-white-rgb), 0.75);
 position: absolute;
 inset: 0;
}

@media (min-width: 1365px) {
 .hero-fullscreen {
 background-attachment: fixed;
 }
}

.hero-fullscreen h2 {
 margin: 0 0 10px 0;
 font-size: 48px;
 font-weight: 300;
 color: Gray ;
 text-shadow: 3px 3px 5px DimGray ! important ; 
}

.hero-fullscreen h2 span {
 color: var(--color-primary); 
 text-shadow: 3px 3px 5px DimGray ! important ; 
}

.hero-fullscreen p {
 color: rgba(var(--color-secondary-rgb), 0.8);
 margin: 0 0 30px 0;
 font-size: 20px;
 font-weight: 400;
}

.hero-fullscreen .btn-get-started {
 font-size: 16px;
 font-weight: 400;
 display: inline-block;
 padding: 10px 28px;
 border-radius: 4px;
 transition: 0.5s;
 color: var(--color-white);
 background: var(--color-primary);
 font-family: var(--font-primary);
}

.hero-fullscreen .btn-get-started:hover {
background: #b4e0bf /* rgba(var(--color-primary-rgb), 0.8)*/ ;
color : #046b1e ;
 
}

.hero-fullscreen .btn-watch-video {
 font-size: 16px;
 transition: 0.5s;
 margin-left: 25px;
 font-family: var(--font-primary);
 color: var(--color-secondary);
 font-weight: 600;
}

.hero-fullscreen .btn-watch-video i {
 color: var(--color-primary);
 font-size: 32px;
 transition: 0.3s;
 line-height: 0;
 margin-right: 8px;
}

.hero-fullscreen .btn-watch-video:hover {
 color: var(--color-primary);
}

.hero-fullscreen .btn-watch-video:hover i {
 color: rgba(var(--color-primary-rgb), 0.8);
}

@media (max-width: 640px) {
 .hero-fullscreen h2 {
 font-size: 32px;
 }

 .hero-fullscreen p {
 font-size: 18px;
 margin-bottom: 30px;
 }

 .hero-fullscreen .btn-get-started,
 .hero-fullscreen .btn-watch-video {
 font-size: 14px;
 }
}

/*--------------------------------------------------------------
# Static Hero Section
--------------------------------------------------------------*/
.hero-static {
 width: 100%;
 min-height: 50vh;
 background: url("../img/hero-bg.png") center center;
 background-size: cover;
 position: relative;
 padding: 120px 0 60px;
}

.hero-static h2 {
 margin: 0 0 10px 0;
 font-size: 48px;
 font-weight: 300;
 color: var(--color-secondary);
 font-family: var(--font-primary);
}

.hero-static h2 span {
 color: var(--color-primary);
}

.hero-static p {
 color: rgba(var(--color-secondary-rgb), 0.8);
 margin: 0 0 30px 0;
 font-size: 20px;
 font-weight: 400;
}

.hero-static .btn-get-started {
 font-size: 16px;
 font-weight: 400;
 display: inline-block;
 padding: 10px 28px;
 border-radius: 4px;
 transition: 0.5s;
 color: var(--color-white);
 background: var(--color-primary);
 font-family: var(--font-primary);
}

.hero-static .btn-get-started:hover {
 background: #9ab8a2 /* rgba(var(--color-primary-rgb), 0.8) */ ;
 color: #0f8a30 /* var(--color-primary) */ ;
 
}

.hero-static .btn-watch-video {
 font-size: 16px;
 transition: 0.5s;
 margin-left: 25px;
 font-family: var(--font-primary);
 color: var(--color-secondary);
 font-weight: 600;
}

.hero-static .btn-watch-video i {
 color: var(--color-primary);
 font-size: 32px;
 transition: 0.3s;
 line-height: 0;
 margin-right: 8px;
}

.hero-static .btn-watch-video:hover {
 color: var(--color-primary);
}

.hero-static .btn-watch-video:hover i {
 color: rgba(var(--color-primary-rgb), 0.8);
}

@media (max-width: 640px) {
 .hero-static h2 {
 font-size: 32px;
 }

 .hero-static p {
 font-size: 18px;
 margin-bottom: 30px;
 }

 .hero-static .btn-get-started,
 .hero-static .btn-watch-video {
 font-size: 14px;
 }
}

/*--------------------------------------------------------------
# Featured Services Section
--------------------------------------------------------------*/
.featured-services , .service-item {
 padding: 0 10px 10px 10px;
 transition: all ease-in-out 0.4s;
 background: transparent !important ;
 border-radius: 8px;
 §max-height:calc(100% - opx);
  }
 .service-item {
 /*box-shadow: 11px 11px 68px -3px rgba(0,0,0,0.1),0px 10px 15px -3px rgba(0,0,0,0.4);
 box-shadow: 2px 4px 8px 7px rgba(105,96,96,0.68);
-webkit-box-shadow: 2px 4px 8px 7px rgba(105,96,96,0.68);
-moz-box-shadow: 2px 4px 8px 7px rgba(105,96,96,0.68);
*/
}


.featured-services .service-item .icon {
 margin-bottom: 10px;
}

.icon {
 color: DarkSlateGray;
 font-size: 25px !important ;
 transition: 0.3s; text-shadow: 1px 1px 2px Silver ;
}



.featured-services .service-item h4 , .featured-services .service-item h5 {
 font-weight: 600;
 margin-bottom: 15px;
 font-size: 24px;
}

 .featured-services .service-item h5 {

 font-size: 20px;
}

.featured-services .service-item h4 a , .featured-services .service-item h5 a {
 color: var(--color-secondary);
 transition: ease-in-out 0.3s;
}

.featured-services .service-item p {
 line-height: 24px;
 font-size: 14px;
 margin-bottom: 0;
}

.featured-services .service-item {

	 border-radius: 0 20px; 

}

.featured-services .service-item:hover {
 /* item */	
	 border-radius: 20px 0 ; border: 1px solid green ;
 transform: translateY(2px);
box-shadow: 3px 3px 10px 3px rgba(0,0,0,0.3);
}

.featured-services .service-item:hover h4 a , .featured-services .service-item:hover h5 a{
 color: var(--color-primary);
}

/*--------------------------------------------------------------
# About Section
--------------------------------------------------------------*/
.about .about-img {
 position: relative;
 margin: 60px 0 0 60px;
}

.about .about-img:before {
 position: absolute;
 inset: -60px 0 0 -60px;
 z-index: -1;
 content: "";
 background: url("../img/about-bg.png") top left;
 background-repeat: no-repeat;
}

@media (max-width: 575px) {
 .about .about-img {
 margin: 30px 0 0 30px;
 }

 .about .about-img:before {
 inset: -30px 0 0 -30px;
 }
}

.about h3 {
 color: var(--color-secondary);
 font-family: var(--font-primary);
 font-weight: 300;
 font-size: 32px;
 margin-bottom: 20px;
}

@media (max-width: 768px) {
 .about h3 {
 font-size: 28px;
 }
}

.about .nav-pills {
 border-bottom: 1px solid rgba(var(--color-secondary-rgb), 0.2);
}

.about .nav-pills li+li {
 margin-left: 30px;
}

.about .nav-link {
 background: none;
 font-size: 18px;
 font-weight: 400;
 color: var(--color-secondary);
 padding: 12px 0;
 margin-bottom: -2px;
 border-radius: 0;
 font-family: var(--font-primary); 
}

.about .nav-link.active {
 color: var(--color-primary);
 background: none; /*font-weight: bold;*/
 border-bottom: 3px solid var(--color-primary); 
}

@media (max-width: 575px) {
 .about .nav-link {
 font-size: 16px;
 }
}

.about .tab-content h4 {
 font-size: 18px;
 margin: 0;
 font-weight: 700;
 color: var(--color-secondary);
}

.about .tab-content i {
 font-size: 22px;
 line-height: 0;
 margin-right: 8px;
 color: var(--color-primary);
}

/*--------------------------------------------------------------
# Clients Section
--------------------------------------------------------------*/
.clients {
 padding: 0 0 60px 0;
}

.clients .swiper-slide img {
 opacity: 0.5;
 transition: 0.3s;
 filter: grayscale(100); 	
}

.clients .swiper-slide img:hover {
 filter: none;
 opacity: 1;
}

/*--------------------------------------------------------------
# Call To Action Section
--------------------------------------------------------------*/
.cta {
 padding: 0;
 margin-bottom: 60px;
}

.cta .container {
 padding: 80px;
 background: rgba(var(--color-secondary-rgb), 0.1);
 border-radius: 15px;
}

@media (max-width: 992px) {
 .cta .container {
 padding: 60px;
 }
}

.cta .content h3 {
 color: var(--color-secondary);
 font-size: 48px;
 font-weight: 700;
}

.cta .content h3 em {
 font-style: normal;
 position: relative;
}

.cta .content h3 em:after {
 content: "";
 position: absolute;
 left: 0;
 right: 0;
 bottom: 10px;
 height: 10px;
 background: rgba(var(--color-primary-rgb), 0.5);
 z-index: -1;
}

.cta .content p {
 color: var(--color-secondary);
 font-weight: 600;
 font-size: 18px;
}

.cta .content .cta-btn {
 color: var(--color-white);
 font-weight: 500;
 font-size: 16px;
 display: inline-block;
 padding: 12px 40px;
 border-radius: 5px;
 transition: 0.5s;
 margin-top: 10px;
 background: rgba(var(--color-primary-dark-rgb), 0.9);
}

.cta .content .cta-btn:hover {
 background: var(--color-primary);
}

.cta .img {
 position: relative;
}

.cta .img:before {
 content: "";
 position: absolute;
 inset: 0;
 background: rgba(var(--color-white-rgb), 0.5);
 border-radius: 15px;
 transform: rotate(12deg);
}

.cta .img:after {
 content: "";
 position: absolute;
 inset: 0;
 background: rgba(var(--color-white-rgb), 0.9);
 border-radius: 15px;
 transform: rotate(6deg);
}

.cta .img img {
 position: relative;
 z-index: 3;
 border-radius: 15px;
}

/*--------------------------------------------------------------
# On Focus Section
--------------------------------------------------------------*/
.onfocus {
 padding: 0;
}

.onfocus .video-play {
 min-height: 400px;
 background: linear-gradient(rgba(var(--color-black-rgb), 0.4), rgba(var(--color-black-rgb), 0.7)), url("../img/onfocus-video-bg.jpg") center center;
 background-size: cover;
}

.onfocus .content {
 background: linear-gradient(rgba(var(--color-secondary-rgb), 0.5), rgba(var(--color-secondary-rgb), 0.8)), url("../img/onfocus-content-bg.jpg") center center;
 background-size: cover;
 color: rgba(var(--color-white-rgb), 0.8);
 padding: 40px;
}

@media (min-width: 768px) {
 .onfocus .content {
 padding: 80px;
 }
}

.onfocus .content h3 {
 font-weight: 600;
 font-size: 32px;
 color: var(--color-white);
}

.onfocus .content ul {
 list-style: none;
 padding: 0;
}

.onfocus .content ul li {
 padding-bottom: 10px;
}

.onfocus .content ul i {
 font-size: 20px;
 padding-right: 4px;
 color: var(--color-primary);
}

.onfocus .content p:last-child {
 margin-bottom: 0;
}

.onfocus .content .read-more {
 font-family: var(--font-primary);
 font-weight: 500;
 font-size: 16px;
 letter-spacing: 1px;
 padding: 12px 24px;
 border-radius: 5px;
 transition: 0.3s;
 display: -nline-flex;
 align-items: center;
 justify-content: center;
 color: var(--color-white);
 background: var(--color-primary);
}

.onfocus .content .read-more i {
 font-size: 18px;
 margin-left: 5px;
 line-height: 0;
 transition: 0.3s;
}

.onfocus .content .read-more:hover {
 background: rgba(var(--color-primary-rgb), 0.9);
 padding-right: 19px;
}

.onfocus .content .read-more:hover i {
 margin-left: 10px;
}

.onfocus .play-btn {
 width: 94px;
 height: 94px;
 background: radial-gradient(var(--color-primary) 50%, rgba(var(--color-primary-rgb), 0.4) 52%);
 border-radius: 50%;
 display: block;
 position: absolute;
 left: calc(50% - 47px);
 top: calc(50% - 47px);
 overflow: hidden;
}

.onfocus .play-btn:before {
 content: "";
 position: absolute;
 width: 120px;
 height: 120px;
 animation-delay: 0s;
 animation: pulsate-btn 2s;
 animation-direction: forwards;
 animation-iteration-count: infinite;
 animation-timing-function: steps;
 opacity: 1;
 border-radius: 50%;
 border: 5px solid rgba(var(--color-primary-rgb), 0.7);
 top: -15%;
 left: -15%;
 background: rgba(198, 16, 0, 0);
}

.onfocus .play-btn:after {
 content: "";
 position: absolute;
 left: 50%;
 top: 50%;
 transform: translateX(-40%) translateY(-50%);
 width: 0;
 height: 0;
 border-top: 10px solid transparent;
 border-bottom: 10px solid transparent;
 border-left: 15px solid var(--color-white);
 z-index: 100;
 transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.onfocus .play-btn:hover:before {
 content: "";
 position: absolute;
 left: 50%;
 top: 50%;
 transform: translateX(-40%) translateY(-50%);
 width: 0;
 height: 0;
 border: none;
 border-top: 10px solid transparent;
 border-bottom: 10px solid transparent;
 border-left: 15px solid var(--color-white);
 z-index: 200;
 animation: none;
 border-radius: 0;
}

.onfocus .play-btn:hover:after {
 border-left: 15px solid var(--color-primary);
 transform: scale(20);
}

@keyframes pulsate-btn {
 0% {
 transform: scale(0.6, 0.6);
 opacity: 1;
 }

 100% {
 transform: scale(1, 1);
 opacity: 0;
 }
}

/*--------------------------------------------------------------
# Features Section
--------------------------------------------------------------*/
.features .nav-tabs {
 border: 0;
}
.features .nav-link   { 
 background: #eee ;
 border: 0;
 padding: 10px; /* 4 nov */
 color: var(--color-secondary); 
 box-shadow: 5px 5px 5px rgba(var(--color-secondary-rgb), 0.45);
 border-radius: 8px ;
 display: flex;
 align-items: center;
 justify-content: center;
 flex-direction: column;
 transition: .5s;
 cursor: pointer;
 height: 100%; 
}
.features .nav-link2 { 
 padding: 5px; /* 4 nov */
 color: gray ; 
 /*box-shadow: 5px 5px 5px rgba(var(--color-secondary-rgb), 0.45);
 border-radius: 8px ;*/
 display: flex;
 align-items: center;
 justify-content: center;
 flex-direction: column;
 transition: .3s;
 cursor: pointer;
 height: 100%;  border-bottom: 1px solid gray ;
}
.features .nav-link2:hover {      color: var(--color-primary);
 border-bottom: 2px solid var(--color-primary); font-weight: bolder !important; 
}
.features .nav-link2.active { font-weight: bolder !important; 
    color: var(--color-primary);
    background: none;
    border-bottom: 3px solid var(--color-primary);
}


/* 26 novembre */
.features .nav-link:hover {   transition: 0.5s; 
background: #36a166; /* bg-button */
background: linear-gradient(2deg,rgba(54, 161, 102, 0.47) 0%, rgba(43, 128, 80, 0.18) 100%);
 box-shadow: 6px 6px 6px rgba(112,128,144, 1); color: red ! important 
}
.nav-link-border { border: 1px solid Silver !important ; }
.features .nav-link i {
 font-size: 32px;
 line-height: 0;
}
.features .nav-link h4 , .features .nav-link h5 {
 font-size: 20px;
 font-weight: 600;
 margin: 10px 0 0 0;
 color: var(--color-secondary);
}
.features .nav-link h5 { font-size: 10px;}
.features .nav-link:hover { color: var(--color-primary); }
/* 26 novembre */
.features .nav-link.active {
 transition: 0.3s; border-radius: 10px;
background: #36a166; /* bg-button */
background: linear-gradient(180deg, rgba(54, 161, 102, 0.75) 0%, rgba(43, 128, 80, 1) 100%);
 border-color: var(--color-primary); border: 1px solid red
}

.features .nav-link.active h4 {
 color: var(--color-white);
}

.features .nav-link.active i {
 color: var(--color-white) !important;
}

.features .tab-content {
 margin-top: 30px;
}

.features .tab-pane.active {
 animation: fadeIn 0.5s ease-out;
}

.features .tab-pane h3 {
 font-weight: 600;
 font-size: 36px;
 color: var(--color-secondary);
}

.features .tab-pane ul {
 list-style: none;
 padding: 0;
}

.features .tab-pane ul li {
 padding-bottom: 10px;
}

.features .tab-pane ul i {
 font-size: 24px;
 margin-right: 4px;
 color: var(--color-primary);
}

.features .tab-pane p:last-child {
 margin-bottom: 0;
}

@keyframes fadeIn {
 0% {
 opacity: 0;
 }

 100% {
 opacity: 1;
 }
}

/*--------------------------------------------------------------
# Services Section
--------------------------------------------------------------*/
.services .img {
 border-radius: 0px; padding-top: 10px ; 
 overflow: hidden;
}

.services .img img {
 transition: 0.8s;
}

.services .details {
 padding: 2px 5px;
 margin: -150px 18px 0 15px;
 transition: all ease-in-out 0.3s;
 background: var(--color-white);
 position: relative;
 /*background: #effaf6 ;*/
background: linear-gradient(180deg, #e7fdf5 0%, #d1f0e5 100%)
; 
 text-align: center;
 border-radius: 8px; 
 box-shadow: 0px 0 25px rgba(var(--color-black-rgb), .5);
 border: 1px solid var(--color-primary); padding:15px ;
 
}

.services .details .icon {
 margin: 0;
 width: 72px;
 height: 72px;
 background: var(--color-primary);
 border-radius: 50px;
 display: flex;
 align-items: center;
 justify-content: center;
 margin-bottom: 20px;
 color: var(--color-white);
 font-size: 28px;
 transition: ease-in-out 0.3s;
 position: absolute;
 top: -36px;
 left: calc(50% - 36px);
 border: 6px solid var(--color-white);
}

.services .details h3 {
 color: var(--color-default);
 font-weight: 700;
 margin: 10px 0 15px 0;
 font-size: 22px;
 transition: ease-in-out 0.3s;
}

.services .details p {
 line-height: 24px;
 font-size: 14px;
 margin-bottom: 0;
}

.services .service-item:hover .details h3 {
 color: var(--color-primary);
}

.services .service-item:hover .details .icon {
 background: var(--color-white);
 border: 2px solid var(--color-primary);
}

.services .service-item:hover .details .icon i {
 color: var(--color-primary);
}
.img { §opacity: 0.7 }
.services .service-item:hover .img img { transform: scale(1.06); opacity: 1.0 }
.services .service-item:hover .ribbon span {transition: all 1s ease; background: linear-gradient( 0%, DarkSeaGreen SeaGreen 100%) !important }

.img:hover { opacity: 1.0 ; transition: all 1s ease; }

/*--------------------------------------------------------------
# Testimonials Section
--------------------------------------------------------------*/
.testimonials {
 padding: 80px 0;
 background: url("../img/testimonials-bg.jpg") no-repeat;
 background-position: center center;
 background-size: cover;
 position: relative;
}

.testimonials::before {
 content: "";
 position: absolute;
 inset: 0;
 background: rgba(var(--color-secondary-dark-rgb), 0.8);
}

.testimonials .section-header {
 margin-bottom: 40px;
}

.testimonials .testimonials-carousel,
.testimonials .testimonials-slider {
 overflow: hidden;
}

.testimonials .testimonial-item {
 text-align: center;
 color: var(--color-white);
}

.testimonials .testimonial-item .testimonial-img {
 width: 100px;
 border-radius: 50%;
 border: 6px solid rgba(var(--color-white-rgb), 0.15);
 margin: 0 auto;
}


.testimonials .testimonial-item h3 {
 font-size: 20px;
 font-weight: bold;
 margin: 10px 0 5px 0;
 color: var(--color-white);
}

.testimonials .testimonial-item h4 {
 font-size: 14px;
 color: rgba(var(--color-white-rgb), 0.6);
 margin: 0 0 15px 0;
}

.testimonials .testimonial-item .stars {
 margin-bottom: 15px;
}

.testimonials .testimonial-item .stars i {
 color: var(--color-yellow);
 margin: 0 1px;
}

.testimonials .testimonial-item .quote-icon-left,
.testimonials .testimonial-item .quote-icon-right {
 color: rgba(var(--color-white-rgb), 0.6);
 font-size: 26px;
 line-height: 0;
}

.testimonials .testimonial-item .quote-icon-left {
 display: inline-block;
 left: -5px;
 position: relative;
}

.testimonials .testimonial-item .quote-icon-right {
 display: inline-block;
 right: -5px;
 position: relative;
 top: 10px;
 transform: scale(-1, -1);
}

.testimonials .testimonial-item p {
 font-style: italic;
 margin: 0 auto 15px auto;
}

.testimonials .swiper-pagination {
 margin-top: 20px;
 position: relative;
}

.testimonials .swiper-pagination .swiper-pagination-bullet {
 width: 12px;
 height: 12px;
 background-color: rgba(var(--color-white-rgb), 0.4);
 opacity: 0.5;
}

.testimonials .swiper-pagination .swiper-pagination-bullet-active {
 background-color: var(--color-white);
 opacity: 1;
}

@media (min-width: 992px) {
 .testimonials .testimonial-item p {
 width: 80%;
 }
}

/*--------------------------------------------------------------
# Pricing Section
--------------------------------------------------------------*/
.pricing {
 background: rgba(var(--color-secondary-rgb), 0.04);
}

.pricing .pricing-item {
 padding: 60px 40px;
 box-shadow: 0 3px 20px -2px rgba(var(--color-gray-rgb), 0.15);
 background: var(--color-white);
 height: 100%;
 display: flex;
 flex-direction: column;
 border: 4px solid var(--color-white);
 border-radius: 10px;
 overflow: hidden;
}

.pricing .pricing-header {
 background: linear-gradient(rgba(var(--color-secondary-rgb), 0.9), rgba(var(--color-secondary-rgb), 0.9)), url("../img/pricing-bg.jpg") center center;
 background-size: cover;
 text-align: center;
 padding: 40px;
 margin: -60px -40px 0;
}

.pricing h3 {
 font-weight: 600;
 margin-bottom: 5px;
 font-size: 36px;
 color: var(--color-white);
}

.pricing h4 {
 font-size: 48px;
 color: var(--color-white);
 font-weight: 400;
 font-family: var(--font-primary);
 margin-bottom: 0;
}

.pricing h4 sup {
 font-size: 28px;
}

.pricing h4 span {
 color: rgba(var(--color-white-rgb), 0.6);
 font-size: 24px;
}

.pricing ul {
 padding: 30px 0;
 list-style: none;
 color: var(--color-gray);
 text-align: left;
 line-height: 20px;
}

.pricing ul li {
 padding: 10px 0;
 display: flex;
 align-items: center;
}

.pricing ul i {
 color: var(--color-primary);
 font-size: 36px;
 padding-right: 3px;
 line-height: 0;
}

.pricing ul .na {
 color: rgba(var(--color-gray-rgb), 0.5);
}

.pricing ul .na i {
 color: rgba(var(--color-gray-rgb), 0.5);
 font-size: 24px;
 padding-left: 4px;
}

.pricing ul .na span {
 text-decoration: line-through;
}

.pricing .buy-btn {
 display: inline-block;
 padding: 12px 40px;
 border-radius: 6px;
 color: var(--color-primary);
 transition: none;
 font-size: 16px;
 font-weight: 700;
 transition: 0.3s;
 border: 1px solid var(--color-primary);
}

.pricing .buy-btn:hover {
 background: var(--color-primary);
 color: var(--color-white);
}

.pricing .featured {
 border-color: var(--color-primary);
}

.pricing .featured .pricing-header {
 background: linear-gradient(rgba(var(--color-primary-rgb), 0.9), rgba(var(--color-primary-rgb), 0.9)), url("../img/pricing-bg.jpg") center center;
}

.pricing .featured .buy-btn {
 background: var(--color-primary);
 color: var(--color-white);
}

/*--------------------------------------------------------------
# F.A.Q Section
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Faq Section

.faq .content h3 {
 font-weight: 400;
 font-size: 34px;
}

.faq .content p {
 font-size: 15px;
 color: color-mix(in srgb, var(--default-color), transparent 30%);
}

.faq .faq-container .faq-item {
 background-color: var(--surface-color);
 position: relative;
 padding: 20px;
 margin-bottom: 20px;
 box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.1);
 overflow: hidden;
}

.faq .faq-container .faq-item:last-child {
 margin-bottom: 0;
}

.faq .faq-container .faq-item h3 {
 font-weight: 600;
 font-size: 18px;
 line-height: 24px;
 margin: 0 30px 0 0;
 transition: 0.3s;
 cursor: pointer;
 display: flex;
 align-items: flex-start;
}

.faq .faq-container .faq-item h3 .num {
 color: var(--accent-color);
 padding-right: 5px;
}

.faq .faq-container .faq-item h3:hover {
 color: var(--accent-color);
}

.faq .faq-container .faq-item .faq-content {
 display: grid;
 grid-template-rows: 0fr;
 transition: 0.3s ease-in-out;
 visibility: hidden;
 opacity: 0;
}

.faq .faq-container .faq-item .faq-content p {
 margin-bottom: 0;
 overflow: hidden;
}

.faq .faq-container .faq-item .faq-toggle {
 position: absolute;
 top: 20px;
 right: 20px;
 font-size: 16px;
 line-height: 0;
 transition: 0.3s;
 cursor: pointer;
}

.faq .faq-container .faq-item .faq-toggle:hover {
 color: var(--accent-color);
}

.faq .faq-container .faq-active h3 {
 color: var(--accent-color);
}

.faq .faq-container .faq-active .faq-content {
 grid-template-rows: 1fr;
 visibility: visible;
 opacity: 1;
 padding-top: 10px;
}

.faq .faq-container .faq-active .faq-toggle {
 transform: rotate(90deg);
 color: var(--accent-color);
}
--------------------------------------------------------------*/




@media (max-width: 991px) {
 .faq {
 padding: 0;
 }
}

.faq .content h3 {
 font-weight: 400;
 font-size: 34px;
 color: var(--color-secondary);
}

.faq .content h4 {
 font-size: 20px;
 font-weight: 700;
 margin-top: 5px;
}

.faq .content p {
 font-size: 15px;
 color: var(--color-gray);
}

.faq .img {
 background-size: cover;
 background-repeat: no-repeat;
 background-position: center center;
 min-height: 400px;
}

.faq .accordion-item {
 border: 0;
 margin-top: 15px;
 box-shadow: 0px 5px 25px 0px rgba(var(--color-black-rgb), 0.06);
}

.faq .accordion-collapse {
 border: 0;
}

.faq .accordion-button {
 padding: 15px 40px 20px 60px;
 font-weight: 600;
 border: 0;
 font-size: 18px;
 color: var(--color-default);
 text-align: left;
 background: var(--color-white);
 box-shadow: none;
 border-radius: 5px;
}

.faq .accordion-button:not(.collapsed) {
 color: var(--color-primary);
 border-bottom: 0;
 box-shadow: none;
}

.faq .question-icon {
 position: absolute;
 top: 14px;
 left: 25px;
 font-size: 20px;
 color: var(--color-primary);
}

.faq .accordion-button:after {
 position: absolute;
 right: 15px;
 top: 15px;
 color: var(--color-primary);
}

.faq .accordion-body {
 padding: 0 30px 25px 60px;
 border: 0;
 border-radius: 5px;
 background: var(--color-white);
 box-shadow: none;
}

/*--------------------------------------------------------------
# Portfolio Section
--------------------------------------------------------------*/
.portfolio .portfolio-flters {
 padding: 0;
 margin: 0 auto 30px auto;
 list-style: none;
 text-align: center;
}

.portfolio .portfolio-flters li {
 cursor: pointer;
 display: inline-block;
 padding: 0;
 font-size: 18px;
 font-weight: 300;
 margin: 0 10px;
 line-height: 1;
 margin-bottom: 5px;
 transition: all 0.3s ease-in-out;
}

.portfolio .portfolio-flters li:hover,
.portfolio .portfolio-flters li.filter-active {
 color: var(--color-primary);
}

.portfolio .portfolio-flters li:first-child {
 margin-left: 0;
}

.portfolio .portfolio-flters li:last-child {
 margin-right: 0;
}

@media (max-width: 575px) {
 .portfolio .portfolio-flters li {
 font-size: 14px;
 margin: 0 5px;
 }
}

.portfolio .portfolio-item {
 position: relative;
 border: 1px solid var(--color-white);
 overflow: hidden;
 z-index: 1;
}

.portfolio .portfolio-item img {
 transition: all 0.3s;
}
/*
.portfolio .portfolio-item:before {
 content: "";
 inset: 0;
 position: absolute;
 background: rgba(var(--color-secondary-rgb), 0.8);
 z-index: 2;
 transition: 0.5s;
 visibility: hidden;
 opacity: 0;
}*/

.portfolio .portfolio-item .portfolio-info {
 opacity: 0;
 position: absolute;
 inset: auto 40px 40px 40px;
 z-index: 3;
 transition: all ease-in-out 0.3s;
 padding: 20px;
}

.portfolio .portfolio-item .portfolio-info h4 {
 font-size: 18px;
 font-weight: 600;
 color: var(--color-white);
 padding-right: 50px;
}

.portfolio .portfolio-item .portfolio-info .preview-link,
.portfolio .portfolio-item .portfolio-info .details-link {
 position: absolute;
 right: 50px;
 font-size: 24px;
 top: calc(50% - 14px);
 color: rgba(var(--color-white-rgb), 0.7);
 transition: 0.3s;
 line-height: 0;
}

.portfolio .portfolio-item .portfolio-info .preview-link:hover,
.portfolio .portfolio-item .portfolio-info .details-link:hover {
 color: var(--color-white);
}

.portfolio .portfolio-item .portfolio-info .details-link {
 right: 14px;
 font-size: 28px;
}

.portfolio .portfolio-item:hover:before {
 visibility: visible;
 opacity: 1;
}

.portfolio .portfolio-item:hover img {
 transform: scale(1.2);
}

.portfolio .portfolio-item:hover .portfolio-info {
 opacity: 1;
 inset: auto 10px 0 10px;
}

/*--------------------------------------------------------------
# Team Section
--------------------------------------------------------------*/
.team .team-member .member-img {
 border-radius: 8px;
 overflow: hidden; 
 box-shadow: 0px 2px 15px rgba(var(--color-black-rgb), 0.3);
}

.team .team-member .social {
 position: absolute;
 left: 0;
 top: -18px;
 right: 0;
 opacity: 0;
 transition: ease-in-out 0.3s;
 display: flex;
 align-items: center;
 justify-content: center;
}

.team .team-member .social a {
 transition: color 0.3s;
 color: var(--color-white);
 background: var(--color-primary);
 margin: 0 5px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 36px;
 height: 36px;
 border-radius: 50%;
 transition: 0.3s;
}

.team .team-member .social a i {
 line-height: 0;
 font-size: 16px;
}

.team .team-member .social a:hover {
 background: var(--color-primary-light);
}

.team .team-member .social i {
 font-size: 18px;
 margin: 0 2px;
}

.team .team-member .member-info {
 padding: 15px 15px;
 text-align: center;
 box-shadow: 0px 2px 15px rgba(var(--color-black-rgb), 0.3);
 background: var(--color-white);
 margin: -50px 20px 0 20px;
 position: relative;
 border-radius: 8px;
}

.team .team-member .member-info h4 {
 font-weight: 400;
 margin-bottom: 5px;
 font-size: 24px;
 color: var(--color-secondary);
}

.team .team-member .member-info span {
 display: block;
 font-size: 16px;
 font-weight: 400;
 color: var(--color-gray);
}

.team .team-member .member-info p {
 font-style: italic;
 font-size: 14px;
 line-height: 26px;
 color: var(--color-gray);
}

.team .team-member:hover .social {
 opacity: 1;
}

/*--------------------------------------------------------------
# Recent Blog Posts
--------------------------------------------------------------*/
.recent-blog-posts .post-box {
 transition: 0.3s;
 height: 100%;
 overflow: hidden;
 position: relative;
 display: flex;
 flex-direction: column;
 box-shadow: 0px 4px 15px -3px rgba(0,0,0,0.3); border-radius: 10px;
}

.recent-blog-posts .post-box .post-img {
 overflow: hidden;
 position: relative;
 border-radius: 10px;
}

.recent-blog-posts .post-box .post-img img {
 transition: 0.5s;
}

.recent-blog-posts .post-box .meta {
 margin-top: 15px;
}

.recent-blog-posts .post-box .meta .post-date {
 font-size: 15px;
 font-weight: 400;
 color: var(--color-primary);
}

.recent-blog-posts .post-box .meta .post-author {
 font-size: 15px;
 font-weight: 400;
 color: var(--color-secondary);
}

.recent-blog-posts .post-box .post-title {
 font-size: 24px;
 color: var(--color-secondary);
 font-weight: 700;
 margin: 15px 0 0 20px;
 position: relative;
 transition: 0.3s;
}
.recent-blog-posts .post-box h4 {
 
 margin: 0 0 0 20px;
 
}


.recent-blog-posts .post-box p {
 margin: 15px 0 0 0;
 color: rgba(var(--color-secondary-dark-rgb), 0.7);
}

.recent-blog-posts .post-box .readmore {
 display: flex;
 align-items: center;
 font-weight: 600;
 line-height: 1;
 transition: 0.3s;
 margin-top: 15px;
}

.recent-blog-posts .post-box .readmore i {
 line-height: 0;
 margin-left: 4px;
 font-size: 18px;
}

.recent-blog-posts .post-box:hover .post-title {
 color: var(--color-primary);
}

.recent-blog-posts .post-box:hover .post-img img {
 transform: scale(1.1);
}

/*--------------------------------------------------------------
# Contact Section
--------------------------------------------------------------*/
.contact .map {
 margin-bottom: 40px;
}

.contact .map iframe {
 border: 0;
 width: 70%;
 height: 400px;
}

.contact .info {
 padding: 40px; background-color : #fff ; border-radius : 5px ; 
 box-shadow: 0px 2px 15px rgba(var(--color-black-rgb), 0.1);
 overflow: hidden;
}

.contact .info h3 {
 font-weight: 600;
 font-size: 24px;
}

.contact .info p {
 color: var(--color-secondary-light);
 margin-bottom: 30px;
 font-size: 15px;
}

.contact .info-item+.info-item {
 padding-top: 10px;
 margin-top: 10px;
 border-top: 1px solid rgba(var(--color-secondary-rgb), 0.15);
}

.contact .info-item i {
 font-size: 24px;
 color: var(--color-primary);
 transition: all 0.3s ease-in-out;
 margin-right: 20px; text-shadow: 3px 3px 5px #aeb0ae ;
}

.contact .info-item h4 {
 padding: 0;
 font-size: 18px;
 font-weight: 600;
 margin-bottom: 5px;
 color: var(--color-secondary);
}

.contact .info-item p {
 padding: 0;
 margin-bottom: 0;
 font-size: 14px;
 color: var(--color-secondary-light);
}
.contact .info-item:hover {
  background-color: rgba(255, 255, 255, 0.2);
  transform: translateY(-3px);   transition: all 0.6s ease;
}

.contact .php-email-form {
 width: 100%;
 background: var(--color-white);
}

.contact .php-email-form .form-group {
 padding-bottom: 8px;
}

.contact .php-email-form .error-message {
 display: none;
 color: var(--color-white);
 background: var(--color-red);
 text-align: left;
 padding: 5px;
 font-weight: 600;
}

.contact .php-email-form .error-message br+br {
 margin-top: 25px;
}

.contact .php-email-form .sent-message {
 display: none;
 color: var(--color-white);
 background: var(--color-green);
 text-align: center;
 padding: 5px;
 font-weight: 600;
}

.contact .php-email-form .loading {
 display: none;
 background: var(--color-white);
 text-align: center;
 padding: 5px;
}

.contact .php-email-form .loading:before {
 content: "";
 display: inline-block;
 border-radius: 50%;
 width: 24px;
 height: 24px;
 margin: 0 10px -6px 0;
 border: 3px solid var(--color-green);
 border-top-color: var(--color-white);
 animation: animate-loading 1s linear infinite;
}

.contact .php-email-form input[type=text],
.contact .php-email-form input[type=email],
.contact .php-email-form textarea {
 border-radius: 0px;
 box-shadow: none;
 font-size: 14px;
}

.contact .php-email-form input[type=text]:focus,
.contact .php-email-form input[type=email]:focus,
.contact .php-email-form textarea:focus {
 border-color: var(--color-secondary-light);
}

.contact .php-email-form input[type=text],
.contact .php-email-form input[type=email] {
 height: 48px;
 padding: 5px 5px;
}

.contact .php-email-form textarea {
 padding: 10px 12px;

}

.contact .php-email-form button[type=submit] {
 background: var(--color-primary);
 border: 0;
 padding: 13px 50px;
 color: var(--color-white);
 transition: 0.4s;
 border-radius: 0;
}
.prevnext, .button_main , .read_more , .button_news , .button_link {
 background: var(--color-primary);
 border: 0;
 padding: 3px 15px;
 color: var(--color-white);
 transition: 0.4s; 
 margin-bottom:14px ;
 border-radius: 8px; box-shadow: 0px 8px 8px -3px rgba(0,0,0,0.4);
}
.button_main , .read_more , .button_link { 
 background: #72cc90 ;
 color: var(--color-white); margin-top: 12px !important ; margin-bottom:0px !important ;
}
.button_icon { 
padding-left; 0px !important ; margin-left; 0px !important ; 
 /*color: var(--color-primary); border: 0px !important ; */
}
.button_link { font-size: 1.3rem ; border-radius: 14px ; margin: 10px 20px !important } 

.read_more { padding: 0px 5px; font-size:.9rem ; 
 background: white ; float:right !important ; 
 color: var(--color-primary) !important ; border: 1px solid var(--color-primary) ;
 }
.read_more:hover {
letter-spacing: 1px; 
}

.prevnext:hover , .button_main:hover , .read_more:hover , .button_link:hover {
background: #b4e0bf /* rgba(var(--color-primary-rgb), 0.8)*/ ;
color : #000 /* #046b1e */ ; 
transform: scale(1.06); 
}
.button_link:hover { transform: scale(1.051); }

.prevnext  {
 background-image: linear-gradient( #6dab8d , #0b673b );
 border: 0;
 padding: 3px 15px;
 color: #fff ;
 transition: 0.4s; 
 margin-bottom:14px ;
 border-radius: 8px; box-shadow: 0px 8px 8px -3px rgba(0,0,0,0.4);
}
.prevnextMini {
 background-image: linear-gradient( #95C2AC    , #B5D4C5 );
 border: 0;
 padding: 3px 15px;
 color: DarkGreen ;
 transition: 0.4s; 
 margin-bottom:14px ;
 border-radius: 8px; box-shadow: 0px 8px 8px -3px rgba(0,0,0,0.4);
 } 


.prevnext:hover , .prevnextMini:hover {
background: #b4e0bf /* rgba(var(--color-primary-rgb), 0.8)*/ ;
color : #000 /* #046b1e */ ; 
}


.button-70 {
 
 border: 0;
 border-radius: 4px;
 box-shadow: rgba(0, 0, 0, .3) 0 5px 15px;
 box-sizing: border-box;
 color: #fff;
 cursor: pointer;
 font-family: Montserrat,sans-serif;
 font-size: .9em;
 margin: 5px;
 padding: 10px 15px;
 text-align: center;
 user-select: none;
 -webkit-user-select: none;
 touch-action: manipulation;
}



.contact .php-email-form button[type=submit]:hover {
 background: rgba(var(--color-primary-rgb), 0.85);
}

@keyframes animate-loading {
 0% {
 transform: rotate(0deg);
 }

 100% {
 transform: rotate(360deg);
 }
}

/*--------------------------------------------------------------
# Portfolio Details
--------------------------------------------------------------*/
.portfolio-details {
 padding-top: 40px;
}

.portfolio-details .portfolio-details-slider img {
 width: 100%;
}

.portfolio-details .portfolio-details-slider .swiper-pagination {
 margin-top: 20px;
 position: relative;
}

.portfolio-details .portfolio-details-slider .swiper-pagination .swiper-pagination-bullet {
 width: 12px;
 height: 12px;
 background-color: var(--color-white);
 opacity: 1;
 border: 1px solid var(--color-primary);
}

.portfolio-details .portfolio-details-slider .swiper-pagination .swiper-pagination-bullet-active {
 background-color: var(--color-primary);
}

.portfolio-details .portfolio-info {
 padding: 30px;
 box-shadow: 0px 0 30px rgba(var(--color-secondary-rgb), 0.15);
}

.portfolio-details .portfolio-info h3 {
 font-size: 22px;
 font-weight: 700;
 margin-bottom: 20px;
 padding-bottom: 20px;
 border-bottom: 1px solid var(--color-secondary-light);
}

.portfolio-details .portfolio-info ul {
 list-style: none;
 padding: 0;
 font-size: 15px;
}

.portfolio-details .portfolio-info ul li+li {
 margin-top: 10px;
}

.portfolio-details .portfolio-description {
 padding-top: 30px;
}

.portfolio-details .portfolio-description h2 {
 font-size: 26px;
 font-weight: 700;
 margin-bottom: 20px;
}

.portfolio-details .portfolio-description p {
 padding: 0;
}

/*--------------------------------------------------------------
# Blog Stylings
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Blog Home Posts List
--------------------------------------------------------------*/
.blog .posts-list article {
 box-shadow: 0 4px 16px rgba(var(--color-black-rgb), 0.1);
 padding: 30px;
 height: 100%;
}

.blog .posts-list article+article {
 margin-top: 60px;
}

.blog .posts-list .post-img {
 max-height: 240px;
 margin: -30px -30px 0 -30px;
 overflow: hidden;
}

.blog .posts-list .title {
 font-size: 20px;
 font-weight: 700;
 padding: 0;
 margin: 20px 0 0 0; color: var(--color-primary) !important ;
}

.blog .posts-list .title a {
 color: var(--color-secondary);
 transition: 0.3s;
}

.blog .posts-list .title a:hover {
 color: var(--color-primary);
}

.blog .posts-list .meta-top {
 margin-top: 20px;
 color: var(--color-gray);
}

.blog .posts-list .meta-top ul {
 display: flex;
 flex-wrap: wrap;
 list-style: none;
 align-items: center;
 padding: 0;
 margin: 0;
}

.blog .posts-list .meta-top ul li+li {
 padding-left: 20px;
}

.blog .posts-list .meta-top i {
 font-size: 16px;
 margin-right: 8px;
 line-height: 0;
 color: rgba(var(--color-primary-rgb), 0.8);
}

.blog .posts-list .meta-top a {
 color: var(--color-gray);
 font-size: 14px;
 display: inline-block;
 line-height: 1;
}

.blog .posts-list .content {
 margin-top: 20px;
}

.blog .posts-list .read-more a {
 display: inline-block;
 background: var(--color-primary);
 color: var(--color-white);
 padding: 8px 30px;
 transition: 0.3s;
 font-size: 14px;
 border-radius: 4px;
}

.blog .posts-list .read-more a:hover {
 background: rgba(var(--color-primary-rgb), 0.8);
}

/*--------------------------------------------------------------
# Blog Details Page
--------------------------------------------------------------*/
.blog .blog-details {
 box-shadow: 0 4px 16px rgba(var(--color-black-rgb), 0.1);
 padding: 10px 30px 30px 30px !important ;
}

.blog .blog-details .post-img {
 margin: -30px -30px 20px -30px;
 overflow: hidden;
}

.blog .blog-details .title {
 font-size: 28px;
 font-weight: 700;
 padding: 0;
 margin: 20px 0 0 0;
 color: var(--color-secondary);
}

.blog .blog-details .content {
 margin-top: 20px;
}

.blog .blog-details .content h3 {
 font-size: 22px;
 margin-top: 30px;
 font-weight: bold;
}

.blog .blog-details .content blockquote {
 overflow: hidden;
 background-color: rgba(var(--color-secondary-rgb), 0.06);
 padding: 60px;
 position: relative;
 text-align: center;
 margin: 20px 0;
}

.blog .blog-details .content blockquote p {
 color: var(--color-default);
 line-height: 1.6;
 margin-bottom: 0;
 font-style: italic;
 font-weight: 500;
 font-size: 22px;
}

.blog .blog-details .content blockquote:after {
 content: "";
 position: absolute;
 left: 0;
 top: 0;
 bottom: 0;
 width: 3px;
 background-color: var(--color-secondary);
 margin-top: 20px;
 margin-bottom: 20px;
}

.blog .blog-details .meta-top {
 margin-top: 20px;
 color: var(--color-gray);
}

.blog .blog-details .meta-top ul {
 display: flex;
 flex-wrap: wrap;
 list-style: none;
 align-items: center;
 padding: 0;
 margin: 0;
}

.blog .blog-details .meta-top ul li+li {
 padding-left: 20px;
}

.blog .blog-details .meta-top i {
 font-size: 16px;
 margin-right: 8px;
 line-height: 0;
 color: rgba(var(--color-primary-rgb), 0.8);
}

.blog .blog-details .meta-top a {
 color: var(--color-gray);
 font-size: 14px;
 display: inline-block;
 line-height: 1;
}

.blog .blog-details .meta-bottom {
 padding-top: 10px;
 border-top: 1px solid rgba(var(--color-secondary-rgb), 0.15);
}

.blog .blog-details .meta-bottom i {
 color: var(--color-secondary-light);
 display: inline;
}

.blog .blog-details .meta-bottom a {
 color: rgba(var(--color-secondary-rgb), 0.8);
 transition: 0.3s;
}

.blog .blog-details .meta-bottom a:hover {
 color: var(--color-primary);
}

.blog .blog-details .meta-bottom .cats {
 list-style: none;
 display: inline;
 padding: 0 20px 0 0;
 font-size: 14px;
}

.blog .blog-details .meta-bottom .cats li {
 display: inline-block;
}

.blog .blog-details .meta-bottom .tags {
 list-style: none;
 display: inline;
 padding: 0;
 font-size: 14px;
}

.blog .blog-details .meta-bottom .tags li {
 display: inline-block;
}

.blog .blog-details .meta-bottom .tags li+li::before {
 padding-right: 6px;
 color: var(--color-default);
 content: ",";
}

.blog .blog-details .meta-bottom .share {
 font-size: 16px;
}

.blog .blog-details .meta-bottom .share i {
 padding-left: 5px;
}

.blog .post-author {
 padding: 20px;
 margin-top: 30px;
 box-shadow: 0 4px 16px rgba(var(--color-black-rgb), 0.1);
}

.blog .post-author img {
 max-width: 120px;
 margin-right: 20px;
}

.blog .post-author h4 {
 font-weight: 600;
 font-size: 22px;
 margin-bottom: 0px;
 padding: 0;
 color: var(--color-secondary);
}

.blog .post-author .social-links {
 margin: 0 10px 10px 0;
}

.blog .post-author .social-links a {
 color: rgba(var(--color-secondary-rgb), 0.5);
 margin-right: 5px;
}

.blog .post-author p {
 font-style: italic;
 color: rgba(var(--color-gray-rgb), 0.8);
 margin-bottom: 0;
}

/*--------------------------------------------------------------
# Blog Sidebar
--------------------------------------------------------------*/
.blog .sidebar {
 padding: 30px; 
}
.blog .sidebar.pad {
 padding: 5px 30px 20px 30px !important ; 
}

.blog .sidebar .sidebar-title {
 font-size: 20px;
 font-weight: 700;
 padding: 0;
 margin: 0;
 color: var(--color-primary);
}

.blog .sidebar .sidebar-item+.sidebar-item {
 margin-top: 40px;
}

.blog .sidebar .search-form form {
 background: var(--color-white);
 border: 1px solid rgba(var(--color-secondary-rgb), 0.3);
 padding: 3px 10px;
 position: relative;
}

.blog .sidebar .search-form form input[type=text] {
 border: 0;
 padding: 4px;
 border-radius: 4px;
 width: calc(100% - 40px);
}

.blog .sidebar .search-form form input[type=text]:focus {
 outline: none;
}

.blog .sidebar .search-form form button {
 position: absolute;
 top: 0;
 right: 0;
 bottom: 0;
 border: 0;
 background: none;
 font-size: 16px;
 padding: 0 15px;
 margin: -1px;
 background: var(--color-primary);
 color: var(--color-white);
 transition: 0.3s;
 border-radius: 0 4px 4px 0;
 line-height: 0;
}

.blog .sidebar .search-form form button i {
 line-height: 0;
}

.blog .sidebar .search-form form button:hover {
 background: rgba(var(--color-primary-rgb), 0.8);
}

.blog .sidebar .categories ul {
 list-style: none;
 padding: 0;
}

.blog .sidebar .categories ul li+li {
 padding-top: 10px;
}

.blog .sidebar .categories ul a {
 color: var(--color-secondary);
 transition: 0.3s;
}

.blog .sidebar .categories ul a:hover {
 color: var(--color-default);
}

.blog .sidebar .categories ul a span {
 padding-left: 5px;
 color: rgba(var(--color-default-rgb), 0.4);
 font-size: 14px;
}

.blog .sidebar .recent-posts .post-item {
 display: flex;
}

.blog .sidebar .recent-posts .post-item+.post-item {
 margin-top: 15px;
}

.blog .sidebar .recent-posts img {
 width: 80px;
 margin-right: 15px;
}

.blog .sidebar .recent-posts h4 {
 font-size: 18px;
 font-weight: 400;
}

.blog .sidebar .recent-posts h4 a {
 color: var(--color-secondary);
 transition: 0.3s;
}

.blog .sidebar .recent-posts h4 a:hover {
 color: var(--color-primary);
}

.blog .sidebar .recent-posts time {
 display: block;
 font-style: italic;
 font-size: 14px;
 color: rgba(var(--color-default-rgb), 0.4);
}

.blog .sidebar .tags {
 margin-bottom: -10px;
}

.blog .sidebar .tags ul {
 list-style: none;
 padding: 0;
}

.blog .sidebar .tags ul li {
 display: inline-block;
}

.blog .sidebar .tags ul a {
 color: var(--color-secondary-light);
 font-size: 14px;
 padding: 6px 14px;
 margin: 0 6px 8px 0;
 border: 1px solid rgba(var(--color-secondary-light-rgb), 0.8);
 display: inline-block;
 transition: 0.3s;
}

.blog .sidebar .tags ul a:hover {
 color: var(--color-white);
 border: 1px solid var(--color-primary);
 background: var(--color-primary);
}

.blog .sidebar .tags ul a span {
 padding-left: 5px;
 color: rgba(var(--color-secondary-light-rgb), 0.8);
 font-size: 14px;
}

/*--------------------------------------------------------------
# Blog Comments
--------------------------------------------------------------*/
.blog .comments {
 margin-top: 30px;
}

.blog .comments .comments-count {
 font-weight: bold;
}

.blog .comments .comment {
 margin-top: 30px;
 position: relative;
}

.blog .comments .comment .comment-img {
 margin-right: 14px;
}

.blog .comments .comment .comment-img img {
 width: 60px;
}

.blog .comments .comment h5 {
 font-size: 16px;
 margin-bottom: 2px;
}

.blog .comments .comment h5 a {
 font-weight: bold;
 color: var(--color-default);
 transition: 0.3s;
}

.blog .comments .comment h5 a:hover {
 color: var(--color-primary);
}

.blog .comments .comment h5 .reply {
 padding-left: 10px;
 color: var(--color-secondary);
}

.blog .comments .comment h5 .reply i {
 font-size: 20px;
}

.blog .comments .comment time {
 display: block;
 font-size: 14px;
 color: rgba(var(--color-secondary-rgb), 0.8);
 margin-bottom: 5px;
}

.blog .comments .comment.comment-reply {
 padding-left: 40px;
}

.blog .comments .reply-form {
 margin-top: 30px;
 padding: 30px;
 box-shadow: 0 4px 16px rgba(var(--color-black-rgb), 0.1);
}

.blog .comments .reply-form h4 {
 font-weight: bold;
 font-size: 22px;
}

.blog .comments .reply-form p {
 font-size: 14px;
}

.blog .comments .reply-form input {
 border-radius: 4px;
 padding: 10px 10px;
 font-size: 14px;
}

.blog .comments .reply-form input:focus {
 box-shadow: none;
 border-color: rgba(var(--color-primary-rgb), 0.8);
}

.blog .comments .reply-form textarea {
 border-radius: 4px;
 padding: 10px 10px;
 font-size: 14px;
}

.blog .comments .reply-form textarea:focus {
 box-shadow: none;
 border-color: rgba(var(--color-primary-rgb), 0.8);
}

.blog .comments .reply-form .form-group {
 margin-bottom: 25px;
}

.blog .comments .reply-form .btn-primary {
 border-radius: 4px;
 padding: 10px 20px;
 border: 0;
 background-color: var(--color-secondary);
}

.blog .comments .reply-form .btn-primary:hover {
 background-color: rgba(var(--color-secondary-rgb), 0.8);
}

/*--------------------------------------------------------------
# Blog Home Pagination
--------------------------------------------------------------*/
.blog .blog-pagination {
 margin-top: 30px;
 color: var(--color-secondary-light);
}

.blog .blog-pagination ul {
 display: flex;
 padding: 0;
 margin: 0;
 list-style: none;
}

.blog .blog-pagination li {
 margin: 0 5px;
 transition: 0.3s;
}

.blog .blog-pagination li a {
 color: var(--color-secondary);
 padding: 7px 16px;
 display: flex;
 align-items: center;
 justify-content: center;
}

.blog .blog-pagination li.active,
.blog .blog-pagination li:hover {
 background: var(--color-primary);
}

.blog .blog-pagination li.active a,
.blog .blog-pagination li:hover a {
 color: var(--color-white);
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.footer {
 color: var(--color-white);
 font-size: 14px;
}

.footer .footer-content {
 background: var(--color-secondary);
 padding: 60px 0 30px 0;
}

.footer .footer-content .footer-info {
 margin-bottom: 30px;
}

.footer .footer-content .footer-info h3 {
 font-size: 28px;
 margin: 0 0 20px 0;
 padding: 2px 0 2px 0;
 line-height: 1;
 font-weight: 700;
 text-transform: uppercase;
}

.footer .footer-content .footer-info h3 span {
 color: var(--color-primary);
}

.footer .footer-content .footer-info p {
 font-size: 14px;
 line-height: 24px;
 margin-bottom: 0;
 font-family: var(--font-primary);
 color: var(--color-white);
}

.footer .footer-content h4 {
 font-size: 16px;
 font-weight: 600;
 color: var(--color-white);
 position: relative;
 padding-bottom: 12px;
 margin-bottom: 15px;
}

.footer .footer-content h4::after {
 content: "";
 position: absolute;
 display: block;
 width: 20px;
 height: 2px;
 background: var(--color-primary);
 bottom: 0;
 left: 0;
}

.footer .footer-content .footer-links {
 margin-bottom: 30px;
}

.footer .footer-content .footer-links ul {
 list-style: none;
 padding: 0;
 margin: 0;
}

.footer .footer-content .footer-links ul i {
 padding-right: 2px;
 color: var(--color-white);
 font-size: 12px;
 line-height: 1;
}

.footer .footer-content .footer-links ul li {
 padding: 10px 0;
 display: flex;
 align-items: center;
}

.footer .footer-content .footer-links ul li:first-child {
 padding-top: 0;
}

.footer .footer-content .footer-links ul a {
 color: rgba(var(--color-white-rgb), 0.7);
 transition: 0.3s;
 display: inline-block;
 line-height: 1;
}

.footer .footer-content .footer-links ul a:hover {
 color: var(--color-white);
}

.footer .footer-content .footer-newsletter form {
 margin-top: 30px;
 background: var(--color-white);
 padding: 6px 10px;
 position: relative;
 border-radius: 4px;
}

.footer .footer-content .footer-newsletter form input[type=email] {
 border: 0;
 padding: 4px;
 width: calc(100% - 110px);
}

.footer .footer-content .footer-newsletter form input[type=email]:focus-visible {
 outline: none;
}

.footer .footer-content .footer-newsletter form input[type=submit] {
 position: absolute;
 top: 0;
 right: -2px;
 bottom: 0;
 border: 0;
 background: none;
 font-size: 16px;
 padding: 0 20px;
 background: var(--color-primary);
 color: var(--color-white);
 transition: 0.3s;
 border-radius: 0 4px 4px 0;
}

.footer .footer-content .footer-newsletter form input[type=submit]:hover {
 background: rgba(var(--color-primary-rgb), 0.85);
}

.footer .footer-legal {
 padding: 30px 0;
 background: var(--color-secondary-dark);
}

.footer .footer-legal .credits {
 padding-top: 4px;
 font-size: 13px;
 color: var(--color-white);
}

.footer .footer-legal .credits a {
 color: var(--color-primary-light);
}

.footer .footer-legal .social-links a {
 font-size: 18px;
 display: inline-block;
 background: rgba(var(--color-white-rgb), 0.1);
 color: var(--color-white);
 line-height: 1;
 padding: 8px 0;
 margin-right: 4px;
 border-radius: 4px;
 text-align: center;
 width: 36px;
 height: 36px;
 transition: 0.3s;
}

.footer .footer-legal .social-links a:hover {
 background: var(--color-primary);
 text-decoration: none;
}




/*--------------------------------------------------------------
# aggiunte

h4 { color: var(--color-primary) !important ; }
--------------------------------------------------------------*/
h4 { font-size: 1.3rem !important; }

/*.navbar .dropdown ul li .color-white_over:hover { color: #ffffff !important; }*/
.navbar .dropdown ul li .color-white { color: #ffffff !important; }


/*.fancycarosello {
box-shadow: 10px 10px 13px 0px rgba(184,181,181,0.75);
-webkit-box-shadow: 10px 10px 13px 0px rgba(184,181,181,0.75);
-moz-box-shadow: 10px 10px 13px 0px rgba(184,181,181,0.75);
border-radius: 15px ; §margin: 10px ; §padding: 10px 0 ; 
border: 4px solid red ;
	}*/
	
.color-social { color: var(--color-primary-light) !important; }
.color-social:hover { color: #edefed !important; }
.800x600 { width: 800px; height: 600px; }
p, .color_primary { color: var(--color-primary) !important ; font-size: 1rem }


p.color_primary { font-size: 1rem }

h2.title , h2.titleNotizia {
 font-size: 1.3rem !important ;
 font-weight: 700;
 padding: 0;
 margin: 20px 0 0 0; color: var(--color-primary) !important ;
}
h2.titleNotizia {
 font-size: 1.2rem !important ; margin: 0 0 0 0 !important ; 
}


.div-class , .div-classF_REMMATO {
 background-image: url("../../img/Banner_sito_CdQ.jpg");
 background-size: cover;
 background-repeat: no-repeat; width: 100%; 
 height: 120px;
}
/* §-§ */
.navbar a { font-size: 18px !important; } 
.navbar a i { font-size: 18px !important; color: var(--color-primary) } 

.color-gray { color: LightSlateGray !important; padding: 0 5px ; }

.indent , .indentBR { font-size: 17px !important; text-indent: 30px !important; text-align: left; color: var(--color-primary) !important; }
.soloP { font-size: 17px !important;  color: var(--color-primary) !important; }

.maiuscolo { color: var(--color-primary-dark) ; font-weight: bold !important ; }



h3 { font-size: 19px !important; }

h1 , h2 ,h5 , h3 , h4 , .postitsmartphone , .summ , .button_link { color : #red ; text-shadow: 3px 3px 5px #aeb0ae ; }


h2.titoloP { margin-top: 132px; }
 h2.titolocrumbs { margin-top: -10px; }

.margintop { margin-top: 80px ;}
.margintop130 { margin-top: 130px ;}

.ml-30 { margin-left: 30px ;}
.bi-calendar-event-fill , .bi-camera-reels-fill { color: var(--color-default) !important ;}
.paddingtop { padding: 60px 0 0 0 !important;}
.shadow { border-radius: 8px ; box-shadow: 9px 7px 15px 5px rgba(0,0,0,0.3) !important ;}
.backcolor { background: green; !important;}
.copyright { text-align:left }

summary { padding-left: 10px!important ; background: #ffffff ; /*font-weight: bold;*/ border-bottom: 0px solid green !important ; font-size: 16px !important ; } 
summary { color: var(--color-primary) !important ; box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1); background: #edefed ; padding-left: 20px } 

.com_info { border-bottom: 0px solid green !important } 

details { font-size: 20px; }
.padding20 { padding: 20px !important ;}
.paddingPoesia { font-weight: bold !important ; color: var(--color-primary) ; font-size: 20px !important ; font-family: var(--font-secondary ); padding : 0 0 10px 50px !important ;}
details > summary: visited { color: pink;}



.image-shadow{ 
margin : 10px !important ; 
box-shadow: 2px 2px 12px 0px rgba(20,20,20,1);
-webkit-box-shadow: 2px 2px 12px 0px rgba(20,20,20,1);
-moz-box-shadow: 2px 2px 12px 0px rgba(20,20,20,1); 
}


.border-1 {border-radius: 50% 20% / 10% 25% !important ;}
.border-2 {border-radius: 15% / 25% !important ;}
.border-3 {border-radius: 20% 10% !important ;}
.border-4 {border-radius: 15% 15% 15% 15% !important ;}
.border-img {border-radius: 13px !important ;}

.example-image-iniziative { width: 250px !important ; } 

.hr-color-green { border-top: 2px solid var(--color-primary ); }

h6 , h6.iniziative , h6.galleryphoto , .galleryphoto { font-size: 18px; margin-top: 15px ; color: var(--color-primary) !important ; border-bottom: 1px solid var(--color-primary) ; width: 80%; 
 }
h6.iniziative , h6.galleryphoto { font-style: normal !important ; border-bottom: 0 ; width: 80%; }
.label_gallery { font-weight: bold; font-size: 18px; margin-top: 15px ; color: var(--color-primary) !important ; text-shadow: 3px 3px 5px #aeb0ae !important ;}
h6 { font-style: normal;}


.member-img { border-radius:18px }
.galleryImg{ z-index: 289 !important ; opacity: .9 /* remmato 0.7 */; transform-origin: 50% 50%; transition: all 1s linear; }
 .galleryImg:hover{ opacity: 1.0 ; transform: scale(1.1) ; }
 
 
 .lb-data .lb-caption {
 font-size: 16px !important ; color: #fff ; }

 
 
 
.shadow_main { 
 border-radius: 13px !important ; 
 box-shadow: 0 4px 16px rgba(var(--color-black-rgb), 0.3) !important ;
-webkit-box-shadow:0 4px 16px rgba(var(--color-black-rgb), 0.3) !important ;
-moz-box-shadow: 0 4px 16px rgba(var(--color-black-rgb), 0.3) !important ;
  /* 
 box-shadow: 2px 2px 12px 0px red;
-webkit-box-shadow: 2px 2px 12px 0px red;
-moz-box-shadow: 2px 2px 12px 0px red; 
box-shadow: 0px 2px 15px gray !important ; */
}

article.shadow-border , .shadow-border 
{border-radius: 13px !important ;
 background: #fff !important ;
 box-shadow: 0 4px 16px rgba(var(--color-black-rgb), 0.3) !important ;
}




.shadow_img {
 border-radius: 13px !important ; 
box-shadow: 2px 2px 12px 0px rgba(20,20,20,.5) !important ; 
-webkit-box-shadow: 2px 2px 12px 0px rgba(20,20,20,.5) !important ; 
-moz-box-shadow: 2px 2px 12px 0px rgba(20,20,20,.5) !important ; 

}
	
	
 .accordion-button {
 color: var(--color-primary) !important; background-color: #edefed ;
} 
.modal-content{ border: 5px solid var(--color-primary) ; box-shadow: 0px 2px 15px rgba(var(--color-black-rgb), 0.4); } 



.postit { 
background-image: url('../../postit.png') ;
 display: inline-block;
 width: 400px;
 height: 370px;
 margin-left: 30px ; background-attachment: fixed;
 background-position: center; 
 background-repeat: no-repeat; 
 }
.text1 , .text2 {
transform: rotate(10deg);
font-family: "Indie Flower" !important ;
 font-weight: 400;
 font-style: normal;
}
.text1 { 
 padding: 16px 0 0 30px ; 
}
.text2 { text-align: center; 
 padding: 30px 25px 0 50px !important ; font-size: 1.5rem ! important ;
}

.NoVisibilita {visibility: hidden;}

.postit_index , .postit_index1 , .postit_index3 { 
/*border: 1px solid var(--color-primary) !important; */
color:green !important ; width:300px !important ; 
padding:20px !important ; margin:10px !important ;
}
.postit_index h4 , .postit_index1 h4 , .postit_index3 h4 { color: var(--color-primary) !important }
h4 .sottotitolo { font-size: 1rem ! important ; }
h5 .sottotitolo { font-size: 1rem ! important ; }
.navbar .dropdown ul li .color-white-2 { /*color: red !important;*/ }
.navbar .dropdown a:focus .icon-nav , .navbar .dropdown a:hover .icon-nav { color: var(--color-white) !important; }
.section-header h4 { color: var(--color-primary) !important;}
.newrem { font-size: 1.3rem ! important ; padding: 20px 30px; margin:10px !important; }
.color-primary { color: var(--color-primary) !important;}


.myborderTop {border-top: 0px solid gray } 

.ShowDesktop	 { height: auto !important; }
.ShowItem	 { display:none !important ; } 

.color-primary {color: var(--color-primary)}


summary { box-shadow: 0 0 0 0 rgba(var(--color-black-rgb), .0) !important ;}
.services .details { margin: -100px 8px 0 8px !important ; padding :10px ; } 
/*
*, html , body , h1, h2, h3 , h4, h5, h6 , .container-fluid .nav-link .scrollto a { font-family: 'cursive', Helvetica, sans-serif !important ; } 
*/
h4.color_primary , h4 {font-size: 1.1rem !important ; }
.margintop10 {margin-top: 10px !important }

.button_news { background:var(--color-primary)  ; color : #fff ; font-size:1.3rem } 
.button_news:hover { transition: all 0.6s ease-out; background: #72cc90 ; color: var(--color-white); letter-spacing: 1px; } 
.stylemodal { width:50% }

.services .detailsVideo {
 padding: 2px 2px !important;
 margin: -40px 60px 0 15px !important;
 transition: all ease-in-out 0.3s;
 background: var(--color-white);
 position: relative;
 background: rgba(var(--color-white-rgb), 1);
 text-align: center;
 border-radius: 8px;
 box-shadow: 0px 0 25px rgba(var(--color-black-rgb), .5);
 border: 1px solid var(--color-primary);
 padding: 15px;
}
.caption-text { box-shadow: 0px 2px 20px rgba(var(--color-secondary-rgb), 0.6); width:90%; margin-bottom:20px !important ; text-align:center ;left: 0; right: 0; position: absolute; top:220px ; 
color:var(--color-primary) ; background:white ; border: 1px solid var(--color-primary) ; 
			border-radius :8px; }

.service-item:hover .caption-text{ transition: all 0.5s ; transform: rotate(-1deg);}


.newsitem .details {
background: rgb(114,199,152);
background: linear-gradient(180deg, rgba(114,199,152,1) 0%, rgba(31,121,9,1) 100%, rgba(0,212,255,1) 100%);
	!important ; }
.newsitem .details h3, .newsitem .details .indent , .newsitem .details .bi {color : white !important ; }
.facebook , .instagram { text-shadow: 1px 1px 3px #949494 ; }



.prova {		background: rgb(2,0,36);
background: linear-gradient(180deg, rgba(2,0,36,1) 0%, rgba(213,240,199,1) 0%, rgba(193,244,229,1) 100%);}

.radius15 {border-radius: 15px !important ; }
.radius10 {border-radius: 10px !important ; }

.back_withe {background: var(--color-white);}


h4 .H4small { font-size: .5rem !important ;}

/* read-more-state */ 
.read-more-state { display: none; }
.read-more-target { opacity: 0; max-height: 0; font-size: 0; transition: .25s ease;}
.read-more-state:checked ~ .read-more-wrap .read-more-target { opacity: 1; font-size: inherit; max-height: 999em;}
.read-more-state ~ .read-more-trigger:before { content: 'Show more';}
.read-more-state:checked ~ .read-more-trigger:before { content: 'Show less';}
.read-more-trigger { cursor: pointer; display: inline-block; padding: 0 .5em; color: #666; font-size: .9em; line-height: 2; border: 1px solid #ddd; border-radius: .25em;}
/* read-more-state */ 


hr.hr-1 , hr.hr-2 {
 border: 0 !important;
 height: 2px !important; margin: 30px 0 !important; 
 background-image: linear-gradient(to right, rgba(12, 66, 35, 0), rgba(0, 128, 67, 1), rgba(12, 66, 35, 0)) !important;
}
hr.hr-2 {
 height: 4px !important;
 background-image: linear-gradient(to right, rgba(12, 66, 35, 0), rgba(0, 128, 67, 1), rgba(12, 66, 35, 0)) !important;
}

/* 3/8 */ 
hr.hr-30 , hr.hr-20 , hr.hr-10,  hr.hr-30r , hr.hr-modal {
 border: 0 !important;
 height: 2px !important; margin: 30px 0 !important; 
 background-image: linear-gradient(to right, rgba(12, 66, 35, 0)  , rgba(15, 77, 47, 1) , rgba(12, 66, 35, 0)  ) !important;
}  

hr.hr-20 { margin: 20px 0 !important; }  
hr.hr-10 { margin: 10px 0 !important; }  
hr.hr-30r { margin: 0 0 30px 0 !important; }  
hr.hr-modal { margin: 15px 0 15px  0 !important; }  
hr.hr-0left  {
 border: 0 !important;
 height: 2px !important; margin:  0 !important; 
 background-image: linear-gradient(to right,  rgba(15, 77, 47, 1) , rgba(12, 66, 35, 0)  ) !important;
}  
hr.hr-0right {
 border: 0 !important;
 height: 2px !important; margin:  0 !important; 
 background-image: linear-gradient(to right,   rgba(12, 66, 35, 0) , rgba(15, 77, 47, 1) ) !important;
}  

@media (max-width: 992px) {
hr.hr-20 { height: 2px !important;margin: 20px 0 !important;  }
}
.bi-dot { font-weight: bold !important ; font-size: 1.3rem !important ;}


.icon-bacheca { font-size: 1.3rem !important ; text-shadow: 1px 1px 3px #949494 !important ; }


.mytabs {box-shadow: 0px 2px 10px gray !important ; border: 1px solid #D5D7D5 ; margin: 10px !important ; border-radius: 10px !important ; background: white !important ;}
.smallSmartphone{font-size: 1.5rem !important}

.nav-link h4 {margin: 0px !important ;}
 .nav-link h4 {color: green !important ;}
 .nav-link.active h4 {color: #fff !important ;}
 .myCaret {font-size: .7rem !important ;}
 .carret-color {color: DarkSeaGreen !important ;}
 


.gradient { -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,2)), to(rgba(0,0,0,0))) !important ;}
div.postitsmartphone { margin: 10px 0 12px 0 !important; }
.firebrick {color: firebrick !important ; }



.gray {color: red !important ; }

.dimgray {color: dimgray !important ; }
.LightSalmon {color: LightSalmon !important ; }

.stylemodal { margin:20px 0 35px 0 !important }
.rem22 {font-size: 2.2rem !important ;}
#fancy_bg
{
 background-color:red !important;
}
.pixar-image-right , .pixar-image-left , .pixar-image { 
width: 300px;
margin : 15px !important ; float: right ; 
box-shadow: 2px 2px 12px 0px rgba(20,20,20,1);
-webkit-box-shadow: 2px 2px 12px 0px rgba(20,20,20,1);
-moz-box-shadow: 2px 2px 12px 0px rgba(20,20,20,1); 
}
.pixar-image-left { 
margin-right : 35px !important ; float:left ; 
}
.pixar-image { 
margin : 20px auto !important ; 
width: 350px;

box-shadow: 2px 2px 12px 0px rgba(20,20,20,1);
-webkit-box-shadow: 2px 2px 12px 0px rgba(20,20,20,1);
-moz-box-shadow: 2px 2px 12px 0px rgba(20,20,20,1); 
} 
.postit_index400 { width:400px !important ; padding: 10px 0 0 0 !important ; margin:15px !important ;}	

.header-social-links { margin-right : 45px !important ; font-weight: bold; font-size: 1.2rem }

.color-footer { color: #F7FBAF !important; }

.marginlogo	 {margin-left: 200px ! important ; }
.CDQlogo { width: 53px ! important ; height: 60px ! important ; padding-bottom : 10px ! important }
.bi-pen-fill , .bi-calendar-check-fill { REMcolor: red !important ; padding-right: 2px !important }
.text-center {color: var(--color-primary) !important; text-align: center!important }

.size_social	{ color: #F7FBAF !important ; background: #175701 !important ; font-weight: normal; font-size:22px ; -webkit-transition: all .3s ease-in-out;
 -o-transition: all .3s ease-in-out;
 transition: all .3s ease-in-out;}
.size_social:hover	{ color: white ; -webkit-transform: translateY(-3px);
 transform: translateY(-3px); 
	 transform: scale(1.3, 1.3); }
a.mystyle , a.mystyle2 , a.mystyle3 { font-size: 1.4rem ! important ; color: var(--color-primary) /* precedente #008043*/ ! important ; text-shadow: 2px 2px 4px Gray ! important ; }
dropdown a.mystyle2:hover { color:pink ! important ; }
 h2.titolo , h2.titoloP , h2.titolocrumbs , h2.titoloIndex 
 { text-align:center ; text-shadow: 3px 3px 5px #aeb0ae ;
 font-size: 32px !important ;
 font-weight: bold !important ;
 margin-bottom: 20px !important ; 
 margin-top: 88px !important ;
 color: var(--color-primary); 
 /*border-bottom: 1px solid var(--color-primary) ; */

 border-bottom: 2px solid transparent;
    border-image: linear-gradient(0.25turn, rgba(12,115,66 ), rgba(255,255,255),  rgba(12,115,66 ) );
    border-image-slice: 1;
    width:100%;

}
 h2.titoloIndex { margin-top: 5px !important ; }





.hide_desktop	 { display:none; height: 0 !important; } 
.color_icon_navbar_smartphone {color:LightGreen !important ;}
.color_icon_navbar_facebook {margin-left:10px !important ; color:LightSteelBlue !important ; }
.color_icon_navbar_whatsapp { rem font-size : 150px !important ; margin-left:10px !important ; color:#47C758 !important ; }
.card { margin-bottom: 16px !important ; }
.nav-social {display:none}

.section { padding-top: 70px; }
.bi-envelope-paper::before {display: inline !important ;}
.bolder {font-weight: bolder !important; }
.see_smartphone {display: none !important; }
.see_desktop {display: inline-block !important; }
.cursor{cursor: pointer;}

.example-image { 
cursor: zoom-in;
width: 250px !important ; 
margin : 15px !important ; 
box-shadow: 2px 2px 12px 0px rgba(20,20,20,1);
-webkit-box-shadow: 2px 2px 12px 0px rgba(20,20,20,1);
-moz-box-shadow: 2px 2px 12px 0px rgba(20,20,20,1); 
}
.example-image {	 border : 1px solid LightGray ;  border-radius: 0 20px;  transition-property: all;	transition-duration: .5s;	transition-timing-function: ease-in-out; }

.example-image:hover {		 border : 1px solid Gainsboro ;  transform: rotate(1deg); border-radius: 20px 0 ;  transform: scale(1.02, 1.02);  }
.radius20border2 { border-radius: 0 20px  !important ; border : 2px solid LightGray ; box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px  !important ; }  

.rem09 {font-size: 0.9rem  !important }
.conferenza {color: SeaGreen !important ; }

.label_italic {padding: 0 20% !important }
.f-button{  border-radius: 50% !important ;    height: 35px !important; width:35px  !important  ; color : #fff !important ; background-image: linear-gradient( #6dab8d , #0b673b ) !important ;}

.gradientVerde { background: hsla(120, 38%, 78%, 1);
background: linear-gradient(45deg, hsla(120, 38%, 78%, 1) 0%, hsla(120, 70%, 90%, 1) 100%);
background: -moz-linear-gradient(45deg, hsla(120, 38%, 78%, 1) 0%, hsla(120, 70%, 90%, 1) 100%);
background: -webkit-linear-gradient(45deg, hsla(120, 38%, 78%, 1) 0%, hsla(120, 70%, 90%, 1) 100%);
}
.gradientCeleste { }
.gradientGiallo { }
.gradientGiallino { }
 /*16-8*/
 .footer { background: linear-gradient(180deg,rgba(255, 255, 255, 0) 0%, rgba(23, 87, 1, 1) 10%, rgba(23, 87, 1, 1) 100%) !important; }


.show_smartphone	 { display:none !important ; height: auto !important; } 
.hide_smartphone	 { display: block !important ; }
.show_pc { display: block !important ; } 
.hide_pc { display: none !important ; } 
.smartphone_pc  { display: none !important ; }
.per_smartphone	 { display: none !important ; }
.per_pc	 { display: block !important ; }
.border_left_verde { border-left: 6px solid #96c5ab !important ;  transition: all 1.5s ease-out; }
.border_left_verde:hover {
	border-left: 6px solid var(--color-primary) !important ;
border-radius: 20px 0 ; border: 1px solid var(--color-primary) ;
 transform: translateY(2px); 
box-shadow: 3px 3px 10px 3px rgba(0,0,0,1);
}


.suPhone , .suPC	{ display:none !important ; } 
.suPhone	{ display:none !important ; } 
.suPC	 	{ display:block !important ; } 	 

.service-item2:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 7px;
    background: green  ;
}

.service-item2 {
    padding: 15px 10px 0 10px ;
    position: relative; 
    overflow: hidden;  
}
.service-item2:hover {
border-radius: 20px 0 ; border: 1px solid var(--color-primary) ;
transform: translateY(2px);
box-shadow: 3px 3px 10px 3px rgba(0,0,0,0.3);
}










 /* 
------------------------------------------------
qwe smartphone 
 ------------------------------------------------
 */ 
 @media (max-width: 1449px) {
a.mystyle , a.mystyle2 , a.mystyle3 { color: white ! important ; }
.nav-social {display:block}
 }

 @media (max-width: 992px) {



hr.hr-30  { margin: 20px 0 !important; }  	 
.show_smartphone	 { display: block !important ; height: auto !important; }
.hide_smartphone	 { display: none !important ; } 
.show_pc { display: none !important ; } 
.hide_pc { display: block !important ; } 	

.smartphone_pc  { display: none !important ; }
.per_smartphone	 { display: none !important ; }
.per_pc	 { display: block !important ; }

 
.label_italic {padding: 0 0 !important }
 /*16-8
  .footer { margin : 0 0 !important ; REMbackground-color: var(--color-primary-dark) !important; }
 */
.footer { padding: 0 0 !important ;  margin-top: 20px !important;  background: linear-gradient(180deg,rgba(255, 255, 255, 0) 0%, rgba(23, 87, 1, 1) 5%, rgba(23, 87, 1, 1) 100%) !important; }
   


.example-image { width: 135px !important ; }
.info { width:85% !important ; margin : 0 auto }
h2.titoloIndex { text-align:center ; margin-top: 30px !important ; font-size: 1.5rem !important}
.section { padding-top: 0px !important ; } 
h2.titolo { text-align:center ; margin-top: 94px !important ; font-size: 1.5rem !important}
	 
h2.top20 { margin-top: 20px !important ; }	
 
a.mystyle3 { font-size: 1rem ! important ; }	 
	 
.card {width:90% !important ; margin: auto; margin-bottom: 16px !important ; }	 
.cdq-h2{ font-size: 1.2rem !important }	 


.hide_desktop	 { display:block; height: 0 !important; } 
.ShowDesktop	 { display:none; height: 0 !important; } 


 	 
a.mystyle , a.mystyle2{ color:white ! important ; }	 
.dropdown.mystyle2 ul { display: none ! important ; }	 

.CDQlogo { width: 40px ! important ; height: 50px ! important ; padding-bottom : 10px ! important }	 
.marginlogo	 {margin-left: 0px ! important ; }

.postit_index400 { width:70% !important ; padding: 10px 0 0 0 !important ; margin:15px !important ;}		 
	 

.fa-bell.faa-ring.animated {font-size:1.2rem !important ;} 
.pixar-image-right , .pixar-image-left { width: 160px; }

.button_link {font-size:1.2rem !important ; }
.line-height-rid { line-height: .9 ! important ; }
div.postitsmartphone { font-size:1.1rem !important ; margin: 10px 0 0 0  !important; }
.services .details { margin: -100px 8px 0 8px !important ; } 	 
h2.titleNotizia { text-align: center !important ; }
.icon-bacheca { font-size: 1rem !important ;}
.smallSmartphone	 { font-size: 1.1rem !important } 	 

.newrem { padding: 10px !important; font-size: 1.1rem !important }	 
.features .nav-link { padding: 5px  10px !important ; margin: 0 !important; height: 70% !important; }	
 .features .nav-link h4 { font-size: 1rem !important}	

.navbar a, .navbar a:focus { padding: 2px 10px;}	 
.ItemColor {color: #C8CCD1 !important; }
.caption-text { top:180px !important; margin-right:100px !important ; }
.services .detailsVideo { padding: 2px 2px !important; margin: -40px 30px 0 15px !important; }	 
.stylemodal { width:95% !important ; padding:5px !important ; padding-bottom:35px !important }
.button_news { width:60% ; } 
.card-container2 .card {width:100% !important ; margin: auto; }
h4.color_primary { color: var(--color-primary) !important ; font-size: 1rem !important }
.ShowItem	 { display:block !important ; } 
.myborderTop {border-top: 1px solid gray !important } 
.footer .menu 	 { font-size:1.1rem ; }
.footer .menu a { line-height: 1.2; }
.section-header {
 text-align: center;
 padding-bottom: 0px !important; }
 .color-white-2 { color: #ffffff !important; }
details > summary { font-size: 1.2rem !important ; } 
/* qwe */ 


.postit_index , .postit_index1 , .postit_index3 { width:135px !important ; padding: 0 0 0 0 !important ; margin:10px !important ;}
.postit_index1 {paddingREM:25px 0 0 0 !important ; }
.postit_index3 {padding:0 0 20px 0 !important ; }
.postit_index h4 , .postit_index1 h4 , .postit_index3 h4 {font-size: 1rem !important ; color:green !important }	 
 
.postit { background-size: 70% ; §font-size: 1rem !important }
.text2 { padding:80px 10px 0 40px ! important ;; font-size: 1rem ! important ; }



.mappamobile { display: none } 
.icon-nav { display: none } 
img.image-center-left { width:40% } 

h2.titolocrumbs { text-align:center ; margin-top: -50px; font-size: 28px !important ;} 
.breadcrumbs .d-flex { display: block !important; margin-top : -40px ; }
.breadcrumbs h2 { margin-bottom: 30px; font-size: 24px; }
.breadcrumbs ol { display: block; }
.breadcrumbs ol li { display: inline-block; padding-bottom: 60px; }
.example-image-iniziative { width: 200px !important ; }
.paddingPoesia { font-size: 16px !important ; padding : 20px 0 10px 20px !important ;}
.nav-link h4 {margin: 6px 0px !important ;}



.sidebar { width:100% !important; margin: 0 auto !important;}
.sidebarOss { width: 94% !important; margin: 0 auto !important;}

.sidebar:before {content :""}
.cursor{cursor: pointer;}
.about .nav-pills li+li {
 margin-left: 10px;
}
.see_smartphone {display: block !important; }
.see_desktop { display: none !important; }

.suPhone , .suPC	{ display:none !important ; } 
.suPC	 { display:none !important ; } 	 
.suPhone	{ display:block !important ; } 

 }
 /* 
 ------------------------------------------------
 fine smartphone 
 ------------------------------------------------
 */ 


