/**
 * Front Page Styles
 */

/*default hoem section padding unless overidden*/
.home-section {
    padding:2.5rem 0 3.125rem 0;
}

.spanish-toggle {
    display: none !important;
}
 /*
 * Titles
 */
 .sec-title {
     text-transform: uppercase;
     font-size: ‭1.375rem;
     font-weight: 700;
     text-align: center;
     line-height: normal;
     margin-bottom:1.5rem;
 }
 @media(min-width: 1024px) {
    .sec-title {
        font-size: 4em;
        margin-bottom:2rem;
        line-height: 1;
    }
}
 
/*
 * Header
 */

@media(min-width: 1024px) {
    header#main-header.front-page-header {
        position: absolute;
        width:100%;
        top:0;
        background: rgba(255,255,255,0.94);
        z-index: 1;
    }
}

/*
 * Banner
 */

.banner {
    /*background:url('../images/banner.jpg') no-repeat;*/
    background-position: center top;
    border-bottom:7px solid #f6b22a;
    height:55vh;
    background-size:cover;
    position: relative;
}

.banner .grid-container {
    width:100%;
}

.cta-width {
    color:#FFF;
    margin-top:31vh;
}

.cta-width .outer-names {
    font-size:1.25rem;
    text-align:center;
    line-height: normal;
    margin-bottom:.5rem;
    text-shadow:rgba(0,0,0,0.75) 2px 2px 1px,rgba(0,0,0,0.75) 1px 1px 1px,rgba(0,0,0,0.5) 1px 1px 1px;
}

