/* Fonts */
@import url(https://fonts.googleapis.com/css?family=Arimo);

/* 4 different RPU font sizes
 * 40px - large Titles
 * 20px - Main/sidenav links
 * 18px - Body/content
 * 15px - Mini Links
 * 
 * h1 - 40px
 * h2 - 20px
 * h3 - 30px
 * h4 - 18px
 */


body, html, main {
	/* important */
	height: 100%;
}
 
.cd-fixed-bg {
	background-size: cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: center center;
}
/* colorful gradient 
.cd-fixed-bg.cd-bg-1 {
    background-image: 
    linear-gradient(
      rgb(22,160,133), 
      rgba(22,160,133, 0.45)
    ),
    url("../../images/closeup-roadpipes.jpg");
} 
*/
.cd-fixed-bg.cd-bg-1 {
    background-image: 
    url("../../images/carousel-sprinkler.jpg");
	border-top: 10px solid #fff;
	border-bottom: 10px solid #fff;
}
.cd-fixed-bg.cd-bg-2 {
    background-image: 
    linear-gradient(
      rgb(52,73,94), 
      rgba(52,73,94, 0.45)
    ),
    url("../../images/utility-bg-powerlines.jpg");
}
.cd-fixed-bg.cd-bg-3 {
    background-image: 
    linear-gradient(
      rgb(52,73,94), 
      rgba(52,73,94, 0.45)
    ),
    url("../../images/cfl-lightbulbs.jpg")
}
.cd-fixed-bg.cd-bg-4 {
    background-image: 
    linear-gradient(
      rgb(52,73,94), 
      rgba(52,73,94, 0.45)
    ),
    url("../../images/water-tanks.jpg");
}
.cd-fixed-bg.cd-bg-5 {
    background-image: 
      linear-gradient(   
      rgb(52,73,94),      
      rgba(142,68,173, 0.45)     
      ),     
    url("../../images/bw-smokestacks.jpg");
}
.cd-fixed-bg.cd-bg-6 {
    background-image: 
    url("../../images/carousel-flowers.jpg");
}
.cd-fixed-bg.cd-bg-7 {
    background-image: 
    linear-gradient(
      rgb(52,73,94), 
      rgba(52,73,94, 0.45)
    ),
    url("../../images/utility-bg-light.jpg");
}
.cd-fixed-bg.cd-bg-8 {
    background-image: url("../../images/utility-bg-mountains.jpg");
	border-top: 10px solid #fff;
	border-bottom: 10px solid #fff;
}


/* ----------- Overall Template - Header Styles ----------- */
body {
  font-family: 'Arimo', sans-serif;
}
::-moz-selection { /* Code for Firefox */
    background: #e0b33f;
    color: #fff;
}
::selection {
    background: #e0b33f;
    color: #fff;
}
a:not(.dropbtn) {
  color: #cca134;
  -webkit-transition: all 300ms ease-in;
  -moz-transition: all 300ms ease-in;
  -o-transition: all 300ms ease-in;
  -ms-transition: all 300ms ease-in;
  transition: all 300ms ease-in;
}
a:hover,
a:active,
a:hover,
a:focus {
  text-decoration: none;
  color: #002856;
}

.top-buffer {
  margin-top:50px;
  }
.bottom-buffer {
  margin-bottom: 100px;
}

/* RPU Styles */
.department-bar {
  display: block;
  background: #e0b33f;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 8px;
  padding: 2px 15px;
  font-size: 14px;
}
.logo {
  margin-bottom: -61px;
  margin-top: 30px;
  width: 178px;
}
.minilink {
    padding-right: 10px;
}
.socialm {
    position: relative;
    top: 14px;
    font-size: 14px;
    color: #cca134;
}
.socialm i {
    padding-left: 10px;
    display: inline-block;
    position: relative;
    margin-top: 16px;
}
.green-link:hover {
  color: #5cb85c !important;
}

/* Notch-nav (main navigation with triangle current state marker) */
.notch-nav .pull-right {
    margin-top: 34px;
}
.dropbtn {
    color: #fff;
    padding: 20px;
    font-size: 20px !important;
    border: none;
    cursor: pointer;
    position: static;
    z-index: 8;
}
.dropdown {
    position: static;
    display: inline-block
}
.dropdown-content {
    display: none;
    position: absolute;
    z-index: 999999996;
    background-color: #eee;
    min-width: 220px;
    max-width: 275px;
    box-shadow: 8px 8px 0 rgba(0, 0, 0, .2);
    -moz-box-shadow: 8px 8px 0px rgba(0,0,0,0.2);
    box-shadow: 8px 8px 0px rgba(0,0,0,0.2);
    padding-top: 15px;
    padding-bottom: 15px;
    padding-right: 15px;
    margin-top: -15px;
    margin-left: 0;
    /* left: 0; */
    /* z-index: -1; */
}
.dropdown-content a {
    padding: 5px 0px!important;
    margin-left: 20px !important;
}
.dropdown-content a:hover {
    /* background-color:#f1f1f1 */
}
.dropdown:hover .dropdown-content {
    display: block;
}


@media only screen and (max-width: 1445px) {
    .last {
        -webkit-box-shadow: -8px 8px 0px rgba(0,0,0,0.2);
        -moz-box-shadow: -8px 8px 0px rgba(0,0,0,0.2);
        box-shadow: -8px 8px 0px rgba(0,0,0,0.2);
        margin-top: -15px;
        margin-left: -80px;
        text-align: right;
    }
}

.last a {
    padding: 5px 0px!important;
    margin-left: 20px !important;
}
.last a:hover {
    /* background-color:#f1f1f1 */
}
.dropdown-content .last {
    display: block;
}



.dropdown:hover .dropbtn {
    box-shadow: 8px 8px 0 rgba(0, 0, 0, 0);
    background-color: #eee;
}


/* notched navigation & fullwidth-header bg's */
.notch-nav {
    overflow: hidden;
    background: #fff;
    margin-top: -47px;
    list-style: none;
    margin-bottom: 0;
}

@media only screen and (max-width: 991px) {
	.notch-nav {
	    margin-top: 10px;
	}
}


.notch-nav li {
    float: left;
    margin-top: 33px;
    /* adjust this line to push entire notch nav down and away from minilinks */
}
.notch-nav a {
    display: block;
    margin-left: 0;
    color: #cca134;
    text-decoration: none;
    font-size: 18px;
    padding-bottom: 26px;
}
.notch-nav a:hover {
    text-decoration: none;
    color: #002856;
}

.notch-nav .current .dropdown:hover .dropbtn:before,
.notch-nav .current .dropdown:hover .dropbtn:after {
    display: none
}
.notch-nav .current .dropdown-content a:before,
.notch-nav .current .dropdown-content a:after {
    display: none
}
.notch-nav .current a {
    position: relative;
    text-decoration: none;
    z-index: 5;
}
.notch-nav .current a:before,
.notch-nav .current a:after {
    content: "";
    display: block;
    width: 26px;
    height: 26px;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -13px;
}


.fullwidth-header1,
.notch-nav.header1 .current a:before {
    background: url(../../images/fullwidth-header-sink.jpg) top left repeat fixed;
}
.fullwidth-header2,
.notch-nav.header2 .current a:before {
    background: url(../../images/fullwidth-header-businesses.jpg) top left repeat fixed;
}
.fullwidth-header3,
.notch-nav.header3 .current a:before {
    background: url(../../images/fullwidth-header-dig.jpg) top left repeat fixed;
}
.fullwidth-header4,
.notch-nav.header4 .current a:before {
    background: url(../../images/fullwidth-header-about-rpu2.jpg) -10px 0 repeat fixed;
}
.fullwidth-header5,
.notch-nav.header5 .current a:before {
    background: url(../../images/fullwidth-header-toy.jpg) -10px 0 repeat fixed;
}
.fullwidth-header6,
.notch-nav.header6 .current a:before {
    background: url(../../images/fullwidth-header-spanish.jpg) -10px 0 repeat fixed;
}
.fullwidth-header7,
.notch-nav.header7 .current a:before {
    background: url(../../images/fullwidth-header-solar.jpg) top left repeat fixed;
}
.fullwidth-header8,
.notch-nav.header8 .current a:before {
    background: url(../../images/fullwidth-header-lineman.jpg) -10px 0 repeat fixed;
}

.notch-nav .current a:after {
    border: 13px solid;
    border-color: #fff #fff transparent #fff;
}


.pull-right-extra {
  margin-right: -20px;
}

/* mobile department header - logo + main navigation + minilinks */
.minilink-mobile {
  float: left;
  margin-left: 15px;
  margin-right: 15px;
  margin-top: 5px;
  margin-bottom: 15px;
  font-size: 14px;
  color: #fff !important;
}

.minilink-mobile a:hover,
a:active,
a:hover,
a:focus {
  color: #002856 !important;
}

.minilink-mobile i {
  font-size: 18px !important;
}
.notch-mobile {
  background: #fff;
}
.notch-mobile a {
  font-size: 24px !important;
  text-transform: none !important;
  padding: 20px 15px !important;
  color: #cca134 !important;
}
.notch-mobile a:hover,
.notch-mobile a:active,
.notch-mobile a:focus {
  color: #002856 !important;
}
.last-leaf {
  margin-bottom: 10px !important;
  border-bottom: 15px solid #fff;
}
.notch-mobile img {
  display: block;
  margin-top: 15px;
  margin-bottom: 0;
}
.city-mobile {
  margin-top: 12px;
  margin-bottom: 5px;
  margin-left: 15px;
  margin-right: 15px;
  font-size: 18px;
  color: #fff;
}
@media only screen and (max-width: 767px) {
  .notch-nav {
    display: none;
  }
  .logo {
    display: none;
  }
  .socialm {
    display: none;
  }
}

/* fancy close-button */
.navIcon > * {
  width: 30px;
}

.navIcon {
  width: 30px;
  height: 20px;
  cursor: pointer;
  margin-top: 5px;
}

.naviconUpper {
  display: block;
  background: #fff;
  width: 100%;
  height: 2px;
  cursor: pointer;
  transition: all 0.2s;
}

.innerNavicon {
  margin-top: 5px;
  border-top: 2px solid #fff;
  cursor: pointer;
  transition: all 0.3s;
}

.naviconLower {
  border-bottom: 2px solid #fff;
  cursor: pointer;
  transition: all 0.3s;
  margin-top: 5px;
}

.naviconUpper.on {
  transform:
    rotate(360deg);
  border-top: 3px solid #fff;
  
  opacity: 0;
}

.innerNavicon.on {
  transform: rotate(45deg);
  border-top: 2px solid #fff;
}

.naviconLower.on {
  transform: translateY(-8px) rotate(-45deg);
  border-bottom: 2px solid #fff;
}

/* main-header */
.main-header-container {
  margin: 0 auto;
  display: flex;
  /* flex-direction: column; */
  justify-content: center;
}
.main-header-container > .main-header {
  display: block !important;
  width: 590px;
  padding: 30px;
  margin: 60px 0;
  background: #fff;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .main-header-container > .main-header {
    width: 100%;
    padding: 15px;
    margin-left: 15px;
    margin-right: 15px;
  }
}

