@charset "utf-8";


/* CSS Document */
/* https://www.w3schools.com/howto/howto_make_a_website.asp */

#wrapper {
	max-width: 63.250em; /* 900px = 56.25em ---  1002px = 62.625em  ---- 1010px  = 63.125em  1012px = 63.250em http://pxtoem.com/*/
	margin-left: auto;
	margin-right: auto;
	padding:11px;
	/*https://toolset.mrwebmaster.it/css/css3-box-shadow.html*/
	/*-webkit-box-shadow: 8px 12px 26px -3px #000000;
	-moz-box-shadow: 8px 12px 26px -3px #000000;
 	-o-box-shadow: 8px 12px 26px -3px #000000;
	box-shadow: 8px 12px 26px -3px #000000;*/
	background:#FFF;
		-moz-box-shadow:0 2px 28px 0 rgba(0,0,0,.6);
		-webkit-box-shadow:0 2px 28px 0 rgba(0,0,0,.6);
		box-shadow:0 2px 28px 0 rgba(0,0,0,.6);
	}


* {box-sizing: border-box;}


/* Style the body */
body {
    font-family: Arial, Helvetica, sans-serif;
    margin: 0;
	background-color:#eee;
}


/* Header/logo Title */
.header {
    /*padding: 80px;*/
  /*  text-align: center;*/
	/*padding-right:4px;*/
	 /*  background: #1abc9c;*/
  /*  color: white;*/
  /*padding:0px;*/
 }


/* Sticky navbar - toggles between relative and fixed, depending on the scroll position. It is positioned relative until a given offset position is met in the viewport - then it "sticks" in place (like position:fixed). The sticky value is not supported in IE or Edge 15 and earlier versions. However, for these versions the navbar will inherit default position */
.navbar {
    overflow: hidden;
    background-color: white;
    top: 0;
	margin-bottom:7px;
	margin-top:5px;
	text-align:right;
	border: dotted 1px #DDDDDD;
	border-top:0px; 
	border-left: 0px; 
	border-right:0px;
	padding-bottom:4px;
	}


.navbar a {
    padding-right:5px; 
	padding-left:5px;
	text-decoration: none;
	float: none;
    width: 100%;
	
}  


/* Column container */
.row {  
    display: -ms-flexbox; /* IE10 */
    display: flex;
	-ms-flex-wrap: wrap; /* IE10 */
    flex-wrap: wrap;
}

/* Create two unequal columns that sits next to each other */
/* Sidebar/left column */
.side {
    -ms-flex: 20%; /* IE10 */
	flex: 20%;
    background-color: white/*#f1f1f1*/; 
	padding-right: 5px; 
	padding-bottom: 7px;
	
}


.main {   
    -ms-flex: 80%; /* IE10 */
	flex: 80%;
    background-color:  white;
   /* padding: 10px;*/
   padding-left:6px;
}


.footer { padding-top:0px; 
		padding-bottom:0px;
		padding-left:10px; 
		padding-right:20px;
       	background: white/*#ddd*/;
}







/* --------------------- MEDIA -------------------- */




@media screen and (max-width: 601px) {
   .side {text-align:left;}
   .navbar {text-align:center;}
   /*.pSideEvidence {text-align:center;}*/
   .side {padding-left: 30px;}
   /*https://www.codingcreativo.it/order/*/
   .main {order:1;}
   .side{order:2;} 
   /*https://rocketweb.it/cinque-modi-per-nascondere-elementi-con-il-css/*/
   .pEpilogue {display: none; }
   .linkSplit{display: none; }
   .divLine {display: none; }
}







/*------------------- Hx ------------------*/
h1, h2, h3, h4  {font-family: Verdana, Arial, Helvetica, sans-serif;font-weight: bold;}

h1{ 
	font-size: 21px;
	color: #0F8690;
	letter-spacing: 1.8pt; 
	line-height:140%;
	margin: 0px;
	text-align: center; 
	/*padding-top:0px; */
	padding-bottom:6px;
	padding-top: 6px;
	
}

