/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

@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); */
    }
	
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,body {
  height: 100%;
  background:#222222;
  
}



html {
  font-size: 62.5%;
  /*height: 100%;*/
  }

body {
  height: 100%;
  overflow-y: scroll;
  
  
}

/****************************
-- General Layout --
****************************/
#main {
  position: relative;
}

/*.wrapper {
  margin: 0 auto;
}*/
.wrapper {
  margin: 0 auto;
  padding: 0 5px;
  max-width: 520px;
}

/****************************
-- Text Generals --
****************************/
body {
  font-family: Helvetica, sans-serif;
  background: #222222;
}

a {
  cursor: pointer;
  text-decoration: none;
  font-size: 15px;
  /* font-size: 1.2rem; */
  color: #FFF;
  line-height: 1.2;
}

/****************************
-- Paragraphs --
****************************/
.blanco {
	color: RGB(255, 255, 255);
font-family: "gotham_book";
font-size: 13px;
margin-top: 8px;
line-height: 22px;
width: 100% !important;

}

h1 {
  color: #d52b1e;
  font-size: 15px;
  font-size: 1.5rem;
  text-align: left;
  line-height: 1;
  font-family: "gotham_bold";
}

h1 span {
  display: block;
}

h3 {
  font-family: "gotham_bold";
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1;
  color: #313131;
}

p {
  display: block;
  font-size: 12px;
  font-size: 1.2rem;
  color: #FFF;
  font-family: "gotham_light";
  line-height: 1.2;
}

p span {
  display: block;
}

p strong {
  font-family: "gotham_bold";
}

/****************************
-- Header --
****************************/
#header {
    background: #222222;
    padding: 10px 0 0px;
    position: relative;
    height: 70px;
}
#header .wrapper {
	background: transparent;
	height: 100%;
	width: 100%;
	border-top-left-radius: 1em;
	border-top-right-radius: 1em;
	/*padding: 0px 14px;*/
} 
#header img {
	margin: 0 auto;
	float:right;
	position:relative;
	width: 110px;
	margin-top: 20px;
	/* margin-bottom: 0px; */
	/* padding: 7px 0; */
}
#header h1 {
  color: #fff;
  font-size: 14px;
  /*font-size: 1.5vw;*/
  text-align: left;
  margin-left:8px; 
  line-height: 1.3;
  font-family: "gotham_light";
  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: "gotham_bold";
  padding-left:0px!important;
  margin-left:0px!important;
  
}

/****************************
-- Section --
****************************/
#home,
#main,
#pages {
  max-width: 520px;
  width: 100%;
  margin: 0 auto;
}

#home {
  padding: 1px 10px;
  border-bottom-left-radius: 1em;
  border-bottom-right-radius: 1em;
}

#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: #FFF;
	min-height: 56PX;
	border: 1px solid #FFFFFF;
   /* border-radius: 5px;
 min-height: 56px; */
}
hr {height: 1px;background: #222;border:none;margin-top: 13px;margin-bottom: 13px;}

.box.odd .txt {
	background: #FFFFFF;
}

.box .txt p {
	font-size: 14px;
	margin: 17px 0px 0 13px;
	color: #000;
	font-weight: bold;
  /* WIDTH: 308PX; */
}

.box .txt img {
  margin: 19px 17px 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: transparent;
	padding-top: 5px;
 
}

.step {
 /* background: #F2F2F2;*/
    padding: 20px 30px!important;
    margin-bottom: 8px;
}
.txt-step {
  background: #f5f5f5;
  padding: 5px 30px;
}


.dropdown h1 {
  margin-bottom: 0px;
}

.dropdown > p {
  margin-bottom: 0px;
}

.step h2 {
  margin-bottom: 8px;
}

.step h2 span {
  padding: 8px 12px;
  border-radius: 100%;
}

.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: 70%;
}

.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;
}
.margintop-dies {
    margin-top: 8px;
}

.separator {
    /* border-bottom: 1px solid #fcfcfc; 
    margin-bottom: 30px;*/
    padding-bottom: 0px;
}

.terms {
  margin-top: 30px;
  font-size: 1.1rem;
}

.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;
  
}

.last {
  float: right;
}

.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;
 
}

.legal .collapses {
  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;
}

.legal .collapses, .legal p {
  text-align: center;
  color: #343434;
  font-family: "gotham_book";
}

/****************************
-- Footer --
****************************/
#footer {
	margin-top: 20px;
	background: #FFF;
	padding: 20px 0px 20px;
}

footer {
	color: #333;
font-family: "gotham_book";
font-size: 13px;
margin-top: 8px;
line-height: 17px;
width: 100% !important;
text-align: center;
background: #fff;
width: 100%;
margin-top: 50px;
padding: 40px 0;

}

