/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 21/05/2023, 16:31:07
    Author     : gilbs
*/

*{padding:0; margin:0; border:0; outline:0; box-sizing:border-box;}
html,body{width:100%; height:100%; overflow:auto}
body{font:normal 90% Helvetica,Arial,sans-serif;}
a{text-decoration: none;}
li{list-style: none}

.defaultSize{ min-width:900px; max-width:1260px; width:90%; margin: 0 auto; }
.mainContent{min-height:550px}
.webTitle{ font-size:max(1.2vw,1.4rem); margin-bottom:25px; padding:1% 2%; border-radius:8px; }
.homeTitles{ font-size:max(1vw,0.9rem); width:100%; padding: 2%; margin:15px auto; border-radius: 8px; font-weight: normal;  }
.webContent{ padding:0 5%; font-size:max(0.9vw,1rem )}
.webContent p{padding: 15px 0}
#webHeader{width:100%; padding-top:20px;}


body{color:var(--txtbody); background-color:var(--bgmain); background-position:50% 0; background-repeat:var(--bgrepeat); background-image:var(--bgimg)}
.webTitle{background-color:var(--bgtop); color:var(--txttop)}
.formProcess,
.homeTitles,
.formProcess,
#formSender{color:var(--txtmenu); background-color:var(--bgmenu);}
.homeIcons{ color:var(--bgtop);}
.homeIcons:before{ background-color:var(--bgtop); color:var(--txttop) }
.homeIcons:hover:before{color:var(--txtmenu); background-color:var(--bgmenu); }

#webHeader{ background-color:var(--bgtop); }
#webHeader #webtels p{color:var(--txttop)}
#webHeader #webmenu{background:var(--bgmenu); color:var(--txtmenu) }
#webHeader #webmenu a{color:var(--txtmenu); }
#webHeader #webmenu a:hover{border-color:var(--bgmenu); border-left-width:10px; border-style: solid }
#webMain{color:var(--cfgtxt) }
#webFeet{background-color:var(--bgfeet);}
#webFeet *{color:var(--txtfeet)}

#webHeader #webline{ width:100%; height:95px; display: table  }
#webHeader #weblogo{ width:max(400px, 70%); height:80px; display: block; float:left;}
#webHeader #weblogo img{ width:auto  }
#webHeader #webtels{ width:max(300px, 30%); height:75px; float:right; text-align: right; }
#webHeader #webtels p{ font-size: 135%; padding:2% 0; letter-spacing:2px  }

#webHeader #webmenu{width:100%; height:45px; }
#webHeader #webmenu a{line-height: 45px; vertical-align: middle; height:45px; display:inline-block; width:max(100px,12%); }
#webHeader #webmenu a:hover{font-weight:bold}

#webMain{min-height:450px; display:table; padding: 15px 0;  }
#webFeet{width:100%; min-height:100px; max-height:200px; height:100%;   padding:20px 0;   }
#webFeet .weblogo{ height:85px; width:200px; display: inline-block  }
#webFeet .weblogo img{height:100%; width:auto  }
#webFeet #webaddress{ max-width:400px; width:50%; float:right; text-align: right; padding: 15px 0;   }
#webFeet #feetLogo{height:110px; }
#webFeet #infoline{ font-size:85% }

#homePhotos{padding:25px 0 60px 0; display: table; width:100%  }
#homePhotos li{width:max(25%,10vw); float: left; }
#homePhotos li a{margin-bottom:15px; display: block }
#homePhotos li img{border:4px solid #fff; width:95%; }
#homePhotos li p{text-align: center; font-size:120%; }

#homeServices{ width:48%; float:left; min-height:150px;   }
#homeServices li{padding: 15px 35px}
#homeProfile{width:48%; float:right; min-height:150px;  }
#homeProfile div{padding: 0 5%}
#homeProfile p{min-height:140px }
.homeIcons{ display: block; clear:both; margin:10px 0; line-height:25px; vertical-align: middle }
.homeIcons:before{ width:25px; height: 25px; content: "+"; float:left; margin-right:10px; border-radius:20px; text-align: center   }

form#contactus label,
form#contactus input{height:45px; line-height:45px; vertical-align: middle; float:left;}
form#contactus div{clear:both; width:100%; padding:20px; display: table; }
form#contactus label{width:max(100px,20%) }
form#contactus input{ width:max(250px,70%);}
form#contactus textarea{ width:max(250px,70%); }
form#contactus input,
form#contactus textarea{border:1px solid #ccc; border-radius: 4px; padding: 0 2%}
form#contactus textarea{padding: 2% 3%}

.copy{ width:40%; float:left }
.eservice{ width:20%; float:right; text-align: right;}

#photoGalery ul{ width:96%; margin: 0 auto }
#photoGalery li{width:29%; margin:0 1%; text-align: center; height:max(220px,16vw); float:left  }
#photoGalery li img{ width:100%; border:5px solid #fff }

#serviceList li{padding:15px 0}



#sendResponse{ width:60%; margin: 25px auto; display: none }
#formSender{ width:190px; text-align: center; padding:15px 10px; border-radius: 4px; float: right; display: block; margin:0 10%   }


.pointed{border:1px solid #f90; background: #FFF0D9; color:#f30}
.pointed strong{display: block}
div.pointed{padding:30px; border-radius:8px}
.formProcess{ padding:25px; border-radius: 8px; width:40%; margin: 2% auto  }