/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	/*vertical-align: baseline;*/
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer,
header, hgroup, main, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}

/****************************
-- General --
****************************/

html {
  font-size: 62.5%;
  /*height: 100%;
  background:#FFF;*/
}

body {
	margin:0px;
	padding:0px;
  height: 100%;
  overflow-y: scroll;
 /* background:#FFF;*/
  
}

@font-face {
      font-family: 'iconos-new';
      src: url('../fonts/iconos-new.eot?28085500');
      src: url('../fonts/iconos-new.eot?28085500#iefix') format('embedded-opentype'),
           url('../fonts/iconos-new.woff?28085500') format('woff'),
           url('../fonts/iconos-new.ttf?28085500') format('truetype'),
           url('../fonts/iconos-new.svg?28085500#fontello') format('svg');
      font-weight: normal;
      font-style: normal;
    }

@font-face {
      font-family: 'fontello';
      src: url('../fonts/fontello.eot?28085500');
      src: url('../fonts/fontello.eot?28085500#iefix') format('embedded-opentype'),
           url('../fonts/fontello.woff?28085500') format('woff'),
           url('../fonts/fontello.ttf?28085500') format('truetype'),
           url('../fonts/fontello.svg?28085500#fontello') format('svg');
      font-weight: normal;
      font-style: normal;
    }
	
.demo-icon2
    {
        font-family: 'iconos-new';
      font-style: normal;
      font-weight: normal;
      speak: none;
     
      display: inline-block;
      text-decoration: inherit;
      text-align: center;
      /* opacity: .8; */
     
      /* For safety - reset parent styles, that can break glyph codes*/
      font-variant: normal;
      text-transform: none;
     
      /* fix buttons height, for twitter bootstrap */
      line-height: 1em;
     
     /* Font smoothing. That was taken from TWBS */
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
     
      /* Uncomment for 3D effect */
      /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
    }
.demo-icon
    {
      font-family: "fontello";
      font-style: normal;
      font-weight: normal;
      speak: none;
     
      display: inline-block;
      text-decoration: inherit;
      width: 1em;
      margin-right: .2em;
      text-align: center;
      /* opacity: .8; */
     
      /* For safety - reset parent styles, that can break glyph codes*/
      font-variant: normal;
      text-transform: none;
     
      /* fix buttons height, for twitter bootstrap */
      line-height: 1em;
     
      /* Animation center compensation - margins should be symmetric */
      /* remove if not needed */
      margin-left: .2em;
     
      /* You can be more comfortable with increased icons size */
      /* font-size: 120%; */
     
      /* Font smoothing. That was taken from TWBS */
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
     
      /* Uncomment for 3D effect */
      /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
    }
/****************************
-- General Layout --
****************************/
#main {
  position: relative;
}

.wrapper {
  margin: 0 auto;
}
.wrapper {
  margin: 0 auto;
  padding: 0 5px;
  max-width: 580px;
}

/****************************
-- Text Generals --
****************************/
body {
  font-family: Helvetica, sans-serif;
  background: #FFF;
}

a {
  cursor: pointer;
  text-decoration: none;
  font-size: 12px;
  font-size: 1.2rem;
  color: #5C5C5C;
  line-height: 1.2;
}

/****************************
-- Paragraphs --
****************************/


h1 {
  color: #d52b1e;
  font-size: 15px;
  font-size: 1.5rem;
  text-align: left;
  line-height: 1;
  font-family: "DINCond-Bold";
}

h1 span {
  display: block;
}

h3 {
  font-family: "DINCond-Bold";
  font-size: 12px;
  font-size: 1.5rem;
  line-height: 1;
  color: #000000;
}

p {
  display: block;
  font-size: 15px;
  /*font-size: 1.2rem;*/
  color: #000000;
  font-family: "DINCond-Regular";
  line-height: 20px;
}

p a {
  font-size: 15px;
  /*font-size: 1.2rem;*/
  color: #000000;
  font-family: "DINCond-Regular";
  line-height: 20px;
}

