/* start custom slider css */

.col-md-4{
	width:33.333%;
	float:left;
}
.range-holder{
	margin: 3em auto;
	padding: 260px 40px 40px 30px;
	width: 100%;
	
}

.dragdealer {
  position: relative;
  height: 30px;
  background: #FFF;
  border-radius: 8px;
  border: 1px solid #a7a7a7;
}
.dragdealer .handle {
  position: absolute;
  top: 0;
  left: 0;
}

.stripe{
	background: #ddd  url("https://dl.dropboxusercontent.com/u/4277345/codepen/stripe-bg.png") top left repeat;
	position: absolute;
	top: 0;
	left: 0;
	margin: 3px;
	height: 24px;
	border-radius: 8px;
}

#part1-highlight{position: absolute; top:0; left: 0px; height: 24px; opacity: .5; background: #8dc63f; display: none;}
#part2-highlight{position: absolute; top:0; left: 0px; height: 24px; opacity: .5; background: #e07c00; display: none;}
#part3-highlight{position: absolute; top:0; left: 0px; height: 24px; opacity: .5; background: #008da8; display: none;}
#part4-highlight{position: absolute; top:0; left: 0px; height: 24px; opacity: .5; background: #708da8; display: none;}
#part5-highlight{position: absolute; top:0; left: 0px; height: 24px; opacity: .5; background: #90fdf8; display: none;}



.square{
  position: absolute;
  top: 0;
  left: 0;	  
  margin-top: -13px;
  margin-left: -10px;
  cursor: pointer;
  width: 50px;
  height: 37px;
  background: #505054;
  border-radius: 8px;
  color: #FFF;
  font-size: 14px;
  line-height: 30px;
  text-align: center;
  padding-top: 13px;
}

.menu-line{width: 50%; margin: 2px auto; height: 5px; background: #FFF; display: block;}

.handle .infobox{
	position: absolute;
    top: 0;
    left: 0;
    margin-top: -235px;
    margin-left: -117px;
	width: 260px;
	height: 190px;
	background: #FFF;
	padding: 0px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border: #26ae61 solid 2px;
}

.handle .infobox:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 20px 23px 0;
	border-color: #FFFFFF transparent;
	display: block;
	width: 0;
	z-index: 1;
	bottom: -20px;
	left: 107px;
}

.handle .infobox:before {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 21px 24px 0;
	border-color: #008da8 transparent;
	display: block;
	width: 0;
	z-index: 0;
	bottom: -23px;
	left: 106px;
}

.infobox .titlebar{
	background: #26ae61;
	color: #FFF;
	padding: .5em;
	line-height: 1.5em;
	font-size: 15px;
}
#plan-holder{font-weight: bold;}

.handle .infobox .innerbox{
	padding: 1em;
	line-height:20px;
	text-align:left;
}

.info-price{color: #e07c00; font-size: 33px; line-height: 1.5em;}


.annual-label{
  color: #505054; font-size: 14px; font-weight: bold; width: 110px; line-height: 1.8em;}
.annual-price{color: #939393; font-size: 17px; width: 110px;} 

.desctext{color:#000000;font-weight:bold;font-size:20px;}
.desctitle{color:#86B68E;font-weight:bold;font-size:18px;}
.text-center{
	text-align:center;
}
.slidercontainer{
	width:70%;text-align:center;margin:auto;
}
/*end custom slider css  */