h2{  
	font-size: 12pt; /*10.9 oggi*/
	color: #27764A /*#e45369*/;
	letter-spacing: 1.6pt; 
	line-height: 140%;
	margin-top: 40px; 
	margin-bottom: 0px;
}

h3{  
	font-size: 10.5pt; /*9.5* oggi*/
	color:#0B34A4/*dodgerblue/*#555555*/;
	letter-spacing: 1.6pt; 
	line-height: 150%;
	padding-top: 10px; 
	padding-bottom: 0px;
	margin-top: 30px; 
	margin-bottom:0px;
	text-align:left;
	margin-left: auto;
	margin-right: auto;
}




h4{
	margin: 1px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9.6pt;  
	color:black/*#555555*/;
	LETTER-SPACING: 1.5pt; 
	LINE-HEIGHT: 175%;
	Text-align: left;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px; 
	FONT-WEIGHT: bold;
}
/*----------------------- image -------------------------------*/

.img-fluid
{
	width:100%;
	max-width:100%;
	height:auto;
	border: 1px solid #000;
}


.img-fluid-max-800px
{
	width:100%;
	max-width:800px;
	height:auto;
	border: 1px solid #000;
}


.img-fluid-max-700px
{
	width:100%;
	max-width:700px;
	height:auto;
	border: 1px solid #000;
}


.img-fluid-max-600px
{
	width:100%;
	max-width:600px;
	height:auto;
	border: 1px solid #000;
}


.img-fluid-max-550px
{
	width:100%;
	max-width:550px;
	height:auto;
	border: 1px solid #000;
}

.img-fluid-max-500px
{
	width:100%;
	max-width:500px;
	height:auto;
	border: 1px solid #000;
	margin-top: 8px; 
	margin-bottom: 8px;
}

.img-fluid-max-400px
{
	width:100%;
	max-width:400px;
	height:auto;
	border: 1px solid #000;
}

.img-fluid-max-375px
{
	width:100%;
	max-width:375px;
	height:auto;
	border: 1px solid #000;
}


.img-fluid-max-300px
{
	width:100%;
	max-width:300px;
	height:auto;
	border: 1px solid #000;
}

.img-fluid-max-200px
{
	width:100%;
	max-width:200px;
	height:auto;
	border: 1px solid #000;
}

.img-fluid-no-border
{
	width:100%;
	max-width:100%;
	height:auto;
}

.img-fluid-max-600px-no-border
{
	width:100%;
	max-width:600px;
	height:auto;
}

.img-fluid-max-500px-no-border
{
	width:100%;
	max-width:500px;
	height:auto;
}

.img-fluid-max-400px-no-border
{
	width:100%;
	max-width:400px;
	height:auto;
}

.img-fluid-max-300px-no-border
{
	width:100%;
	max-width:300px;
	height:auto;
}

.img-fluid-max-260px-no-border
{
	width:100%;
	max-width:260px;
	height:auto;
	margin-bottom: 8px; 
	margin-top: 8px;
}

.img-fluid-max-200px-no-border
{
	width:100%;
	max-width:200px;
	height:auto;
}



/* --------------------------- Video ---------- */

.video {
  max-width: 100%;
  height: auto;
}