p span {
  display: block;
}

p strong {
  font-family: "DINCond-Bold";
  font-size:16px;
}

p.titulo {
  display: block;
  font-size: 24px;
  color: #FFF;
  font-family: "DINCond-Regular";
  line-height: 1.2;
  margin: 10% 0% 10% 0%!important;
}

p.titulo-bold {
  display: block;
  font-size: 24px;
  color: #FFF;
  font-family: "DINCond-Bold";
  line-height: 1.2;
  margin: 10% 0% 10% 0%!important;
}

.copete {
    font-family: "DINCond-Bold"!important;
    font-size: 17px;
    margin-top: 15px;
    margin-bottom: 10px!important;
    display: block;
    text-align: left!important;
}

.btn-back {
 	font-family:"gotham_book", Verdana, Geneva, sans-serif;
 	font-size: 18px;
 	color:#FFF!important;
 	margin-top: 25%;
 	display:block;
 	transition: all 0.5s;
 	padding-left: 15px;
}
.btn-back:hover {
	margin-left:20px;
	transition: all 0.5s;
}
/****************************
-- Header --
****************************/
#header {
  background: #da262c;
  padding: 10px 0 7px;
  position:relative;
  height:55px;
}

#header img {
  margin: 0 auto;
  float:left;
   position:relative;
}
#header h1 {
  color: #fff;
  font-size: 14px;
  /*font-size: 1.5vw;*/
  text-align: left;
  margin-left:8px; 
  line-height: 1.3;
  font-family: "DINCond-Regular";
  float:left;
   position:relative;
       margin-top: 7px;
}
#header h1 strong {
  color: #fff;
  font-size: 15px;
 /* font-size: 1.5vw;*/
  text-align: left;
  line-height: 1.3;
  font-family: "DINCond-Bold";
  padding-left:0px!important;
  margin-left:0px!important;
  
}

/****************************
-- Section --
****************************/
#home,
#main,
#pages {
  max-width: 580px;
  min-width:300px;
  width: 100%;
  margin: 0 auto;
}

#home {
  padding: 14px 0;
}

#home > p {
  padding: 0 30px;
  margin-bottom: 14px;
}

.box > a {
  height: 56px;
  display: block;
}

.box .icon {
  width: 16%;
  background: #eee;
  height: 100%;
}

.box .icon img {
  margin: 20px 13px;
}

.box.odd .icon {
  background: #f5f5f5;
}
#main .box .txt, #pages .box .txt.box .txt{
	 width: 100%;
}
.box .txt {
  width: 100%;
  background: #E6E6E6;
  height: 100%;
    border-radius: 5px;
}
hr { height:0px; background:#FFF; border:none;}

.box.odd .txt {
  background: #E6E6E6;
}

.box .txt p {
  font-size: 18px;
  margin: 20px 0px 0 26px;
}

.box .txt img {
  margin: 20px 30px 0 0px;
}

#main, #pages {
  padding: 15px 0;
}

.title {
  text-align: center;
  margin-bottom: 15px;
}

#main .box > a {
  height: 65px;
  display: block;
}

#main .box .txt,
#pages .box .txt {
  width: 100%;
}

#main .box .txt p {
  margin-top: 15px;
}

#main .box .txt img {
  margin-top: 26px;
}

/*#home .dropdown {
  padding: 0;
}*/

.dropdown {
  /*display: none;
  background: #f5f5f5;
      padding-top: 18px;
 */
}

.step {
  background: #fff;
  padding: 20px 0px;
}
.txt-step {
  background: #f5f5f5;
  padding: 5px 30px;
}


.dropdown h1 {
  margin-bottom: 0px;
}

.dropdown > p {
  margin-bottom: 0px;
}

.step h2 {
  margin-bottom: 23px!important;
}

.step h2 span {
 /* padding: 8px 12px!important;
  border-radius: 100%!important;
  background-color:#da262c;
  color:#FFF;*/
}