/* Inside Page styles */
.sidenav {
  border-right: 1px solid #e0b33f;
  margin-bottom: 60px;
}
.sidenav h4 {
  padding: 5px 0;
}
.sidenav .list-group {
  margin-top: 0;
  margin-bottom: 5px;
}
.sidenav .portal {
  display: block;
  padding-bottom: 14px;
  font-size: 18px;
  border-bottom: 1px solid #e0b33f;
}
.sidenav .landing {
  display: block;
  padding: 8px 0;
}
.sidenav .top-buffer {
  margin-top: 10px;
  }
  
.sidenav .landing i {
  float: right;
  margin-right: 15px;
  font-size: 18px;
  margin-top: 4px;
}
.target-blank i {
  float: right !important;
  margin-right: 15px !important;
  font-size: 14px !important;
  margin-top: 6px !important;
}
.external i {
  float: right;
  font-size: 14px;
  margin-top: 6px;

}
.iconpanel {
  margin-bottom: 100px;
}
.circle {
	border-radius: 50%;
	margin: auto;
	width: 130px;
	height: 130px;
	/* width and height can be anything, as long as they're equal */
	-webkit-transition: all 300ms ease-in;
	-moz-transition: all 300ms ease-in;
	-o-transition: all 300ms ease-in;
	-ms-transition: all 300ms ease-in;
	transition: all 300ms ease-in;
	background: transparent;
}
.panel-default .panel-heading:hover .circle {
    background: #eee;
}
.panel-default > .panel-heading i {
  margin-top: 25px;
}
.panel-gray {
  display: block;
  padding: 15px;
  background: #eee;
}

