* {
  margin: 0;
}

body {
	height:100%;
}

section {
	padding-bottom:30px;
}

.surround {
  min-height: 100%;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: -50px;
}

.surround:after {
  content: "";
  display: block;
}

footer,.surround:after {
  min-height:50px;
}

.mod-articles-category-title {
  font-size: 16px;
  line-height: 24px;
}

.bg-background2 {
    background-color: rgba(68, 136, 204, 0.9);
}

.footer-2 {
    width: 100%;
}

#toolbar {
    width: 100%;
    height: 25px;
    padding: 0px;
    overflow: hidden;
    line-height: 25px;
    font-size: 10px;
	clear: both;
}

.label-info {
    background-color: #77aa44;
}

.label-info[href]:hover, .label-info[href]:focus {
    background-color: #dedede;
}

a {
    color: #7A4;
    text-decoration: none;
    transition: all 0.25s ease 0s;
}

a:hover {
    color: #777;
}
 .navbar {
  margin-bottom:10px;
}
.navbar-nav > li > a {
    color: #222;
}

.navbar-nav > li > a:hover {
    color: #666666;
}

.navbar-nav > li.active a {
    color: #77aa44;
}

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
    background-color: #dedede;
    color: #FFF;
    outline: 0px none;
    text-decoration: none;
}

.iconcontainer {
   width: 100%;
   height: 210px;
   margin:0 auto;
   padding: 0;
   text-align: center;
   background: #77aa44;
}

.iconbox {
/*   width: 62%; */
   max-width:790px;
   margin:0 auto;
   padding: 0;
}

.emailimg {
  margin-bottom: 5px;
}

