@charset "utf-8";
/*CSS Document*/

*    { margin: 0;
       padding: 0;}          
  
body { 
     max-width: 1440px;      
     height:auto;
     background-color:#BFCFD9; 
     margin: 0 auto;
     font-family: 'Catamaran', sans-serif;}

#container {
           margin:0 auto;        
           max-width: 1140px;
           box-shadow:10px 0px 20px -10px rgba(31,55,82);}
         
html {font-size:100%}

header {        
       margin-top:15px;
       margin-bottom:4px;
       background:#4478A6;
       background:linear-gradient(90deg,rgba(31,55,82)-70%, rgba(71,118,169) 60%, rgba(167,188,212) 100%); 
       box-shadow:10px 0px 20px -10px rgba(31,55,82);
       height:140px; 
       display:flex;
       width:100%;}   

header ul {padding:0px}

nav {
       margin: 10px 0px 20px 0px;
       clear: left;
       float: left;
       display:block;}


nav ul {
       font-weight: normal;
       font-size: 0.9em;
       list-style: none;
       display:block;
       overflow: auto;
       margin-top:59px;
       color: #F2F2F2;
       text-align: center;
       text-decoration: none; 
       margin-bottom: 40px;
       border-bottom: 1px solid #F2F2F2;}


header nav ul li {
                 float: left;
                 margin-right: 1px;} 

header nav ul li a {
                   display: inline-block;
                   padding: 10px 0px 10px 0px;
                   color: #F2F2F2;
                   font-weight: normal;
                   margin: 0px 12px 0px 12px;}

    
header nav a:hover {
                   background-color: #F2F2F2;
                   color: #0D0D0D;}

nav .current {color: #0D0D0D; font:bold}                         
                           

header nav a:link, header nav a:visited {text-decoration: none;}

nav select {display: none;}

select:not(:-internal-list-box) {
                                overflow: visible;
                                overflow-x: visible;
                                overflow-y: visible;}



.logo {    
      padding-left:36px;
      padding-top:25px;
      float:left;
      padding-right:245px;}

 

#phoneicon {
           padding-left: 225px;
           margin-top: 50px;}

#number {
        font-size:14px;
        color:#0D0D0D;
        font-weight:bolder;
        text-shadow:1px 1px 1px  #ffff;
        margin-top:63px;
        padding-left:20px; 
        margin-right:0px;  
        font-family:'Roboto', sans-serif;}

   
.textcontent {
             width:50%;
             float:left; 
             background:#0D0D0D; 
             overflow:hidden;
             margin-bottom:-4px}

#homeHero {
          margin: 0 auto;     
          width:100%;}
       

    
#homeHero h1 {
             font-size: 15px;            
             margin-left:96px;
             margin-top:55px;
             line-height:0.5;
             color:#4478A6;
             font-family:'Roboto', sans-serif;}

#homeHero h2 {
             font-size:50px;         
             margin-left:95px;
             margin-top:20px;
             line-height:1.1;
             color:#F2F2F2;}

#homeHero h3 {
            font-size:50px;
            margin-left:95px;
            margin-bottom:8px;
            line-height:1.9;
            color: #F2F2F2;}

#homeHero p  {
             font-size:17px;
             margin-left:96px;
             padding-bottom:22px;            
             line-height:1.6;
             color:#BFCFD9;
             max-width:400px;}

.sidebar h4 {
            font-size:50px;         
            margin-left:95px;
            margin-top:20px;
            line-height:1.1;
            color:#F2F2F2;
            text-shadow: 4px 2px  #0D0D0D;}
       

.sidebar h5 {
           font-size:50px;
           margin-left:95px;
           margin-bottom:8px;
           line-height:1.9;
           color: #F2F2F2;
           text-shadow: 4px 2px  #0D0D0D;}
       
#cta   {
       float:right;
       display:block;
       width:120px;
       height:50px;
       text-align:center; 
       margin-top:3px;
       margin-right:70px;
       margin-bottom:46px;
       background:#4478A6;
       color:#F2F2F2;
       border-color: #2F5373;
       border-width:4px;
       font-size: 15px;}


#covid {
       margin-top:14px;
       float:left;
       margin-left:90px;
       display:block;}
    
.sidebar {
         width:50%; 
         height:100%;       
         float:right; 
         margin-bottom:-4px; 
         overflow:hidden}

.images {
        margin: 0 auto;
        width:100%;
        height:auto}  
        

.thumbnails {
            width:100%;
            height:auto;
            float:right;
            border: 1px#F2F2F2 solid;
            padding: 4px;
            margin: 0 auto; 
            display:block;} 

#altpic {display:none}


form {
     border:6px solid #4478A6;
     background-color:#BFCFD9;
     padding:30px;
     max-width:600px;
     display:block;
     margin:0 auto;
     text-align: center;}

input, select {
               display:block;
               margin:0 auto;}

input [type=text], textarea {
                            border:3px solid #4478A6;
                            padding:5px;}

textarea {
         margin:10px;
         width:85%;}    
     
.renovations, .customCarpentry, .outdoorFeatures, .steelframedConstruction, .projectSupervision {
             width:50%;
             float:left; 
             background:#0D0D0D;}


#containerA, #containerB, #containerC, #containerD, #containerE {
            margin:0 auto;        
            max-width: 1140px;
            height:100%}
              
.projectsidebar1, .projectsidebar2, .projectsidebar3, .projectsidebar4, .projectsidebar5 {
            width:50%; 
            height:100%;       
            float:right;}



figcaption {text-align: center;}

  
#footer{
       width:100%;
       max-width:1140px;
       margin-bottom:15px;             
       background-color: #4478A6; 
       background:linear-gradient(90deg, rgba(31,55,82) -50%, rgba(71,118,169) 80%, rgba(167,188,212) 100%); 
       height: 40px; 
       display:flex; 
       align-items: center;
       position: relative;
       box-shadow:10px 0px 20px -10px rgba(31,55,82);}       
      
     
#footer * {
         display:inline;
         text-decoration: none;
         list-style-type:none;}
         

#footer li a {             
             margin:0 auto;
             font-size: 11pt; 
             font-family:'Roboto', sans-serif;
             color:#F2F2F2; 
             padding-right:35px;
             padding-left:35px;
             width:1140px;
             text-align:center;                                             
             text-shadow: 4px 2px 3px #2F5373;}

#footer a:hover {
                color:#0D0D0D;
                text-decoration-line: underline;}    

#footer p {
           margin:0 auto;
           font-size:20px;
           color:#F2F2F2;
           text-shadow:1px 2px 3px #0D0D0D;
           width:768px; 
           display:inline-block;
           text-align:center;}