* {
  font-family:Questrial;
  font-size: 20px;
  margin: 0;
  padding:0;
}

b {
  letter-spacing: 2px;
  font-size:inherit;
}
body {
  background:url('../images/bglarge2.jpg') repeat;
  background-size: cover;
}

sup {
  font-size:0.5em;
  line-height:1em;
}

img.images {
  max-height:100%;
  width:100%;
  object-fit: cover;
  border:1px solid #000;
}
img.gallery {
  height:100%;
  width:100%;
  border:1px solid #000;
}

img.block {
  margin:0px;
}
img.block2 {
  margin:0px;
  visibility:hidden;
  width:0%;
}

.grid {
  background:none;
  display:grid;
  grid-template-columns: 0.3fr 2.1fr;
  grid-template-rows: 120px 260px 350px auto;
  grid-template-areas:
  "title content"
  "titlelogo content"
  "header content"
  "footer content";
}

.title {
  grid-area: title;
  width: auto;
  color:#C0C0C0;
    background-color: #202020;
    border-left:2px solid #000;
    border-right: 2px solid #000;
    border-bottom:2px solid #000;
    text-align:center;
    font-weight:bold;
    letter-spacing:1px;
}

.title2 {
  display:none;
  color:#C0C0C0;
  text-align:center;
  font-weight:bold;
  letter-spacing:1px;
}

.titlelogo {
  grid-area: titlelogo;
  width: auto;
    background-color: #FFF;
    border-bottom:2px solid #000;
    border-left:2px solid #000;
    border-right: 2px solid #000;
    vertical-align: middle;
}

.header {
  grid-area: header;
  max-height:350px;
    background:url('../images/bglarge.jpg') repeat;
    border-left:2px solid #000;
    border-right:2px solid #000;
    border-bottom:none;
    padding-top:15px;
}
.content {
  grid-area: content;
    height:inherit;
    background:none;
    background-size: cover;
}
.maintitle {
  grid-area:maintitle;
}
.maintitle {
  font-size:1.5em;
  line-height:1.5em;
  color:#000000;
  border:2px solid #000;
  margin: 5px;
  padding: 10px;
  letter-spacing: 2px;
  background-color: rgba(255, 255, 255, 0.5);
}
.footer {
  grid-area: footer;
  height:260px;
  border:2px solid #000;
}
.footer {
  background-color: #202020;
  color:#808080;
  vertical-align: text-top;
  text-align: center;
  display:grid;
  grid-template-columns: 1fr;
  grid-template-rows: 0.1fr 0.1fr 0.1fr;
  grid-template-areas:
  "title2"
  "call"
  "social"
  "information";
}
.title2 {
  grid-area:title2;
  font-size: 1em;
  text-align: center;
}
.call {
  grid-area:call;
  font-size: 1em;
  text-align: center;
}
.social {
  vertical-align: top;
  grid-area:social;
  grid-gap: 10px;
}
.information {
  grid-area:information;
  font-size: 14px;
}

.maingrid3 {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
  grid-row-gap: 4px;
  grid-column-gap: 10px;
  align-items: stretch;
  width:95%;
  }
    .mainbody {
      grid-area:mainbody;
    display:grid;
    background-color: rgba(0, 0, 0, 0.6);
    border:2px solid #000;
    margin: 5px;
    padding: 5px;
    color:#FFFFFF;
    width:inherit;
    text-align: justify;
  }

.show {
  display:none;
}

@media screen and (max-width: 767px)
{
b {
  letter-spacing: 1px;
  font-size:inherit;
  text-align:center;
}
    img.logo {
      width: 100%;
      height: auto;
      display:block;
      margin-left: auto;
      margin-right: auto;
    }
  img.block {
    margin:0px;
    padding-left:10px;
  }
  img.block2 {
    visibility:visible;
    width:auto;
    padding-left:10px;
  }
  .grid {
  display:grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto;
  grid-template-areas:
  "titlelogo header"
  "content content"
  "footer footer";
}
.title {
  display: none;
  border-left: none;
  }
.title2 {
    display: grid;
    border-left: none;
    }
  .titlelogo {
      border-left: none;
          border-right: none;
          padding-top:50%;
          padding-bottom:auto;
      }
.maingrid3 {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(1fr, 2fr));
  grid-row-gap: 4px;
  grid-column-gap: 10px;
  align-items: center;
  width:95%;
  }
  .maintitle, .maintitle2, .maintitle3 {
    text-align:center;
  }
  .hide {
    display:none;
  }
.header {
border-right: none;
border-bottom:2px solid #000;
padding-top: 10px;
padding-bottom: 10px;
}
.footer {
  padding-top:0px;
  height:100%;
}
  .show {
    display:initial;
    }
  .mainbody {
    width:auto;
  }
}

A.menuhome:link, A.menuhome:visited, A.menuhome:active, A.menuservices:link, A.menuservices:visited, A.menuservices:active, A.menucommercial:link, A.menucommercial:visited, A.menucommercial:active, A.menureviews:link, A.menureviews:visited, A.menureviews:active, A.menuproducts:link, A.menuproducts:visited,
A.menuproducts:active, A.menufaq:link, A.menufaq:visited, A.menufaq:active, A.menucontact:link, A.menucontact:visited, A.menucontact:active, A.menugallery:link, A.menugallery:visited, A.menugallery:active, A.menuinstallations:link, A.menuinstallations:visited, A.menuinstallations:active
			{  display:block; line-height:35px; text-align:center; color:#FFF; text-decoration:none; }

A.menuhome2:link, A.menuhome2:visited, A.menuhome2:active, A.menuservices2:link, A.menuservices2:visited, A.menuservices2:active, A.menucommercial2:link, A.menucommercial2:visited, A.menucommercial2:active, A.menureviews2:link, A.menureviews2:visited, A.menureviews2:active, A.menuproducts2:link, A.menuproducts2:visited,
A.menuproducts2:active, A.menufaq2:link, A.menufaq2:visited, A.menufaq2:active, A.menucontact2:link, A.menucontact2:visited, A.menucontact2:active, A.menugallery2:link, A.menugallery2:visited, A.menugallery2:active, A.menuinstallations2:link, A.menuinstallations2:visited, A.menuinstallations2:active
			{  display:block; line-height:35px; text-align:center; color:#FF9933; text-decoration:none; }

A.menuhome:hover, A.menuservices:hover, A.menucommercial:hover, A.menureviews:hover, A.menuproducts:hover, A.menufaq:hover, A.menucontact:hover, A.menuhome2:hover, A.menuservices2:hover, A.menucommercial2:hover, A.menuproducts2:hover, A.menufaq2:hover, A.menucontact2:hover,
A.menugallery:hover, A.menuinstallations:hover
			{ color:#0099CC; text-decoration:none; }

      A.img_link:link, A.img_link:visited, A.img_link:active {
      		padding-left:10px; text-decoration:none; opacity:1.0; color:#EDD333; }
      A.img_link:hover {
      		opacity:0.6; }

          A.product_link:link, A.product_link:visited, A.product_link:active {
          		text-decoration:none; }
          A.product_link:hover {
            	text-decoration:none; }

      A.smallorange:link, A.smallorange:visited, A.smallorange:active {
        	display:block; text-align: right;vertical-align: middle;text-decoration:underline; opacity:1.0; color:#FF9933; width:100%; }
      A.smallorange:hover {
         color:#0099CC;
          text-decoration:underline;}