/*https://www.w3schools.com/howto/howto_css_responsive_iframes.asp*/
.container02 {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

/* Then style the iframe to fit in the container div with full height and width */
.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

 
/*-----------------------DIV-------------------------------*/

div.divLine{
margin-left: 0;
margin-right: auto;
margin-top: 0px;
margin-bottom: 0px;
width: 92%;
height: 1px;
background-color: #CCCCCC;
}


div.divLineEnd{
margin-left: auto;
margin-right: auto;
margin-top: 0px;
margin-bottom: 0px;
padding:0px; 
/*max-width: 56.25em; /* 900px = 56.25em*/
width: 98%;
height: 1px;
background-color: #CCCCCC;
}

div.divHeightVeryThin {height: 4px;}

div.divHeightThin {height: 8px;}

div.divHeightThick {height: 16px;}
 
 
 div.divCenter{
	 text-align:center;
 }
 



/*------------- divLinkPDF divLinkDOC divLinkPIC -------------*/

.divLinkPDF, .divLinkPDFsmallFont, .divLinkDOC, .divLinkPIC, .divLinkVID, .divLinkDWG, .divLinkInfo  {
font-family: Tahoma, Helvetica, Arial, Verdana, sans-serif;
font-size: 9.8pt;   /*9.3pt; */
letter-spacing:0.5pt; /*:0.3pt;*/
text-align:left;
line-height: 140%;
color: #0080BF; /*#0080BF; */
background-repeat:no-repeat;
padding-top: 0px;
padding-bottom: 0px;
margin-top: 10px;
margin-left: auto;
margin-right: auto;
margin-bottom:22px;
width: auto;
}




div.divLinkInfo{ background-image:url(../images/icone/incona-informazioni-sfondo-trasparente.png);}

div.divLinkPDF{ background-image:url(../images/icone/4.jpg);}

div.divLinkDWG{ background-image:url(../images/icone/icona_file_dwg.gif);}



/*div.divLinkPDFsmallFont{ background-image:url(../images/icone/4.jpg); 
font-size: 7.2pt; 
letter-spacing:1.1pt;}*/

div.divLinkDOC{ background-image:url(../images/icone/doc1.jpg);}

div.divLinkPIC{background-image:url(../images/icone/pic5.jpg); 
}

div.divLinkVID{background-image:url(../images/icone/icmpg.png); 
}

div.divImmagineArticolo{float:left;}
		
div.divTestoArticolo{
float:left;
width:80%;
padding-left:10px;
}

/* .... */
div.divContainer {
    width: 90%;
    text-align: center;
	/*border: 1px solid #000;*/
}

div.divSplit2 div {
    float: left;
    width: 50%;
}

div.divClear {
    clear: left;
}




/* ---------------------LINK------------------------- */

a.linkList
{
color:blue;
/*LIST-STYLE-TYPE: none;*/
margin-left: auto;
margin-right: auto; 
LETTER-SPACING: 0.3pt; 
}


a.linkList:hover 
{
TEXT-DECORATION: none; 
COLOR: #000;/*#00ccff; */
background-color: #ddd; /*#F3F3F3; #00ccff; */
  }


a.linkTopBar
{
FONT-WEIGHT: normal;
FONT-SIZE: 9.2pt;
BACKGROUND-IMAGE: none;
COLOR: #005F9C;
FONT-FAMILY:    Tahoma, Helvetica, Arial, Verdana, sans-serif;  /* Verdana, Arial, Helvetica, sans-serif;*/
LIST-STYLE-TYPE: none;
margin-left: auto;
margin-right: auto; 
LETTER-SPACING: 0.6pt;
TEXT-DECORATION: underline;
 }

a.linkTopBar:hover 
{
/*TEXT-DECORATION: underline; */ 
COLOR: #006EB5;
}

a.linkSideBar
{
FONT-WEIGHT: normal;
FONT-SIZE: 9.5pt;
BACKGROUND-IMAGE: none;
COLOR: #02496C; 
FONT-FAMILY:    Tahoma, Helvetica, Arial, Verdana, sans-serif;  /* Verdana, Arial, Helvetica, sans-serif;*/
LIST-STYLE-TYPE: none;
margin-left: auto;
margin-right: auto; 
LETTER-SPACING: 0.5pt;
LINE-HEIGHT: 0px; 
/*font-style:italic;*/
}

a.linkSideBar:hover 
{
TEXT-DECORATION: none; 
/*COLOR: #00ccff; */
/*background-color: #F3F3F3;*/
 background-color: #F9F8F8;
    color: #000;
}


.linkNoTopBar
{
	
	FONT-SIZE: 9.2pt;
	BACKGROUND-IMAGE: none;
	COLOR: #666666;
	FONT-FAMILY: Tahoma, Helvetica, Arial, Verdana, sans-serif;  
	LIST-STYLE-TYPE: none;
	TEXT-DECORATION: none; 
	margin-left: auto;
	margin-right: auto; 
	width: 644px; 
	LETTER-SPACING: 0.6pt;
	 }



.linkNoSideBar
{
	FONT-WEIGHT: bold;
	FONT-SIZE: 9pt;
	BACKGROUND-IMAGE: none;
	COLOR: #777777;
	FONT-FAMILY:  Tahoma, Helvetica, Arial, Verdana, sans-serif;  /* Verdana, Arial, Helvetica, sans-serif;*/
	LIST-STYLE-TYPE: none;
	margin-left: auto;
	margin-right: auto; 
	LETTER-SPACING: 0.7pt;
	LINE-HEIGHT: 300%;
}

.linkSplit
{  
	font-size: 7pt;
	color: #555555;/*#999999;*/
}

a.link_w3
{  
font-size: 9pt;
color: #454242;
LIST-STYLE-TYPE: none;
TEXT-DECORATION: none;
}



a.linkContactUs{ 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9pt; 
LETTER-SPACING: 1.0pt;
color:blue  /*#00C*/;
text-decoration:none;
} 

a.linkContactUs:hover 
{
  color:mediumblue;
  text-decoration:underline;
}


a.linkWhatsAppUs{ 
 	text-decoration:none;
	font-style: italic;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	width: 100%; 
    margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	font-size: 10pt;
	LETTER-SPACING: 1pt;  
	LINE-HEIGHT: 150%;
	color:#0C6;
} 

a.linkWhatsAppUs:hover 
{
  
  text-decoration:underline; 
  font-size: 10pt; 
 /* color:#F00;*/
   }


a.linkCallUs{ 
 	text-decoration:none; 
	font-style: italic;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	width: 100%; 
    margin-left: auto;
	margin-right: auto;
	font-size: 10pt;
	LETTER-SPACING: 0.8pt;  
	LINE-HEIGHT: 250%;
	color:#275DEF;
	margin-bottom: 0px;
	
} 

a.linkCallUs:hover 
{
  
  text-decoration:underline; 
  font-size: 10pt; 

   }

a.link_privacy
{  
font-size: 10.0pt;
LETTER-SPACING: 1pt;
color:darkgreen;
}






a.linkH{ 
 text-decoration:none;
	 color: #555555;
	 
}

 a.linkH:hover 
{
 cursor: default;
	color: #555555;
  text-decoration:none;
}
 



 /*-----------------------P---------------------*/
p {  
	margin: 1px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9.2pt; /*27 09 219 8,2 */ 
	color: #010101;
	LETTER-SPACING: 1.5pt; 
	LINE-HEIGHT: 175%;
	Text-align: left;
	margin-left: auto;
	margin-right: auto;
	padding-top:3px;
	/*padding-right: 6px;*/
}

h1 + p 
{
	font-size:10pt; 
	Text-align:left;
} 


p.pEpilogue
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/*text-align:justify;*/
	width: 100%; 
	padding-top:4px; 
	padding-bottom:10px;
	/*padding-left:0px;
	padding-right: 16px;*/
	margin-left: auto;
	margin-right: auto;
	font-size: 9.9pt;
	LETTER-SPACING: 1.5pt;  
	LINE-HEIGHT: 170%;
	color:#3366CC;
	text-align:left;
}


