@charset "UTF-8";
/* Specialty Construction

specialtyconstruction.co

Designed & Developed by A&M Media
© A&M Media
=======================================*/

/* Site Color Palette
=======================================
Orange:         #F15A29 . rgba(241,90,41)
Light Orange:   #D68D62 . rgba(214,141,98)
Blue #1:        #4E939A . rgba(78,147,154)
Blue #1 Hover:  #227179 . rgba(34,113,121)
Blue #2:        #BCDDE4 . rgba(188,221,228)
Blue #3:        #E9F1EF . rgba(233,239,241)
Medium Blue:    #29595E . rgba(89,94,41)
Dark Blue:      #043135 . rgba(4,49,53)
Turquoise:      #CFE8D4 . rgba(207,232,212)
Lime:           #D7E8AE . rgba(215,232,174)
=======================================*/

/* CSS Font Styles
=======================================

=======================================*/

/* Table of Contents
=======================================
1) GLOBAL
  a) BASE STYLES
  b) FORM OVERRIDES
=======================================*/

/*##############################################################################################################################################
##############################################################################################################################################*/

/* 1) GLOBAL */
  /* a) BASE STYLES */
  @font-face  { font-family: 'Oswald', sans-serif; }
  @font-face  { font-family: 'Roboto', sans-serif; }
  h1 { font-family: 'Oswald', sans-serif; font-style:normal; text-rendering:geometricPrecision; }
  h2 { font-family: 'Oswald', sans-serif; font-style:normal; font-weight:700; text-rendering:geometricPrecision; }
  h3 { font-family: Roboto; font-style:normal; font-weight:700; text-rendering:geometricPrecision; }
  h4 { font-family: Roboto; font-style:normal; font-weight:500; text-rendering:geometricPrecision; }
  h5, p { font-family: Roboto; font-weight:400; text-rendering:geometricPrecision; -webkit-font-smoothing:antialiased; -moz-font-smoothing:antialiased; font-smoothing:antialiased; text-transform:initial; }
  h6 { font-family: 'Oswald', sans-serif; font-style: normal; font-weight:200; text-rendering:geometricPrecision; }
  em { font-family:"Sentinel SSm A", "Sentinel SSm B"; font-style: italic; font-weight: 400; }

  body { background-color:#E9F1EF !important; overflow:auto !important; height:auto  !important; min-height:100%; }
  strong { font-weight:700; }
  a { text-decoration:none; color:#000000; transition: all .2s ease-in-out; }
  ul, li { list-style:none; }
  .wrapper { margin:auto; width:100%; height:auto; padding:0; }
  .inline { display:inline !important; } 
  .display_none { display:none; } 

  .padding-top-1 { padding-top:1%; }
  .padding-top-2 { padding-top:2%; }
  .padding-top-3 { padding-top:3%; }
  .padding-top-4 { padding-top:4%; }
  .padding-top-6 { padding-top:6%; }
  .padding-top-8 { padding-top:8%; }
  .padding-top-10 { padding-top:10%; }
  .padding-btm-1 { padding-bottom:1%; }
  .padding-btm-2 { padding-bottom:2%; }
  .padding-btm-3 { padding-bottom:3%; }
  .padding-btm-4 { padding-bottom:4%; }
  .padding-btm-6 { padding-bottom:6%; }
  .padding-btm-8 { padding-bottom:8%; }
  .padding-btm-10 { padding-bottom:10%; }
  .margin-top-1 { margin-top:1%; }
  .margin-top-2 { margin-top:2%; }
  .margin-top-3 { margin-top:3%; }
  .margin-top-4 { margin-top:4%; }
  .margin-top-6 { margin-top:6%; }
  .margin-top-8 { margin-top:8%; }
  .margin-top-10 { margin-top:10%; }
  .margin-btm-0 { margin-bottom:0 !important; }
  .margin-btm-1 { margin-bottom:1%; }
  .margin-btm-2 { margin-bottom:2%; }
  .margin-btm-3 { margin-bottom:3%; }
  .margin-btm-4 { margin-bottom:4%; }
  .margin-btm-6 { margin-bottom:6%; }
  .margin-btm-8 { margin-bottom:8%; }
  .margin-btm-10 { margin-bottom:10%; }

  /* b) FORM OVERRIDES */
  input:focus { outline: none; }
  textarea:focus { outline: none; }
  select:focus { outline: none; }
  ::-webkit-input-placeholder { color: #797A7A; }
  :-moz-placeholder { color: #797A7A; opacity:  1; }
  ::-moz-placeholder {  opacity:  1; }
  :-ms-input-placeholder { color: #797A7A; }
  input, textarea, button { font-family: "Gotham SSm A", "Gotham SSm B", Helvetica, Arial, san-serif; font-style: normal; font-weight: 300; transition: all .15s ease-in-out; }

  /* NAV -
---------------------------------------*/
html, body, .nav { padding: 0; margin: 0; }
.nav { position: absolute; top: 0; left: 0; width: 60px; height:100%; z-index:50; background-image:url(../../../assets/art/nav/nav-background.jpg); background-repeat: repeat-y; background-position: top left;}
.nav ul { *zoom:1; list-style:none; margin:0; padding:0; width: 60px; }
.nav ul:before,.nav ul:after { content:""; display:table; }
.nav ul:after { clear:both; }
.nav ul > li { position:relative; height: 25; width: 150px; }
.nav ul li { position: relative; display:block; width: 30px; height: 25px; text-align: center; padding: 15px; line-height:1.2em; color:#fff; border-bottom: 1px solid rgb(70, 75, 77); transition: all .3s ease-in-out;}
.nav ul li:hover { background-color: rgba(255,255,255,.25); }
.nav-active { background-color: rgba(255,255,255,.25); }
.nav li:first-child { padding: 15px; height: 100px; transition: all .3s ease-in-out; }
.nav li:first-child:hover { background-color: rgba(255,255,255,.25); }
.nav li ul {  }
.nav li ul li { width:200px; height: 55px; }
.nav li ul a { position: relative; display:block; width: 200px; height: 55px; }
.nav li ul a:hover {  }
.nav li ul { position:relative; width: 200px; height: 55px; left:100%; left:-215px; top:-50px; z-index: 200; }
.nav li ul li { background:rgba(237,25,33,1); border-bottom: 0; left:0; -webkit-transition:left 150ms ease; -moz-transition:left 150ms ease; -o-transition:left 150ms ease; transition:left 150ms ease; z-index: 200; }
.nav li ul li:first-child { height: 55px; padding: 0; }
.nav li ul li:last-child { height: 100%; padding: 0; }
.nav li ul li:first-child:hover { background:rgba(237,25,33,1); }
.nav ul > li:hover ul li { background:rgba(237,25,33,1); left:260px; z-index: 200; }
.nav h4 { text-align:left; color:#fff; padding:11px 0 0 11px; font-size:17px; line-height:1em; text-transform:uppercase; }

/*
.nav {
    position: absolute;
    top: 0;
    left: 0;
    width: 290px;
    height: 100%;
    background-image: url(assets/art/nav/nav-bkgd.jpg);
    background-position: top left;
    background-repeat: no-repeat;
    overflow: hidden;
    z-index: 15;
    }
*/
.responsive_menu { display:none; }
.button_container { position:absolute; top:8px; left:6%; height:40px; width:40px; cursor:pointer; z-index:110; transition:opacity .25s ease; }
.button_container.active .top { transform:translateY(6px) translateX(0) rotate(45deg); background:#FFF; }
.button_container.active .bottom { transform:translateY(-6px) translateX(0) rotate(-45deg); background:#FFF; }
.button_container span { background:rgb(231,51,37); border:none; height:5px; width:100%; position:absolute; top:20px; left:0; transition:all .35s ease; cursor:pointer; }
.button_container span:nth-of-type(2) { top:33px; }
.button_word { position:absolute; top:38px; left:112px; font-size:.8em; z-index:110; color:#ccc; }
.button_word.active { color:#ffffff; }
.overlay { position:fixed; background:rgba(231,51,37,.9); z-index:101; top:0; left:0; width:0%; height:100%; opacity:0; visibility:hidden; transition:opacity .15s, visibility .15s, width .15s; overflow:hidden; }
.overlay.open { opacity:1; visibility:visible; width:100%; }
.overlay-menu { position:relative; height:100%; }
.overlay-menu nav { text-align:left; width:100%; text-align:center; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
.overlay-menu ul { list-style:none; padding:0; margin:0 auto; display:block; height:auto; }
.overlay-menu ul li { display:block; padding-bottom:10px; position:relative; opacity:.9; }
.overlay-menu ul li img { height:.7em; padding-right:4px; }
.overlay-menu ul li:last-child { padding-bottom:0; margin-bottom:0; border-bottom:none;  }
.overlay-menu ul li a { display:block; position:relative; color:#FFF; text-decoration:none; overflow:hidden; }
.overlay-menu ul li a:hover { color:#CFE8D4; }
.overlay-menu ul li span { color:#D7E8AE; font-size:1.3em; }
.overlay-menu ul li h3 { font-size:1.3em; text-transform:uppercase; }
.overlay_staff_login { position:fixed; bottom:2%; right:2%; text-align:right; }
.overlay_staff_login a { font-size:.8em; color:#fff; }
.overlay_staff_login a:hover { color:#CFE8D4; }
.overlay_index_link { position:fixed; top:2%; right:2%; text-align:right; }
.overlay_index_link a { font-size:.8em; color:#fff; }
.overlay_index_link a:hover { color:#CFE8D4; }
.overlay_developers_note { text-align:center; width:100%; position:fixed; bottom:2%; font-size:12px; }
  .overlay_developers_note a { font-size:.7em; color:#fff; }
  .overlay_developers_note a:hover { color:#CFE8D4; }



/* Read Page Styles - Usage: About Us, Our Work Read
-------------------------------------- */
.read-content-container { position: absolute; top: 0; left: 10%; width: 800px; background-color: rgba(255,255,255,.8); }
.about-content-container { position: absolute; top: 0; left: 10%; width: 800px; height: auto; background-color: rgba(255,255,255,.8); }
.read-header { box-sizing: border-box; display:block; margin-top: 30px; padding: 20px 20px 18px 20px; position: relative; width: 100%; background-color: #000000; }
.read-header-left { padding: 0; margin: 0; position: relative; display: inline-block; width: auto; }
.read-header-left h1 { margin-right:10%; padding: 0 0 8px 0; margin-bottom: 0; font-family: Oswald; line-height: 46px; text-transform: uppercase; font-size:46px; color: #ffffff; font-weight: normal; }
.read-header-left h2 { padding: 0 0 8px 0; margin-bottom: -8px; font-family: Roboto; font-weight:400; line-height: 16px; font-size: 16px; color: #ffffff; font-weight: normal; }
.read-header-left h4 { font-size:1.2em; color:#fff; text-transform:uppercase; }
.read-header-right { position:absolute; top:20px; right:20px; }
.read-img { padding: 20px; }
.read-text { padding: 0 20px 20px 20px; }
.read-text p { font-family: Roboto, Arial, Helvetica, sans-serif; font-size:.95em; line-height:1.3em; padding-bottom: 10px; color: #000000; }
.read-text strong { font-family: Roboto; font-weight:700; }
.read-text h1 { font-family: Roboto, Arial, Helvetica, sans-serif; font-weight:700; font-size: 14px; color: #f05a28; text-transform: uppercase; padding: 20px 0 4px 0; }
.read-text h2 { display: block; margin: 0; padding:0 0 8px 0; font-family: Roboto; font-weight:700; font-size:1.3em; line-height:1.3em; color: #000; font-weight: normal; }
.read-text h3 { font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 1.1em; line-height: 1.2em; color: #000000; padding:4px 0; }
.read-text h4 { font-family: Roboto, Arial, Helvetica, sans-serif; font-size: .9em; font-style:italic; line-height: 1.2em; color: #333; padding-bottom:4px; }
.read-text img { display: inline-block; margin: 10px 10px 0 0; }
.read-text a { font-family: Roboto, Arial, Helvetica, sans-serif; text-decoration: none; font-size: 12px; line-height: 15px; color: #000000; transition: all .3s ease-in-out; }
.read-text a:hover { color: #ed1c24; }



/* 1) Index
=======================================*/
.logo-container { position: absolute; top: 20px; right: 20px; width:155px; height: 79px; z-index: 15; }
.index-content-container { position: absolute; top: 0; left: 34%; width: 280px; height: 100%; background-color: rgba(240,90,40,.3); padding: 0 35px 0 35px; text-align: right; }
.index-content-container h1 { font-family: Oswald; font-size: 55px; color: #ffffff; font-weight: none; text-transform: uppercase; line-height: 56px; padding: 160px 0 20px 0; }
.index-content-container p { font-family: Roboto; font-weight:400; font-size:.9em; line-height:1.2em; color: #ffffff; font-weight: none; padding: 0 0 20px 120px; }
.index-content-container a { font-family: Roboto; font-weight:700; color: #fff100; text-decoration: none; transition: all .3s ease-in-out; }
.index-content-container a:hover { color: #f7931d; }
video { position:absolute; top:50%; left:50%; min-width:100%; min-height:100%; width:auto; height:auto; z-index:-1; transform:translateX(-50%) translateY(-50%); -webkit-transform:translateX(-50%) translateY(-50%); -moz-transform:translateX(-50%) translateY(-50%); background-size:cover; transition:1s opacity; }



/* 2) Services
=======================================*/
.services-content-container { position: absolute; top: 0; left: 33%; width: 410px; height: 100%; background-color: rgba(0,0,0,.6); padding: 0 35px 0 35px; text-align: right; }
.services-content-container h1 { font-family: Oswald; font-size: 62px; color: #ffffff; font-weight: none; text-transform: uppercase; line-height: 58px; padding: 35px 0 15px 0; }
.services-content-container p { font-family: Roboto; font-weight:400; font-size:1em; line-height:1.3em; color: #ffffff; font-weight: none; padding: 0 0 20px 0; }
.services-content-container a { font-family: Roboto; font-weight:700; color: #fff100; text-decoration: none; transition: all .3s ease-in-out; font-size:.9em;}
.services-content-container a:hover { color: #f7931d; }
.services-featured-container { position: absolute; right: 35px; width: 320px; height: auto; display: block; margin: 0 0 30px 0; }
.services-featured-header { padding: 8px 10px; background-color: #000000; text-align: left; font-family: Roboto; font-weight:700; font-size: 12px; color: #ffffff; font-weight: none; text-transform: uppercase; line-height: 14px; }
.services-featured-footer { display: block; background-color: #000000; text-align: right; font-family: Roboto; font-weight:700; font-size: 12px; color: #ffffff; font-weight: none; text-transform: uppercase; line-height: 12px; }
.services-featured-footer a { padding: 8px 10px; display: block; text-decoration: none; color: #ffffff; background-color: #000000; transition: all .3s ease-in-out; }
.services-featured-footer a:hover { color: #f7931d; }
.services-featured-content { height: 320px; -webkit-perspective: 1000; -moz-perspective: 1000; -o-perspective: 1000; perspective: 1000; }
.services-featured-content:hover .flipper,  
.services-featured-content.hover .flipper { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -o-transform: rotateY(180deg); transform: rotateY(180deg); }
.services-featured-content .front { width: 314px; height: 314px; border: 3px solid #ccc; background-size:cover; background-position:center; background-repeat:no-repeat; }
.services-featured-content .back { width: 280px; height: 280px; }
.services-bkgd { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: auto; background-attachment: fixed; background-color: #333; background-position: top center; background-repeat: no-repeat; margin: 0; padding: 0; background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; }

.flipper { -webkit-transition: 0.6s; -webkit-transform-style: preserve-3d; -moz-transition: 0.6s; -moz-transform-style: preserve-3d; -o-transition: 0.6s; -o-transform-style: preserve-3d; transition: 0.6s; transform-style: preserve-3d; position: relative; }
.front, .back { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; position: absolute; top: 0; left: 0; }
.front { background-color:#002447; }
.front .name { width: 294px; background: rgba(237,25,33,.8); padding: 10px; position: absolute; top: 40%; text-align: center; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; }
.front .name h1 { margin: 0; padding: 0; font-family: Oswald; font-size: 16px; line-height: 16px; color: #FFF; text-emphasis:none; text-transform: uppercase; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; }
.front .name h2 { margin: 0; padding: 0; text-emphasis:none; font-family: Roboto; font-weight:400; font-size: 13px; line-height: 13px; color: #FFF; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; }
.back { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -o-transform: rotateY(180deg); transform: rotateY(180deg); background-color: #002447; padding: 20px; text-align: left; }
.back h1 { text-emphasis: none; padding: 0 0 4px 0; margin: 0; font-family: Oswald; font-weight:normal; text-transform: uppercase; color: #ed1c24; font-size: 24px; line-height: 24px; }
.back h2 { text-emphasis:none; padding: 0 0 2px 0; margin: 0; font-family: Oswald; font-weight:normal; text-transform: uppercase; color: #f05a28; font-size: 16px; line-height: 16px; }
.back p { margin: 0; text-emphasis:none; padding: 0 0 25px 0; font-family: Roboto; font-weight:400; font-size: 12px; line-height: 13px; font-weight:100; color: #ffffff; }
.back a { position: absolute; bottom: 20px; padding: 0 0 2px 0; margin: 0; font-family: Roboto; font-weight:400; text-emphasis:none; text-transform: uppercase; color: #f05a28; font-size: 14px; line-height: 14px; transition: all .3s ease-in-out; }
.back a:hover { color: #ffffff; }


/* 3) Our Work
=======================================*/
/*
.work-top-content-container { position: absolute; top: 0; left: 10%; width:64%; height:auto; background-color: rgba(255,255,255,.8); }
.work-content-container { box-sizing:border-box; position: relative; margin: 0; padding: 20px 0 0 20px; width: 100%; height: auto;  }
.work-sq { position: relative; float: left; margin: 0 20px 20px 0; padding: 0; width: 240px; height: 240px; background-color: #666; background-size:cover; background-position:center; background-repeat:no-repeat; }
.work-sq-top { display: block; width: 240px; height: 153px; overflow: hidden; }
.work-sq a { position:absolute; bottom:0; padding: 0; margin: 0; display: block; width: 216px; padding: 12px 12px 12px 12px; background-color: #666; transition: all .2s ease-in-out; text-decoration: none; color: #ffffff; }
.work-sq a:hover { background-color: #ed1c24; }
.work-sq h1 { font-family: Oswald, san-serif; text-transform: uppercase; font-weight: normal; font-size: 18px; line-height: 18px; margin-bottom: 2px; }
.work-sq h2 { font-family: Roboto, serif; font-weight: normal; font-size: 12px; line-height: 14px; }
.work-sq p { font-family: Roboto, san-serif; font-weight: normal; font-size: 9px; line-height: 9px; margin: 6px 0 0 0; }
.our-work-back-button { display: block; margin: 20px 0; }
.our-work-back-button a { display: inline-block; font-family: Oswald; font-size: 18px; line-height: 18px; color: #fff; text-transform: uppercase; text-decoration: none; padding: 14px 12px 10px 12px; background-color: #666; transition: all .2s ease-in-out; }
.our-work-back-button a:hover { color: #fff; background-color: rgba(247,147,29,1); }
.our-work-back-button i { margin-right: 3px; }
*/
.work-top-content-container { position: absolute; top: 0; left: 10%; width:64%; height: auto; background-color: rgba(255,255,255,.8); }
.work-content-container { position: relative; margin: 0; padding: 2% 0 0 2%; width:100%; height: auto; box-sizing:border-box; }
.work-sq { position: relative; float: left; margin: 0 2% 2% 0; padding: 0; width: 31.3%; height: 240px; background-color: #666; background-size:cover; background-position:center; background-repeat:no-repeat; }
.work-sq-top { box-sizing:border-box; display: block; width:100%; height: 153px; overflow: hidden; }
.work-sq-top-short { display: block; width:100%; height: 135px; overflow: hidden; }
  .work-sq-top img, .work-sq-top-short img { width:100%; }
.work-sq a { position:absolute; bottom:0; box-sizing:border-box; padding: 0; margin: 0; display: block; width: 100%; padding: 12px 12px 12px 12px; background-color: #666; transition: all .2s ease-in-out; text-decoration: none; color: #ffffff; }
.work-sq a:hover { background-color: #ed1c24; }
.work-sq h1 { font-family: Oswald, san-serif; text-transform: uppercase; font-weight: normal; font-size: 18px; line-height: 18px; margin-bottom: 2px; }
.work-sq h2 { font-family: Roboto, serif; font-weight: normal; font-size: 12px; line-height: 14px; }
.work-sq p { font-family: Roboto, san-serif; font-weight: normal; font-size: 9px; line-height: 9px; margin: 6px 0 0 0; }
.our-work-back-button { display: block; margin: 20px 0; }
.our-work-back-button a { display:inline; font-family: Oswald; font-size: 18px; line-height: 18px; color: #fff; text-transform: uppercase; text-decoration: none; width: 176px; padding: 12px 12px 10px 12px; background-color: #666; transition: all .2s ease-in-out; }
.our-work-back-button a:hover { color: #fff; background-color: rgba(247,147,29,1); }
.our-work-back-button i { margin-right: 3px; }
.work-bkgd { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: auto; margin: 0; padding: 0; background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; }
.work-sq-top-short { display: block; width: 240px; height: 135px; overflow: hidden; }
.flexslider .flexslide-li { height:400px; background-size:cover; background-position:center; }


/* 4) About Us 
=======================================*/
.about-bkgd { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: auto; background-attachment: fixed; background-color: #333; background-position: top center; background-repeat: no-repeat; margin: 0; padding: 0; background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; }
.about_team_container { padding-bottom:14px; margin-bottom:14px; border-bottom:solid 1px #999; }
.about_team_container img { float:right; width:30%; margin:0 0 12px 12px; }
.about_team_container a { display:inline-block; font-size:.9em; }

/* 5) Contact
=======================================*/
.contact-content-container { position: absolute; top: 0; left: 22%; width: 600px; height: auto; background-color: rgba(255,255,255,.8); }
.contact-header { display: block; margin-top: 30px; padding: 20px 20px 18px 20px; position: relative; width: 560px; background-color: #000000; }
.contact-header-left { padding: 0; margin: 0; position: relative; display: inline-block; width: auto; }
.contact-header-left h1 { font-family: Oswald; font-size: 62px; color: #ffffff; font-weight: none; text-transform: uppercase; line-height: 58px; padding: 0; margin-bottom: -10px;  }
.contact-header-right { position: relative; float: right; }
.contact-content { padding: 0 20px 20px 20px; }
.contact-content a { text-decoration: none; color: #000; transition: all .2s ease-in-out; }
.contact-content a:hover { color: rgba(237,25,33,1); }
.contact-content p { font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 16px; line-height: 20px; color: #000000; }
.contact-content h1 { font-family: Oswald, Arial, Helvetica, sans-serif; font-size: 28px; color: rgba(237,25,33,1); text-transform: uppercase; padding: 30px 0 0 0; }
#contact-map { margin: 20px 0 0 0; }
.contact-form { width: 100%; }
.form-box { margin: 0; padding: 0; }
.form-field { width: 550px; height: 40px; padding-left: 10px; margin-top: 8px; background-color: #fff; border: solid 1px; border-color: #999; font-family: Roboto; font-weight:400; font-size: 18px; color: #000; }
.form-field-comment { margin-bottom: 8px; width: 550px; height: 100px; padding: 10px 0 0 10px; margin-top: 8px; background-color: #fff; border: solid 1px; border-color: #999; font-family: Roboto; font-weight:400; font-size: 18px; color: #000; }
input { outline: none; font-family: Roboto; font-weight:400; font-size: 16px; color: #000; } 
.button { padding: 14px 12px 10px 12px; border: 0; transition: all .2s ease-in-out; background-color: rgba(237,25,33,1); font-family: Oswald; font-size: 18px; line-height:16px;text-transform: uppercase; color: #fff; cursor: pointer; }
.button:hover { background-color: rgba(240,90,40,1); }  
#form-subhead { font-family: Oswald; font-size: 20px; color: #000; text-transform: uppercase; padding-top: 15px; }
.contact-bkgd { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: auto; background-attachment: fixed; background-color: #333; background-image: url(../../../assets/art/our-work/our-work-read-bkgd.jpg); background-position: top center; background-repeat: no-repeat; margin: 0; padding: 0; background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; }



/* 6) Testimonials
=======================================*/
.testimonials-content-container { position: absolute; top: 0; left: 28%; width: 500px; height: 100%; background-color: rgba(255,255,255,.8); }
.testimonials-header { display: block; margin-top: 30px; padding: 20px 20px 18px 20px; position: relative; width: 460px; background-color: #000000; }
.testimonials-header-left { padding: 0; margin: 0; position: relative; display: inline-block; width: auto; }
.testimonials-header-left h1 { font-family: Oswald; font-size: 62px; color: #ffffff; font-weight: none; text-transform: uppercase; line-height: 58px; padding: 0; margin-bottom: -10px;  }
.testimonials-header-right { position: relative; float: right; }
.testimonials-content { padding: 20px; }
.testimonials-content p { font-family: Roboto, Arial, Helvetica, sans-serif; font-size: 32px; line-height: 40px; color: #000000; font-weight: normal; }
.testimonials-bio-name { margin-top: 20px; font-family: Oswald; font-weight:normal; font-size: 26px; color: rgba(237,25,33,1); text-transform: uppercase; }
.testimonials-bio-title { font-family: Roboto; font-weight:700; font-weight: normal; font-size: 16px; color: #000; }
.testimonials-bio-title-italic { font-family: Roboto; font-weight:400; font-weight: normal; font-style:italic; font-size: 16px; color: #000; padding-bottom:5px; }