.step h3 {
  margin-bottom: 15px;
}

.step img {
  /*margin-right: 27px;*/
   display: inline-block;
    vertical-align: middle;
  
}

.step .subscription img {
  margin-right: 16px;
}

.step p {
  width: 100%;
  text-align: justify;
}

.step .subscription p {
  width: 78%;
  margin-top: 3px;
}
.solo-letra{
	margin-bottom: 0px!important;
    margin-top: -36px!important;
    text-align: center!important;
    margin-left: 56px!important;
}
.step .space {
  margin-bottom: 20px;
}

.margintop {
  /*margin-top: 20px;*/
  margin-top: 13px;
}
.margintop-dies {
    margin-top: 8px;
}

.separator {
    /* border-bottom: 1px solid #fcfcfc; 
    margin-bottom: 30px;*/
    padding-bottom: 0px;
}

.terms {
  margin-top: 20px;
  font-size: 13px;
}

.float_o {
  float: left;
  font-size: 15px;
  left: 150px;
  position: relative;
  top: -105px;
}

/****************************
-- Utilities --
****************************/
/* For modern browsers */
*:before,
*:after {
  content: '';
  position: absolute;
}

.cf:before,
.cf:after {
  content: "\0020";
  display: table;
  position: static;
}

.cf:after {
  clear: both;
}

.first {
  float: left;
  display:inherit!important;
  margin-right: 12px;
  
}

.last {
  /*float: right;*/
  /* float: left; */
  /* margin-left: 8%; */
}

.center {
  margin: 0 auto;
  text-align: center;
}

/* Vertical Align */
.vertical {
  height: 100%;
}

.vertical:before{
  content: '';
  display: inline-block;
  width: 0;
  height: 100%;
  position: static;
  vertical-align: middle;
}

.vertical .centered {
  display: inline-block;
  vertical-align: middle;
}

.legal {
  background:#FFF;
  width:100%;
  padding: 10px 0 10px 0;
  margin-top:30px;
 
}

.legal .collapse-legal {
  font-size: 1.4rem;
  color: #808080;
  display: block;
  margin: 0 auto;
}

.legal .content {
  display: none;
  padding: 10px;
  border-top: 1px solid #ccc;
  padding: 14px 10px 14px 10px;
  border-top: 1px solid #ccc;
  margin-top: 13px;
  width: 100%;
}

.legal .collapse-legal {
  text-align: center;
  color: #343434;
  font-family: "gotham_book";
}

.legal p {
  text-align: justify;
  color: #343434;
  font-family: "gotham_book";
}

/****************************
-- Footer --
****************************/
#footer {
  margin-top:20px;
  background: #d52b1e;
  padding: 20px 0 35px;
}

#header .logo {
  background: url(../images/logo_claro_flat.png);
  width: 119px;
  height: 53px;
  display: block;
  text-indent: -9999px;
}

#header a {
  font-size: 2rem;
  color: #fff;
  text-align:center;
}

.list-inline li {
  display: inline-block;
  margin-right: 2px;
}


/****************************
-- Fonts --
****************************/
@font-face {
  font-family: 'DINCond-Regular';
  src: url('../fonts/DINCond-Regular.eot'); /* IE9 Compat Modes */
  src: url('../fonts/DINCond-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/DINCond-Regular.woff') format('woff'), /* Modern Browsers */
  url('../fonts/DINCond-Regular.ttf')  format('truetype'), /* Safari, Android, iOS */
  url('../fonts/DINCond-Regular.svg#62f75ccd04c776030ca293d074e92944') format('svg'); /* Legacy iOS */

  font-style:   normal;
  font-weight:  200;
}

