Responsive Web Designs Virginia Beach : Clark Roofing & Siding, Inc.

MAIN PAGE | CLICK IMAGES TO VIEW * CLICK OUTSIDE THE LARGE IMAGE TO CLOSE THE DESIGN

Global notes -
When any design is scrolled vertically or hover there are effects with respect to boxes and photos moving or folding into vertically/horizontally place as is commonly seen in responsive design having long vertically scrolls. In the 3 designs below all colors, sections, photos and icons are interchangable.


Design #1A TOP SECTION • Small brand logos will fade-animate if more than 4 to display. • Search box on right side. • 3 or more social link icons can be displayed LARGE PHOTO • Multiple large product photos will fade animate QUOTE TAB • Click on the tab and an inquiry form will slide up over the photo SIX BOXES • Hover on the boxes shows an animation effect. Click on box, goes to appropriate interior page. CORE VALUES • Below the 4 values there will be changing custom testimonials. Click on any testimonials goes to full testimonial page.	Design #1B • Same as design 1A except: • Engineering texture has been added to the top blue header. • Company photo has been added below CORE VALUES	Design #1B map open • Same as design 1B: • Map page seen after clicking on the tab; 'MAP & DIRECTIONS'. The Google map page slides-in. Clicking on the blue tab again, returns the staff photo.


Design #2A TOP SECTION • Search box on right side. • 3 or more social link icons can be displayed LARGE PHOTO AREA • Roof materials and corresponding roof project photos will fade-animate together. • Product logos are super-imposed over the roofing material. • Text is super-imposed as well with respect to the photos and/or branding taglines. SIX BOXES • Hover on the boxes shows an animation effect. Click on box, goes to appropriate interior page. STAFF and MAP • When the blue tab is clicked a Google directions box slides up. Visitors may entering a starting point and click GO for directions.	Design #2B • Same as design 2A except: • Solid blue color has been added behind the 6 boxes.


Design #3A TOP SECTION • Search box plus 3 or more social link icons can be displayed on the right. LARGE PHOTO AREA • Large photo with text super-imposed over the photo in the lower section of the photo. SIX BOXES • Hover on the boxes shows an animation effect. Click on box, goes to appropriate interior page. STAFF and MAP • When the blue tab is clicked a Google directions box slides up. Visitors may entering a starting point and click GO for directions.	Design #3B • Same as design 3A except: • Logo is white over a dark blue gradient with engineering texture in the background. • Six boxes has a semi-transparent blue with white text over each of the six boxes.