.responsive-slider {

  width: 100%;

  position: relative;

}

.responsive-slider .touch-surface {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

}

.responsive-slider .slides {

  position: relative;

  overflow: hidden;

}

.responsive-slider .slides ul {

  list-style-type: none;

  padding: 0;

  margin: 0;

  white-space: nowrap;

  font-size: 0;

}

.responsive-slider .slides ul li {

  display: inline-block;

  max-width: 100%;

  text-align: center;

    width: 100% !important;

}

.responsive-slider .slides ul li .slide-body {

  display: inline-block;

  position: relative;

  max-width: 100%;

  font-size: 14px;

  text-shadow: 0px 1px 0px #000000;

}

.responsive-slider .slides ul li .slide-body img {

  max-width: 100%;

}

.responsive-slider .slides ul li .slide-body .caption {

  position: absolute;

  color: #fff;

/*  text-shadow: 0px 1px 0px #000000;*/

  font-size:16px;

  width:32%







}

.responsive-slider .slides ul li .slide-body .circle { /*border-radius: 50%;

  width: 100%;

  padding-bottom: 100%;   

  background:rgba(102,156,65,0.8);

  line-height:0px;*/  

  position:relative;

   z-index:2;

   background:rgba(0,0,0,0.3); height:100%; margin-top:25%}



   

.responsive-slider .slides ul li .slide-body .caption:before {

/*   font-family: FontAwesome;

   content: "";

   position:absolute;

   left:-10%;

   top:-34%;

   z-index:0;

   font-size:500px;

   color:rgba(255,255,255,0.8);

   opacity:0.5;

    background:rgba(0,0,0,0.3);*/

 

}

.responsive-slider .slides ul li .slide-body .circle h6 {

	float:left;

	width:100%;

	padding:30px 5%;

	line-height:35px;

	margin-top:-0.5em;

	text-align:center;

	color:white;

	white-space:normal;

	 font-family: 'neotechbold';

	 font-size:30px

}

.responsive-slider .slides ul li .slide-body .circle h6 small {

	float:left;

	width:115%;

	padding:10px 10% 0px ;

	line-height:21px;

	margin:10px -10% 10px -10%;

	text-align:center;

	color:white;

	white-space:normal;

	font-size:15px;

	font-family: 'neotechregular';

/*	background:rgba(0,0,0,.10)*/

}

.responsive-slider .slides ul li .slide-body .circle h6 span {



	font-size:13px;

	font-family: 'neotechregular';

	text-align:left !important;

	



	

}

.responsive-slider .slides ul li .slide-body .caption h6 { margin:0px;    background:rgba(0,0,0,0.7); }

.responsive-slider .slides ul li .slide-body .caption.header {

  top: 28%;

  position:absolute !important;

  left:10%



}

.responsive-slider .slides ul li .slide-body .caption.lefting {

  top: 28%;

  left: 10%;

  text-align:left

}

.responsive-slider .slides ul li .slide-body .caption.header h2 {

  font-size: 60px;

  color:#fff;

  font-family: 'pf_beausans_probold';

  text-transform:uppercase

}

.responsive-slider .slides ul li .slide-body .caption.header h4 {

  font-size: 46px;

  color:#fff;

  font-family: 'pf_beausans_probold';

  border:none

 

}

.responsive-slider .slides ul li .slide-body .caption.header h2 i {

  font-size: 35px;

}

@media (max-width: 1199px) {

.responsive-slider .slides ul li .slide-body .caption {

  position: absolute;

  color: #fff;

/*  text-shadow: 0px 1px 0px #000000;*/

  font-size:14px;

  







}	

.responsive-slider .slides ul li .slide-body .circle h6 { font-size:24px}

.responsive-slider .slides ul li .slide-body .circle h6 small{ font-size:15px}

.responsive-slider .slides ul li .slide-body .circle h6 { padding:35% 10%; width:120%}

}

@media (max-width: 991px) {

.responsive-slider .slides ul li .slide-body .caption.header {

  top: 20%;

  right: 5% !important;

  left:inherit

}

.responsive-slider .slides ul li .slide-body .caption.lefting {

  top: 15%;

  left: 10%;

  text-align:left

}	

.responsive-slider .slides ul li .slide-body .caption:before {

  font-family: 'neotechregular';

  

   position:absolute;

   left:0%;

   top:0%;

   z-index:1;

   font-size:500px;



    background:rgba(38,148,49,0.9);

	width:110%;

	padding:0px !important

 

}

.responsive-slider .slides ul li .slide-body .circle h6 small { padding:0px; margin:0px; width:auto !important}

.responsive-slider .slides ul li .slide-body .circle h6 { padding:15% 15%}

	 }

	 