.side-panel {
  padding: 15px;
  background-color: #eee;
}
.side-container img {width: 100%;border-top: 15px solid #eee;height: 100%;}
.news-subtitle {
	color: #999;
	margin-bottom: 0;
}

/* Footer styles */
footer {
  background: #002856;
  color: #fff;
  margin-top: -1px;
  padding-top: 50px;
  padding-bottom: 50px;
}
footer h2 {
  font-size: 20px;
  text-transform: uppercase;
  letter-spacing: 4px;
  margin-bottom: 30px;
}
footer ul {
  list-style: none;
  padding-left: 0;
}
footer a {
  color: #fff !important;
    -webkit-transition: all 300ms ease-in;
    -moz-transition: all 300ms ease-in;
    -o-transition: all 300ms ease-in;
    -ms-transition: all 300ms ease-in;
    transition: all 300ms ease-in;
    background: transparent;
}
footer a:hover {
  color: #e0b33f !important;
}
@media only screen and (max-width: 991px) {
  .footerimg-desktop {
    margin-top: 90px;
  }
}
.space-left {
  margin-left: 15px;
}

/* utility 2.0 */
.cd-color-2 {
  background: #fff;
  margin-bottom: -20px;
}
.cd-color-3 {
  background: #2c3e50;
  margin-bottom: -20px;
}
.cd-color-4 {
  background: #3d3d3d;
  margin-bottom: -20px;
}
.cd-color-5 {
  background: #16a085;
  margin-bottom: -20px;
}
#jsfadein
{
  
}

#jsfadein DIV
{
    display: inline;
    margin:0; 
}
.hideme
{
    opacity:0;
}
.hideme img {
    padding-right:30px;
    padding-top:60px;
}
.beigebox-left {
  background: #eee;
  border-right: 5px solid #fff;
  position: relative;
}
.beigebox-right {
  background: #eee;
  border-left: 5px solid #fff;
}
.beigebox-left img {
  width: 60%;
  margin: auto;
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, 0);
  padding: 60px 0;
}
.beigebox-right img {
  width: 60%;
  margin: auto;
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, 0);
  padding: 60px 0;
}