.cta-box {
     /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#bb1a20+0,bb1a20+50,15489f+51,15489f+100&0.77+0,0.77+100 */
    background: -moz-linear-gradient(left,  rgba(187,26,32,0.77) 0%, rgba(187,26,32,0.77) 50%, rgba(21,72,159,0.77) 50%, rgba(21,72,159,0.77) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(187,26,32,0.77) 0%,rgba(187,26,32,0.77) 50%,rgba(21,72,159,0.77) 50%,rgba(21,72,159,0.77) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(187,26,32,0.77) 0%,rgba(187,26,32,0.77) 50%,rgba(21,72,159,0.77) 50%,rgba(21,72,159,0.77) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c4bb1a20', endColorstr='#c415489f',GradientType=1 ); /* IE6-9 */
    border: 3px solid #f6b22a;
    text-align: center;
    position: relative;
    padding:1rem 1rem 0;
}

.cta-box .texas {
    position: absolute;
    margin:auto;
    left:0;right:0;bottom:0;
    top:-30px;
    pointer-events: none;
    max-width:55px;
}

.cta-box .pa {
    font-size: 3vw;
    font-weight: 700;
    text-transform: lowercase;
    font-style: italic;
}

.cta-box .tagline {
    font-size: 4.75vw;
    font-weight: 700;
    margin: .5rem auto 2.25rem;
}

.cta-box .cta-btn-1 {
    position: absolute;
    bottom:-22px;
    margin: 0 auto;
    left: 0;
    right: 0;
}

.cta-box .primary-button {
    width:80%;
    margin:0 auto;
    padding:.75rem;
}

@media(min-width: 640px) {
    .banner {
        height:325px;
        background-position: center;
    }
    .cta-width {
        margin-top:155px;
    }
    .cta-box {
        padding:.5rem .5rem 0;
    }
    .cta-box .pa {
        font-size: .875rem;
    }
    .cta-box .tagline {
        font-size:1.75rem;
        margin:.25rem auto 2rem;
    }

    .cta-box .primary-button {
        font-size:1rem;
    }
}

@media(min-width: 768px) {
    .banner {
        height:500px;
    }
    .cta-width {
        margin-top:250px;
    }
    .cta-box .tagline {
        font-size: 2rem;
        margin: 1rem auto 2.5rem;
    }
}

@media(min-width: 1024px) {
    .banner {
        height:1075px;
    }
    .banner .inner-banner-height {
        height:100%;
    }
    .cta-width {
        color:#FFF;
        margin-top:23em;
    }
    .cta-box {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#bb1a20+0,bb1a20+50,15489f+51,15489f+100&0.77+0,0.77+100 */
       background: -moz-linear-gradient(left,  rgba(187,26,32,0.77) 0%, rgba(187,26,32,0.77) 50%, rgba(21,72,159,0.77) 50%, rgba(21,72,159,0.77) 100%); /* FF3.6-15 */
       background: -webkit-linear-gradient(left,  rgba(187,26,32,0.77) 0%,rgba(187,26,32,0.77) 50%,rgba(21,72,159,0.77) 50%,rgba(21,72,159,0.77) 100%); /* Chrome10-25,Safari5.1-6 */
       background: linear-gradient(to right,  rgba(187,26,32,0.77) 0%,rgba(187,26,32,0.77) 50%,rgba(21,72,159,0.77) 50%,rgba(21,72,159,0.77) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
       filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c4bb1a20', endColorstr='#c415489f',GradientType=1 ); /* IE6-9 */
       border: 8px solid #f6b22a;
       padding:1.5rem 0;
    }
    .cta-box .texas {
        max-width:100%;
        top:-95px;
    }
    .cta-box .pa {
        font-size:1.25rem;
    }
    .cta-box .tagline {
        font-size: 2.875rem;
        margin: 3rem auto 3rem;
    }
    .cta-box .cta-btn-1 {
        position: static;
        bottom: unset;
        margin: 0 auto;
        left: unset;
        right: unset;
    }
    .cta-box .primary-button {
    padding:1rem;
    }
}
@media(min-width: 1200px) {
    .cta-box .pa {
        font-size:2rem;
    }
}

/*
 * Content
 */
.homeh1 {
    font-size:8vw;
    text-transform: uppercase;
    text-align:center;
    font-weight: 700;
    color:#bb1a20;
    display:block;
}

.main-home-section h2,
.main-home-section h3 {
    margin-bottom:1rem;
}

.home-secondary {
    padding-bottom:0px;
}

.home-secondary .homeh1 {
    color:#cc7073;
}



@media(min-width: 400px) {
    .homeh1 {
        font-size:5vw;
    }
}

@media(min-width: 1024px) {
}

@media(min-width: 1100px) {
    .homeh1 {
        font-size:3.5rem;
        margin-bottom:2.5rem;
    }
}

/*
 * Case Results Section
 */
 .results-section {
  padding:2rem 0;
/*   background:#15489f url(../images/cr-bg.jpg); */
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 70% center;
  color:#FFF;
  overflow-x:hidden;
  position: relative;
}

.results-section .above-cr {
  margin-bottom:2rem;
}

.cr-list {
  margin-bottom:2rem;
  width: 100%;
}

.cr-block {
  border-top:12px solid #FFF;
  position: relative;
  background: rgba(0,0,0,0.35);
}

@media (max-width:640px) {
    .cell.cr-block {
        margin:0;
        width:100%;
    }
}

.cr-block::before {
  position: absolute;
  content: '';
  background:#FFF;
  width: 101vw;
  height: 12px;
  top: -12px;
  left:0;
  right: 0;
  margin: auto;
}

.cr-result {
  background: #f6b22a;
  text-align: center;
  font-size: 6vw;
  text-transform: uppercase;
  font-weight:500;
  position: relative;
  width: 101vw;
  color:#15489f;
}

.cr-meta {
  background: rgba(0,0,0,0.25);
  padding:1rem 10%;
  position: relative;
  width: 100vw;
}

.cr-desc {
  padding:1rem;
}

@media(min-width: 400px) {
}
@media(min-width: 640px) {
  .cr-block {
      border:12px solid #FFF;
      position:static;
  }
  
  .cr-block::before {
      display:none;
  }
  
  .cr-result {
      font-size: 2.5rem;
      width:100%;
      position: static;
  }
  
  .cr-meta {
      padding:1rem 5%;
      width:100%;
      position: static;
  }
  .cr-desc {
      padding:1rem;
  }
}
@media(min-width: 768px) {
}
@media(min-width: 1024px) {
  .results-section {
      background-position: center center;
  }
  .cr-meta {
      padding:1.5rem 9%;
  }
  .cr-desc {
      padding:1.5rem;
  }
}
@media(min-width: 1200px) {
  .cr-meta {
      padding:1.5rem 5%;
  }
}
@media(min-width: 1500px) {
}

/*
 * Attorneys Section
 */
.atty-section .sec-title {
    color:#bb1a20;
}
.atty-section .atty {
    position: relative;
    color:#FFF;
}

.atty-section .atty .atty-overlay {
    position: absolute;
    bottom:0;
    width:100%;
    height:38%;
    background:rgba(0,0,0,0.5);
    transition:.25s all ease;
    padding:.25rem;
}

.atty-section .atty:hover .atty-overlay {
    background:rgba(21,72,159,0.5)
}

.atty-section .atty .atty-name {
    font-size:3.75vw;
    text-align: center;
    font-weight: 700;
    line-height:1;
    margin-bottom:.5rem;
}

.atty-section .atty .atty-name .atty-role{
    font-size:2.5vw;
    font-weight: 400;
    margin-top:.25rem;
}

.atty-section .atty .atty-btn {
    padding:.5rem;
    max-width:80%;
    margin:0 auto;
}

@media(min-width: 400px) {
    .atty-section .atty .atty-overlay {
        padding:.5rem;
    }
}

@media(min-width: 500px) {
    .atty-section .atty .atty-overlay {
        padding-top:4vw;
    }
}


@media(min-width: 640px) {
    .atty-section .atty .atty-overlay {
        height:33%;     
    }
}

@media(min-width: 1024px) {
    .atty-section .atty .atty-overlay {
        padding:1.875rem 1rem;
    }
}

@media(min-width: 1200px) {
    .atty-section .atty .atty-overlay {
        padding:3.5rem 1rem 1.875rem;
    }
    .atty-section .atty .atty-name {
        font-size:3rem;
    }
    .atty-section .atty .atty-name .atty-role{
        font-size:1.125rem;
    }
    
    .atty-section .atty .atty-btn {
        padding:1rem;
        margin-top:1rem;
    }
}

/*
 * Practice Areas
 */
.pa-section {
    background: -moz-linear-gradient(left,  rgba(187,26,32,1) 0%, rgba(187,26,32,1) 50%, rgba(21,72,159,1) 50%, rgba(21,72,159,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  rgba(187,26,32,1) 0%,rgba(187,26,32,1) 50%,rgba(21,72,159,1) 50%,rgba(21,72,159,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  rgba(187,26,32,1) 0%,rgba(187,26,32,1) 50%,rgba(21,72,159,1) 50%,rgba(21,72,159,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c4bb1a20', endColorstr='#c415489f',GradientType=1 ); /* IE6-9 */
}

.pa-section .sec-title {
    color:#FFF;
}

.pa-link {
    border:2px solid #f6b22a;
    padding:.5rem;
    display:flex;
    align-items: center;
    justify-content: center;
    color:#FFF;
    margin-bottom:1.25rem;
    font-family: 'Open Sans Condensed', Arial, sans-serif;
    font-weight: 700;
    min-height:68px;
    text-align:center;
    transition:.25s all ease;
}

.pa-link:hover,
.pa-link:active,
.pa-link:focus {
    background:#FFF;
    color: #15489f;
}

/*PA Grid margin changes*/
@media print, screen and (min-width: 40em) {
    .pa-section .grid-margin-x>.medium-6 {
        width: calc(50% - 1.25rem);
        margin-left: .625rem;
        margin-right: .625rem;
    }
}
@media print, screen and (min-width: 75em) {
    .pa-section .grid-margin-x>.medium-6 {
        width: calc(33.33333% - 1.25rem);
        margin-left: .625rem;
        margin-right: .625rem;
    }
}

@media(min-width: 1024px) {
    .pa-section {
        background: url(../images/areas-of-practice-desktop-bg.jpg) center center no-repeat;
        background-size: auto;
    }
    .pa-section .view-more-button {
        max-width: 500px;
        margin: 0 auto;
    }
    .pa-link {
        font-size:1.25rem;
        border-width:8px;
        min-height:179px;
    }
}

/*
 * Firm Section
 */
.biglogo {
    margin:0 auto 1.5rem;
}

.office-address {
    font-weight:700;
    padding-left:18vw;
    color:#15489f;
}

@media(min-width: 400px) {
    .office-address {
        padding-left:10vw;
        font-size:5.5vw;
    }
}

@media(min-width: 640px) {
    .office {
        position: relative;
    }
    .office-address {
        font-size:2.25vw;
        padding-left:0;
    }
}

@media(min-width: 1440px) {
    .office-address {
        font-size:1.5rem;
    }
}

@media(min-width: 1550px) {
    .office-address {
        font-size:2rem;
    }
}

@media(min-width: 1656px) {
    .office-address {
        font-size:2.375rem;
    }
}

/*
 * Contact Section
 */
#contact-wrapper {
    padding: 8vw 0;
    background: #f6b22a;
}

#contact-wrapper .wpcf7-response-output {
    color: #fff;
}

#contact-wrapper p.disc-text {
    text-align: center;
    color: #fff;
    font-family: 'Open Sans Condensed', Arial, sans-serif;
    font-size: 4vw;
    display: block;
    max-width: 90%;
    margin: 0 auto;
    padding-bottom: 8vw;
}

#contact-wrapper p.section-description,
#contact-wrapper h2 {
    color: #15489f;
}

#contact-wrapper form {
    font-family: 'Open Sans Condensed', Arial, sans-serif;
}

#contact-wrapper form label {
    font-family: 'Open Sans Condensed', Arial, sans-serif;
    font-weight:700;
}

