/*@ import url(//fonts.googleapis.com/css?family=Open+Sans:400,300,600,700);*/
 
@font-face {font-family:"Open Sans Light";src:url("fonts/OpenSans-Light.eot?") format("eot"),url("fonts/OpenSans-Light.woff") format("woff"),url("fonts/OpenSans-Light.ttf") format("truetype"),url("fonts/OpenSans-Light.svg") format("svg");font-weight:normal;font-style:normal;} /*svg#OpenSans-Light*/

*{
  margin: 0;
	padding: 0;
	outline: none;
	border: none;
	-webkit-box-sizing: border-box;
}
*:before,
*:after{
	-webkit-box-sizing: border-box;
}
.clearfix {
  *zoom: 1;
}
html{
	font-family: "Cantarell", open-sans, Helvetica, arial, sans-serif;
	font-size: 12px;
}
body{
/*	background: url('brushed_alu.png');*/
	background-image: url(../img/LightTilesforRepeat60.png) ;
	background-image: repeat;
}
.clearfix:before,
.clearfix:after {
  display: table;
  line-height: 0;
  content: "";
}
.clearfix:after {
  clear: both;
}
.container{
	width: 90%;
	margin: 0 auto;
}
.top-bar-ppra {
	line-height: 3em;
	width: 88.2%;/*78.4%;*/
}
header{
	width: 100%;
	/*height: auto;*/
  line-height: 80px;
	background: white;
}
.header-left,
.header-right{
	position: relative;
	color: green;
	float: left;
}
.header-left{
	width: 30%;
}
.header-right label{
	position: absolute;
	top: -3.7em;
	right: 0;
	cursor: pointer;
}
.header-right span{
	position: relative;
	width: 2em;
	height: 2em;
	background: rgba(255,255,255,.3);
	-webkit-transition: all .3s ease;
}
.header-right span:hover{
	background: rgba(255,255,255,.6);
}
.header-right span:before,
.header-right span:after{
	content: '';
	position: absolute;
	width: 2em;
	height: .5em;
	top: 4px;
	left: 0;
	background: black;
}
.header-right span:after{
	top: 14px;
}
.header-right{
	width: 70%;
	text-align: right;
}
#open{
	display: none;
}
h1{
	font-weight: 300;
	line-height: 40px;
}
a{
	text-decoration: none;
	color: green;
}
a:hover{
	text-rendering: optimizeLegibility;
	-webkit-transition: all .3s ease;
	color: black;
	text-shadow: 0px -1px 0 #767676, 1px 1px 2px #737272;
}
nav>a{
	position: relative;
	display: inline-block;
	font-size: 13px;
	line-height: 40px;
	padding: 0 2em;
	-webkit-transition: all .3s ease;
	text-rendering: optimizeLegibility;
	text-transform: uppercase;
	letter-spacing: .040em;
  	text-shadow: 0px -1px 0 #767676, 1px 1px 2px #737272;
}
nav>a:hover{
	background: rgba(255,255,255,.9);
	color: black;
}
.hidden-desktop{
	display: none;
}
section{
	width: 100%;
	height: auto;
/*	background-image: -webkit-linear-gradient(#80059E 0%, #550486 100%);*/
}
.gradient-ppra {
    background-image: -webkit-linear-gradient(#004226 -1000%, #ffffff 100%);
}
.white-bg-ppra { /*introduced New*/
  	background-color: #FEFFFF;
}
.right-left-padding{ /*introduced New*/
	padding: 8px 8px;
}
.section-left,
.section-right{
	float: left;
}
.section-left{
	width: 70%;
	padding: 3em 0;
}
.section-right{
	width: 30%;
}
.section-title,
.section-tagline{
	color: darkseagreen;
	font-weight: 100;/*changed from 300 to 100*/
	font-size: 1.5em;/*I changed it*/
	margin: 0;
	padding: 0;
	-webkit-transition: all .4s ease;
}
.section-title{
	font-size: 1.5em; /*changed it from 2.5 to 1.5*/
	margin-bottom: .6em;
	text-shadow: 0 3px 0px black,
				 0 4px 0px rgba(150,150,150,.5);
}
.section-tagline{
	font-size: 1em;
	color: #004226; /*introduced it*/
}
.learn-more{
	display: table;
	margin: 3em auto 0;
	padding: 1em 6em;
	cursor: pointer;
	border-radius: 3px;
	box-shadow: inset 1 -2px 0 rgba(0,0,0,.8);
	background: green;
	background-image: -webkit-linear-gradient(#a1b98f 0%, #a1b98f 100%);
	font-size: 1.1em;
}
.learn-more:hover{
	background: #EAAF00;
}
.learn-more:active{
	box-shadow: inset 0 2px 0 rgba(0,0,0,.8);
	color: green;
}

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
	.box{
		width: 49%;
		margin-bottom: 5%;
	}

	ul li:nth-child(6) .box{
		clear: both;
	}

	ul li:nth-child(2n) .box{
		margin-right: 0;
		clear: right;
	}
}

/* Small monitor */
@media (max-width: 979px){
	nav>a{
		padding: 0 1.5em;
	}
	.section-left,
	.section-right{
		width: 100%;
	}
	.section-left{
		text-align: center;
	}
	.section-right{
		padding: 0 0 2em;
	}
	.section-title{
		font-size: 1.5em;
		margin-bottom: .2em;
	}
	.section-tagline{
		font-size: 1.3em;
	}
	.learn-more{
		margin: 0 auto;
	}
}
 
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
	.container{
		width: 95%;
	}
	nav>a{
		padding: 0 2em;
	}
	h1{
		padding: .5em 0;
	}
	.header-left,
	.header-right{
		width: 100%;
		text-align: center;
	}
	.section-left,
	.section-right{
		width: 100%;
	}
	.section-left{
		text-align: center;
		padding: 2em 0;
	}
	.section-right{
		padding: 1em 0 2em;
	}
	.section-title{
		font-size: 1.5em;
		margin-bottom: .2em;
	}
	.section-tagline{
		font-size: 1.3em;
	}
	.learn-more{
		margin: 0 auto;
	}
}
 