@media only screen and (max-width: 991px) {
  .beigebox-left {
    border-right: 0;
    border-bottom: 5px solid #fff;
  }
  .beigebox-right {
    border: 0;
  }
}

.beigerow {
margin:0; 
text-align: center;
padding: 60px 0;
}

.beigebox-left h1, .beigebox-right h1 {
padding: 0 150px;
}
.beigebox-left p, .beigebox-right p {
padding: 0 150px;
}

.beigebox img {
  width: 80%;
  margin: auto;
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, 0);
  padding: 60px 0;
}

.feedback {
display: block;
height: 55px;
width: 208px;
position: fixed;
right: -208px;
top: 200px;
background: #333;
color: #fff;
z-index: 9999999999999999999999999999999999;
transform: rotate(90deg);
transform-origin: left top 0;
padding: 15px;
text-align: center;
}

.feedback:hover {
background: #555;
cursor: pointer;
}

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 999; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
    background-color: #fefefe;
    margin: auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
}

/* The Close Button */
.close {
    color: #aaaaaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

blockquote {
  /* background: #eee; */
  border-left: 5px solid #ccc;
  margin: 1.5em 10px;
  padding: 0.5em 10px;
  quotes: "\201C""\201D""\2018""\2019";
}
blockquote:before {
  color: #ccc;
  content: open-quote;
  font-size: 4em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.4em;
}
blockquote p {
  display: inline;
}


/* Rebates */
/* TEMPORARILY (POSSIBLY PERMANENTLY) MADE YELLOW! :) */
.greenbar {
  display: block;
  width: 100%;
  height: 15px;
  background: #e0b33f !important;
}
.greenbar-logos {
  display: block;
  width: 100%;
  padding: 25px;
  background: #e0b33f !important;
}

/* Index card/thumbnail */
.thumbnail {
  float: left;
  padding-right: 10px;
  padding-left: 0;
  padding-bottom: 0;
  padding-top: 0;
  border: 0;
  margin-bottom: 0;
          border-radius: 0;
}
.indexcard {
  border: 1px solid #333;
  padding: 15px;
}




/* Green stuff */
.greenbox {
  background: #469936;
  text-align: center;
  color: #fff;
  padding: 30px 0;
  margin: 0 50px;
  -webkit-transition: all 300ms ease-in;
  -moz-transition: all 300ms ease-in;
  -o-transition: all 300ms ease-in;
  -ms-transition: all 300ms ease-in;
  transition: all 300ms ease-in;
}
.greenbox:hover {
  background: #002856;
  cursor: pointer;
}
.greenbox-arrow-down {
	width:0px; 
	height:0px; 
	border-left:20px solid transparent;
	border-right:20px solid transparent;
	border-top:20px solid #469936;
	margin: auto;
  -webkit-transition: all 300ms ease-in;
  -moz-transition: all 300ms ease-in;
  -o-transition: all 300ms ease-in;
  -ms-transition: all 300ms ease-in;
  transition: all 300ms ease-in;
}
.greenbox:hover ~ .greenbox-arrow-down {
	border-top:20px solid #002856;
}

@media only screen and (max-width: 1199px) {
  .greenbox {
	padding: 50px 0;
	margin: 0 20px;
  }
}
@media only screen and (max-width: 991px) {
  .greenbox {
	padding: 50px 0;
	margin: 0 200px;
  }
}
@media only screen and (max-width: 767px) {
  .greenbox {
	padding: 50px 0;
	margin: 0 50px;
  }
}

.title {
  margin: 1em auto;
  opacity: .99;
  padding-left: 60px;
  padding-right: 30px;
  width: 100%;
}

.title > span {
  background: #469936;
  /*border-radius: 2em;*/
  box-shadow: -.5em -.5em 0 #469936,
    .5em -.5em 0 #469936,
    -.5em .5em 0 #469936,
    .5em .5em 0 #469936;
}

/* fixed: no need for text-shadow with an extra element */
.title > span > span {
  color: #fff;
  position: relative;
}

.sustainability-btn {
  padding-left: 48px;
}
@media only screen and (max-width: 600px) {
  .sustainability-btn {
    padding-left: 52px;
  }
}



/* Twitter UI */
.tweet-row {
  background: #4099FF;
  margin: 0;
}
.tweet-bird {
  background: #4099FF;
  color: #fff;
  /* height: 100px; */
  /* padding-top: 20px; */
  /* padding-left: 15px; */
  width: 100%;
  text-align: center;
  font-size: 30px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.tweet {
  background: #fff;
  height: 100%;
  padding: 20px;
  border-left: 4px solid #4099FF;
  border-right: 4px solid #4099FF;
  width: 100%;
}
.tweet-bird-bottom {
  background: #4099FF;
  color: #fff;
  /* height: 100px; */
  /* padding-top: 20px; */
  /* padding-left: 15px; */
  width: 100%;
  text-align: center;
  font-size: 30px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

/* YouTube UI */
.yt-row {
  background: #cd201f;
  margin: 0;
}
.yt-vidicon {
  background: #cd201f;
  color: #fff;
  /* height: 100px; */
  /* padding-top: 20px; */
  /* padding-left: 15px; */
  width: 100%;
  text-align: center;
  font-size: 30px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.yt {
  background: #fff;
  height: 100%;
  padding: 20px;
  border-left: 4px solid #cd201f;
  border-right: 4px solid #cd201f;
  width: 100%;
}
.yt-vid-bottom {
  background: #cd201f;
  color: #fff;
  /* height: 100px; */
  /* padding-top: 20px; */
  /* padding-left: 15px; */
  width: 100%;
  text-align: center;
  font-size: 30px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

/* Instagram UI */
.instagram-icon {
  background: -webkit-radial-gradient(circle farthest-corner at 35% 90%, #fec564, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(circle farthest-corner at 0 140%, #fec564, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, rgba(0, 0, 0, 0)), -webkit-linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
  background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, rgba(0, 0, 0, 0) 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, rgba(0, 0, 0, 0)), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
  color: #fff;
  /* height: 100px; */
  /* padding-top: 20px; */
  /* padding-left: 15px; */
  width: 100%;
  text-align: center;
  font-size: 30px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.instagram-pic {
  background: #fff;
  height: 100%;
  padding: 20px;
  border-left: 4px solid #fec564;
  border-right: 4px solid #d9317a;
  width: 100%;
}
.instagram-bottom {
  background: -webkit-radial-gradient(circle farthest-corner at 35% 90%, #fec564, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(circle farthest-corner at 0 140%, #fec564, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, rgba(0, 0, 0, 0)), -webkit-linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
  background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, rgba(0, 0, 0, 0) 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, rgba(0, 0, 0, 0)), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
  color: #fff;
  /* height: 100px; */
  /* padding-top: 20px; */
  /* padding-left: 15px; */
  width: 100%;
  text-align: center;
  font-size: 30px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}





.whitebox {
display: block; 
background: #fff; 
padding: 60px; 
color: #000; 
height:465px;
}

@media only screen and (max-width: 600px) {
.whitebox {
display: block; 
background: #fff; 
padding: 60px; 
color: #000; 
height:100%;
}
}


/* GREEN BOXES ON REBATES PAGE (NOW YELLOW!) - all with overwrites to ensure override of possible CSS on page itself! */

.greenbox {
  background: #e0b33f !important;
  text-align: center !important;
  color: #fff !important;
  padding: 30px 0 !important;
  margin: 0 50px !important;
  -webkit-transition: all 300ms ease-in !important;
  -moz-transition: all 300ms ease-in !important;
  -o-transition: all 300ms ease-in !important;
  -ms-transition: all 300ms ease-in !important;
  transition: all 300ms ease-in !important;
}
.greenbox:hover {
  background: #002856 !important;
  cursor: pointer !important;
}
.greenbox-arrow-down {
	width:0px !important; 
	height:0px !important; 
	border-left:20px solid transparent !important;
	border-right:20px solid transparent !important;
	border-top:20px solid #e0b33f !important; /* SO HARD TO FIND THIS HEX CODE, BUT HERE'S THE LITTLE TRIANGLE ATTACHED TO BOX ;) */
	margin: auto !important;
  -webkit-transition: all 300ms ease-in !important;
  -moz-transition: all 300ms ease-in !important;
  -o-transition: all 300ms ease-in !important;
  -ms-transition: all 300ms ease-in !important;
  transition: all 300ms ease-in !important;
}
.greenbox:hover ~ .greenbox-arrow-down {
	border-top:20px solid #002856 !important;
}

@media only screen and (max-width: 1199px) {
  .greenbox {
	padding: 50px 0 !important;
	margin: 0 20px !important;
  }
}
@media only screen and (max-width: 991px) {
  .greenbox {
	padding: 50px 0 !important;
	margin: 0 200px !important;
  }
}
@media only screen and (max-width: 767px) {
  .greenbox {
	padding: 50px 0 !important;
	margin: 0 50px !important;
  }
}