@font-face {
    font-family: 'trebuchet_ms';
    src: url('../fonts/trebuchet_ms-webfont.woff2') format('woff2'),
    url('../fonts/trebuchet_ms-webfont.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'trebuchet_ms';
    src: url('../fonts/trebuchet_ms_bold-webfont.woff2') format('woff2'),
    url('../fonts/trebuchet_ms_bold-webfont.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}

body {
    font-family: 'trebuchet_ms';
    font-weight: 400;
    font-size: 16px;
    line-height: 1.3;
}

.opacity-0 {
    transition-duration: 500ms;
}

a,
.RightCol strong{
    transition-duration: 300ms;
    color: #008359;
}

.RightCol strong{
    font-weight: 400;
}

a:hover {
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-thickness: 1.2px;
    text-underline-offset: 4px;
}

.categories-list > a:nth-child(1){
	order:1
}

.categories-list > a:nth-child(2){
	order:2
}

.categories-list > a:nth-child(4){
	order:3
}

.categories-list > a:nth-child(3){
	order:4
}

.categories-list > a:nth-child(5){
	order:5
}

.categories-list {
    font-size: 20px;
}

.categories-list .hover\:opacity-100:hover .title,
.categories-list .hover\:opacity-100.active .title {
    opacity: 1;
}

.categories-list .hover\:opacity-100:hover,
.categories-list .hover\:opacity-100.active {
    text-decoration: none !important;
}

.categories-list .hover\:opacity-100:hover .w-full.opacity-0,
.categories-list .hover\:opacity-100.active .w-full.opacity-0 {
    opacity: 1;
    z-index: 1;
}

.projects a {
    cursor: pointer;
}

.projects a img,
.projects a:after{
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.projects a:hover img {
/*     filter: brightness(1.2) blur(2px); */
}
.projects a{
	position:relative;
}
.projects a .opp{
	content: '';
	text-align:center;
    display: flex;
    background: #fff;
    padding: 30px;
    opacity: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
    left: 0;
    visibility: hidden;
    justify-content: center;
    align-items: center;
	    font-size: 20px !important;
    font-weight: 400;
}

.projects a:hover .opp{
	opacity: 0.8;
	    visibility: visible; 
}

nav a.font-semibold,
.mobile-menu-btn {
    font-size: 20px;
    padding: 6px 13px;
    border: solid 2px transparent;
    border-radius: 7px;
    color: #000;
}

nav a.font-semibold:hover,
nav a.font-semibold.active,
.mobile-menu-btn {
    border: solid 2px #000;
    text-decoration: none;
}

.categories-list a img{
    border-radius: 20px;
}

img.vert-move {
    -webkit-animation: mover 1s infinite alternate;
    animation: mover 1s infinite alternate;
}

img.vert-move {
    -webkit-animation: mover 1s infinite alternate;
    animation: mover 1s infinite alternate;
}

@-webkit-keyframes mover {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-10px);
    }
}

@keyframes mover {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-10px);
    }
}


#scroll-to-top {
    display: flex;
    background-color: #008359;
    width: 70px;
    height: 70px;
    text-align: center;
    border-radius: 100%;
    position: fixed;
    bottom: 30px;
    right: 60px;
    transition: background-color .3s,
    opacity .5s, visibility .5s;
    opacity: 0;
    visibility: hidden;
    z-index: 1000;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

#scroll-to-top::after {
    content: "";
    background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBVcGxvYWRlZCB0bzogU1ZHIFJlcG8sIHd3dy5zdmdyZXBvLmNvbSwgR2VuZXJhdG9yOiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4NCjxzdmcgZmlsbD0iI2ZmZiIgaGVpZ2h0PSI4MDBweCIgd2lkdGg9IjgwMHB4IiB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIg0KCSB2aWV3Qm94PSIwIDAgMzMwIDMzMCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8cGF0aCBpZD0iWE1MSURfMjI0XyIgZD0iTTMyNS42MDYsMjI5LjM5M2wtMTUwLjAwNC0xNTBDMTcyLjc5LDc2LjU4LDE2OC45NzQsNzUsMTY0Ljk5Niw3NWMtMy45NzksMC03Ljc5NCwxLjU4MS0xMC42MDcsNC4zOTQNCglsLTE0OS45OTYsMTUwYy01Ljg1OCw1Ljg1OC01Ljg1OCwxNS4zNTUsMCwyMS4yMTNjNS44NTcsNS44NTcsMTUuMzU1LDUuODU4LDIxLjIxMywwbDEzOS4zOS0xMzkuMzkzbDEzOS4zOTcsMTM5LjM5Mw0KCUMzMDcuMzIyLDI1My41MzYsMzExLjE2MSwyNTUsMzE1LDI1NWMzLjgzOSwwLDcuNjc4LTEuNDY0LDEwLjYwNy00LjM5NEMzMzEuNDY0LDI0NC43NDgsMzMxLjQ2NCwyMzUuMjUxLDMyNS42MDYsMjI5LjM5M3oiLz4NCjwvc3ZnPg==") no-repeat;
    background-size: 100%;
    width: 32px;
    height: 32px;
    display: flex;
}

#scroll-to-top:hover {
    cursor: pointer;
    background-color: #333;
}

#scroll-to-top:active {
    background-color: #555;
}

#scroll-to-top.show {
    opacity: 1;
    visibility: visible;
}

.item a {
    font-weight: 700;
}

.item .date {
    font-weight: 700;
    margin: 10px 0 15px;
}

.tags a.font-semibold {
    border-color: #e27c4c;
    color: #e27c4c;
}

.tags a.font-semibold:hover {
    color: #000 !important;
    border-color: #000 !important;
}

h1 {
    font-size: 36px;
}

.map {
    color: #000;
}