@font-face {
  font-family: 'DINCond-Bold';
  src: url('../fonts/DINCond-Bold.eot'); /* IE9 Compat Modes */
  src: url('../fonts/DINCond-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/DINCond-Bold.woff') format('woff'), /* Modern Browsers */
  url('../fonts/DINCond-Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
  url('../fonts/DINCond-Bold.svg') format('svg'); /* Legacy iOS */

  font-style:   normal;
  font-weight:  200;
}

@font-face {
  font-family: 'gotham_black';
  src: url('../fonts/copyfonts.com_gotham-black.eot'); /* IE9 Compat Modes */
  src: url('../fonts/copyfonts.com_gotham-black.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/copyfonts.com_gotham-black.woff') format('woff'), /* Modern Browsers */
  url('../fonts/copyfonts.com_gotham-black.ttf')  format('truetype'), /* Safari, Android, iOS */
  url('../fonts/copyfonts.com_gotham-black.svg#ba4ac0babd0f10b69ed14d91cd5c8788') format('svg'); /* Legacy iOS */

  font-style:   normal;
  font-weight:  400;
}

@font-face {
  font-family: 'gotham_book';
  src: url('../fonts/copyfonts.com_gotham-book.eot'); /* IE9 Compat Modes */
  src: url('../fonts/copyfonts.com_gotham-book.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/copyfonts.com_gotham-book.woff') format('woff'), /* Modern Browsers */
  url('../fonts/copyfonts.com_gotham-book.ttf')  format('truetype'), /* Safari, Android, iOS */
  url('../fonts/copyfonts.com_gotham-book.svg#65526539dec42e535893223c14767f58') format('svg'); /* Legacy iOS */

  font-style:   normal;
  font-weight:  400;
}

@font-face {
  font-family: 'gotham_thin';
  src: url('../fonts/Gotham-Thin.eot'); /* IE9 Compat Modes */
  src: url('../fonts/Gotham-Thin.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/Gotham-Thin.woff') format('woff'), /* Modern Browsers */
  url('../fonts/Gotham-Thin.ttf')  format('truetype'), /* Safari, Android, iOS */
  url('../fonts/Gotham-Thin.svg#62f75ccd04c776030ca293d074e92944') format('svg'); /* Legacy iOS */

  font-style:   normal;
  font-weight:  200;
}

/****************************
-- Images Positioning --
****************************/
img {
  /*display: block;*/
  max-width: 100%;
}

.pack img {
  /*display: inline-block;
  vertical-align: middle;*/
  width:10%;
  margin-left:10px;
  vertical-align: top;
}

.pack h2 {
  display: block;
  font-size: 16px;
  font-size: 1.3rem;
  font-family: "DINCond-Bold";
  margin-bottom: 5px;
  
}


.pack .txt {
  display: inline-block;
  vertical-align: middle;
  margin-left: 20px
}

.pack.separator {
  padding-top:10px;
 /* margin-bottom: 15px;
  border-bottom: 1px solid #bdbdbd;*/
  padding-bottom: 10px;
}
.pull-left {
  float: left;
}

.pull-right {
  float: right;
}

.pack .txta {
  display: inline-block;
  vertical-align: middle;
  margin-left: 9px;
  width: 252px;
}

.txta {
  margin: 0px 0 0;
}
.text_red  p{
color:#d52b1e;
text-align:center;
margin-top:10px;
} 

h1 {
  color: #fff;
  font-size: 18px;
  font-size: 1.8rem;
  text-align: center;
  line-height: 1.3;
  font-family: "DINCond-Bold";
}

h1 span {
  display: block;
}

h2 {
  display: block;
  font-size: 16px;
  font-size: 1.6rem;
  font-family: "DINCond-Bold";
  margin-bottom: 10px;
  line-height: 1;
}

/*h2 span {
  display: block;
}*/

/*p {
  display: block;
  font-size: 12px;
  font-size: 1.2rem;
  color: #5c5c5c;
  font-family: "DINCond-Regular";
  /*line-height: 1.2;
  line-height: 18px;
}

p span {
  display: block;
}

p strong {
  font-family: "DINCond-Bold";
}*/

#contenedor-tabla-txt{ width:100%; float:left; clear:both; margin-bottom:20px;}
.div-tabla-txt { width:40%; float:left;}

.div-tabla-txt p {margin:0 auto;margin-top: 76%;padding-left: 19px;}


.fondo-tabla {
	background:#e6e6e6;
	border-radius:20px;
	width:100%;
	padding:10px;
	float:left;
}

.tabla-control {
	/*background:#e6e6e6;
	border-radius:20px;
	*/
	width:100%;


}

.tabla-control,
.tabla-control .txt-title,
.tabla-control .txt-uno,
.tabla-control .txt-dos {
	text-align:center;
}

.tabla-control .txt-title {
	font-family:gotham_book, Verdana, Geneva, sans-serif;
	font-size:12px;
}

.tabla-control .txt-uno {
	font-family:gotham_book, Verdana, Geneva, sans-serif;
	font-size:12px;
}
.tabla-control .txt-uno-g {
	font-family:gotham_book, Verdana, Geneva, sans-serif;
	font-size:16px;
}

.tabla-control .txt-dos {
	font-family:DINCond-Bold, Verdana, Geneva, sans-serif;
	font-size:12px;
}


.tabla-control tr td{ padding:10px;}


.tabla-control tr td:first-child { border-right:1px solid #b3b3b3; } 
.tabla-control tr td:last-child { border-left:1px solid #b3b3b3; } 

.tabla-control .td-blanco,.tabla-control .td-blanco td { border:none!important; padding:0px!important; height:10px; }

.borde-med {
    border-bottom: 1px solid #b3b3b3;
    padding-bottom: 10px;
}

.panel-group .panel-heading+.panel-collapse>.list-group, .panel-group .panel-heading+.panel-collapse>.panel-body {
    border-top:none!important;
}

.botones-principal {
    margin-top: 12%;
    margin-left: 5%;
}

.botones-principal li {width: 243px;margin-bottom:20px;}

.botones-principal li a {
  display: block;
  color: #fff;
  padding: 15px;
  border: 1px solid #FFF;
  position: relative;
  font-size: 19px;
  transition: all 0.5s;
  font-family:gotham_book, Verdana, Geneva, sans-serif;
  text-align:center;
}

.botones-principal li a:hover {
    display: block;
    color: #000;
    padding: 15px;
    position: relative;
    background-color: white;
	transition: all 0.5s;
}


.foot-txt {
  display: block;
  font-size: 17px;
  color: #FFF;
  font-family: "DINCond-Regular";
  line-height: 1.2;
  text-align:center;
}
.foot-txt a {
  color: #FFF;
}

.circulo-rojo{
		width: 70px;
		height: 70px;
		background: #da262c;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
		border-radius: 50px;
		text-align: center;
		padding-top: 15px;
		float: left;
		margin-right: 12px;
}

.circulo-rojo-precio{
		width: 70px;
		height: 70px;
		background: #da262c;
		-moz-border-radius: 50px;
		-webkit-border-radius: 50px;
		border-radius: 50px;
		text-align: center;
		padding-top: 20px;
		float: left;
		margin-right: 12px;
}

.megas{
  font-size: 12px;
  color: #FFF;
  font-family: "gotham_thin";
  display:block;
  clear:both;
 }

.precio{
  font-size: 26px;
  color: #FFF;
  font-family: "gotham_book";
  display:block;
  clear:both;
  letter-spacing: -2px;
 }


.g-black{
  font-family: "gotham_black"!important;
 }

.line-16{line-height: 16px; }

@media (min-width: 490px) {
	#accordion .panel-heading a:before {
		right: 12px!important;
		top: 19%;
		height: 71%;
	}
}

@media (max-width: 390px) {
  	
	.div-tabla-txt { width:100%; float:left; clear:both;}
	
	.div-tabla-txt p {width:100%; margin:0 auto; margin-top: 10px;}
	
	
	.fondo-tabla {
		
		width:100%;
		padding:10px;
		float:left;
		clear:both;
	}
  
  
}







