/***********************
Big Red Rooster 

RHEEM WEBSITE REDESIGN 
                                                
AUTHOR: Sabrina Azad 
***********************/
body {
  font-family: "Roboto", sans-serif; }
  body img {
    max-width: 100%; }
  body #section-1 {
    background: url(https://media.ruud.com/site/ruuddotcom/_WP/img/triton-20180226/section-1-bg-1.png) no-repeat center bottom;
    display: block;
    position: relative;
    color: white; }
    body #section-1 .wrapper {
      padding: 120px 0; }
      body #section-1 .wrapper .triton_logo {
        padding-bottom: 15px; }
        
.rh-triton-container h4 { font-size: 2.2rem; line-height: 2.4rem; }

.rh-triton-container h5 { font-size: 2rem; line-height: 2.2rem; }

.rh-triton-container p , .rh-triton-container .btn { font-size: 1.8rem; line-height: 2.0rem; }

.rh-triton-container .table th , .rh-triton-container .table td { font-size: 1.8rem; line-height: 2.0rem; }

  #stickynav-sticky-wrapper { position: relative; margin: 0; width: 100%; }
  
  .stickynav {
    position: relative;
    z-index: 999; }
    
    .stickynav ul {
      list-style: none;
      margin: 0;
      padding: 0;
      text-align: center;
      width: 100%;
      display: table;
      table-layout: fixed; }
      .stickynav ul li {
        display: table-cell;
        padding: 13px 0;
        background-color: #505759;
        border-right: 1px solid #fff; }
        .stickynav ul li a {
          line-height: 2rem;
          display: block;
          text-align: center;
          color: #fff;
          text-decoration: none;
          font-size: 1.8rem; }
          .stickynav ul li a:hover {
            text-decoration: none; }
        .stickynav ul li:hover {
          /* opacity: .8; */ background-color: #3b4345; }
        .stickynav ul li:last-child {
          background-color: #8a0e03;
          border-right: none; }
  .is-sticky .stickynav {
    z-index: 999 !important;/* left: 201px; */ }
    
    .stickynav .dropdown-menu { width: 100%; }
    
    .stickynav .dropdown-menu a { width: 100%;
    text-align: left; color: #505759; }
    .stickynav .dropdown-menu a:hover {  }
    
  body #section-2 {
    background: url(https://media.ruud.com/site/ruuddotcom/_WP/img/triton-20180226/section-1-bg-2.png) repeat center bottom;
    display: block;
    position: relative;
    height: auto; }
    @media only screen and (min-width: 768px) {
      body #section-2 {
        background-repeat: no-repeat; } }
    body #section-2 .sec-1-feature {
      position: relative;
      display: block;
      margin: 0 auto; }
      @media only screen and (min-width: 768px) {
        body #section-2 .sec-1-feature {
          position: absolute;
          right: 0;
          bottom: 65px;
          z-index: 2; } }
    body #section-2 .wrapper {
      padding: 100px 15px; }
      body #section-2 .wrapper h4 {
        color: #007681; }
      body #section-2 .wrapper .feature-btn {
        background-color: #007681;
        color: #fff;
        padding: 15px 60px;
        margin-top: 15px; }
  body #section-3 .sec-1-feature {
    display: block;
    margin: 0 auto; }
  body #section-3 .sec-1-feature-vid {
    display: block;
    margin: 0 auto; }
  body #section-3 #video {
    display: none; }
  body #section-3 .triton-keys {
    padding-top: 50px; }
    body #section-3 .triton-keys h4 {
      color: #007681; }
    body #section-3 .triton-keys .card {
      margin: 25px 0; }
      body #section-3 .triton-keys .card p {
        transition: opacity 1s ease-out;
        opacity: 0;
        height: 0;
        overflow: hidden;
        margin-bottom: 0; }
      body #section-3 .triton-keys .card h5 {
        color: #007681; }
      body #section-3 .triton-keys .card .left-side {
        display: table-cell;
        vertical-align: middle;
        width: 10%; }
      body #section-3 .triton-keys .card .right-side {
        display: table-cell;
        vertical-align: middle;
        width: 85%;
        padding-left: 3%; }
      body #section-3 .triton-keys .card:hover {
        background-color: #b1b3b3;
        border: 1px solid #000;
        cursor: pointer; }
    body #section-3 .triton-keys .active {
      background-color: #b1b3b3;
      border: 1px solid #000; }
      body #section-3 .triton-keys .active p {
        opacity: 1;
        height: auto; }
  body #section-4 {
    background: url(https://media.ruud.com/site/ruuddotcom/_WP/img/triton-20180226/section-4-bg.png) repeat center top;
    display: block;
    position: relative; }
    body #section-4 .wrapper {
      padding: 120px 0;
      margin: 0 auto; }
      body #section-4 .wrapper h2 {
        color: #007681;
        text-align: center;
        padding-bottom: 25px; }
      body #section-4 .wrapper table {
        color: white;
        background-color: white; }
        body #section-4 .wrapper table tr {
          width: 100%; }
          body #section-4 .wrapper table tr th {
            color: #505759;
            border: 1px solid #000;
            padding: 15px; }
          body #section-4 .wrapper table tr td {
            border: 1px solid #000;
            padding: 15px; }

