body{
  background-color: #B3D7E3;
  font-weight: 200;

}

/*###########################################################################
GENERAL
#############################################################################*/

.lineDivisionThick{
  border-bottom: 6px white solid;
  width: 100%;
}
.lineDivisionThin{
  border-bottom: 2px white solid;
  width: 100%;
}
.mobileshow{display:none;}


/*###########################################################################
TYPOGRAPHY
#############################################################################*/
html {
  font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
  font: normal 112.5%/1.65 serif; /* base font size 18px with 1.65 line-height */
}

body {
  color: #444444;
}

.ccm-page h1,
.ccm-page h2,
.ccm-page h3,
.ccm-page h4,
.ccm-page h5,
.ccm-page h6 {
  line-height: 1;
  margin-top: 0;
  text-rendering: optimizeLegibility; /*  voodoo to enable ligatures and kerning | https://developer.mozilla.org/en-US/docs/CSS/text-rendering */
  color: #347389;
}

.ccm-page h1 {
  font-size: 40px;
  margin-bottom: 8.91px;
  margin-bottom: 0.495rem;
  font-weight:bold;
  border-bottom: 1px solid gray;
  padding-bottom: 12px;
  margin-bottom: 18px!important;
}

.ccm-page h2 {
  font-size: 28px;
  margin-bottom: 11.1375px;
  margin-bottom: 0.61875rem;
}

.ccm-page h3 {
  font-size: 20px;
  margin-bottom: 14.85px;
  margin-bottom: 0.825rem;
}

.ccm-page h4 {
  font-size: 16px;
  margin-bottom: 22.275px;
  margin-bottom: 1.2375rem;
  font-weight:bold;
}

.ccm-page h5 {
  font-size: 14px;
  margin-bottom: 25.45714px;
  margin-bottom: 1.41429rem;
    font-weight:bold;
}

.ccm-page h6 {
  font-size: 14px;
  margin-bottom: 29.7px;
  margin-bottom: 1.65rem;
    font-weight:bold;
}

.btn-blue {background-color: #347389; padding: 15px 20px; margin-bottom: 20px;
  display: block;    max-width: 300px;
  text-align: center; box-shadow: 0px 1.89764px 3.79528px rgba(0, 0, 0, 0.25);
}
.btn-blue a {color:white;}

.btn-blue:hover {background-color: #225465;  color:#fff;cursor:pointer;}
.btn-blue:hover a {text-decoration:none;}


/*###########################################################################
HEADER
#############################################################################*/

#headerTop {
  background-color: #55585B;
  height: 42px;
}

#headerBanner {
  height: 150px;
  width: 100%;
}


#headerBanner p {font-size:1.6em;text-align:center;font-weight:bold;color:#90061F;letter-spacing:4px;    margin-bottom: 18px;}
  /*#headerLeftLogo{
  background-image:url('images/scoopLeft.png');
  background-repeat:no-repeat;
 background-position: 100% 100%;
    height:100%;
	padding:8px;
  }
    #headerRightLogo img {
        float: right;
    }
    #headerLeftLogo img {
        float: left;
    }*/

  /*#headerTitle{
    height:100%;
    /* background-color: rgb(214, 192, 116);
  }*/

  /*#headerTitle h1 {
  font-size: 24px;
    margin-top: 16px;
    text-align: center;
	color:rgb(238, 226, 205);
	font-weight:bold;
  }
    #headerTitle p {
      color: rgb(238, 226, 205);
      text-align: center;
	  font-weight:bold;
    }
  #headerRightLogo{
    background-color: rgb(111, 141, 166);
    height:100%;
	padding-top:8px;
	  background-image:url('images/scoopRight.png');
  background-repeat:no-repeat;
 background-position: 0% 100%;
    height:100%;
	padding:8px;
  }
  */
  #headerBottom {background-color:#55585B;
    height: 42px;}
    #headerBottom {text-align:center;padding-top:10px;color:white;font-weight:bold;letter-spacing:4px;}

    #headerBanner #hb-left, #headerBanner #hb-middle,#headerBanner #hb-right {float:left;}
    #headerBanner #hb-left, #headerBanner #hb-right {width:25%;}
    #headerBanner #hb-middle {width:50%;}
    #hb-left img {float:right;padding-top:30px;max-height:160px;}
#headerBanner img {width:auto}
#hb-right img {max-height:120px;padding-top:50px;}
#hb-middle {padding-top:40px;}

/*###########################################################################
NAVIGATION
#############################################################################*/
 #siteNavigation{
  height:45px;
  width:100%;
  background-color: white;
  z-index: 2000;
}

.ccm-page .nav>li>a {display:inline!important; color: black;  padding: 13px 15px!important;}
.ccm-page .nav>li>a:hover {}

.ccm-page .nav>li {display:inline!important;}
.ccm-page .nav-path-selected a {color: #347389!important;}


  #siteNavigation ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    text-align: center;
    height: 100%;
  }


