@font-face {
  font-family: 'dinpro';
  src: url('../fonts/dinpro-regular.otf');
}

@font-face {
  font-family: 'dinpro-condensed_regular';
  src: url('../fonts/dinpro-condensed_regular.otf');
}

@font-face {
  font-family: 'dinpro-condensed-bold';
  src: url('../fonts/dinpro-condensed_bold.otf');
}

body{
background-color: #fff;	
}
.beneficios span{
font-family: dinpro-condensed_regular;
font-size: 20px;
}

button.close {
    -webkit-appearance: none;
    padding: 0;
    cursor: pointer;
    background: url(../img/close.png);
    border: 0;
    background-repeat: no-repeat;
    background-size: 100%;
	height: 35px;
    width: 35px;
}

.close {
    float: right;
    font-size: 21px;
    font-weight: bold;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20);
    opacity: .9;
}

.modal-title {
    margin-left: 7%;
}


.modal-header {
    text-align: center;
    color: #fff;
    border: 0;
    padding: 0;    
}

.modal-body p{
	color: #fff;
}

.categoria span{
font-family: dinpro-condensed_regular;
font-size: 20px;
}

span img{
    width: 28px;
    margin-right: 8px;
    margin-top: -5px;	
}

.grey{
	color: #7b7b7b;
}

.bg-cream{
	background-color: #eeeae9;
    padding: 15px 15px 15px 15px;	
	
}

.text-2{
    padding: 15px 15px 15px 15px;
    font-size: 17px;    	
}

.pd20{
    padding: 20px;
}

.img100{
	width: 100%;
}

.f-left{
	float: left;
}

.box-table{
	width: 100%;
}

.box-table p{
	font-family: 'dinpro-condensed-bold';	
}


.w-all{
	width: 100%;
}

.beneficios{
	height: 84;
}

.categoria{
	text-align: center;
    padding: 10px;
    height: 50px;
    width: 99%;
}


}

.border3-white{
	border-right: 2px solid #fff;
	border-left: 2px solid #fff;
	border-top: 2px solid #fff;
}

.box-left{
    width: 40%;
}

.numbert{
	font-size: 46px;
	font-family: 'dinpro-condensed_regular';		

}

.meses{
	font-family: 'dinpro-condensed-bold';	
}

.box-left2{
    width: 100%;
    height: 84px;
    text-align: center;
    padding: 27px;
}

.pad5{
    padding: 5px 5px 5px 5px;	
}

.box-right{
	width: 60%;
}

.bg-grey1{
background-color: #edeae9;
width: 100%;	
}

.bg-grey2{
background-color: #dcd9d8;
width: 100%;	
}

.bg-red{
	background-color: #fb2f38;
	height: 30px;
	text-align: center;
	color: #fff;
    width: 100%;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;    
}

.bg-red span, .bg-yelow span, .bg-black span{
	font-size: 23px;
	font-family: 'dinpro-condensed_regular';
}

.bg-yelow{
	background-color: #e1ae2e;
	height: 30px;
	text-align: center;
	color: #fff;
    width: 100%;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;    			
}


.bg-black{
	background-color: #000;
	height: 30px;
	text-align: center;
	color: #fff;
	border-right: 0 !important;	
    width: 100%;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;    	
}

.w-33{
	width: 33%;
}

.w-33 span{
}

.he80{
	height: 80px;
}

.he30{
	height: 30px;
}

.he40{
	height: 40px;
}



body, h1, h2, h3, h4, h5, p, span{

font-family: 'dinpro';

}

	.div-top{
	margin-top: 19%;
	}

    /* Custom, iPhone Retina */ 
    @media only screen and (min-width : 320px) {
   
	.btn-top{
	    position: relative;
	    bottom: 0;
	    left: 0;
	    text-align: center;
	}

	.btn-top img{
	   	width: 100%;
	   	max-width: 100%;	
	}

	.space-bot{
		margin-bottom: 30px;
	}

	.box-top{
		position: relative;
	}

	.box-left {
	    width: 100%;
	}

	.box-right{
		width: 100%;
	}

	.box-table p{
		font-size: 14px;
		line-height: 14px;
	}

	.meses{
	font-size: 11px;
	}


    }

    /* Extra Small Devices, Phones */ 
    @media only screen and (min-width : 480px) {

	.box-left {
	    width: 100%;
	}

	.box-right{
		width: 100%;
	}

	.box-table p{
		font-size: 14px;
	}

	.meses{
	font-size: 15px;
	}

    }

    /* Small Devices, Tablets */
    @media only screen and (min-width : 768px) {

	.box-left {
	    width: 100%;
	}


	.box-right{
		width: 100%;
	}

	.box-table p{
		font-size: 14px;
	}

	.meses{
	font-size: 11px;
	}

    }

    /* Medium Devices, Desktops */
    @media only screen and (min-width : 992px) {

.btn-top{
    position: absolute;
    bottom: 0;
    left: -6px;	
    opacity: 0.8;  
}

	.box-left {
	    width: 40%;
	}


	.box-right{
		width: 60%;
	}


	.box-table p{
		font-size: 18px;
	}

	.meses{
	font-size: 11px;
	}


    }

    /* Large Devices, Wide Screens */
    @media only screen and (min-width : 1200px) {


	.box-left {
	    width: 40%;
	}

	.box-right{
		width: 60%;
	}


	.box-table p{
		font-size: 18px;
	}

	.meses{
	font-size: 11px;
	}

    }