@media (max-width: 767px) {

	.responsive-slider .slides ul li .slide-body .caption.header { display:none}	 

		  }

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

  .responsive-slider .slides ul li .slide-body .caption.header h2 {

    font-size: 25px;

  }

    .responsive-slider .slides ul li .slide-body .caption.header h4 {

    font-size: 24px;

  }

  .responsive-slider .slides ul li .slide-body .caption.header h2 i {

    font-size: 20px;

  }

}

@media (max-width: 480px) {

  .responsive-slider .slides ul li .slide-body .caption.header h2 {

    font-size: 16px;

  }

    .responsive-slider .slides ul li .slide-body .caption.header h4 {

    font-size: 16px;

  }

  .responsive-slider .slides ul li .slide-body .caption.header h2 i {

    font-size: 14px;

  }

  .responsive-slider .slides ul li .slide-body .caption {

	  font-size:14px

  }

}

.responsive-slider .slides ul li .slide-body .caption.sub {

/*  bottom: -78px;

  right: -20px;*/

  

}

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

  .responsive-slider .slides ul li .slide-body .caption.sub {

    font-size: 14px;

    bottom: -40px;

    right: 0px;

  }

  .responsive-slider .slides ul li .slide-body .caption.header {

  top: 28%;

  left: 25%;

}

}

@media (max-width: 480px) {

  .responsive-slider .slides ul li .slide-body .caption.sub {

    font-size: 10px;

    bottom: -30px;

    right: 0;

	left:0%

  }

    .responsive-slider .slides ul li .slide-body .caption.header {

  top: 28%;

  left: 3%;

}

}

.responsive-slider .slides ul li .slide-body .caption.img-html5 {

  top: 30%;

  right: 25%;

  width: 30%;

}

.responsive-slider .slides ul li .slide-body .caption.img-html5 img {

  max-width: 100%;

}

.responsive-slider .slides ul li .slide-body .caption.img-css3 {

  top: 57%;

  right: 12%;

  width: 10%;

}

.responsive-slider .slides ul li .slide-body .caption.img-css3 img {

  max-width: 100%;

}

.responsive-slider .slides ul li .slide-body .caption.img-bootstrap {

  top: 0%;

  right: 0%;

  

}

.responsive-slider .slides ul li .slide-body .caption.img-bootstrap img {

  max-width: 100%;

}

.responsive-slider .slides ul li .slide-body .caption.img-twitter {

  top: 19%;

  right: 12%;

  width: 11%;

}

.responsive-slider .slides ul li .slide-body .caption.img-twitter img {

  max-width: 100%;

}

.responsive-slider .slides ul li .slide-body .caption.img-jquery {

  top: 48%;

  left:25%

  

}

.responsive-slider .slides ul li .slide-body .caption.img-jquery img {

  max-width: 100%;

}

.responsive-slider .slider-control {

  position: absolute;

  font-size: 16px;

  color: #fff;

  top: 45%;

  background-color: #000;

  padding:28px 14px;

}

.responsive-slider .slider-control.left {

/*

-webkit-transform: skew(20deg);

	   -moz-transform: skew(20deg);

	     -o-transform: skew(20deg);*/

		 margin:0 auto;

		 text-align:center;

		 left:0px;

outline: none;

outline: 0;

}

.responsive-slider .slider-control.left:hover {

  text-decoration: none;

  padding-left: 18px;

   -moz-outline-style: 0;	

-moz-outline-style: none;



}

.responsive-slider .slider-control.left:active

{

outline: none;

outline: 0;

}

.responsive-slider .slider-control.right {

/*-webkit-transform: skew(20deg);

	   -moz-transform: skew(20deg);

	     -o-transform: skew(20deg);*/

		 margin:0 auto;

		 text-align:center;

		 right:0px;

		 outline: none;

outline: 0;

}

.responsive-slider .slider-control.right:hover {

  text-decoration: none;

  padding-right: 18px;

}

@media (max-width: 480px) {

  .responsive-slider .slider-control.left,

  .responsive-slider .slider-control.right {

    display: none;

  }

}

.responsive-slider .pages {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  text-align: center;

}

.responsive-slider .pages .page {

  display: inline-block;

  color: transparent;

  width: 5px;

  height: 5px;

  border: 3px solid #fff;

  border-radius: 50%;

  opacity: 0.5;

}

.responsive-slider .pages .page.active {

  opacity: 1;

}