.map svg {
    max-width: 48px;
    margin-top: 20px;
}
main.xl\:m-\[60px\]{
    margin-top: 0;
}
.projects-list .aspect-\[4\/3\] {
    aspect-ratio: 3 / 2;
}
.menu{
    display: flex;
    gap: 10px;
}
.projects .item {
    width: 100%;
}

.desc br{
    display: none;
}
	.xl\:mt-\[60px\] p{
    font-size: 16px;
    line-height: 1.4;
    font-weight: 400;
}
	.xl\:mt-\[60px\] .date.text-base{
	    font-size: 20px;
    font-weight: 900;
}

	.md\:w-\[50\%\].desc{
    font-size: 16px;
    line-height: 1.3;
}
.pd0{
	padding:0 !important
}
@media (min-width: 1280px){
    .categories-list{
        margin-top: -30px;
    }
}

@media (min-width: 1024px){
.lg\:mr-\[24\%\] {
    margin-right: 8% !important;
    font-size: 16px;
}
	    .lg\:pr-\[12\.5\%\] {
        padding-right: 15%;
    }

	#scroll-to-top{
		    right: 7.5%;
    margin-right: -5px;
	}
	

    .lg\:-mb-\[10\%\] {
        margin-bottom: -6% !important;
    }
}
@media (min-width: 768px){
    .text br{
        display: none;
    }
    .md\:-rotate-\[14deg\] {
        --tw-rotate: -14.7deg !important;
    }
}

@media only screen and (max-width: 1199px) {
    nav a.font-semibold,
    .leftCol {
        font-size: 18px;
    }

}

@media only screen and (max-width: 1023px) {

}

.nDes {
    display: flex;
    justify-items: start;
    gap: 20px;
    flex-wrap: nowrap;
}

.nDes div:first-child{
    min-width: 80px;
	    max-width: 80px;
}
a::after {
  display: none;
  content: "";
}
a:hover::after {
  display: inline;
}
.categories-list .title{
	font-size:20px !important;
	font-weight:700
}
.aspect-\[4\/2\.5\],
.aspect-\[4\/3\] {
	    aspect-ratio: 3 / 2 !important;
}

@media only screen and (max-width: 768px) {
    nav a.font-semibold, .mobile-menu-btn {
        font-size: 18px;
        padding: 4px 11px;
    }
	    .shortDesc.pd0 .sm\:col-span-2 {
        margin-right: 0;
    }
	.shortDesc br{
		display:none
	}

	.categories-list a img {
    border-radius: 10px;
}
	
	#categories .item:not(.items-center) img{
		border-radius:0px !important
	}
    .contact {
        font-size: 14px;
        text-align: right;
        position: absolute;
        bottom: -100px;
        right: 0;
    }

    .text span {
        display: block;
    }

    .text {
        margin: 10px 0px -20px;
    }

    .RightCol .image {
        display: flex;
        justify-content: center;
    }

    .leftCol strong {
        display: block;
    }

    h1 {
        font-size: 24px;
    }

    nav a.font-semibold {
        font-size: 15px;
    }

    .map {
        position: absolute;
        right: 0;
        top: 0;
        display: flex;
        align-items: center;
        font-size: 14px;
    }

    .map svg {
        margin-top: 0;
        max-width: 35px;
    }

    .shortDesc {
        font-size: 14px;
        padding-right: 60px;
    }

    .item {
        font-size: 14px;
    }

    .item .date {
        margin: 8px 0 10px;
        font-size: 14px;
    }

    .shortDesc .sm\:col-span-2 {
        margin-right: -60px;
    }

    #scroll-to-top::after {
        content: "";
        width: 15px;
        height: 15px;
    }

    #scroll-to-top {
        right: 20px;
        width: 40px;
        height: 40px;
    }

    .mobMenu{
        display: flex;
        z-index: 99998;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 100%;
        transition: all .3s ease-in-out 0s;
        align-items: center;
        overflow-y: auto;
        padding: 0 25px 25px;
        background: #fffffff2;
        transform: translateY(-100%);
        opacity: 0;

    }

    .mobile-menu-btn{
        z-index: 99999;
    }

    .mobMenu.activeMenu{
        transform: translateY(0);
        opacity: 1;
    }

    .mobMenu .menu-main-menu-container{
        width: 100%;
        text-align: center;
        margin-top: auto;
        margin-bottom: auto;
        padding: 25px 0;
    }

    .mobMenu a.font-semibold {
        font-size: 18px;
        font-weight: 700;
    }

    .mobMenu .menu {
        display: flex;
        gap: 20px;
        flex-direction: column;
    }
    .closeBtn.mobile-menu-btn span{
        font-size: 0;
    }
    .closeBtn.mobile-menu-btn span:after{
        content: 'Chiudi';
        font-size: 18px;
    }
}
.sm\:rounded-\[50px\] {
    border-radius: 30px !important;
}
@media only screen and (max-width: 580px) {
    .text {
        font-size: 14px;
    }


    .categories-list .title:not(.mobTitle){
        display: none !important;
    }

    .categories-list .title {
        font-size: 14px;
        margin-bottom: 0;
        margin-top: 10px;
    }
    .mobTitle{
        font-size: 18px;
        margin-top: 10px;
    }
.mobTitle.active{
    display: block;
    opacity: 1;

}
.categories-list .title{
    min-width: 300px;
    text-align: left;
}

    .categories-list a{
    justify-content: flex-end;
}

    main {
        margin-bottom: 100px !important;
    }

    .categories-list a {
        display: flex;
        flex-direction: column-reverse;
    }

    .categories-list .bottom-0 {
        top: 0
    }

    .text {
        margin: 10px 0px 0px;
    }

    .contact {
        bottom: -70px;
        font-size: 14px;
    }
}
