@charset "UTF-8";

#footer {border: 1px solid #f1f1f1; margin: 30px 0px 0px ; padding: 0px; width: 100%; background: #f1f1f1}

.wrapperfooter {
  display: grid;
  grid-gap: 20px;
  grid-template-columns: 25% 25% 25% 25%;
  padding: 0px;
  margin: 10px 240px 20px;
  width: calc(100% - 460px);
}

.boxfooter {
  padding: 0px;
  margin: 0px;
  text-align: left;
  border: 0px solid #ee0000;
}

.f1 {  grid-row: 1;  grid-column: 1;}
.f2 {  grid-row: 1;  grid-column: 2;}
.f3 {  grid-row: 1;  grid-column: 3;}
.f4 {  grid-row: 1;  grid-column: 4;}
.f5 {  grid-row: 2;  grid-column: 1 / span 4; border-top: 1px solid var(--dltext)}


.boxfooter h4 {font-size: 0.8em;  font-weight: 600; color: var(--main); line-height: 0em}
.boxfooter a {font-size: 0.8em;  font-weight: 400; color: #555; line-height: 1.5em}
.boxfooter a:hover {color: #000; }



/********************************* header responsive desktop  *****************************/

@media (min-width: 1451px) {

    
}


/********************************************tablet settings**********************************************************/
@media screen and (max-width: 1450px) {

 .wrapperfooter {
  display: grid;
  grid-gap: 20px;
  grid-template-columns: 25% 25% 25% 25%;
  padding: 0px;
  margin: 20px 20px;
  width: calc(100% - 80px);
}   
    

}

/********************************************general mobile settings**********************************************************/
@media all and (max-width: 64em), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
 
#footer {border: 1px solid #f1f1f1; margin: 30px 0px 0px ; padding: 0px; width: 100%; background: #f1f1f1}

.wrapperfooter {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: 50% 50%;
  padding: 0px;
  margin: 20px 10px;
  width: calc(100% - 40px);
}

.boxfooter {
  padding: 0px;
  margin: 0px;
  text-align: left;
  border: 0px solid #ee0000;
}

.f1 {  grid-row: 1 / span 3;  grid-column: 1;}
.f2 {  grid-row: 1;  grid-column: 2;}
.f3 {  grid-row: 2;  grid-column: 2;}
.f4 {  grid-row: 3;  grid-column: 2;}
.f5 {  grid-row: 4;  grid-column: 1 / span 2; border-top: 1px solid var(--dltext)}

.boxfooter h4 {font-size: 0.8em;  font-weight: 600; color: var(--main); line-height: 1em}
.boxfooter a {font-size: 0.8em;  font-weight: 400; color: #555; line-height: 1.5em}
.boxfooter a:hover {color: #000; }
    
}