html, body, p {margin: 0; padding: 0; font-family: 'Roboto', sans-serif; font-size: 100%}

h1, h2, h3, h4, h5, h6, ul { margin: 0; padding: 0; list-style: none}

@font-face {

  font-family: 'fontello';

  src: url('../font/fontello.eot?17576186');

  src: url('../font/fontello.eot?17576186#iefix') format('embedded-opentype'),

       url('../font/fontello.woff?17576186') format('woff'),

       url('../font/fontello.ttf?17576186') format('truetype'),

       url('../font/fontello.svg?17576186#fontello') format('svg');

  font-weight: normal;

  font-style: normal;

}

[class^="icon-"]:before, [class*=" icon-"]:before, #row2 article a:hover::after {

  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%; */



  /* Uncomment for 3D effect */

  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */

}

.cf:before, .cf:after { content: ""; display: table; }

.cf:after { clear: both; }

.cf { zoom: 1; }

.icon-right-open:before { content: '\e801'; } /* '' */

.icon-left-open:before { content: '\e802'; } /* '' */

.btn {background-color: #009ee2; text-decoration: none;}

.btn:hover {background-color: #00b2ff;}

.big-btn {font-size: 1.3em; color: #fff; font-weight: 400; text-align: center; margin: 0 auto ; display: block; padding: 1em; width: 220px; text-decoration: none;}

.big-btn i { vertical-align: middle;}

.main-title {font-size: 3em; font-weight: 400; color: #434343; text-align: center; margin: 0.8em 0}

.title {color: #434343; font-weight: 300; text-align: center; font-size: 1.5em;}

hr { width: 150px; height: 8px; background-color: #e9e9ea; margin: 1em auto; display: block; border: none}

.bg-color {background-color: #ddecf2; padding: 2em 0}

.bg-color-gris {background-color: #e6e6e6; padding: 0.2em 0 3em 0}


/* HEADER */

header { background-color: #eee; background-repeat: repeat-y; background-position: center}

header > div > div {float: left}

header h1 {background-color: #eee; padding: 0.7em 1.1em 0 0.7em; }

header .cuatro { background-color: #ffd500; color: #000; text-align: center; font-size: 24px; margin-top: 0.4em}

header h2 span { font-size: 0.8em; font-weight: 300}

header ul { float: right; list-style: none}

header ul li { width: 225px; display: table-cell; color: #fff; vertical-align: top; background-size: cover; background-position: center; background-repeat: no-repeat;}

header ul li a {text-decoration: none; color: #fff}

header ul li a:hover article {opacity: 0.9}

header ul li article {padding: 20px;}

header #rosario {background-image: url(../images/info-e-rosario.jpg);}

header #santarosa {background-image: url(../images/info-e-santarosa.jpg);}

header #tucuman {background-image: url(../images/info-e-tucuman.jpg);}

header #mendoza {background-image: url(../images/info-e-mendoza.jpg);}

header #mardelplata {background-image: url(../images/info-e-mardelplata.jpg);}

header #neuquen {background-image: url(../images/info-e-neuquen.jpg);}

header #resistencia {background-image: url(../images/info-e-resistencia.jpg);}

header #cordoba {background-image: url(../images/info-e-cordoba.jpg);}

header #concordia {background-image: url(../images/info-e-concordia.jpg);}

header #salta {background-image: url(../images/info-e-salta.jpg);}

header #trelew {background-image: url(../images/info-e-trelew.jpg);}

header #parana {background-image: url(../images/info-e-parana.jpg);}

header ul li .fecha {font-size: 14px}

header ul li .region {font-size: 11px; background-color: #ffd500; padding: 0.5em; display: inline-block; color:#000;}

header ul li h4 {font-size: 24px}

header ul li .lugar {font-size: 16px}

header .exito { position: absolute;top:0; left: 220px}



body > div {background-image: url(../images/info-expo-cadena-bg.jpg); background-repeat: no-repeat; background-size: 100% auto; background-position: center top}



/* MAIN VIDEO */

#main-video { position: relative;}

#main-video h3 { text-align: center; font-size: 1.5em; font-weight: 300; margin:0 1em 1.6em}

#main-video h4 { text-align: center; color: #106d95; font-size: 1.5em}

#main-video ul { list-style: none; padding: 0 1em}

#main-video ul li {background-color: #009ee2; border-bottom: 2px solid #096c97; font-size: 1.5em;}

#main-video ul li span {font-size: 0.5em; color: #000}

#main-video ul li a {display: block; height: 100%; text-decoration: none; color: #fff;}

#main-video ul li a:hover {background-color: #00b2ff}

#main-video video {display: none}

#main-video .arrow-left {width: 0; height: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-right:14px solid #096c97; position: absolute; left: -14px; top:14px; display: none}

#main-video .main-title { margin: 0.8em 1em 0}

.selected {background-color:#096c97 }



/* FEATURES */

#features {margin-top: 1em}

#features .wrapper { padding: 3em 0 3em 0}

#features .row {padding: 0 4em}

#features article { padding: 0 2em}

#features article img {margin: 0 auto; display: block; max-width: 100%; position: relative; top: 0}

#features article h3 {color:#096c97; font-weight: 700; text-align: center; font-size: 1.5em; margin-top: 0.5em; line-height: 1em}

#features article ul {list-style: none; margin-top: 0.5em}

#features article ul li {text-align: center; font-size: 1em; color: #618a9b}



/* PARTICIPAR */

#participar {margin-top: 1em}

#participar .wrapper { background-color: #ddecf2; padding: 0.2em 0 3em 0}

#participar .row {padding: 0 4em}

#participar article { padding: 0 2em}

#participar article > ul {list-style: square url('../images/ul-square.jpg');}

#participar article > ul li { padding-left: 1em; margin-bottom: 1em; color: #434343}

#participar article > ul li > ul {list-style: none; font-size: 1em; font-weight: 300; font-style: italic; line-height: 1em; margin-top: 1em}



/* FOOTER */

footer { background-color: #2e333a; padding: 2em 0 0 0; margin-top: 2em}

footer .wrapper > ul { float: right; list-style: none; font-size: 0.9em; color: #e0e0e0;}

footer .wrapper > ul > li { display: inline-block; vertical-align: top; margin: 0 1em}

footer .wrapper > ul a { color:#e0e0e0 }

footer .wrapper > ul a:hover { color:#ffffff }

footer .wrapper > ul > li a {text-decoration: none; color:#e0e0e0 }

footer .wrapper > ul > li > ul { list-style: none; }

footer .wrapper > ul > li > ul span { color: #999898}

footer .wrapper > ul > li > ul > li {margin-bottom: 1em}

footer #focus-footer { background-color: #141414; padding: 2em 0 2em 0; display: block; margin-top:1em }

footer #focus-footer > a { display: block; }

footer #focus-footer img { display: block; margin: 0 auto 1em}

footer #focus-footer p { color: #dfdfdf; text-align: center; font-size: 12px}

footer #focus-footer p a { text-decoration: none; color: #dfdfdf;}



#alert { position: fixed; top: 0; background-color: #CB0303; padding: 10px; font-size: 1em; color: #fff; display: none; width: 100%; text-align: center;}

#alert a {color: #fff}







/* OPCIONES DE PARTICIPACION */

#opciones h3 {text-align: center;}

#opciones article {margin-bottom: 1em;}

#opc-participacion article {display: table; }

#opc-participacion header {background-color: #ffd500; color: #fff; font-size: 1.2em; font-weight: 700; width: 25%; text-align: center; display: table-cell;}

#opc-participacion aside { border:3px solid #ffd500; padding: 1em; display: table-cell;}

#opc-participacion ul li {margin-bottom: 0.5em}

#opc-participacion h2 {font-size: 2em}

#opc-sponsor header { background-color: #009ee2; color: #fff; font-size: 1.2em; font-weight: 700; padding: 0.7em}

#opc-sponsor h2 {font-size: 2em}

#opc-sponsor aside { border:3px solid #009ee2; padding: 1em; }



/*ORGANIZACION*/
main {
  margin: 0;
  padding: 0;
}
.txt-fondo-blanco {
  background-color: #fff; 
  align-items: center; 
  justify-content: center; 
  color: #000; 
  padding: 20px; 
  text-align: center; 
  box-sizing: border-box;
  min-height: 300px; 
  max-width: 1200px; 
  margin: 0 auto; 
}
.txt-fondo-blanco > div:first-child {
  margin-top: 40px; 
}
.txt-fondo-blanco h1 {
  font-family: 'Open Sans', sans-serif;
  font-size: 2em;
  color: #000;
  font-weight: bolder;
  line-height: 1.1;
}
.txt-fondo-blanco h2 {
  font-weight: 500;
  font-size: 2em;
  line-height: 1.1em;
  margin-bottom: 1.1em;
  color: #000;
  text-align: center;
  font-family: 'Open Sans', sans-serif;
}
.txt-fondo-blanco p {
  background-color: #5A7DBE;
  border-radius: 10px 0 10px 0px; 
  padding: 40px;
  color: #ffffff;
  line-height: 1.4;
  font-size: 24px;
}

.logos-fondo-negro {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-image: url('../images/org-background.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 150px 0;
  min-height: 600px;
  width: 100%; 
  margin: 0 auto; 
}

.logos-fondo-negro .imagenes {
  display: flex;
  flex-wrap: wrap; 
  justify-content: center; 
  max-width: 1200px; 
  width: 100%; 
  gap: 30px; 
  margin: 0 auto; 
}

.logos-fondo-negro .imagenes a {
  display: flex;
  justify-content: center; 
  width: 48%; 
}

.logos-fondo-negro .imagenes img {
  width: 100%; 
  height: auto; 
  max-width: 250px; 
  object-fit: contain; 
}

.logos-fondo-negro .imagenes img {
  margin-bottom: 30px;
  
}

/* Ajustes para la imagen de los países */
#paises {
  margin-top: 100px;
  width: 80%; 
  display: flex;
  justify-content: center;
}

#paises img {
  width: 100%; 
  max-width: 350px; 
  height: auto; 
}


/* //////////////////// MEDIA QUERIES ////////////////////  */

/* //////////////////// MEDIA QUERIES ////////////////////  */

/* //////////////////// MEDIA QUERIES ////////////////////  */

@media only screen and (max-width: 480px) {
  .logos-fondo-negro .imagenes a {
      width: 70%;  
  }

  .logos-fondo-negro .imagenes img {
      max-width: 250px;  
  }
  .txt-fondo-blanco p {
      padding: 20px;
      font-size: 20px;
  }
  .txt-fondo-blanco h2 {
      font-weight: 500;
      font-size: 1.5em;
      line-height: 1.1em;
      padding-top: 1em;
  }

}

@media only screen and (min-width: 960px) and (max-width: 1200px) {

  header ul li { width: 170px; }

  header ul li h4 {font-size: 16px}

  footer .wrapper > ul { font-size: 0.9em;}

  footer .wrapper > ul > li { margin: 0 0.8em}

  #map-canvas {height:580px}

}

/*------------------------------------------------------*/

@media only screen and (max-width: 959px) {

  header h1 a img {max-width: 100%; display: block; margin: 0 auto}

  header h1 { width: 100%; box-sizing: border-box; text-align: center;}

  header ul { float: none}

  header ul li { width: 25%; display: table-cell; }

  header ul li h4 {font-size: 18px}

  header .wrapper > div { text-align: center; float: left; width: 100%}

  .wrapper{width:768px;}

  #compradores #main-info .row { background-position: 300px 0; background-size: auto 600px; }

  footer .wrapper > img {display: block; margin: 0 auto}

  footer .wrapper > ul { float: none; margin-top: 1em}

  #map-canvas {height:552px}

  .main-title {font-size: 2.5em; }

  header .exito { right: 0; left: inherit}

  #main-video .col-3-4 {width: 100%}

  #main-video .col-1-4 {width: 100%}

  #main-video .col-1-4 h4 {display: none}

  #main-video .col-1-4 hr {display: none}

  #main-video .col-1-4 .arrow-left {display: none}

  #main-video .arrow-left {visibility: hidden;}

}

/*------------------------------------------------------*/

@media only screen and (max-width: 767px) {

  .wrapper{width:100%}

  footer .wrapper > ul { display: none}

  footer .wrapper > img {display: block; margin: 0 auto}

  #agenda #agenda-cont .agenda-dia .grilla ul li .detalle .data { display: block}

  #agenda #agenda-cont .agenda-dia .grilla ul li .detalle .logos { float: none}

  #agenda #agenda-cont .agenda-dia .grilla ul li.conlogo {height:105px }

  body > div {background-image: none;}

  #features .col-1-3 {width: 100%}



}

/*------------------------------------------------------*/

@media only screen and (max-width: 619px) {

 .main-title { width: 80%; font-size: 2.5em; margin: 0.8em auto} 

 #cuatroformas article { height: auto}

 #select-ins {display: none}

 #select-ins-sm {display: block}



}

/*------------------------------------------------------*/

@media only screen and (max-width: 520px) {

  header ul li article {padding: 10px}

  header ul li {width: 50%; text-align: center; float: left}

  header ul li .fecha {display: none}

  header ul li .lugar {display: none}

  #main-video h3 { font-size: 1em;}

}

/*------------------------------------------------------*/

@media only screen and (max-width: 479px) {

  .prov-comp .sidetxt article {padding: 1em}

  .prov-comp .sidetxt article h2 { font-size: 2.5em; }

  .prov-comp #features article { padding: 0 0 }

  .prov-comp #features .row {padding: 0 2em}

  #organizacion .title { font-size: 1em }

  .main-title {font-size: 2em; }



}



/* PARTICIPANTES */

table {

  border-collapse: collapse;

  border-spacing: 0;

  width:730px;

  margin:0 auto 0 auto;



}

table tr{

  height: 2em;

  vertical-align: middle;

}

table tr .h4 {color: #fff}

table tr:nth-child(odd) {  

  background: #eee;

}

table td{

  padding-left: 1em;

  padding-top: .4em;

  height: 2em;

  text-align: left;

}

table td:first-child{

  font-weight: bold;

  color: #666;

  overflow: hidden;

}

table td:nth-child(3){

  color: #666;

  overflow: hidden;

}

table tr:first-child{

  background: #363b41;

  height: 3em;

}