#siteNavigation ul li {
    font-weight: bold;
    margin-top:auto;margin-bottom:auto;
    display: inline;
    list-style-type: none;
        padding: 0% 3%;
    vertical-align: middle;
    height:100%;

    line-height: 45px;
	font-size:17px;
  }

/*###########################################################################
HERO/NEWS AREA
#############################################################################*/
  #hero{
    /* height: 262px; */
    background-color: rgb(44, 50, 130);
  }
    #heroCarousel{
      height:100%;
      width: 450px;
      padding-left: 0;
}
    #heroCarousel img{
      display: block;
      margin-left: auto;
      margin-right: auto;
      height: 100%;
      padding-top: 10px;
}
    #heroText{
      height:auto;
      background-color: rgb(44, 50, 130);
	     padding:20px 0;
}
      #heroText h3{
        color: rgb(254, 254, 254);
      }
      #heroText h5{
        color: rgb(127, 180, 213);
		      font-weight:bold;
		        margin-bottom:5px;
      }
      #heroText p{
        color: white;
		padding-bottom:20px;
      }

/*###########################################################################
BODY
#############################################################################*/

.container {width:80%;}

#welcomeSection{
  background-color: #D9D9D8;
  -webkit-box-shadow: inset 0 6px 8px -5px #322A2A;
     -moz-box-shadow: inset 0 6px 8px -5px #322A2A;
          box-shadow: inset 0 6px 8px -5px #322A2A;
  /* height: 450; */
  padding-top: 25px;
  padding-bottom: 35px;
  /* height: 467px; */
}

  #welcomePanel{
    background-color: white;
    /* height:400px; */
    width: 100%;
    overflow-x: auto;
    padding: 30px 60px 60px 60px;
    -webkit-box-shadow: 0px 0px 5px 2px rgb(127, 129, 126);
       -moz-box-shadow: 0px 0px 5px 2px rgb(127, 129, 126);
            box-shadow: 0px 0px 5px 2px rgb(127, 129, 126);

}
    #services img{
      display: block;
      margin-left: auto;
      margin-right: auto;
      padding-top: 29px;
    }
    .gray-box {padding:40px; margin-top:40px; background-color:#E5E5E5}
    span.blue-content {font-weight:bold; color:#347389;}

/*###########################################################################
CUSTOM BLOCK STYLING
#############################################################################*/

/*Accordian*/
	.simple-accordion-title-shell h2 {font-size: 14px; font-weight: bold; padding-top:8px;}

/*Page List*/


/*###########################################################################
FOOTER
#############################################################################*/

.ccm-page #footer{
    background-color: #55585B;
    height: 100px;
}
.ccm-page  #copyright{
    display:inline-block;
    padding-left:50px;
    padding-top: 34px;
    float: left;
    color: rgb(216, 216, 216);
    font-weight: lighter;
}
.ccm-page  #memberLogin{
    display:inline-block;
    padding-right:20px;
    padding-top: 34px;
    color: rgb(216, 216, 216);
    float: right;

    padding-right: 50px;
    font-weight: lighter;
}

/*###########################################################################
MEDIA QUERIES
#############################################################################*/

@media (max-width: 1410px) {
  #headerBanner {
  height:180px;
  }


  #headerTitle h1 {
	font-size: 24px;
  }
}


@media (max-width: 1310px) {
#headerTitle h1 {line-height: 30px;}

}
/************************* media query < 991px ************************************/
@media (max-width: 991px) {

  #headerBanner {
  height: 100px;
  }
#headerTitle h1{ font-size: 21px; line-height: 28px; }

  #heroText{
    height:auto;
    padding-top: 20px;
    padding-bottom: 30px;
  }


    #services img{
      width: 100%;
    }



.mobilehide{display:none;}
.mobileshow{display:block;}

}
/************************* media query < 706px ************************************/
@media (max-width: 750px) {
  #headerBanner {
  height: 80px;
  }

  #headerTitle h1 {
	font-size: 18px;
  }
  }


@media (max-width: 706px) {

  #headerBanner {
  height: 80px;
  }

#headertitle {
  width: 62%;
}
#headerTitle h1 {
  font-size: 18px;
}
#headerTitle p {
  color: rgb(238, 226, 205);
  text-align: center;
  /*z-index: 0;*/
  z-index: 1000;
}
#headerLeftLogo{
  float: left;
  padding-left: 0px;
  z-index: 10;
}
#headerLeftLogo img{
  z-index: 10;
}
#headerRightLogo{
  float: right;
  padding-right: 0px;
  z-index: 10;
}
#headerRightLogo img{
  z-index: 10;
}



  .ccm-page ul li {
        padding: 0% 2%;
	font-size:15px;
  }



#hero{
  padding-top: 20px;
}
#heroCarousel{
  height: auto;
}
#heroCarousel img{
  height: auto;
  width:100%;
}
#heroText{
  height:auto;
  padding-bottom: 20px;
}




#services img{
width:100%;
}