p.pSideEvidence
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	width: 90%; 
	padding-top:10px; 
	padding-bottom:0px;
	margin-left: 0px;
	margin-right: auto;
	font-size: 10pt;
	LETTER-SPACING: 0.7pt;  
	LINE-HEIGHT: 150%;
	color:#B00F0F;
}


p.pEvidence
{
	font-size:9pt; 
	Text-align:left;
	color:darkgreen;
}


p.pRights{
font-size: 9pt; /* oggi7.1pt;*/
color: #5C5959;
font-weight: normal;
letter-spacing: 1.2pt; 
line-height: 150%;
margin-right: auto; 
padding-bottom:0px;
padding-top:5px;
text-align: center;
}

p.pNoEvidence2{
font-size:9.4pt;
color:darkslategray;
font-weight: normal;
font-style: italic;
letter-spacing: 0.8pt; 
line-height: 170%/*20px*/;
margin-right: auto; 
padding-bottom:0pt;
padding-top:0pt;
text-align: left;
}

 p.pAlignRight{text-align:right;}
 
 /*p.pAlignCenter{text-align:center;}*/
 
 
 p.pPrice{
 width: 90%;
 font-family: Tahoma, Helvetica, Arial, Verdana, sans-serif;
 font-size: 10pt;
 color:darkgreen /*#B11913*/;
 LETTER-SPACING: 1.6pt; 
 LINE-HEIGHT: 200%;
 padding-top: 0px;
 margin-left: auto;
 margin-right: auto; 
 text-align: center; 
 text-decoration:none;
 FONT-WEIGHT: bold;
}


 p.pEvidence-1
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	width: 100%; 
    margin-top: 0px; 
	margin-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
	font-size: 9.9pt;
	LETTER-SPACING: 1.5pt;  
	LINE-HEIGHT: 180%;
	color:#03F;
}