#footer .logo {
	color:#FFF;
	text-align:right;
	font-family: "gotham_book";
	font-size:14px;
}

#footer a {
  font-size: 1rem;
  color: #fff;
  text-align:center;
}

.list-inline li {
  display: inline-block;
  margin-right: 2px;
}


/****************************
-- Fonts --
****************************/
@font-face {
  font-family: 'gotham_light';
  src: url('../fonts/Gotham-Light.eot'); /* IE9 Compat Modes */
  src: url('../fonts/Gotham-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/Gotham-Light.woff') format('woff'), /* Modern Browsers */
  url('../fonts/Gotham-Light.ttf')  format('truetype'), /* Safari, Android, iOS */
  url('../fonts/Gotham-Light.svg#62f75ccd04c776030ca293d074e92944') format('svg'); /* Legacy iOS */

  font-style:   normal;
  font-weight:  200;
}

@font-face {
  font-family: 'gotham_bold';
  src: url('../fonts/Gotham-Bold.eot'); /* IE9 Compat Modes */
  src: url('../fonts/Gotham-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/Gotham-Bold.woff') format('woff'), /* Modern Browsers */
  url('../fonts/Gotham-Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
  url('../fonts/Gotham-Bold.svg') format('svg'); /* Legacy iOS */

  font-style:   normal;
  font-weight:  200;
}
@font-face {
  font-family: 'gotham_medium';
  src: url('../fonts/Gotham-Medium.eot'); /* IE9 Compat Modes */
  src: url('../fonts/Gotham-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('../fonts/Gotham-Medium.woff') format('woff'), /* Modern Browsers */
  url('../fonts/Gotham-Medium.ttf')  format('truetype'), /* Safari, Android, iOS */
  url('../fonts/Gotham-Medium.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;
}

/****************************
-- 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: "gotham_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;
} 



#head{/*margin: 35px 0px 35px 0px;*/
	width: 100%;
}

#head h1{
	font-family: "gotham_book"!important;
	font-size: 22px;
	color: #FFF;
	text-align: left;
	text-indent: 0;
	padding-top: 26px;
	padding-right: 0px;
	padding-left: 0px;
	padding-bottom: 34px;
	width: 100%;
}

#head h2{font-family: "gotham_book"; font-size:14px; color:#000; text-align:left;text-indent: 2px;}



/*.alto {
    min-height: 100px!important;
}*/


h1 {
  color: #fff;
  font-size: 18px;
  font-size: 1.8rem;
  text-align: center;
  line-height: 1.3;
  font-family: "gotham_bold";
}

h1 span {
  display: block;
}

h2 {
  display: block;
  font-size: 17px;
  /* font-size: 1.5rem; */
  font-family: "gotham_medium";
  margin-bottom: 4px;
  line-height: 21px;
  color:#fff;
}

h2 span {
  display: block;
}

p {
  display: block;
  font-size: 12px;
  font-size: 1.2rem;
  color: #FFF;
  font-family: "gotham_light";
  /*line-height: 1.2;*/
  line-height: 18px;
}

p.marTop {
	margin-top: 20px !important;
}

p span {
  display: block;
}

p strong {
  font-family: "gotham_bold";
}

.dos-renglones .first { margin-top:10px!important}

.negro{ color:#000!important;display: initial;}


.listado { list-style:disc; margin-left:18px; margin-bottom: 20px !important;}

.listado li {
	float: left;
	clear: both;
	color: #FFF;
	font-family: "gotham_book";
	font-size: 13px;
	margin-top: 8px;
	line-height: 21px;
}

.listado li strong {font-family: "gotham_bold";}

.azul{color:#29ABE2}


.panel {
  /*border-width: 0 0 1px 0;
  border-style: solid;*/
  /*border-color: #fff;*/
  /*background: none;*/
  box-shadow: none;
  border:none!important;
}

.panel:last-child {
  border-bottom: none;
}

.panel-group > .panel:first-child .panel-heading {
  border-radius: 4px 4px 0 0;
}

.panel-group .panel {
  border-radius: 0;
   
}

.panel-group .panel + .panel {
  margin-top: 0;
}

.panel-heading {
/*  background-color: #009688;*/
  border-radius: 0;
  border: none;
  color: #fff;
  padding: 0;
}

.panel-title a {
  display: block;
  /* color: #fff; */
  padding: 15px 18px 18px 12px;
  /* position: relative; */
  /* font-size: 16px; */
  font-weight: 400;
}

#accordion .panel-body {
/*  background: #fff;*/
 width:100%;
  height:70px;
  text-align:center;
  font-size:14px!important;
}

#accordion .panel-body p,#accordion .panel-body p strong {

font-size: 16px!important;
}


#accordion .panel-body p, #accordion .panel-body p a {
	color:#000;
}