/*.mobilehide{display:none;}
.mobileshow{display:block;}*/




}
/************************* media query < 634px ************************************/
@media (max-width: 634px) {
  #headerBanner{
  height: 80px;
  }

  #headerBanner h1{
  font-size: 24px;
  }

  #headerTitle h1{ font-size: 18px; line-height:22px;}
  #headerBanner p{
  font-size: 16px;
  }


}
/************************* media query < 560px ************************************/
@media (max-width: 560px) {
  #headerBanner {
    margin-top: 10px;
    height: 75px;
  }

 .ccm-page ul li {
    padding: 0px 5px;
  }

#headerTitle h1 {
   font-size:20px;line-height: 24px;
  }

#headerTitle p {font-size:13px; font-weight:bold;}


}
/************************* media query < 544px ************************************/
@media (max-width: 544px) {
  #headerBanner{
    margin-top: 10px;
  }
  #headerLeftLogoImg{
    width: 100%;
    position:absolute;
    top:0;
    bottom:0;
    margin:auto;
  }
  #headerRightLogoImg{
    width: 100%;
    position:absolute;
    top:0;
    bottom:0;
    margin:auto;
  }



}
/************************* media query < 492px ************************************/
@media (max-width: 492px) {
  #headerBanner{
  height: 50px;
  }

  #headerBanner h1{
  font-size: 25px;
  }

  #headerTitle h1{ font-size: 16px; line-height: 20px; }
  #headerBanner p{
  font-size: 12px;
  }
}
















/*###########################################################################
  TEXT-RESIZER
#############################################################################*/

  /********* default/med/lg sizes ***************/
  .medium { font-size: 16px; line-height: 22px; }
  .large { font-size: 20px; line-height: 26px; }


  .ccm-page h1 { font-size: 26px; line-height: 32px; }
  .medium .ccm-page h1 { font-size: 34px; line-height: 40px; }
  .large .ccm-page h1 { font-size: 38px; line-height: 44px; }

/* .medium  #headerTitle h1 {
   font-size:24px!important;font-weight:bold;
  }
  .large  #headerTitle h1 {
   font-size:28px!important;font-weight:bold;
  } */

  .ccm-page h2 { font-size: 24px; line-height: 30px; }
  .medium .ccm-page h2 { font-size: 28px; line-height: 34px; }
  .large .ccm-page h2 { font-size: 32px; line-height: 38px; }

  .ccm-page .simple-accordion-title-shell h2 { font-size: 15px; line-height: 23px; }
  .medium .ccm-page .simple-accordion-title-shell h2 { font-size: 22px; line-height: 34px; }
  .large .ccm-page .simple-accordion-title-shell h2 { font-size: 28px; line-height: 38px; }

  .ccm-page h3 { font-size: 18px; line-height: 24px; }
  .medium .ccm-page h3 { font-size: 22px; line-height: 28px; }
  .large .ccm-page h3 { font-size: 26px; line-height: 32px; }

  .ccm-page h1, .ccm-page h2, .ccm-page h3 {font-weight: normal; text-decoration: none; }


  /********* where all the styles will be applied to  ***************/
  #text-resizer-container { margin: 20px auto; width: 960px; }


  /********* tooltip for resizing ***************/
  .text-resizer {
    border: 1px solid rgb(111, 141, 166);
    margin:6px;
    padding:0px 6px;
    float: right;
    list-style: none;
  }
  .text-resizer li { float: left; line-height: 26px; margin-right: 5px; }
  .text-resizer .small { font-size: 12px; line-height: 26px; }
  .text-resizer .large { margin-right: 0; }
  .small .text-resizer .small a, .medium .text-resizer .medium a, .large .text-resizer .large a { color: rgb(203, 218, 225); text-decoration: none; }
  .small .text-resizer a, .medium .text-resizer a, .large .text-resizer  a{ color: rgb(111, 141, 166); text-decoration: none; }

  @media screen and (min-width: 1410px) {
  #hb-left img {max-height:130px;}
  }

@media screen and (max-width: 1240px) {
    #welcomePanel p img { display: block; height: auto !important; margin: 0 auto; width: 100% !important; }
}
@media screen and (max-width: 768px) {
    #headerBanner { height: auto; }
    #headerBanner img { display: block; margin-bottom: 8px; width: 100%; }
    .mobileshow { margin-bottom: 8px; }
    #welcomePanel { padding: 14px 24px; }
    #welcomePanel > div.row { margin: 0; }
    div.row > div[class*="col-"] { margin-bottom: 20px; padding: 0; }
    div#footer > div { float: none; font-size: .8em; padding: 8px; text-align: center; }
}
@media screen and (max-width: 500px) {
    #heroCarousel { width: 100%; }
    #heroCarousel img { width: 100%; }
    #welcomePanel { padding: 14px; }
    #welcomePanel > div.row { margin: 0; }
    #welcomePanel h2, div.row > div[class*="col-"] h2 { font-size: 1.6em; }
    div.row > div[class*="col-"] { font-size: .8em; line-height: 16px;}
    div.row > div[class*="col-"] > div { margin: 0 !important; }
    h2.panel-title { font-size: 1.3em !important; line-height: 24px !important; margin: 0; padding: 0; }
}