p.pEvidence-2
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	width: 100%; 
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	font-size: 9pt;
	LETTER-SPACING: 1pt;  
	LINE-HEIGHT: 90%;
	color:blue;
}



p.pEvidence-3
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	width: 100%; 
	margin-top: 4px;
	margin-left: auto;
	margin-right: auto;
	font-size: 9.9pt;
	LETTER-SPACING: 1pt;  
	LINE-HEIGHT: 150%;
	color:#F33;
}



 p.p01{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9.5pt;
LETTER-SPACING: 1.6pt; 
LINE-HEIGHT: 190%;
text-align:left; 
padding-left: 6px;
}
 
 
 
 
 p.pMessageOk{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11pt; /* oggi7.1pt;*/
color:MediumSeaGreen;
text-align:left;
}
 
p.pMessageNoOk{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11pt; 
color:red;
text-align:left;
}


p.pPrivacy{
font-size: 9.0pt;
LETTER-SPACING: 1pt;
color:blue;
 }


p.pList{
	margin-left: 20px;
	
}


/* -------------------- special ---------------*/
  
  
/* https://html-online.com/articles/blinking-text-css-animation/ */
.blinking{ 
    animation:blinkingText 1.2s 7;
}

@keyframes blinkingText{
    0%{     color:MediumSeaGreen;    }
    49%{    color:MediumSeaGreen; }
    60%{    color:transparent; }
    99%{    color:transparent;  }
    100%{   color:MediumSeaGreen;    }
}
 

.blinking2{
    animation:blinkingText2 1.2s 7;
}

@keyframes blinkingText2{
    0%{     color:red;    }
    49%{    color:red; }
    60%{    color:transparent; }
    99%{    color:transparent;  }
    100%{   color:red;    }
}


/* ---------------- span ----------- */
 
 span.span01{
		color:mediumSeaGreen;
		 }
 
 span.span02{
		color:gray;
	 font-style: italic;
 }
 
 span.span03{
		color:gray;
	 font-style: italic;
		font-size: 8.5pt;
	 
 }

 span.spanLabel{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9.5pt;
	text-align: left; 
	color:#29AFBB;
}


 
 
/*-------------------- LIST ------------------- */

ol{
	margin: 0px;
}
ul{
	margin: 0px; 
	padding-left:4px;}
li
{  
	margin: 1px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10pt; /*27 09 219 8,2 */
	color:#000;
	LETTER-SPACING: 0.8pt; 
	LINE-HEIGHT: 145%;
	Text-align:justify;
	margin-left: 2px;
	/*margin-right: 12px;*/
	margin-left: 32px;
	padding-top:6px;
	font-style: italic;
	/*text-align:left;*/
}