.panel:last-child .panel-body {
  border-radius: 0 0 4px 4px;
}

.panel:last-child .panel-heading {
 /* border-radius: 0 0 4px 4px;*/
  transition: border-radius 0.3s linear 0.2s;
}

.panel:last-child .panel-heading.active {
  border-radius: 0;
  transition: border-radius linear 0s;
}
/* #bs-collapse icon scale option */

.panel-heading a:before {
 /* content: '\e146';
  position: absolute;
  font-family: 'Material Icons';
  right: 5px;
  top: 10px;
  font-size: 24px;
  transition: all 0.5s;
  transform: scale(1);
*/}

.panel-heading.active a:before {
  /*content: ' ';
  transition: all 0.5s;
  transform: scale(0);
*/}

/* #accordion rotate icon option */

#accordion .panel-heading a:before {
 /* content: '\e316';
  font-size: 24px;
  position: absolute;
  font-family: 'Material Icons';
  right: 5px;
  top: 10px;
  transform: rotate(180deg);
  transition: all 0.5s;
*/}

#accordion .panel-heading.active a:before {
  /*transform: rotate(0deg);
  transition: all 0.5s;
*/}
.head-menu{
    width: 100%;
    height: 65px;
    /*margin-top: 66px;*/
    }
.menu-principal {}

.menu-principal li { float:left; width:33%;}

.menu-principal .selected a {
	color:#000;
	/*-webkit-filter: grayscale(1) brightness(1)!important;
	filter: grayscale(1) brightness(1)!important;*/
}
.menu-principal a  {
	color:#000;
	/*-webkit-filter: grayscale(1) brightness(1)!important;
	filter: grayscale(1) brightness(1)!important;*/
}

.menu-principal  a ,.menu-principal  a h3,.menu-principal  a i {
	color:#000;
	
	/*-webkit-filter: grayscale(0) brightness(0)!important;
	filter: grayscale(0) brightness(0)!important;*/
	
}
.menu-principal  a h3 {
	font-size:15px!important;
}


a:hover {
 color:#CCC;
}

.menu-principal li a.btn-one,
.menu-principal li a.btn-two,
.menu-principal li a.btn-three,
.menu-principal li a.btn-four {
	text-align:center;
	color:#000000;
	
	-webkit-transition: all .4s ease;
       -moz-transition: all .4s ease;
        -ms-transition: all .4s ease;
         -o-transition: all .4s ease;
            transition: all .4s ease;
	
    
}

.menu-principal li a.btn-one:hover,
.menu-principal li a.btn-two:hover,
.menu-principal li a.btn-three:hover,
.menu-principal li a.btn-four:hover {
	color:#da262c;
	
	
	  -webkit-transition: all .4s ease;
       -moz-transition: all .4s ease;
        -ms-transition: all .4s ease;
         -o-transition: all .4s ease;
            transition: all .4s ease;

	
    
}

.actDos{ border-left:1px solid #000; border-right:1px solid #000;}

.menu-principal li a {
	width: 70px;
    margin: 0 auto;
    display: block;
}


.panel-group {
    margin-bottom: 5px!important;
        margin-top: -20px;
    z-index: 10000000000;
    margin-bottom: 5px!important;
}


.separador {width:100%; height:45px; display:block;}


.actTress:hover, .actTress:hover i, .actTress:hover h3,
.actUno a:hover, .actDos a:hover, .actTres a:hover,
.actUno a:hover, .actDos a:hover, .actTres a:hover,
.actUno a:hover i, .actDos a:hover i, .actTres a:hover i,
.actUno a:hover h3, .actDos a:hover h3, .actTres a:hover h3
{
		color:#da262c!important;
	
	
	  -webkit-transition: all .4s ease;
       -moz-transition: all .4s ease;
        -ms-transition: all .4s ease;
         -o-transition: all .4s ease;
            transition: all .4s ease;
}

@media only screen and (max-width: 394px) {
	.ancho{ width:200px;margin: 20px 0px 10px 13px!important;}
	.bajo{margin-top: 20px;}
}
@media only screen and (max-width: 484px) {
/*	.alto {
   	 	min-height: 123px!important;
	}*/
}
@media only screen and (max-width: 367px) {
	#head h1 {
    	width: 100%;
		font-size:18px;
	}
	/*.alto {
   	 	min-height: 145px!important;
	}*/
}