#contact-wrapper form .primary-button[type="submit"] {
    width: 100%;
}

#contact-wrapper .input-wrapper {
    margin: 0 5px;
    position: relative;
}

#contact-wrapper .input-wrapper label {
    padding: 0;
    line-height: 1em;
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
}

#contact-wrapper .input-wrapper input[type="tel"],
#contact-wrapper .input-wrapper input[type="text"],
#contact-wrapper .input-wrapper input[type="email"],
#contact-wrapper .input-wrapper textarea {
    border: none;
    box-shadow: none;
    padding-top: 25px;
    padding-left: 10px;
    background-color: rgba(255,255,255,0.87);
    height: 60px;
}

#contact-wrapper .input-wrapper textarea {
    resize: none;
    height: 90px;
    padding-top: 40px;
    background-color: rgba(255,255,255,0.875);
}

#contact-wrapper .input-wrapper label[for="consultant-form-message-input"] {
    padding-top: 20px;
    top: 0;
}

@media(min-width: 1024px) {
    #contact-wrapper {
        padding: 0;
        padding-bottom: 50px;
        background-color: #f6b22a;
        background-image:url(../images/eagle.png),url(../images/contact-bg.jpg);
        background-size: auto,cover;
        background-repeat: no-repeat,no-repeat;
        background-position: left 90%,right center;
    }

    #contact-wrapper .form-wrapper {
        max-width: 90%;
        margin: 0 auto; 
    }

    #contact-wrapper p.disc-text {
        font-size: 20px;
        padding: 0;
        padding-bottom: 40px;
    }

    #contact-wrapper .grid-container {
    
    }

    #contact-wrapper h2 {
        padding: 40px 0;
        padding-bottom: 0;
        margin-bottom: 10px;
    }

    #contact-wrapper .input-wrapper label {
        padding: 0;
        font-size: 18px;
        left: 20px;
        top: 20px;
    }

    #contact-wrapper .input-wrapper input[type="tel"],
    #contact-wrapper .input-wrapper input[type="text"],
    #contact-wrapper .input-wrapper input[type="email"],
    #contact-wrapper .input-wrapper textarea {
        height: 90px;
        font-size: 20px;
        padding-left: 20px;
        padding-top: 40px;
    }

    #contact-wrapper .input-wrapper textarea {
        height: 178px;
        resize: none;
    }

    #contact-wrapper .primary-button[type="submit"] {
        width: 100%;
        max-width: 500px;
        cursor: pointer;
        margin-top: 35px;
    }
}

@media(min-width: 1200px) {
    #contact-wrapper p.disc-text {
        font-size: 24px;
    }
    #contact-wrapper .form-wrapper {
        max-width: 1200px;
    }
}

@media(min-width: 1920px) {
    #contact-wrapper {
        margin: 0 auto;
    }
}
