/* La academia adentro del portal del socio.

   El HTML es el mismo que el de la pagina publica (lo presta academia.js, ver
   academia-portal.js), pero el envase cambia: alla vive suelto en la pagina y
   aca vive adentro de la columna del portal, que ya trae su propio ancho y su
   propio aire. Sin estos ajustes, cada seccion sumaba un segundo margen y todo
   quedaba corrido hacia adentro y con huecos de mas.

   Va DESPUES de academia.css en el index: son ajustes que lo pisan. */

/* El .wrap de adentro es el envase del sitio (1180px y 24px a los lados). En
   el portal ese lugar ya lo pone la columna, asi que se desarma. */
.acportal .wrap{max-width:none;padding-left:0;padding-right:0}

/* Las secciones traen el aire de una pagina entera; adentro alcanza con la
   separacion entre bloques. */
.acportal .acsec{padding:0;border:0}
.acportal .acsec+.acsec{margin-top:34px}

/* El titulo de "cursos maquina por maquina" queda como subtitulo del portal,
   no como titulo de seccion de una pagina. */
.acportal .acmaqt{font-size:15px;letter-spacing:.1em;margin-bottom:14px}

/* ---- LA FICHA DEL CURSO, BLANCA DE BORDE A BORDE ----

   El problema. La ficha trae fondo blanco propio (.acficha, en academia.css)
   pero vive adentro de .main, que tiene padding (24px arriba, 30px a los
   costados) y deja ver el gris del portal por detras. Resultado: el blanco
   arrancaba recien despues del padding y quedaba dibujado como una tarjeta
   recortada -- una franja gris arriba del "Volver a todos los cursos" y otra
   entre el carril del menu y el blanco. Se leia como un recuadro metido
   adentro de la pantalla en vez de ser la pantalla.

   La solucion. El bloque se come el padding del .main con margenes negativos
   y lo repone como padding propio: el contenido queda exactamente donde
   estaba, pero el fondo blanco ahora arranca en el borde de arriba y llega
   hasta el carril del menu. El min-height lo estira hasta abajo aunque el
   curso sea corto (uno de un solo video, sin plan de estudios), asi no
   reaparece el gris al final.

   VA SOLO EN LA FICHA (clase fichacurso, que pone vCursoPortal). El listado de
   cursos NO la lleva: ahi el contenido se apoya sobre el gris igual que el
   resto de las pantallas del portal, y asi tiene que seguir. Si algun dia el
   padding de .main cambia en portal.css, estos numeros hay que tocarlos junto
   con aquel: son los mismos dos valores, escritos en dos lados. */
.acportal.fichacurso{
  background:#fff;
  margin:-24px -30px -70px;
  padding:24px 30px 70px;
  min-height:calc(100vh - 60px);
}

/* La ficha del curso adentro del portal: sin el aire de pagina y con el
   "volver" pegado arriba de todo. */
.acportal .acficha{padding-top:0}
.acportal .acvolver{margin-top:0}

/* ---- EL MARCO DEL VIDEO, SIN MARCO ----

   En la pagina publica el bloque del video se apoya sobre el fondo claro del
   sitio y lleva fondo propio y puntas redondeadas: ahi funciona como una pieza
   suelta. Adentro del portal el video vive en el MEDIO DEL TEXTO de la ficha,
   entre el resumen del curso y la descripcion, y ese fondo propio se lee como
   un recuadro metido en la columna.

   Aca el bloque se vuelve blanco y de puntas rectas, igual que el papel que lo
   rodea. Cuando el video de YouTube no llena el 16:9 exacto -- pasa cuando el
   material original tiene otra proporcion -- lo que sobra queda blanco y se
   funde con la pagina, en vez de dibujar un marco.

   OJO: esto vale SOLO para el bloque CON video (.conyt). El bloque sin video
   conserva su fondo oscuro: ahi el degradado no es decoracion, es lo unico que
   ocupa el lugar mientras no hay nada que reproducir. */
.acportal .acvideo.conyt{background:#fff;border-radius:0}

/* En pantallas chicas el .main cambia su padding (portal.css), asi que los
   margenes negativos de la ficha tienen que acompanarlo o el blanco se corre. */
@media(max-width:1000px){
.acportal.fichacurso{margin:-20px -20px -80px;padding:20px 20px 80px}
}

/* En una columna angosta las dos columnas de la ficha no entran: el detalle
   pasa abajo del contenido. */
@media(max-width:1200px){
.acportal .acdos{grid-template-columns:1fr}
}