/*-------------------------- Table o Div like table --------------------------*/

     .tabDiv {
      display: grid;
      grid-template-columns: 300px  400px; /*1fr 1fr;  Crea due colonne di uguale larghezza */
      gap: 6px; /* Spazio tra le colonne */
      padding-bottom: 30px;
		  }

    .tabDivColonna1 {
    border: dotted 1px #FFFFFF;
		padding:0px;
	}

    .tabDivColonna2 {
     border: dotted 1px #41393A;
	 background-color: #F4F4E9; 
		padding:6px;
}

    .tabDivColonna2Bis {
     border: dotted 1px #41393A;
	 background-color: #F0F1F1;; 
		padding:6px;
}

    /* Media Query per adattare su dispositivi più piccoli */
   @media (max-width: 910px) {
      .tabDiv {
        grid-template-columns: 1fr; /* Imposta una singola colonna su schermi piccoli */
      }
    }



div.tabDiv2Blue, div.tabDiv2Red{
max-width: 500px;
margin-top: 5px;
text-align: left;
border-radius: 20px 20px;
padding: 10px;
}

div.tabDiv3Blue, div.tabDiv3Red{
max-width: 300px;
margin-top: 5px;
text-align: left;
border-radius: 20px 20px;
padding: 10px;
}

div.tabDiv2Blue, div.tabDiv3Blue {border: 1px solid blue;}
div.tabDiv2Red, div.tabDiv3Red {border: 1px solid red;}


td.td2, td.td3{
width:400px; 
border: dotted 1px #41393A;
padding:6px;
}

td.td1{width:300px; padding-right:4px; padding-bottom:0px;}


td.td2{background-color:#F4F4E9; }

td.td3{background-color:#F0F1F1; }



/*https://www.mattepuffo.com/blog/articolo/3205-creare-tabelle-responsive-html-no-more-tables.html*/

 table.no-more-tables{
		padding-top: 0;
 		margin-left: auto;
  		margin-right: auto;
  		margin-top: 0px; 
  		margin-bottom:0px;
   		color: #444444;
   		font-family: Verdana, Arial, Helvetica, sans-serif;
  		font-size: 8.5pt;
  		LETTER-SPACING: 0.8pt; 
  		LINE-HEIGHT: 130%;
}

table.no-more-tables th{
		border: 1px solid #999999;
        text-align: center;
		/*background-color: #999999;*/
}

table.no-more-tables td{
		border: 1px solid #999999;
        text-align: center;
}


table.no-more-tables {
		text-align: center;
}

            @media only screen and (max-width: 767px) {
                .no-more-tables table,
                .no-more-tables thead,
                .no-more-tables tbody,
                .no-more-tables th,
                .no-more-tables td,
                .no-more-tables tr {
                    display: block;
					      }

                .no-more-tables thead tr {
                    position: absolute;
                    top:-9999px;
                    left:-9999px;
				}

                .no-more-tables tr { border: 1px solid #ccc; }
                .no-more-tables td {
                    border: none;
                    border-bottom: 1px solid #eee;
                    position: relative;
                    padding-left: 50%;
                    white-space: normal;
                    text-align:left;
                }

                .no-more-tables td:before {
                    position: absolute;
                    top: 0;
                    left: 6px;
                    width: 45%;
                    padding-right: 10px;
                    white-space: nowrap;
                    text-align:left;
                    font-weight: bold;
                }

                .no-more-tables td:before { content: attr(data-title); }
		
		table.no-more-tables {width:100%;}
		}
/*table.no-more-tables*/





  
 
/* -------------------- Style inputs form* ------------------- */

input[type=text], select, textarea {
  width: 100%;
 /* max-width: 900px;*/
  padding: 12px;
  border: 1px solid #ccc;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
}

input[type=submit] {
  background-color: #4CAF50;
  color: white;
  padding: 12px 20px;
  border: none;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: #45a049;
}

/* Style the container/contact section */
.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 10px;
}


/* --- https://www.puntoinformaticofree.it/guida_css/cssmenu6/markdown-54/css7.html  22 09 2025 */ 

.column {
 float: left;
 width: 50%;
}

/* Clear floats */
.row:after {
 content: "";
 display: table;
 clear: both;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 900px) { 
 .column {
 width: 50%;
 }
}


/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
 .column {
 width: 100%;
 }
}





  