/* Landscape phones and down */
@media (max-width: 480px) {
	body{
		padding: 0 .5em;
	}
	.container{
		width: 90%;
	}
	nav{
		height: 0;
		overflow: hidden;
		-webkit-transition: all .3s ease;
	} 
	/*bootstrap like responsive navigation (no js)  basically using checkbox to trigger the pop down navigation. */
	input[type="checkbox"]:checked + nav{
		height: auto;/*205px;*/
	}
	nav>a{
		padding: 0 1em;
		display: block;
		border-bottom: solid 1px rgba(255,255,255,.1);
	}
	h1{
		padding: .5em 0;
	}
	.header-left,
	.header-right{
		width: 100%;
		text-align: center;
	}
	.section-left,
	.section-right{
		width: 100%;
	}
	.section-left{
		text-align: center;
		padding: 1em 0;
	}
	.section-right{
		text-align: center;
		padding: 1em 0 2em;
	}
	.section-title{
		font-size: 1.5em;
		margin-bottom: 0;
	}
	.section-tagline{
		font-size: 1em;
	}
	.learn-more{
		display: table;
		margin: 2px auto;
	}
	.hidden-desktop{
		display: block;
	}
}


/*News Ticker Works*/
.news {
  box-shadow: inset 0 -15px 30px rgba(0,0,0,0.4), 0 5px 10px rgba(0,0,0,0.5);
  width: 100%;
  height: 30px;
  margin: 20px auto;
  overflow: hidden;
  border-radius: 3px;
  padding: 1px;
  -webkit-user-select: none
} 
.news span {
  float: left;
  color: #fff;
  padding: 6px;
  position: relative;
  top: 1%;
  border-radius: 4px;
  box-shadow: inset 0 -15px 30px rgba(0,0,0,0.4);
  font: 16px;
  -webkit-font-smoothing: antialiased;
  -webkit-user-select: none;
  cursor: pointer
}
.news ul {
  float: left;
  padding-left: 20px;
  animation: ticker 10s cubic-bezier(1, 0, .5, 0) infinite;
  -webkit-user-select: none
}
.news ul li {line-height: 30px; list-style: none }
.news ul li a {
  color: #fff;
  text-decoration: none;
  font: 14px;
  -webkit-font-smoothing: antialiased;
  -webkit-user-select: none
}
.news ul:hover { animation-play-state: paused }
.news span:hover+ul { animation-play-state: paused }
/* OTHER COLORS */
.blue { background: #347fd0 }
.blue span { background: #2c66be }
.red { background: #d23435 }
.red span { background: #c22b2c }
.green { background: #0b6631 }
.green span { background: #547d52 }
.magenta { background: #b63ace }
.magenta span { background: #842696 }
@keyframes ticker {
  0%   {margin-top: 0}
  25%  {margin-top: -30px}
  50%  {margin-top: -60px}
  75%  {margin-top: -90px}
  100% {margin-top: 0}
}


/*footer design*/
.full {
    width: 100%;	
}
.gap {
	height: 30px;
	width: 100%;
	clear: both;
	display: block;
}
.footer {
	background: #63b76c;
	height: auto;
	padding-bottom: 30px;
	padding-left: 8px; /* introduced */
	padding-right: 8px; /* introduced */
	position: relative;
	width: 100%;
	border-bottom: 1px solid #ffffff;
	border-top: 1px solid #feffff;
}
.footer p {
	margin: 0;
}
.footer img {
	max-width: 100%;
}
.footer h3 {
	border-bottom: 1px solid #BAC1C8;
	color: #FFFFFF;
	font-size: 18px;
	font-weight: 600;
	line-height: 27px;
	padding: 40px 0 10px;
	text-transform: uppercase;
}
.footer ul {
	font-size: 13px;
	list-style-type: none;
	margin-left: 0;
	padding-left: 0;
	margin-top: 15px;
	color: #7F8C8D;
}
.footer ul li a {
	padding: 0 0 5px 0;
	display: block;
}
.footer a {
	color: #FFFFFF;
}
.supportLi h4 {
	font-size: 20px;
	font-weight: lighter;
	line-height: normal;
	margin-bottom: 0 !important;
	padding-bottom: 0;
}
.newsletter-box input#appendedInputButton {
	background: #FFFFFF;
	display: inline-block;
	float: left;
	height: 30px;
	clear: both;
	width: 100%;
}
.newsletter-box .btn {
	border: medium none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	-ms-border-radius: 3px;
	border-radius: 3px;
	display: inline-block;
	height: 40px;
	padding: 0;
	width: 100%;
	color: #fff;
}
.newsletter-box {
	overflow: hidden;
}
.bg-gray {
	background-image: -moz-linear-gradient(center bottom, #BBBBBB 0%, #F0F0F0 100%);
	box-shadow: 0 1px 0 #B4B3B3;
}
.social li {
	background: none repeat scroll 0 0 #B5B5B5;
	border: 2px solid #B5B5B5;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-o-border-radius: 50%;
	-ms-border-radius: 50%;
	border-radius: 50%;
	float: left;
	height: 36px;
	line-height: 36px;
	margin: 0 8px 0 0;
	padding: 0;
	text-align: center;
	width: 36px;
	transition: all 0.5s ease 0s;
	-moz-transition: all 0.5s ease 0s;
	-webkit-transition: all 0.5s ease 0s;
	-ms-transition: all 0.5s ease 0s;
	-o-transition: all 0.5s ease 0s;
}
.social li:hover {
	transform: scale(1.15) rotate(360deg);
	-webkit-transform: scale(1.1) rotate(360deg);
	-moz-transform: scale(1.1) rotate(360deg);
	-ms-transform: scale(1.1) rotate(360deg);
	-o-transform: scale(1.1) rotate(360deg);
}
.social li a {
	color: #EDEFF1;
}
.social li:hover {
	border: 2px solid #2c3e50;
	background: #2c3e50;
}
.social li a i {
	font-size: 16px;
	margin: 0 0 0 5px;
	color: #EDEFF1 !important;
}
.footer-bottom {
	background: #105e30;/*#E3E3E3;*/
	border-top: 1px solid #DDDDDD;
	padding-top: 10px;
	padding-bottom: 10px;
	color: white;
}
.footer-bottom a {
	padding-bottom: 10px;
	color: greenyellow;
}
.footer-bottom p.pull-left {
	padding-top: 6px;
}

/*CSS Slider*/
/* Thumbnails */
.thumb-box {
  padding: 1.4em 0 1em;
  margin-left: -1%;
  width: 102%;
  .thumbs {
    @include clearfix;
    li {
      float: left;
      width: 25%;
      text-align: center;
      padding: 0 1%;
      img {
        width: 100%;
        opacity: .8;
        @include transition(opacity .32s);
        border-bottom: 4px solid transparent;
        &.active {
          border-color: $bc-rk-blue;
          opacity: 1;
        }
      }
      &:hover {
        img {
          opacity: 1;
          @include transition(opacity .2s);
        }
      }
    }
  }
}

/*Boxes Info Downloads and Statistics*/
.box > .icon { text-align: center; position: relative; }
.box > .icon > .image { position: relative; z-index: 2; margin: auto; width: 80px; height: 80px; border: 8px solid white; line-height: 80px; border-radius: 50%; background: #63B76C; vertical-align: middle; }
.box > .icon:hover > .image { background: #333; }
.box > .icon > .image > i { font-size: 36px !important; color: #fff !important; }
.box > .icon:hover > .image > i { color: white !important; }
.box > .icon > .info { margin-top: -24px; background: rgba(0, 0, 0, 0.04); border: 1px solid #e0e0e0; padding: 15px 0 10px 0; }
.box > .icon:hover > .info { background: rgba(0, 0, 0, 0.04); border-color: #e0e0e0; color: white; }
.box > .icon > .info > h3.title { font-family: "Roboto",sans-serif !important; font-size: 16px; color: #222; font-weight: 500; }
.box > .icon > .info > p { font-family: "Roboto",sans-serif !important; font-size: 13px; color: #666; line-height: 1.5em; margin: 20px;}
.box > .icon:hover > .info > h3.title, .box > .icon:hover > .info > p, .box > .icon:hover > .info > .more > a { color: #222; }
.box > .icon > .info > .more a { font-family: "Roboto",sans-serif !important; font-size: 12px; color: #222; line-height: 12px; text-transform: uppercase; text-decoration: none; }
.box > .icon:hover > .info > .more > a { color: #fff; padding: 6px 8px; background-color: #63B76C; }

.box > .icon > .inforound { margin-top: -24px; background: rgba(0, 0, 0, 0.04); border: 1px solid #e0e0e0; border-radius: 4px; padding: 15px 0 10px 0; min-height: 225px;}
.box > .icon:hover > .inforound { background: rgba(0, 0, 0, 0.04); border-color: #e0e0e0; color: white; }
.box > .icon > .inforound > h3.title { font-family: "Roboto",sans-serif !important; font-size: 16px; color: #222; font-weight: 500; }
.box > .icon > .inforound > p { font-family: "Roboto",sans-serif !important; font-size: 13px; color: #666; line-height: 1.5em; margin: 20px;}
.box > .icon:hover > .inforound > h3.title, .box > .icon:hover > .info > p, .box > .icon:hover > .info > .more > a { color: #222; }
.box > .icon > .inforound > .more a { font-family: "Roboto",sans-serif !important; font-size: 12px; color: #222; line-height: 12px; text-transform: uppercase; text-decoration: none; }
.box > .icon:hover > .inforound > .more > a { color: #fff; padding: 6px 8px; background-color: #63B76C; }


.box .space { height: 20px; }

.gradient {
    background-color: #02a419;
    /* IE9, iOS 3.2+ */
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxyYWRpYWxHcmFkaWVudCBpZD0idnNnZyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIGN4PSI1MCUiIGN5PSI1MCUiIHI9IjcwLjcxMDY3ODExODY1NDc2JSI+PHN0b3Agc3RvcC1jb2xvcj0iIzAwYmIzMiIgc3RvcC1vcGFjaXR5PSIxIiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjMDM4ZDAwIiBzdG9wLW9wYWNpdHk9IjEiIG9mZnNldD0iMSIvPjwvcmFkaWFsR3JhZGllbnQ+PHJlY3QgeD0iLTUwIiB5PSItNTAiIHdpZHRoPSIxMDEiIGhlaWdodD0iMTAxIiBmaWxsPSJ1cmwoI3ZzZ2cpIiAvPjwvc3ZnPg==);
    /* Android 2.3- hack (needed for the actual radial gradient) */
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxyYWRpYWxHcmFkaWVudCBpZD0idnNnZyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIGN4PSI1MCUiIGN5PSI1MCUiIHI9IjcwLjcxMDY3ODExODY1NDc2JSI+PHN0b3Agc3RvcC1jb2xvcj0iIzAwYmIzMiIgc3RvcC1vcGFjaXR5PSIxIiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjMDM4ZDAwIiBzdG9wLW9wYWNpdHk9IjEiIG9mZnNldD0iMSIvPjwvcmFkaWFsR3JhZGllbnQ+PHJlY3QgeD0iLTUwIiB5PSItNTAiIHdpZHRoPSIxMDEiIGhlaWdodD0iMTAxIiBmaWxsPSJ1cmwoI3ZzZ2cpIiAvPjwvc3ZnPg==),
        -webkit-gradient(radial, center center, 0, center center, 186,color-stop(0, rgb(0, 187, 50)),color-stop(1, rgb(3, 141, 0)));
    /* Android 2.3 */
    background-image: -webkit-repeating-radial-gradient(center center, ellipse farthest-corner,rgb(0, 187, 50) 0%,rgb(3, 141, 0) 100%);
    /* IE10+ */
    background-image: repeating-radial-gradient(ellipse farthest-corner at center center,rgb(0, 187, 50) 0%,rgb(3, 141, 0) 100%);
    background-image: -ms-repeating-radial-gradient(center center, ellipse farthest-corner,rgb(0, 187, 50) 0%,rgb(3, 141, 0) 100%);
}
 
/* IE8- CSS hack */
@media \0screen\,screen\9 {
    .gradient {
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff00bb32",endColorstr="#ff038d00",GradientType=0);
    }
}







/* carousel */
.media-carousel 
{
  margin-bottom: 0;
  padding: 0 40px 30px 40px;
  margin-top: 30px;

}
/* Previous button  */
.media-carousel .left 
{
  left: -12px;
  background-image: none;
  background: none repeat scroll 0 0 rgba(75, 165, 103, 0.5);
  border: 4px solid #FFFFFF;
  border-radius: 23px 23px 23px 23px;
  height: 40px;
  width : 40px;
  margin-top: 30px;

}
/* Next button  */
.media-carousel .right 
{
  right: -12px !important;
  background-image: none;
  background: none repeat scroll 0 0 rgba(75, 165, 103, 0.5);
  border: 4px solid #FFFFFF;
  border-radius: 23px 23px 23px 23px;
  height: 40px;
  width : 40px;
  margin-top: 30px;

}
/* Changes the position of the indicators */
.media-carousel .carousel-indicators 
{
  right: 50%;
  bottom: 0px;
  margin-right: -19px;

  	top:48px;
	bottom:58px;
	opacity: 1;
}
/* Changes the colour of the indicators */
.media-carousel .carousel-indicators li 
{
  background: #c0c0c0;
}
.media-carousel .carousel-indicators .active 
{
  background: #333333;
}
.media-carousel img
{
  width: 200px;
  height: 150px
}
.carousel-control
{
	width:5%;
}
.carousel-inner .active.left { left: -25%; }

/* End carousel */