.view {
   width: 152px;
   height: 152px;
   margin: 10px;
   float: left;
/*   border: 10px solid #fff; */
   overflow: hidden;
   position: relative;
   text-align: center;
/*   -webkit-box-shadow: 1px 1px 2px #e6e6e6;
   -moz-box-shadow: 1px 1px 2px #e6e6e6;
   box-shadow: 1px 1px 2px #e6e6e6; */
   cursor: default;
   /* background: #77aa44 url(../images/bgimg.jpg) no-repeat center center; */
   -webkit-border-radius: 60px;
   -moz-border-radius: 60px;
   border-radius: 60px;
}
.view .mask,.view .content {
   width: 152px;
   height: 152px;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view img {
   display: block;
   position: relative;
}

.imgicon {
   width:152px;
   height:152px;
}

.view h2 {
   text-transform: uppercase;
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 17px;
   padding: 10px;
   background: rgba(0, 0, 0, 0.8);
   margin: 10px 10px 40px 10px;
}
.view p {
   font-family: Georgia, serif;
   font-style: italic;
   font-size: 10px;
   position: relative;
   color: #fff;
   padding: 10px 20px 20px;
   text-align: center;
}
.view a.info-icon {
   display: inline-block;
   font-size: 16px;
   text-decoration: none;
   padding: 7px 14px;
   background: #000;
   color: #fff;
   text-transform: uppercase;
   -webkit-box-shadow: 0 0 1px #000;
   -moz-box-shadow: 0 0 1px #000;
   box-shadow: 0 0 1px #000;
}
.view a.info-icon: hover {
   -webkit-box-shadow: 0 0 5px #000;
   -moz-box-shadow: 0 0 5px #000;
   box-shadow: 0 0 5px #000;
}

.view-tenth img {
   -webkit-transform: scaleY(1);
   -moz-transform: scaleY(1);
   -o-transform: scaleY(1);
   -ms-transform: scaleY(1);
   transform: scaleY(1);
   -webkit-transition: all 0.7s ease-in-out;
   -moz-transition: all 0.7s ease-in-out;
   -o-transition: all 0.7s ease-in-out;
   -ms-transition: all 0.7s ease-in-out;
   transition: all 0.7s ease-in-out;
}
.view-tenth .mask {
   background-color: rgba(255, 255, 255, 0.4);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-border-radius: 60px;
   -moz-border-radius: 60px;
   border-radius: 60px;
}
.view-tenth h2 {
   border-bottom: 1px solid rgba(0, 0, 0, 0.3);
   background: transparent;
   text-align: center;
/*   margin: 20px 40px 0px 30px; */
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   color: #333;
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.view-tenth p {
   color: #333;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
}
.view-tenth a.info-icon {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
}
.view-tenth:hover img {
   -webkit-transform: scale(10);
   -moz-transform: scale(10);
   -o-transform: scale(10);
   -ms-transform: scale(10);
   transform: scale(10);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.view-tenth:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.view-tenth:hover h2,.view-tenth:hover p,.view-tenth:hover a.info-icon {
   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}

@media screen and (max-width: 1024px) {
.iconcontainer {
   height: 154px;
}

.iconbox {
   width: 80%;
   max-width:747px;
   margin:0 auto;
   padding: 0;
}

.view {
   width: 120px;
   height: 120px;
   margin: 10px;
   float: left;
/*   border: 10px solid #fff; */
   overflow: hidden;
   position: relative;
   text-align: center;
/*   -webkit-box-shadow: 1px 1px 2px #e6e6e6;
   -moz-box-shadow: 1px 1px 2px #e6e6e6;
   box-shadow: 1px 1px 2px #e6e6e6; */
   cursor: default;
   background: #77aa44 url(../images/bgimg.jpg) no-repeat center center;
   -webkit-border-radius: 45px;
   -moz-border-radius: 45px;
   border-radius: 45px;
}
.view .mask,.view .content {
   width: 120px;
   height: 120px;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view img {
   display: block;
   position: relative;
}

.imgicon {
   width:120px;
   height:120px;
}

.view h2 {
   text-transform: uppercase;
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 12px;
   padding: 5px;
   background: rgba(0, 0, 0, 0.8);
   margin: 10px 10px 5px 10px;
}
.view p {
   font-family: Georgia, serif;
   font-style: italic;
   font-size: 10px;
   position: relative;
   color: #fff;
   padding: 10px 20px 20px;
   text-align: center;
}
.view a.info-icon {
   display: inline-block;
   font-size: 10px;
   text-decoration: none;
   padding: 4px 14px;
   background: #000;
   color: #fff;
   text-transform: uppercase;
   -webkit-box-shadow: 0 0 1px #000;
   -moz-box-shadow: 0 0 1px #000;
   box-shadow: 0 0 1px #000;
}
.view a.info-icon: hover {
   -webkit-box-shadow: 0 0 5px #000;
   -moz-box-shadow: 0 0 5px #000;
   box-shadow: 0 0 5px #000;
}

.view-tenth .mask {
   background-color: rgba(255, 255, 255, 0.4);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-border-radius: 45px;
   -moz-border-radius: 45px;
   border-radius: 45px;
}
}

@media screen and (max-width: 767px) {

.iconcontainer {
   height: 134px;
}

.iconbox {
   width: 95%;
   max-width:747px;
   margin:0 auto;
   padding: 0;
}

.view {
   width: 100px;
   height: 100px;
   margin: 10px;
   float: left;
/*   border: 10px solid #fff; */
   overflow: hidden;
   position: relative;
   text-align: center;
/*   -webkit-box-shadow: 1px 1px 2px #e6e6e6;
   -moz-box-shadow: 1px 1px 2px #e6e6e6;
   box-shadow: 1px 1px 2px #e6e6e6; */
   cursor: default;
   background: #77aa44 url(../images/bgimg.jpg) no-repeat center center;
   -webkit-border-radius: 50px;
   -moz-border-radius: 50px;
   border-radius: 50px;
}
.view .mask,.view .content {
   width: 100px;
   height: 100px;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view img {
   display: block;
   position: relative;
}

.imgicon {
   width:100px;
   height:100px;
}

.view h2 {
   text-transform: uppercase;
   color: #fff;
   text-align: center;
   position: relative;
   font-size: 12px;
   padding: 5px;
   background: rgba(0, 0, 0, 0.8);
   margin: 10px 10px 5px 10px;
}
.view p {
   font-family: Georgia, serif;
   font-style: italic;
   font-size: 10px;
   position: relative;
   color: #fff;
   padding: 10px 20px 20px;
   text-align: center;
}
.view a.info-icon {
   display: inline-block;
   font-size: 10px;
   text-decoration: none;
   padding: 4px 14px;
   background: #000;
   color: #fff;
   text-transform: uppercase;
   -webkit-box-shadow: 0 0 1px #000;
   -moz-box-shadow: 0 0 1px #000;
   box-shadow: 0 0 1px #000;
}
.view a.info-icon: hover {
   -webkit-box-shadow: 0 0 5px #000;
   -moz-box-shadow: 0 0 5px #000;
   box-shadow: 0 0 5px #000;
}

.view-tenth .mask {
   background-color: rgba(255, 255, 255, 0.4);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-border-radius: 50px;
   -moz-border-radius: 50px;
   border-radius: 50px;
}

}

.carousel-caption {
  width:500px;
  height: 250px;
  padding: 0 10px;
  bottom: 50px;
  left:10%;
  background-color: rgba(0, 0, 0, 0.5);
}

.carousel-caption .btn {
    color: #ffee44;
    font-weight: 300;
}

.carousel-caption h1 a {
    color: #ffee44;
}

.footertxt { 
font-size: 14px; 
line-height: 18px;
text-align: center;
color: #222222;
}

.box420 { 
  width:45%; 
  max-width:420px;
  min-width:270px;
  padding-right:20px; 
  margin-bottom:15px; 
  float:left;
}

.img400 { 
  width:100%; 
  max-width:400px;
  min-width:250px;
}

.divider {
  margin-top: 20px;
  margin-bottom: 20px;
  border-right: 0px none;
  border-width: 1px 0px 0px;
  border-style: solid none none;
  border-color: #EEE -moz-use-text-color -moz-use-text-color;
  -moz-border-top-colors: none;
  -moz-border-right-colors: none;
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  border-image: none;
  clear: both;
}

div.headline h4  {
    font-size: 21px;
    line-height: 38px;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 300;
    color: #777777;
}

@-webkit-keyframes cf4FadeInOut {
 0% {
   opacity:1;
 }
 17% {
   opacity:1;
 }
 25% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

@-moz-keyframes cf4FadeInOut {
 0% {
   opacity:1;
 }
 17% {
   opacity:1;
 }
 25% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

@-o-keyframes cf4FadeInOut {
 0% {
   opacity:1;
 }
 17% {
   opacity:1;
 }
 25% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

@keyframes cf4FadeInOut {
 0% {
   opacity:1;
 }
 17% {
   opacity:1;
 }
 25% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

#cf4a {
  position:relative;
  height:680px;
  width:605px;
  margin:0 auto;
}
#cf4a img {
  position:absolute;
  left:0;
}

#cf4a img {
  -webkit-animation-name: cf4FadeInOut;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-duration: 20s;

  -moz-animation-name: cf4FadeInOut;
  -moz-animation-timing-function: ease-in-out;
  -moz-animation-iteration-count: infinite;
  -moz-animation-duration: 20s;

  -o-animation-name: cf4FadeInOut;
  -o-animation-timing-function: ease-in-out;
  -o-animation-iteration-count: infinite;
  -o-animation-duration: 20s;

  animation-name: cf4FadeInOut;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-duration: 20s;
}
#cf4a img:nth-of-type(1) {
  -webkit-animation-delay: 12s;
  -moz-animation-delay: 12s;
  -o-animation-delay: 12s;
  animation-delay: 12s;
}
#cf4a img:nth-of-type(2) {
  -webkit-animation-delay: 8s;
  -moz-animation-delay: 8s;
  -o-animation-delay: 8s;
  animation-delay: 8s;
}
#cf4a img:nth-of-type(3) {
  -webkit-animation-delay: 4s;
  -moz-animation-delay: 4s;
  -o-animation-delay: 4s;
  animation-delay: 4s;
}
#cf4a img:nth-of-type(4) {
  -webkit-animation-delay: 0;
  -moz-animation-delay: 0;
  -o-animation-delay: 0;
  animation-delay: 0;
}

@media (max-width: 1000px) {

.navbar-brand img {
  width:80%;
}
  
.carousel-caption {
  width:400px;
  height: 250px;
  padding: 0 10px;
  bottom: 25px;
  left:5%;
  background-color: rgba(0, 0, 0, 0.5);
}

.carousel-caption .btn {
    color: #ffee44;
    font-weight: 300;
}

.carousel-caption h1 a {
    color: #ffee44;
	font-size: 21px;
    line-height: 24px;
	margin-top: 0;
	margin-bottom: 0;
}
  
}

@media (max-width: 767px) {
  
.navbar-brand {
    width:150px;
}
  
.navbar-brand img {
    width:70%;
}
 
.top-header {
    height: 0;
    padding-top: 0px;
    padding-bottom: 0px;
    visibility: hidden;
}
  
.carousel-caption {
    visibility: hidden;
}
  
}

.go-top {
    bottom: 0.5em;
}