.key-components {position: relative;width: 299px;height: 747px; background: url(https://media.ruud.com/site/ruuddotcom/_WP/img/triton-20180226/section-2-feature.png) top left no-repeat; background-size: contain; margin: 0 auto; margin: 0 auto; }

.modal { z-index: 1030!important; padding-top: 80px; }
.modal-backdrop { 	display: none; z-index: 1020!important; opacity: .8; }
/*# -sourceMappingURL=ruud_triton.css.map */

	.navbar-nav {display: block!important;}
	.banner-block {display: none!important;}
	.breadcrumbs {display: none!important;}
	.main-holder {padding: 0!important;}
.feature-display { position: relative; width: 299px; height: 747px; }

@-webkit-keyframes lds-ripple {
 0% {
     top: 50px;
     left: 50px;
     width: 0;
     height: 0;
     opacity: 1;
   }
   100% {
     top: 15px;
     left: 15px;
     width: 50px;
     height: 50px;
     opacity: 0;
   }
 }
 @keyframes lds-ripple {
   0% {
     top: 50px;
     left: 50px;
     width: 0;
     height: 0;
     opacity: 1;
   }
   100% {
     top: 15px;
     left: 15px;
     width: 50px;
     height: 50px;
     opacity: 0;
   }
 }
.lds-ripple {
  position: relative;
}
.lds-ripple div {
  box-sizing: content-box;
  position: absolute;
  border-width: 4px;
  border-style: solid;
  opacity: 0.8;
  border-radius: 50%;
  -webkit-animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
  animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}
.lds-ripple div:nth-child(1) {
  border-color: #E4002B;
}
.lds-ripple div:nth-child(2) {
  border-color: #E4002B;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}

.feature-display {
	position: relative; width: 300px; height: 649px;
}

.display-hide {	display: none; }

    /* contact modal */
    .ui-draggable .ui-dialog-titlebar{display: none;}
    .modalBackgroundforContactForm {position: fixed;left: 0px;top: 0px;z-index: 120; width: 100%;height: 100%;background:#000000;opacity: 0.7;display: none;}

    .pi-commercial-role-contact-modal .piContactFormClose {
        position: absolute;
        top: 0;
        right: 0;
        cursor: pointer;
    }

    .pi-contact-table td {
        padding: 2px;
        vertical-align: top;
    }

    .pi-contact-table .textfield-group {
        width: 100%;
        vertical-align: middle;
    }

    .pi-contact-table textarea {
        border: 1px solid #eee;
        width: 100%;
        vertical-align: middle;
    }

    .pi-inline-block { display: inline-block; }

    .pi-2-col { width: 47%; padding: 0 .6rem 0 0; vertical-align: top;  }

    .pi-3-col { width: 31%; padding: 0 .6rem 0 0; vertical-align: top; }

    .pi-select-list{ width: 96%; }

    .pi-block , .pi-displayblock {	display: block!important;}

    .pi-none { display: none; }

    .pi-align-center { text-align: center; }

    .pi-modal-steps h3 { text-align: left; margin-bottom: .4rem!important;}

    .pi-modal-steps .pi-2-col { width: 46%; padding-bottom: .4rem; }
    .pi-modal-steps .pi-2-col .btn-primary { width: 90%; }

    .pi-modal-steps .pi-2-col select { width: 100%; }

    .ui-widget-content .btn-primary { color: #fff; }

    .ui-widget-content .pi-btn-step1 { width: 90%; margin: 0 auto 8px auto; }

    /* .ui-widget-content .pi-btn-step1:hover { opacity: 1 } */

/*    .ui-widget-content h3 { color: #000; font-size: 1.0em; line-height: 1.6rem; }

    .pi-howitworks input[type="text"] { font-family: "Roboto", Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; border-radius: 5px; border: 1px solid #808084; padding: 4px; vertical-align: bottom; }

    .pi-distributor-results {	padding: 0 0 1rem 0; }

    .pi-distributor-results ul { display: inline-block; width: 48%; list-style-type: none; padding-left: 0; vertical-align: top; }

    .pi-distributor-btn-container {	padding-bottom: 20px; }

    #distributor-clear-results-modal { margin-bottom: 20px; }

    .pi-distributor-zip-code, #distributor-zip-search-modal { height: 30px;
        -webkit-border-radius:0px;
        -moz-border-radius:0px;
        border-radius:0px; }
    #distributor-zip-search-modal {
        font-size: 14px;
        padding-top: 7px;
    }

    .pi-coming-soon-1 { height: 24px; font-family: 'Roboto', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: 300; line-height: 1.42857; color: #333333; padding: 2px 0 0 0;}

    .pi-coming-soon-2 { height: 31px; } */

    .btn-primary{
        font-family: "Roboto", Helvetica, Arial, sans-serif;
        font-size: 14px;
        font-weight: normal;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        /* background-color: #EE3A43; */
        border: none!important;
        /* border-color: #EE3A43; */
        opacity: 1;
        color: #fff;
        text-transform: none;
    }

    .form-control{
        margin-bottom: 5px;
        -webkit-border-radius:0px;
        -moz-border-radius:0px;
        border-radius:0px;
    }

    #hybridgen4 #stickynav ul li a:hover{
        cursor: hand;
    }


.triton-form , .triton-form input , .triton-form select , .triton-form textarea { font-size: 1.8rem; line-height: 2.0rem; }

.triton-form .pull-right { text-align: right; }

.form-control, .btn {
border: 1px solid #ccc !important;
}
label .required{
    color: red;
}
form .row{
    margin: 10px;
}
label{
font-weight: normal;
margin-top:5px;
}

.triton-form textarea , 
.triton-form input[type=text] ,
.triton-form input[type=email] , 
.triton-form input[type=password] , 
.triton-form input[type=tel] , 
.triton-form input[type=search] , 
.triton-form input[type=url] , 
.triton-form input[type=number] {
    display: block;
    width: 100%;
    height: 34px!important;
    padding: 6px 12px!important;
    color: #4d585a;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc!important;
    border-radius: 0;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
		outline: none;
		box-shadow: none !important; }

.triton-form textarea { height: auto!important; }

.triton-form .btn {
    border: 1px solid #ccc !important; }
		
select.form-control:not([size]):not([multiple]) {
	height: 34px!important;
}

.rh-tritonModal { z-index: 2050; }

.rh-findDistributorContainer p , .rh-findDistributorContainer li { font-size: 1.6rem; line-height: 1.8rem; }

.rh-findDistributorContainer p { margin: 20px 0; }

 .rh-findDistributorContainer ul { padding-left: 0; list-style-type: none; }

.rh-findDistributorContainer .pi-distributor-zip-code { border: 1px solid #555; font-size: 1.4rem;
 padding:  .2rem; vertical-align:  middle; }
 
.rh-findDistributorContainer .btn { vertical-align:  middle; }