/*

My Custom CSS
=============


*/

.cmi-number {background-color: #474a3f; margin: 0px 3px; margin-bottom: 20px; }

.gray-btn-rsrc {

  padding: 0px;
  margin: 0px;
}

.gray-btn {
  width: 343px; 
  height: 70px; 
  display: table-cell;
  background-color: #c7c8ca; 
  text-align: center; 
  vertical-align: middle;
  line-height: 1.2;
  padding: 10px 70px; 
  font-size: 16px;
  letter-spacing: 2px;
  font-weight: bold;

}

.custom-border {

  -webkit-border-radius: 7px;
-webkit-border-top-left-radius: 1px;
-webkit-border-bottom-right-radius: 1px;
-moz-border-radius: 7px;
-moz-border-radius-topleft: 1px;
-moz-border-radius-bottomright: 1px;
border-radius: 7px;
border-top-left-radius: 1px;
border-bottom-right-radius: 1px;

}
/* --------------------------------------
   Layout
   -------------------------------------- */


.top-nav-container {position: relative;}

.contact-link-top {position: absolute; bottom: 30px; right: 35px;}

body {font-family: 'Montserrat', sans-serif; -webkit-font-smoothing: antialiased;
   text-rendering: optimizelegibility;}



.navbar-inverse { background-color: transparent; margin-bottom: 0px;}
.navbar-inverse .navbar-nav>.active>a:hover,.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus { background-color: transparent;}
.navbar-inverse .navbar-nav>.active>a,.navbar-inverse .navbar-nav>.open>a,.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:hover,.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:hover, .navbar-inverse .navbar-nav>.open>a:focus { background-color: transparent;}
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus { background-color: transparent;}
.navbar-inverse { background-image: none; }
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus { background-image: none; }
.navbar-inverse { border-color: #080808}
.navbar-inverse .navbar-nav>li>a { color: #000000}
.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus { color: #006B64}
.navbar-inverse .navbar-nav>.active>a,.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:hover, .navbar-inverse .navbar-nav>.open>a:focus { color: #006B64}
.navbar-inverse .navbar-nav>.active>a:hover, .navbar-inverse .navbar-nav>.active>a:focus {}
.navbar-default {border: none; border-radius: 0px;}
.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:focus, .navbar-inverse .navbar-nav > .active > a:hover {color: #006B64; background-color: transparent;}
ul.nav.navbar-nav {margin-left: 0px; font-size: 18px; margin-top: 15px; letter-spacing: 1px;}
.navbar-default .navbar-toggle .icon-bar {
    background-color: black;
}

.navbar-logo img {margin: 30px 0px; margin-left: 5px; margin-bottom: 10px;}


#myCarousel { margin: 10px auto;}

#myCarousel img {width: 100%; height: 100%;}


.link-box {
  margin: 0px auto; 
  color: #ffffff; 
  text-transform: uppercase;
  font-size: 18px;
}

.link-box:hover {color: #006B64; }


.btns-wrap {margin-left: 0px; margin-right: -6px; margin-bottom: 10px;}

.no-gutter > [class*='col-'] {
    padding-right:0px;
    padding-left:0px;
}

.cmi-number form {padding: 20px; padding-bottom: 10px;}
.cmi-number label {
  color: #ffffff; 
  text-transform: uppercase; 
  font-size: 24px; 
  font-weight: bold;
  padding-left: 10px;
  padding-right: 10px;
  letter-spacing: 2px;
}

.carousel-caption {top: 50%;
  transform: translateY(-50%);}

  .carousel-caption h1 {font-size: 50px; font-weight: 200; }

.cmi-number i {color: #d18f6f; }


.input-cmi-1 {width: 150px !important; margin-bottom: 10px;}
.input-cmi-2 {width: 60px !important; margin-bottom: 10px;}
.input-cmi-3 {width: 110px !important; margin-bottom: 10px;}
.btn-orange {background-color: #d18f6f; color: #FFFFFF; padding: 6px 40px; margin-bottom: 10px; margin-left: 30px; text-transform: uppercase;}
.btn-orange:hover {color: #000000;}
.cmi-number .form-control {border-radius: 14px;}
#about-heading-wrap {position: relative;}
#about-heading-wrap img {margin-right: 20px; position: absolute; top: 45px; left: 20px;}
.section-heading {display: inline-block; letter-spacing: 2px; font-size: 55px; margin-left: 110px; font-weight: 300; margin-bottom: 40px; margin-top: 40px;}
.section-heading-bill {display: inline-block; letter-spacing: 2px; font-size: 52px; margin-left: 110px; font-weight: 300; margin-bottom: 20px; margin-top: 25px;}

.about-row {margin-bottom: 50px;}
.about-row h2 {margin-top: 0px; letter-spacing: 1px;}
.about-row p {margin-right: 30px; margin-bottom: 20px; padding-left: 10px; text-align: justify; text-justify: inter-word;}
.vertical-divider {float: left; margin-right: 20px;}

.help-form-wrap input {border-radius: 14px;}

#need-help-container {
  background-color: #007069;
}

#help-heading-wrap {position: relative;}
#help-heading-wrap img {margin-right: 20px; position: absolute; top: 48px; left: 30px;}

#need-help-container h1 {color: #FFFFFF;}
.need-help-row {color: #ffffff; margin-bottom: 50px;}
.need-help-row p {margin-right: 30px; margin-bottom: 20px; padding-left: 10px; text-align: justify; text-justify: inter-word;}
.need-help-row a {color: #FFFFFF;}

#inputMessage {max-width: 99%; border-radius: 14px;}
.btn-white {color: #007069; background-color: #FFFFFF; padding: 10px 50px; margin-left: 20px; margin-top: 15px; border-radius: 12px; text-transform: uppercase; font-weight: bold;}
.btn-white:hover {color: #000000;}
#bill-res-container { background-color: #b5c199;}
#bill-res-container h1 {color: #FFFFFF;}

.billres-heading-wrap {position: relative;}
.billres-heading-wrap img {margin-right: 20px; position: absolute; top: 30px; left: 30px;}
.bill-res-row {margin-bottom: 50px;}
.bill-res-row p {margin-right: 30px; margin-bottom: 20px; padding-left: 10px; color: #000000; text-align: justify; text-justify: inter-word;}
.bill-res-row h4 {text-transform: uppercase; color: #000000; margin-left: 15px; letter-spacing: 2px; font-weight: bold;}
.bill-res-row form.form-inline {margin-left: 30px;}
.bill-res-row input {border-radius: 14px;}
.bill-res-row label {color: #FFFFFF; padding: 0px 5px;}
.btn-transparent {
  color: #FFFFFF; 
  background-color: transparent; 
  padding: 10px 50px; 
  margin-top: 15px;
  border-radius: 12px; 
  text-transform: uppercase; 
  font-weight: bold;
  border: 2px solid #FFFFFF;

}
.btn-transparent:hover {color: #FFFFFF;}

.btn-transparent-b {
  color: #000000; 
  background-color: transparent; 
  padding: 10px 42px; 
  margin-left: 0px;
  margin-top: 15px;
  border-radius: 12px; 
  text-transform: uppercase; 
  font-weight: bold;
  border: 2px solid #000000;

}
.btn-transparent-b:hover {color: #FFFFFF;}

.bill-res-row h2 {color:#333; letter-spacing: 1px; text-align: justify; text-justify: inter-word;}

.useful-links {list-style: none; padding-left: 3px}
.useful-links a {color: #000000;  font-size: 12px;}
.useful-links li {padding-left: 0px;}

#cminumber1 {width: 150px;}
#cminumber2 {width: 50px;}
#cminumber3 {width: 100px;}

#faqs-container {background-color: #e7e7e8;}
.faqs-heading-wrap {position: relative;}
.faqs-heading-wrap img {margin-right: 20px; position: absolute; top: 48px; left: 30px;}
.faqs-row {margin: 5px; margin-bottom: 35px;}

.faqs-row p {margin-right: 30px; margin-bottom: 20px; padding-left: 10px; color: #000000; text-align: justify; text-justify: inter-word;}

.p-question {font-weight: bold; margin-bottom: 5px; padding-left: 25px; margin-right: 20px;}
.p-answer {padding-left: 25px; margin-bottom: 20px; margin-right: 20px;}
.qu-dot { float: left; margin-right: 5px;}
.a-dot { float: left; margin-right: 5px;}


.resources-heading-wrap {position: relative;}
.resources-heading-wrap img {margin-right: 20px; position: absolute; top: 40px; left: 28px;}
.resources-row {margin-bottom: 120px;}
.resources-row p {margin-right: 30px; margin-bottom: 20px; padding-left: 30px; text-align: justify; text-justify: inter-word;}

.above-footer {height: 10px; background-color: #d18f6f;}
.cmi-circle-logo {position: absolute; top: 0;}
.footer-nav {margin-left: 20px; margin-top: 20px; font-size: 16px; margin-bottom: 20px; background-color: transparent;}
.footer-nav a {color: #FFFFFF;}
.copyright {margin-left: 40px;}

footer {background-color: #474a3f; min-height: 220px; color: #FFFFFF;}

.icon-bar {color: black; background-color: black;}
.bill-res-single {background-color: #FFFFFF; color: #000000;}
.bill-res-single h2 {color: #333; font-weight: lighter; margin-bottom: 50px;}

.bill-res-single h3 {color: #7d7d7d; font-weight: lighter;  margin-left: 20px; margin-bottom: 50px;}

.account-summary-table {margin: 30px 5px; text-align: justify; text-justify: inter-word;}

p.small {text-align: justify; text-justify: inter-word;}

.btn-pay-bill {
  background-color: transparent; 
  border: 2px solid #14b37d;
  border-radius: 12px; 
  padding: 10px 45px;
  color: #14b37d;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: bold;
  margin-right: 20px;


}

.btn-pay-bill:hover {background-color: #14b37d; color: #FFFFFF;}

.entry-type {font-weight: bold; text-align: right; padding-left: 10px; padding-bottom: 15px;}
.entry-value {text-align: left; padding-left: 35px; padding-bottom: 15px;}
.payplan-cell {text-align: center; padding: 10px 25px;}
.price-value {color: #14b37d; font-weight: bold; font-size: 20px; }
.payment-text {color: #000000; margin-bottom: 20px; text-align: justify; text-justify: inter-word;}
.payment-text a {color: #000000; text-decoration: underline;}
.payment-text a:hover {color: #14b37d; text-decoration: none;}

.row-pay-bill {margin-bottom: 300px;}
.row-pay-bill p {margin-left: 50px;}

.btn-dropwdown {width: 300px; height: 28px; background-color: #c7c8ca; padding: 3px 10px; border-radius: 2px; }

div.btn-group button.btn.dropdown-toggle {
  position: absolute; left: -29px;
  padding: 3px 10px; 
  background-color: #939598;
  border-radius: 2px;
}

 .btn-group-custom {margin-left: 130px; margin-bottom: 50px;}


.update-contact {margin-top: 60px;}

.update-contact .form-control {border-radius: 0px; height: 30px;}


#inputNotes {
  width: 100%; 
  border-top: 4px solid #c7c8ca;
  border-bottom: 4px solid #c7c8ca; 
  border-left: 1px solid #c7c8ca; 
  border-right: 1px solid #c7c8ca;

}

.account-nav {list-style: none; margin-top: 110px; line-height: 2.4; margin-left: 65px;text-align: justify; text-justify: inter-word;}
.account-nav a {color: #000000;}
.account-nav a:hover {color: #14b37d; text-decoration: none;}




fieldset {margin: 20px 15px;}
.row-pay-bill fieldset legend {font-size: 14px; font-weight: bold; border: none; color: #000000; margin-bottom: 35px;}
.request-paperwork label {font-weight: normal; font-size: 13px;}
.request-paperwork input {border-radius: 0px;}

.checkbox label {height: 30px; font-size: 13px;}
.checkbox-wrap {margin-left: 25px}

.paperwork-sent-by {margin-bottom: 40px}


.schedule-future-payments h4 {font-weight: bold; margin: 20px;}
.radio-future-payment {background-color: #e7e7e8; margin-left: 20px; padding: 10px; margin-bottom: 20px;}
.radio-future-payment label {margin-left: 10px; font-weight: bold; letter-spacing: 1px; font-size: }
.select-date  {background-color: #e7e7e8; margin-left: 20px; padding: 10px; padding-bottom: 20px; margin-bottom: 20px;}
/*==================================================
=            Bootstrap 3 Media Queries             =
==================================================*/

/*========== . Mobile First Method  ==========*/

/* Custom, iPhone Retina */ 
@media only screen and (min-width : 320px) {
    
}

/* Extra Small Devices, Phones */ 
@media only screen and (min-width : 480px) {

}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {


   .container-small {
        width: 300px;
    }
    .container-large {
        width: 970px;
    }

}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
   .container-small {
        width: 500px;
    }
    .container-large {
        width: 1170px;
    }




}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
   .container-small {
        width: 700px;
    }
    .container-large {
        width: 1500px;
    }
ul.nav.navbar-nav {margin-left: 5px; font-size: 19px; margin-top: 45px; letter-spacing: 2px;}

.gray-btn-rsrc {

  padding: 0px;
  margin: 0px;
}

.gray-btn {
  width: 373px; 
  height: 90px; 
  display: table-cell;
  background-color: #c7c8ca; 
  text-align: center; 
  vertical-align: middle;
  line-height: 1.2;
  padding: 20px 80px; 
  font-size: 17px;
  letter-spacing: 2px;
  font-weight: bold;

}

.contact-link-top {position: absolute; bottom: -10px; right: 15px;}



}


/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
.container {width: 100%;}
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {

}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
  .navbar-logo img {margin: 30px 0px; margin-left: 15px; }
  .section-heading {font-size: 40px;}
  .help-form-wrap .form-control {max-width: 81%;}
  #inputMessage {max-width: 85%;}
  .btn-white {margin-left: 55px;}
  .gray-btn {display: block; width: 100%; margin-bottom: 5px; padding: 2px; padding-top: 15px;}

  .input-cmi-1 {width: 100% !important;}
  .input-cmi-2 {width: 70% !important ;}
  .input-cmi-3 {width: 70% !important ;}
  .btn-orange {width: 100%; margin: 10px auto;}
  .btn-dropwdown {width: 250px;}
  .carousel-caption {top: 50%;
  transform: translateY(-50%);}

  .carousel-caption h1 {font-size: 28px; font-weight: 200; }

.contact-link-top {position: absolute; bottom: -10px; right: 35px;}
.cmi-circle-logo {position: absolute; top:-100px; right: 40px; width: 150px}


}

/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {

}

/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {
    
}

.container-small, .container-large {
    max-width: 100%;
}

#help-heading-wrap {position: relative;}
div#help-heading-wrap.row div.col-12 img{margin-right: 20px; position: absolute; top: 48px; left: 30px;}
#siteseal > img {margin: 25px;}