@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,700;0,900;1,300;1,400;1,500;1,700;1,900&display=swap');

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}

/*! HTML5 Boilerplate v7.2.0 | MIT License | https://html5boilerplate.com/ */

/* main.css 2.0.0 | MIT License | https://github.com/h5bp/main.css#readme */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
  color: #222;
  font-size: 1em;
  line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
  resize: vertical;
}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */


@font-face {
    font-family: 'SassoonInfant';
    src: url('../fonts/SassoonInfantStd.woff2') format('woff2'),
         url('../fonts/SassoonInfantStd.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'SassoonInfant';
    src: url('../fonts/SassoonInfantStd-Bold.woff2') format('woff2'),
        url('../fonts/SassoonInfantStd-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}




html {
  color: #fff;
  line-height: 1;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; 
  height: 100%;


}

*, *:before, *:after {
    -webkit-box-sizing: inherit;
    -moz-box-sizing: inherit;
    box-sizing: inherit; 
}

body {
  
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;  
  height: 100%;
  font-size: 16px;
  line-height: 1;
  color: #393939;
  font-family: 'Roboto', sans-serif;
  font-style: normal;
}


body, html { font-size: 16px }



figure, section, article, aside, figcaption {margin:0; padding:0}

a { color: #004289; }

a, a:focus, a:hover, a:active { outline:none; text-decoration:none}

a:hover { color: #004289; }

button:focus {outline:0;}

button {
  background: none;
  background-color: transparent;
  padding: 0;
  margin: 0;
  cursor: pointer;
  border-radius: 0;
  border:none;
}


p, li {    
    line-height: 1.35em;
    margin: 1em 0;
}

h1,h2,h3,h4 {
  font-weight: 500;
}



.wrap {  
  position: relative;
  overflow-x: hidden;
  min-height: 100%;
  max-width: 1920px;
  margin: 0 auto;
  padding-bottom: 150px;
  background-color: #e9edf0;
}


.mt0 { margin-top: 0 !important }
.mb0 { margin-bottom: 0 !important }


.mt1 { margin-top: 0.25rem !important }
.mb1 { margin-bottom: 0.25rem !important }

.mt2 { margin-top: 0.5rem !important }
.mb2 { margin-bottom: 0.5rem !important }

.mt3 { margin-top: 1rem !important }
.mb3 { margin-bottom: 1rem !important }

.mt4 { margin-top: 1.5rem !important }
.mb4 { margin-bottom: 1.5rem !important }

.mt5 { margin-top: 2rem !important }
.mb5 { margin-bottom: 2rem !important }

.image-responsive { width: 100%; height: auto }

.text-center { text-align: center; }



.black-bkg { background-color: #0f0f0f; }
.blue-bkg { background-color: #0080c8; }
.lightblue-bkg { background-color: #0dabdc; }
.darkblue-bkg { background-color: #1e3a7f; }
.white-bkg { background-color: #ffffff }
.green-bkg { background-color: #24998e }
.orange-bkg { background-color: #ef7a18 }
.grey-bkg { background-color: #7a7d80 }
.purple-bkg { background-color: #8c378c; }
.red-bkg { background-color: #8C1631; }

.color-white { color: #ffffff; }
.color-blue { color: #0080c8; }
.color-lightblue { color: #0dabdc; }
.color-darkblue { color: #1e3a7f; }
.color-black { color: #0f0f0f; }
.color-green { color: #24998e; }
.color-grey { color: #7a7d80 }
.color-orange { color: #ef7a18 }
.color-purple { color: #8c378c; }
.color-red { color: #8C1631; }


.fw300 { font-weight: 300 }
.fw400 { font-weight: 400 }
.fw500 { font-weight: 500 }
.fw700 { font-weight: 700 }
.fw900 { font-weight: 900 }


.font-sassoon {
  font-family: 'SassoonInfant';
}




.header {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 10;
  background-color: rgba(255,255,255,1);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.20);
}

.header.header-fixed {
  position: fixed;
  left: 0;
  top: 0;
  transition: background 0.5s ease-in-out 0.5s, top 0.5s ease-in-out 0.5s;
}

.header.header-fixed.header-over {
  background-color: rgba(255,255,255,0.95);
}

.header.header-fixed.header-hide {
  top: -84px;
}





.header .header-inner {
  display: flex;
  width: 100%;
  height: 100px;
  align-items: center;
  justify-content: flex-start;
  padding: 0 1.5rem;
  border-bottom: 16px solid #0dabdc;
}

.header .logo-aula-digital {
  width: 150px;
  height: auto;
  margin-right: 3rem;
}

.header .logo-aula-digital > img { width: 100%; }

.header nav {
  display: block;
  width: 100%;
}
.header .top-menu {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-grow: 1;
  padding: 0;
  margin: 0;
}

.header .top-menu li {
  display: block;
  margin: 0 0.5rem;
}

.header .top-menu li.ml-auto { margin-left: auto; }

.header .top-menu li a {
  display: block;
  padding: 0.5rem 0.5rem;
  font-size: 1rem;
  font-weight: 300;
  transition: color 0.5s ease-in, background 0.5s ease-in;
  border-radius: 3px;
}


.header .top-menu li a:hover,
.header .top-menu li a.selected {
  transition: color 0.25s ease-out, background 0.25s ease-in;
  color: #fff;
  background-color: #1e3a7f;
}


.header .top-menu li.orange a:hover,
.header .top-menu li.orange a.selected { background-color: #ef7a18 }
.header .top-menu li.green a:hover,
.header .top-menu li.green a.selected { background-color: #24998e }
.header .top-menu li.purple a:hover,
.header .top-menu li.purple a.selected { background-color: #8c378c }
.header .top-menu li.grey a:hover,
.header .top-menu li.grey a.selected { background-color: #7a7d80 }
.header .top-menu li.blue a:hover,
.header .top-menu li.blue a.selected { background-color: #0080c8 }
.header .top-menu li.red a:hover,
.header .top-menu li.red a.selected { background-color: #8C1631 }



.orange .header .header-inner { border-color: #ef7a18; }
.green .header .header-inner { border-color: #24998e; }
.purple .header .header-inner { border-color: #8c378c; }
.grey .header .header-inner { border-color: #7a7d80; }
.blue .header .header-inner { border-color: #0080c8; }
.bluedark .header .header-inner { border-color: #094681; }
.red .header .header-inner { border-color: #8C1631; }


.header .button-menu-resp {
  display: none;
  visibility: hidden;
}

.menu-block {
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 10;
  }




#modalPopupLogin.remodal {
  padding: 30px 60px;
  background-color: #fff;
  border-radius: 1rem 1rem 1rem 0;
}

#modalPopupLogin .box-form {
  text-align: left;
}

#modalPopupLogin .box-form .form-options {
  display: flex;
  align-items: center;
}

#modalPopupLogin .box-form .form-options .button-switch {
  margin-left: auto;
  color: #004289;
}

#modalPopupLogin .box-form .form-options .button-switch:hover {
  text-decoration: underline;
}

.register-container {
  padding: 150px 25px;
}

.register-container .box-register {
  max-width: 800px;
  margin: 0 auto;
}

.register-container .box-register .form-options { margin-top: 20px }




.anim-logo {
  position: relative;
  width: 586px;
  height: 704px;
}

.anim-logo .cabeza {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: auto;
}

.anim-logo div {
  position: absolute;
  width: 10px;
  height: 10px;
}

.anim-logo div.p1 {     
  background-color: #EF7A18;
  transform: translate(140px, 98px) rotate(39deg) scale(4.8);
}

.anim-logo div.p2 {
  background-color: #7A7D80;
  transform: translate(184px, 205px) rotate(39deg) scale(6.2);
}

.anim-logo div.p3 {     
  background-color: #EF7A18;
  transform: translate(144px, 336px) rotate(70deg) scale(7.7)
}

.anim-logo div.p4 {     
  background-color: #24998E;
  transform: translate(296px, 529px) rotate(84deg) scale(5.2);
}

.anim-logo div.p5 {     
  background-color: #8C378C;
  transform: translate(350px, 645px) rotate(69deg) scale(4.5)
}

.anim-logo div.p6 {     
  background-color: #EF7A18;
  transform: translate(183px, 64px) rotate(23deg) scale(4.5);
}

.anim-logo div.p7 {
  background-color: #7A7D80;
  transform: translate(261px, 320px) rotate(52deg) scale(8.2);
  z-index: -1;
}

.anim-logo div.p8 {     
  background-color: #EF7A18;
  transform: translate(316px, 379px) rotate(10deg) scale(6.7);
}

.anim-logo div.p9 {     
  background-color: #EF7A18;
  transform: translate(337px, 489px) rotate(21deg) scale(5.6);
}

.anim-logo div.p10 {      
  background-color: #0A4581;
  transform: translate(394px, 555px) rotate(85deg) scale(3.2);
}

.anim-logo div.p11 {      
  background-color: #EF7A18;
  transform: translate(432px, 630px) rotate(76deg) scale(3.2);
}

.anim-logo div.p12 {      
  background-color: #24998E;
  transform: translate(252px, 34px) rotate(63deg) scale(4.1);
}

.anim-logo div.p13 {      
  background-color: #24998E;
  transform: translate(268px, 110px) rotate(76deg) scale(4.8);
}


.anim-logo div.p14 {      
  background-color: #EF7A18;
  transform: translate(317px, 234px) rotate(41deg) scale(8.1);
}

.anim-logo div.p15 {      
  background-color: #EF7A18;
  transform: translate(319px, 291px) rotate(72deg) scale(5.1);
}

.anim-logo div.p16 {      
  background-color: #2390CF;
  transform: translate(378px, 354px) rotate(108deg) scale(5.3);
}

.anim-logo div.p17 {      
  background-color: #7A7D80;
  transform: translate(389px, 426px) rotate(112deg) scale(4.6);
}


.anim-logo div.p18 {      
  background-color: #8C378C;
  transform: translate(420px, 499px) rotate(126deg) scale(3.5);
}

.anim-logo div.p19 {      
  background-color: #24998E;
  transform: translate(479px, 554px) rotate(112deg) scale(2.4);
}

.anim-logo div.p20 {      
  background-color: #8C378C;
  transform: translate(329px, 63px) rotate(49deg) scale(4.3);
}

.anim-logo div.p21 {      
  background-color: #7A7D80;
  transform: translate(334px, 152px) rotate(108deg) scale(5.2);
}

.anim-logo div.p22 {      
  background-color: #24998E;
  transform: translate(376px, 242px) rotate(76deg) scale(6.3);
  z-index: -1;
}

.anim-logo div.p23 {      
  background-color: #EF7A18;
  transform: translate(414px, 270px) rotate(77deg) scale(3.8);
}

.anim-logo div.p24 {      
  background-color: #8C378C;
  transform: translate(445px, 341px) rotate(17deg) scale(4.3);
}

.anim-logo div.p25 {      
  background-color: #EF7A18;
  transform: translate(466px, 424px) rotate(77deg) scale(4.2);
}

.anim-logo div.p26 {      
  background-color: #0A4581;
  transform: translate(373px, 14px) rotate(78deg) scale(3.3);
}

.anim-logo div.p27 {      
  background-color: #8C378C;
  transform: translate(419px, 170px) rotate(60deg) scale(4.3);
}

.anim-logo div.p28 {      
  background-color: #0A4581;
  transform: translate(509px, 353px) rotate(68deg) scale(4);
}

.anim-logo div.p29 {      
  background-color: #8C378C;
  transform: translate(534px, 438px) rotate(39deg) scale(2.9);
}

.anim-logo div.p30 {      
  background-color: #EF7A18;
  transform: translate(434px, 85px) rotate(95deg) scale(3.1);
}

.anim-logo div.p31 {      
  background-color: #EF7A18;
  transform: translate(471px, 204px) rotate(24deg) scale(4.2);
}

.anim-logo div.p32 {      
  background-color: #8C378C;
  transform: translate(478px, 280px) rotate(39deg) scale(2.6);
}

.anim-logo div.p33 {      
  background-color: #24998E;
  transform: translate(552px, 189px) rotate(11deg) scale(3);
}

.anim-logo div.p34 {      
  background-color: #EF7A18;
  transform: translate(562px, 313px) rotate(78deg) scale(3);
}


.section-home {
  position: relative;
  
}

.slide-intro {
  display: flex;
  background-color: #fff;
  height: 100vh;
  min-height: 640px;
}

.slide-gr {
  background-color: #1e3a7f;
  padding: 100px 0;
  background-image: url('../images/pill-gr-white.png');
  background-position: right bottom;
  background-repeat: no-repeat;
  background-size: auto 40vh;
}

.slide-contents {
  padding: 100px 0;
  background-color: #e9edf0;

}


.slide-intro .block-left {
  position: relative;
  width: 50%;
  height: 100%;
  background-color: #e9edf0;
  background-image: url('../images/corner-cuadros.png');
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: auto 40vh;
}

.slide-intro .block-right {
  position: relative;
  width: 50%;
  height: 100%;
  text-align: center;
  padding: 150px 0;
}

.slide-intro .block-left .pill-gr {
  position: absolute;
  top: -4%;
  left: -18%;
  width: auto;
  height: 60vh;
}



.slide-intro .block-right h1 {
  font-size: 3.5rem;
  font-weight: 400;
  margin: 0;
  line-height: 1.2em;
}

.slide-intro .block-right .logo-gr {
  position: absolute;
  width: 204px;
  bottom: 2rem;
  right: 2rem;
}

.slide-intro .block-right .logo-aula-digital {
  position: absolute;
  width: 280px;
  top: calc(50% + 50px);
  left: 50%;
  transform: translate(-50%,-50%);
}


.slide-intro .anim-logo {
  position: absolute;
  left: 50%;
  top: calc(50% + 50px);
  transform: translate(-50%,-50%);
  width: 586px;  
}

.home-preload .anim-logo,
.home-preload .slide-intro .block-right h1,
.home-preload .slide-intro .block-right .logo-aula-digital {
  visibility: hidden;
}


.anim-logo div {
  position: absolute;
  width: 10px;
  height: 10px;
}

.anim-logo div.p1 {     
  background-color: #EF7A18;
  transform: translate(140px, 98px) rotate(39deg) scale(4.8);
}

.anim-logo div.p2 {
  background-color: #7A7D80;
  transform: translate(184px, 205px) rotate(39deg) scale(6.2);
}

.anim-logo div.p3 {     
  background-color: #EF7A18;
  transform: translate(144px, 336px) rotate(70deg) scale(7.7)
}

.anim-logo div.p4 {     
  background-color: #24998E;
  transform: translate(296px, 529px) rotate(84deg) scale(5.2);
}

.anim-logo div.p5 {     
  background-color: #8C378C;
  transform: translate(350px, 645px) rotate(69deg) scale(4.5)
}

.anim-logo div.p6 {     
  background-color: #EF7A18;
  transform: translate(183px, 64px) rotate(23deg) scale(4.5);
}

.anim-logo div.p7 {
  background-color: #7A7D80;
  transform: translate(261px, 320px) rotate(52deg) scale(8.2);
  z-index: -1;
}

.anim-logo div.p8 {     
  background-color: #EF7A18;
  transform: translate(316px, 379px) rotate(10deg) scale(6.7);
}

.anim-logo div.p9 {     
  background-color: #EF7A18;
  transform: translate(337px, 489px) rotate(21deg) scale(5.6);
}

.anim-logo div.p10 {      
  background-color: #0A4581;
  transform: translate(394px, 555px) rotate(85deg) scale(3.2);
}

.anim-logo div.p11 {      
  background-color: #EF7A18;
  transform: translate(432px, 630px) rotate(76deg) scale(3.2);
}

.anim-logo div.p12 {      
  background-color: #24998E;
  transform: translate(252px, 34px) rotate(63deg) scale(4.1);
}

.anim-logo div.p13 {      
  background-color: #24998E;
  transform: translate(268px, 110px) rotate(76deg) scale(4.8);
}


.anim-logo div.p14 {      
  background-color: #EF7A18;
  transform: translate(317px, 234px) rotate(41deg) scale(8.1);
}

.anim-logo div.p15 {      
  background-color: #EF7A18;
  transform: translate(319px, 291px) rotate(72deg) scale(5.1);
}

.anim-logo div.p16 {      
  background-color: #2390CF;
  transform: translate(378px, 354px) rotate(108deg) scale(5.3);
}

.anim-logo div.p17 {      
  background-color: #7A7D80;
  transform: translate(389px, 426px) rotate(112deg) scale(4.6);
}


.anim-logo div.p18 {      
  background-color: #8C378C;
  transform: translate(420px, 499px) rotate(126deg) scale(3.5);
}

.anim-logo div.p19 {      
  background-color: #24998E;
  transform: translate(479px, 554px) rotate(112deg) scale(2.4);
}

.anim-logo div.p20 {      
  background-color: #8C378C;
  transform: translate(329px, 63px) rotate(49deg) scale(4.3);
}

.anim-logo div.p21 {      
  background-color: #7A7D80;
  transform: translate(334px, 152px) rotate(108deg) scale(5.2);
}

.anim-logo div.p22 {      
  background-color: #24998E;
  transform: translate(376px, 242px) rotate(76deg) scale(6.3);
  z-index: -1;
}

.anim-logo div.p23 {      
  background-color: #EF7A18;
  transform: translate(414px, 270px) rotate(77deg) scale(3.8);
}

.anim-logo div.p24 {      
  background-color: #8C378C;
  transform: translate(445px, 341px) rotate(17deg) scale(4.3);
}

.anim-logo div.p25 {      
  background-color: #EF7A18;
  transform: translate(466px, 424px) rotate(77deg) scale(4.2);
}

.anim-logo div.p26 {      
  background-color: #0A4581;
  transform: translate(373px, 14px) rotate(78deg) scale(3.3);
}

.anim-logo div.p27 {      
  background-color: #8C378C;
  transform: translate(419px, 170px) rotate(60deg) scale(4.3);
}

.anim-logo div.p28 {      
  background-color: #0A4581;
  transform: translate(509px, 353px) rotate(68deg) scale(4);
}

.anim-logo div.p29 {      
  background-color: #8C378C;
  transform: translate(534px, 438px) rotate(39deg) scale(2.9);
}

.anim-logo div.p30 {      
  background-color: #EF7A18;
  transform: translate(434px, 85px) rotate(95deg) scale(3.1);
}

.anim-logo div.p31 {      
  background-color: #EF7A18;
  transform: translate(471px, 204px) rotate(24deg) scale(4.2);
}

.anim-logo div.p32 {      
  background-color: #8C378C;
  transform: translate(478px, 280px) rotate(39deg) scale(2.6);
}

.anim-logo div.p33 {      
  background-color: #24998E;
  transform: translate(552px, 189px) rotate(11deg) scale(3);
}

.anim-logo div.p34 {      
  background-color: #EF7A18;
  transform: translate(562px, 313px) rotate(78deg) scale(3);
}









.slide-gr .section-inner {
  width: 100%;
  max-width: 1050px;
  margin: 0 auto;
}

.slide-gr .top-gr {
  display: flex;
  align-items: flex-end;
  margin-bottom: 2rem;
}

.slide-gr .top-gr .top-gr-left {
  text-align: right;
  font-size: 4.5rem;
  font-weight: 300;
  flex-shrink: 0;
  margin-right: 2rem;
  line-height: 0.9em;
}

.slide-gr .top-gr .top-gr-right {
    font-size: 1.35rem;
    line-height: 1.3em;
    text-align: justify;
}

.slide-gr .top-gr .top-gr-left > strong { font-size: 12rem; line-height: 1; font-weight: 900 }
.slide-gr .top-gr .top-gr-left > strong small { font-size: 4rem }

.slide-gr .bottom-gr {
  font-size: 1.2rem;
  line-height: 1.3;
  text-align: justify;
}

.slide-gr .logo-center {
  text-align: center;
  margin: 3rem 0;
}


.slide-contents .section-inner {
  width: 100%;
  max-width: 1050px;
  margin: 0 auto;
}

.slide-contents h2 {
  font-size: 2.5rem;
  font-weight: 300;
  line-height: 1.2em;
  text-align: center;
}

.slide-contents .grid-areas {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0 -2rem;
}

.slide-contents .grid-areas .area {
  width: calc(33.333% - 4rem);
  margin: 1rem 2rem;
}


.slide-contents .grid-areas .area a {
  display: block;
  color: #fff;
  aspect-ratio: 5 / 4;
  padding: 1.5rem;
  background-repeat: no-repeat;
  background-position: right -0.5rem bottom 0.5rem;
  background-size: 160px auto;
  border-radius: 1.5rem 0.25rem;
  transition: background 0.5s ease-in-out
}


.slide-contents .grid-areas .area h3 {
  font-size: 2.25rem;
  line-height: 1.1em;
  text-align: left;
  margin: 0;
}



.slide-contents .grid-areas .area.orange a {
  background-color: rgba(239, 122, 24, 0.7);
  background-image: url('../images/cabeza-small-orange.png')
}

.slide-contents .grid-areas .area.green a {
  background-color: rgba(36, 153, 142, 0.7);
  background-image: url('../images/cabeza-small-green.png')
}

.slide-contents .grid-areas .area.purple a {
  background-color: rgba(140, 55, 140, 0.7);
  background-image: url('../images/cabeza-small-purple.png')
}

.slide-contents .grid-areas .area.grey a {
  background-color: rgba(122, 125, 128, 0.7);
  background-image: url('../images/cabeza-small-grey.png')
}

.slide-contents .grid-areas .area.blue a {
  background-color: rgba(0, 128, 200, 0.7);
  background-image: url('../images/cabeza-small-blue.png')
}

.slide-contents .grid-areas .area.bluedark a {
  background-color: rgba(9, 70, 129, 0.8);
  background-image: url('../images/cabeza-small-bluedark.png')
}

.slide-contents .grid-areas .area.red a {
  background-color: rgba(149, 44, 63, 0.7);
  background-image: url('../images/cabeza-small-red.png')
}


.slide-contents .grid-areas .area.orange a:hover {
  background-color: rgba(239, 122, 24, 0.9);
  background-position: right 1.5rem bottom 0.5rem;
}

.slide-contents .grid-areas .area.green a:hover {
  background-color: rgba(36, 153, 142, 0.9);
  background-position: right 1.5rem bottom 0.5rem;
}

.slide-contents .grid-areas .area.purple a:hover {
  background-color: rgba(140, 55, 140, 0.9);
  background-position: right 1.5rem bottom 0.5rem;
}

.slide-contents .grid-areas .area.grey a:hover {
  background-color: rgba(122, 125, 128, 0.9);
  background-position: right 1.5rem bottom 0.5rem;
}

.slide-contents .grid-areas .area.blue a:hover {
  background-color: rgba(0, 128, 200, 0.9);
  background-position: right 1.5rem bottom 0.5rem;
}

.slide-contents .grid-areas .area.bluedark a:hover {
  background-color: rgba(9, 70, 129, 0.9);
  background-position: right 1.5rem bottom 0.5rem;
}

.slide-contents .grid-areas .area.red a:hover {
  background-color: rgba(149, 44, 63, 0.9);
  background-position: right 1.5rem bottom 0.5rem;
}


.slide-contents .claim-aula-digital {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 50px;
}

.slide-contents .claim-aula-digital .head {
  flex-shrink: 0;
  margin-right: 4rem;
}

.slide-contents .claim-aula-digital .claim {
  text-align: center;
}


.slide-contents .claim-aula-digital .claim .logo-aula-digital {
    width: 420px;
}

.slide-contents .claim-aula-digital .claim .claim {
    display: block;
    font-size: 3rem;
    font-weight: 400;
    line-height: 1.1em;
    margin-top: 0.5rem;
}





.section-intro {
  display: flex;
  background-color: #fff;
  height: 100vh;
  min-height: 800px;
}

.section-intro .block-left {
  position: relative;
  width: 45%;
  padding: calc(100px + 2rem) 3rem 0;
  text-align: center;
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: left bottom;
}

.section-intro .block-right {
  position: relative;
  width: 55%;
  background-color: #e9edf0;
}





.section-intro .block-left h1 {
  font-size: 3rem;
  font-weight: 500;
  line-height: 1.2em;
  margin: 0 0 0.875em 0;
}

.section-intro .block-left p {
  font-size: 1.25rem;
  font-weight: 300;
  line-height: 1.25em;
}

.section-intro .block-left .logo-aula-digital {
  width: 442px;
  margin-top: 3rem;
}


.section-intro .block-right .logo-gr {
    position: absolute;
    width: 204px;
    bottom: 2rem;
    right: 2rem;
}

.section-intro .block-right .anim-cabeza {
  position: absolute;
  left: 50%;
  top: calc(50% + 50px);
  transform: translate(-50%,-50%);
}





.anim-cabeza {
  position: relative;
  width: 586px;
  height: 704px;  
}

.anim-cabeza .cabeza {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: auto;
}

.anim-cabeza div {
  position: absolute;
  width: 10px;
  height: 10px;
}


.anim-cabeza div.p1 {     
  transform: translate(140px, 98px) rotate(39deg) scale(4.8);
}

.anim-cabeza div.p2 {  
  transform: translate(184px, 205px) rotate(39deg) scale(6.2);
}

.anim-cabeza div.p3 {       
  transform: translate(144px, 336px) rotate(70deg) scale(7.7)
}

.anim-cabeza div.p4 {       
  transform: translate(296px, 529px) rotate(84deg) scale(5.2);
}

.anim-cabeza div.p5 {       
  transform: translate(350px, 645px) rotate(69deg) scale(4.5)
}

.anim-cabeza div.p6 {     
  transform: translate(183px, 64px) rotate(23deg) scale(4.5);
}

.anim-cabeza div.p7 {  
  transform: translate(261px, 320px) rotate(52deg) scale(8.2);
  z-index: -1;
}

.anim-cabeza div.p8 {       
  transform: translate(316px, 379px) rotate(10deg) scale(6.7);
}

.anim-cabeza div.p9 {     
  transform: translate(337px, 489px) rotate(21deg) scale(5.6);
}

.anim-cabeza div.p10 {        
  transform: translate(394px, 555px) rotate(85deg) scale(3.2);
}

.anim-cabeza div.p11 {        
  transform: translate(432px, 630px) rotate(76deg) scale(3.2);
}

.anim-cabeza div.p12 {        
  transform: translate(252px, 34px) rotate(63deg) scale(4.1);
}

.anim-cabeza div.p13 {        
  transform: translate(268px, 110px) rotate(76deg) scale(4.8);
}

.anim-cabeza div.p14 {        
  transform: translate(317px, 234px) rotate(41deg) scale(8.1);
}

.anim-cabeza div.p15 {        
  transform: translate(319px, 291px) rotate(72deg) scale(5.1);
}

.anim-cabeza div.p16 {        
  transform: translate(378px, 354px) rotate(108deg) scale(5.3);
}

.anim-cabeza div.p17 {        
  transform: translate(389px, 426px) rotate(112deg) scale(4.6);
}

.anim-cabeza div.p18 {        
  transform: translate(420px, 499px) rotate(126deg) scale(3.5);
}

.anim-cabeza div.p19 {        
  transform: translate(479px, 554px) rotate(112deg) scale(2.4);
}

.anim-cabeza div.p20 {        
  transform: translate(329px, 63px) rotate(49deg) scale(4.3);
}

.anim-cabeza div.p21 {        
  transform: translate(334px, 152px) rotate(108deg) scale(5.2);
}

.anim-cabeza div.p22 {        
  transform: translate(376px, 242px) rotate(76deg) scale(6.3);
  z-index: -1;
}

.anim-cabeza div.p23 {        
  transform: translate(414px, 270px) rotate(77deg) scale(3.8);
}

.anim-cabeza div.p24 {        
  transform: translate(445px, 341px) rotate(17deg) scale(4.3);
}

.anim-cabeza div.p25 {        
  transform: translate(466px, 424px) rotate(77deg) scale(4.2);
}

.anim-cabeza div.p26 {      
  transform: translate(373px, 14px) rotate(78deg) scale(3.3);
}

.anim-cabeza div.p27 {      
  transform: translate(419px, 170px) rotate(60deg) scale(4.3);
}

.anim-cabeza div.p28 {      
  transform: translate(509px, 353px) rotate(68deg) scale(4);
}

.anim-cabeza div.p29 {        
  transform: translate(534px, 438px) rotate(39deg) scale(2.9);
}

.anim-cabeza div.p30 {        
  transform: translate(434px, 85px) rotate(95deg) scale(3.1);
}

.anim-cabeza div.p31 {        
  transform: translate(471px, 204px) rotate(24deg) scale(4.2);
}

.anim-cabeza div.p32 {      
  transform: translate(478px, 280px) rotate(39deg) scale(2.6);
}

.anim-cabeza div.p33 {        
  transform: translate(552px, 189px) rotate(11deg) scale(3);
}

.anim-cabeza div.p34 {      
  transform: translate(562px, 313px) rotate(78deg) scale(3);
}




.orange .anim-cabeza div { background-color: #EF7A18;  }

.orange .anim-cabeza div.p1,
.orange .anim-cabeza div.p3,
.orange .anim-cabeza div.p7,
.orange .anim-cabeza div.p14 { background-color: #F8B379;}

.orange .anim-cabeza div.p6,
.orange .anim-cabeza div.p9,
.orange .anim-cabeza div.p26,
.orange .anim-cabeza div.p27,
.orange .anim-cabeza div.p28 { background-color: #FBCFA8;}

.orange .anim-cabeza div.p2,
.orange .anim-cabeza div.p15,
.orange .anim-cabeza div.p16 { background-color: #F3964D; }




.green .anim-cabeza div { background-color: #26938A;  }

.green .anim-cabeza div.p1,
.green .anim-cabeza div.p3,
.green .anim-cabeza div.p7,
.green .anim-cabeza div.p14 { background-color: #5C9F9B}

.green .anim-cabeza div.p6,
.green .anim-cabeza div.p9,
.green .anim-cabeza div.p26,
.green .anim-cabeza div.p27,
.green .anim-cabeza div.p28 { background-color: #3D9992;}

.green .anim-cabeza div.p2,
.green .anim-cabeza div.p15,
.green .anim-cabeza div.p16 { background-color: #3D9992; }



.purple .anim-cabeza div { background-color: #863089;  }

.purple .anim-cabeza div.p1,
.purple .anim-cabeza div.p3,
.purple .anim-cabeza div.p7,
.purple .anim-cabeza div.p14 { background-color: #9B669D}

.purple .anim-cabeza div.p6,
.purple .anim-cabeza div.p9,
.purple .anim-cabeza div.p26,
.purple .anim-cabeza div.p27,
.purple .anim-cabeza div.p28 { background-color: #A27FA2;}

.purple .anim-cabeza div.p2,
.purple .anim-cabeza div.p15,
.purple .anim-cabeza div.p16 { background-color: #914C97; }



.grey .anim-cabeza div { background-color: #616975;  }

.grey .anim-cabeza div.p1,
.grey .anim-cabeza div.p3,
.grey .anim-cabeza div.p7,
.grey .anim-cabeza div.p14 { background-color: #8F959B}

.grey .anim-cabeza div.p6,
.grey .anim-cabeza div.p9,
.grey .anim-cabeza div.p26,
.grey .anim-cabeza div.p27,
.grey .anim-cabeza div.p28 { background-color: #A5A9AE;}

.grey .anim-cabeza div.p2,
.grey .anim-cabeza div.p15,
.grey .anim-cabeza div.p16 { background-color: #788088; }


.blue .anim-cabeza div { background-color: #096CB4;  }

.blue .anim-cabeza div.p1,
.blue .anim-cabeza div.p3,
.blue .anim-cabeza div.p7,
.blue .anim-cabeza div.p14 { background-color: #2BA2D8}

.blue .anim-cabeza div.p6,
.blue .anim-cabeza div.p9,
.blue .anim-cabeza div.p26,
.blue .anim-cabeza div.p27,
.blue .anim-cabeza div.p28 { background-color: #629ECC;}

.blue .anim-cabeza div.p2,
.blue .anim-cabeza div.p15,
.blue .anim-cabeza div.p16 { background-color: #2582C4; }



.bluedark .anim-cabeza div { background-color: #104D87;  }

.bluedark .anim-cabeza div.p1,
.bluedark .anim-cabeza div.p3,
.bluedark .anim-cabeza div.p7,
.bluedark .anim-cabeza div.p14 { background-color: #104D87}

.bluedark .anim-cabeza div.p6,
.bluedark .anim-cabeza div.p9,
.bluedark .anim-cabeza div.p26,
.bluedark .anim-cabeza div.p27,
.bluedark .anim-cabeza div.p28 { background-color: #094681;}

.bluedark .anim-cabeza div.p2,
.bluedark .anim-cabeza div.p15,
.bluedark .anim-cabeza div.p16 { background-color: #04427E; }

.red .anim-cabeza div { background-color: #8C1631;  }

.red .anim-cabeza div.p1,
.red .anim-cabeza div.p3,
.red .anim-cabeza div.p7,
.red .anim-cabeza div.p14 { background-color: #BA6C7E;}

.red .anim-cabeza div.p6,
.red .anim-cabeza div.p9,
.red .anim-cabeza div.p26,
.red .anim-cabeza div.p27,
.red .anim-cabeza div.p28 { background-color: #DBB4BD;}

.red .anim-cabeza div.p2,
.red .anim-cabeza div.p15,
.red .anim-cabeza div.p16 { background-color: #8C1631; }


.orange .section-intro .block-left h1,
.orange .section-intro .block-left p {
  color: #ef7a18;
}
.orange .section-intro .block-left {
  background-image: url('../images/orange-seccion-bg-cuadros-big.png');
}


.green .section-intro .block-left h1,
.green .section-intro .block-left p {
  color: #24998e;
}
.green .section-intro .block-left {
  background-image: url('../images/green-seccion-bg-cuadros-big.png');
}


.purple .section-intro .block-left h1,
.purple .section-intro .block-left p {
  color: #8c378c;
}
.purple .section-intro .block-left {
  background-image: url('../images/purple-seccion-bg-cuadros-big.png');
}

.blue .section-intro .block-left h1,
.blue .section-intro .block-left p {
  color: #0080c8;
}
.blue .section-intro .block-left {
  background-image: url('../images/blue-seccion-bg-cuadros-big.png');
}

.bluedark .section-intro .block-left h1,
.bluedark .section-intro .block-left p {
  color: #094681;
}
.bluedark .section-intro .block-left {
  background-image: url('../images/bluedark-seccion-bg-cuadros-big.png');
}


.grey .section-intro .block-left h1,
.grey .section-intro .block-left p {
  color: #7a7d80;
}
.grey .section-intro .block-left {
  background-image: url('../images/grey-seccion-bg-cuadros-big.png');
}

.red .section-intro .block-left h1,
.red .section-intro .block-left p {
  color: #8C1631;
}
.red .section-intro .block-left {
  background-image: url('../images/red-seccion-bg-cuadros-big.png');
}




.section-header {
  position: relative;
  width: 100%;
  /*background-size: auto 200px;*/
  background-repeat: no-repeat;
  background-position: right center;
  background-color: #fff;
  border-top: 16px solid transparent;
}


.section-header.no-intro {
  padding-top: 100px;
  border:none;
}


.section-header .inner {
  width: 100%;
  height: 180px;
  padding: 0 2rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.section-header .cabeza {
  width: 120px;
  height: 145px;
  background-size: cover;
  margin-right: 1rem;
}

.section-header h2 {
  font-size: 2.5rem;
  font-weight: 500;
  line-height: 1;
}




.orange .section-header { border-color: #ef7a18; background-image: url('../images/orange-seccion-bg-cuadros-small.png') }

.orange .section-header .cabeza { background-image: url('../images/cabeza-small-orange.png') }

.orange .section-header h2 { color: #ef7a18; }

.green .section-header { border-color: #24998e; background-image: url('../images/green-seccion-bg-cuadros-small.png') }

.green .section-header .cabeza { background-image: url('../images/cabeza-small-green.png') }

.green .section-header h2 { color: #24998e; }


.purple .section-header { border-color: #8c378c; background-image: url('../images/purple-seccion-bg-cuadros-small.png') }

.purple .section-header .cabeza { background-image: url('../images/cabeza-small-purple.png') }

.purple .section-header h2 { color: #8c378c; }

.grey .section-header { border-color: #7a7d80; background-image: url('../images/grey-seccion-bg-cuadros-small.png') }

.grey .section-header .cabeza { background-image: url('../images/cabeza-small-grey.png') }

.grey .section-header h2 { color: #7a7d80; }


.blue .section-header { border-color: #0080c8; background-image: url('../images/blue-seccion-bg-cuadros-small.png') }

.blue .section-header .cabeza { background-image: url('../images/cabeza-small-blue.png') }

.blue .section-header h2 { color: #0080c8; }



.bluedark .section-header { border-color: #094681; background-image: url('../images/bluedark-seccion-bg-cuadros-small.png') }

.bluedark .section-header .cabeza { background-image: url('../images/cabeza-small-bluedark.png') }

.bluedark .section-header h2 { color: #094681; }



.red .section-header { border-color: #8C1631; background-image: url('../images/red-seccion-bg-cuadros-small.png') }

.red .section-header .cabeza { background-image: url('../images/cabeza-small-red.png') }

.red .section-header h2 { color: #8C1631; margin: -16px 0 0 0}




.button-biblioteca {
  display: flex;
  align-items: center;
  padding: 7px 24px 6px 12px;
  background-color: #EDEDF2;
  gap:12px;
  border-radius: 24px;
  color: #8C1631;
  font-size:16px;
  font-weight: 700;
  box-shadow: 3px 3px 0 1px #DDE0E8; 
}

.button-biblioteca:hover {
  color: #8C1631;
  background-color: #f0f0f0;
  box-shadow: 3px 3px 0 1px  #c6cad3; 
}

.button-biblioteca i {
  display: block;
  width: 24px;
    height: 24px;
    -webkit-mask: url('../images/icon-biblioteca.svg') no-repeat 50% 50% / 24px 24px;
    mask: url('../images/icon-biblioteca.svg') no-repeat 50% 50% / 24px 24px;
    background-color: #8C1631;
}



.red .section-header .button-biblioteca {
  position: absolute;
  left: 163px;
  bottom: 20px;
}





.section-videos {
  padding: 2rem 2rem;
  background-color: #e9edf0;
}



.grid-videos {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
}


.grid-videos .item {
  width: 20%;
  padding: 0.5rem 1.5rem;
}

.grid-videos .item a {
  display: block;
}

.grid-videos .item .poster {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-top-left-radius: 1.25rem;
  border-top-right-radius: 1.25rem;
  overflow: hidden;
}

.grid-videos .item .poster > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.5s ease-in-out
}

.grid-videos .item .item-info {
  display: block;
  width:  100%;
}

.grid-videos .item .item-info .date {
  display: block;
  width: 100%;
  color: #fff;
  padding: 0.5rem 0.5rem;
  text-align: left;
  font-size: 0.85rem;
  text-align: center;
  border-bottom-right-radius: 1.25rem;
}


.grid-videos .item .item-info .title {
  display: block;
  width: 100%;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2em;
  text-align: left;
  padding: 0.75rem 0;
}

.grid-videos .item a:hover .poster > img {
  opacity: 0.6;
}

.grid-videos .item a:hover .item-info .title { text-decoration: underline; }


.orange .grid-videos .item .poster,
.orange .grid-videos .item .item-info .date { background-color: #ef7a18 }
.orange .grid-videos .item .item-info .title { color: #ef7a18 }


.green .grid-videos .item .poster,
.green .grid-videos .item .item-info .date { background-color: #24998e }
.green .grid-videos .item .item-info .title { color: #24998e }


.purple .grid-videos .item .poster,
.purple .grid-videos .item .item-info .date { background-color: #8c378c }
.purple .grid-videos .item .item-info .title { color: #8c378c }



.grey .grid-videos .item .poster,
.grey .grid-videos .item .item-info .date { background-color: #7a7d80 }
.grey .grid-videos .item .item-info .title { color: #7a7d80 }



.blue .grid-videos .item .poster,
.blue .grid-videos .item .item-info .date { background-color: #0080c8 }
.blue .grid-videos .item .item-info .title { color: #0080c8 }


.red .grid-videos .item .poster,
.red .grid-videos .item .item-info .date { background-color: #8C1631 }
.red .grid-videos .item .item-info .title { color: #8C1631 }


.section-videos .curso-container {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}

.section-videos .curso-container:last-of-type { margin-bottom: 0; }

.section-videos .curso-container .curso-header {
  width: 100%;
}

.section-videos .curso-container .info-curso {
  width: 33.333%;
  padding: 0 1rem 0 0;
}

.section-videos .curso-container .curso-header .title-curso {
  font-size: 1.75rem;
  margin: 0.5em 0 0.5em 0;
}

.section-videos .curso-container .grid-videos {
  width: 66.6667%
}

.section-videos .curso-container .grid-videos .item { width: 25%; }


.orange .section-videos .curso-container .curso-header .title-curso { color: #ef7a18; }
.green .section-videos .curso-container .curso-header .title-curso { color: #8c378c; }
.purple .section-videos .curso-container .curso-header .title-curso { color: #7a7d80; }
.grey .section-videos .curso-container .curso-header .title-curso { color: #7a7d80; }
.blue .section-videos .curso-container .curso-header .title-curso { color: #0080c8; }
.red .section-videos .curso-container .curso-header .title-curso { color: #bd173b; }

.section-video {
  display: flex;
  background-color: #fff;
  /*height: 100vh;*/
  min-height: 100vh;
}

.section-video .block-left {
  position: relative;
  width: 45%;
  padding: 150px 3rem 172px;
  text-align: center;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  text-align: left;
}

.section-video .block-right {
  position: relative;
  width: 55%;
  padding: 128px 3rem 2rem;
  background-color: #e9edf0;
}


.section-video .block-left h1 {
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.2em;
  margin: 0 0 2rem 0;
  text-align: center;
}

.section-video .block-left .date {
  display: block;
  color: #393939;
  font-size: 1.125rem;
  font-weight: 500;
}

.section-video .block-left .info-video,
.section-video .block-left .info-autores {
  color: #393939;
  font-size: 1rem;
  line-height: 1.25em;
  font-weight: 400;
  margin-top: 1.5rem;
}


.section-video .block-left .info-adicional {
  margin-top: 3rem;
  display: flex;
  justify-content: flex-start;
}

.section-video .block-left .group-logo-aula-digital {
  position: absolute;
  display: flex;
  align-items: center;
  left: 1rem;
  bottom: 0;
  margin-bottom: -0.5rem;
}

.section-video .block-left .group-logo-aula-digital .cabeza {
  width: 120px;
  height: 145px;
  background-size: cover;
  margin-right: 1rem;
}

.section-video .block-left .group-logo-aula-digital > img {

}


.section-video .block-left h3 {
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0 0 0.5em 0;
}

.section-video .block-left h4 {
  font-size: 1.25rem;
  font-weight: 700;
  margin: 0 0 0.5em 0;
}

.orange .section-video .block-left .info-video h3,
.orange .section-video .block-left .info-video h4,
.orange .section-video .block-left .info-autores h3,
.orange .section-video .block-left .info-autores h4,
.orange .section-video .block-left .info-video strong,
.orange .section-video .block-left .info-autores strong { color: #ef7a18; }

.green .section-video .block-left .info-video h3,
.green .section-video .block-left .info-video h4,
.green .section-video .block-left .info-autores h3,
.green .section-video .block-left .info-autores h4,
.green .section-video .block-left .info-video strong,
.green .section-video .block-left .info-autores strong { color: #24998e; }

.purple .section-video .block-left .info-video h3,
.purple .section-video .block-left .info-video h4,
.purple .section-video .block-left .info-autores h3,
.purple .section-video .block-left .info-autores h4,
.purple .section-video .block-left .info-video strong,
.purple .section-video .block-left .info-autores strong { color: #8c378c; }

.grey .section-video .block-left .info-video h3,
.grey .section-video .block-left .info-video h4,
.grey .section-video .block-left .info-autores h3,
.grey .section-video .block-left .info-autores h4,
.grey .section-video .block-left .info-video strong,
.grey .section-video .block-left .info-autores strong { color: #7a7d80; }

.blue .section-video .block-left .info-video h3,
.blue .section-video .block-left .info-video h4,
.blue .section-video .block-left .info-autores h3,
.blue .section-video .block-left .info-autores h4,
.blue .section-video .block-left .info-video strong,
.blue .section-video .block-left .info-autores strong { color: #0080c8; }

.red .section-video .block-left .info-video h3,
.red .section-video .block-left .info-video h4,
.red .section-video .block-left .info-autores h3,
.red .section-video .block-left .info-autores h4,
.red .section-video .block-left .info-video strong,
.red .section-video .block-left .info-autores strong { color: #8C1631; }


.section-video .block-right {
  background-size: 50% auto;
  background-repeat: no-repeat;
  background-position: right bottom 1rem;
}



.section-video .block-right .breadcrumb {
  padding: 0 0 1rem 0;
  font-size: 0.85rem;
  line-height: 1.2em;

  text-align: left;
}

.section-video .block-right .breadcrumb a,
.section-video .block-right .breadcrumb span,
.section-video .block-right .breadcrumb ion-icon {
  vertical-align: middle;
}

.section-video .block-right .breadcrumb a { font-weight: 400 }

.section-video .block-right .breadcrumb a:hover {
  text-decoration: underline;
}

.section-video .block-right .breadcrumb span:last-child { font-weight: 500; }



.section-video .webinar-player {
  width: 100%;
}

.section-video .webinar-player .video-container {
  height: 0;
  overflow: hidden;
  padding-bottom: 56.25%;
  position: relative;
  /*box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.5);*/
}

.section-video .webinar-player .video-container iframe,
.section-video .webinar-player .video-container object,
.section-video .webinar-player .video-container embed,
.section-video .webinar-player .video-container img {
    width: 100%;
    height:100%;
    left: 0;
    position: absolute;
    top: 0;
    
  }

.section-video .webinar-player .video-options {
  padding: 1rem 0;
}

.section-video .webinar-player .video-options a {
  font-size: 1.375rem;
  line-height: 1;
  font-weight: 500;
  transition: color 0.5s ease-in-out
}

.section-video .webinar-player .video-options a:hover {
  color: #0dabdc;
}

.section-video .webinar-player .video-options ion-icon {  vertical-align: middle; }




.like-options {
  padding: 1rem 0;
  display: flex;
  align-items: center;
  color: #393939;
  position: relative;
    z-index: 1;
}

.like-options > span {
  font-size: 1rem;
  font-weight: 700;
}



.like-options ul.stars {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  align-items: center;
  margin-left: 1rem;
}

.like-options ul.stars li {
  margin: 0;
}

.like-options ul.stars button {
  width: 28px;
  height: 28px;
  -webkit-mask: url('../images/star-outline.svg') no-repeat 50% 50%/24px 24px;
  mask: url('../images/star-outline.svg') no-repeat 50% 50%/24px 24px;  
}

.like-options ul.stars button.selected,
.like-options ul.stars button.active {
  -webkit-mask: url('../images/star.svg') no-repeat 50% 50%/24px 24px;
  mask: url('../images/star.svg') no-repeat 50% 50%/24px 24px;  
}


.like-options .like-container {
  display: flex;
  align-items: flex-end;  
}


.like-options .like-container > small {
  margin-left: 12px;
  font-weight: 700;
}

.like-options .button-like {
  width: 32px;
  height: 32px;
  -webkit-mask: url('../images/like.svg') no-repeat 50% 50%/32px 32px;
  mask: url('../images/like.svg') no-repeat 50% 50%/32px 32px;  
  margin-left:12px;
}


.like-options .button-like:hover,
.like-options .button-like.selected {
  -webkit-mask: url('../images/like-fill.svg') no-repeat 50% 50%/32px 32px;
  mask: url('../images/like-fill.svg') no-repeat 50% 50%/32px 32px;  
}


.dropdown {
  max-width: 150px;
  position: relative;
  width: 100%;
}

.section-video .webinar-player .like-options .dropdown {
  margin-left: auto;
}

.dropdown-btn {    
  width: 100%;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 25px;
  border-radius: 1rem 1rem 1rem 0;
  line-height: 1;
  color: #fff;
  transition: background .3s ease-out, border .3s ease-out, color .3s ease-out;
}

.dropdown-btn:hover {
  background-color: #0dabdc !important;
}

.dropdown-btn ion-icon { margin-left: 8px; }

.dropdown-content {
  list-style: none;
  position: absolute;
  top: 36px;
  width: 100%;
  margin: 0;
  padding: 0;
  visibility: hidden;
}
.dropdown-content li {
  display: block;
  margin: 0;
}

.dropdown-content li a {
  display: block;
  padding: 8px 5px;
  color: #fff;
  margin: 0;
  text-decoration: none;
  text-align: center;
  font-size: 14px;
  line-height: 1;
  border-top: 1px solid #fff;
  transition: background .3s ease-out, border .3s ease-out, color .3s ease-out;
}

.dropdown-content li a:hover {
  background-color: #0dabdc !important;
}

.dropdown-content li:last-of-type a { border-radius: 0 0 1rem 1rem; }

.dropdown:focus-within .dropdown-content {
  visibility: visible;
} 

.dropdown:focus-within .dropdown-btn {
  border-radius: 1rem 1rem 0 0;
}

/*.section-video .webinar-player .like-options .button-download {
  display: flex;
  align-items: center;
  margin-left: auto;
  color: #fff;
  transition: background .3s ease-out, border .3s ease-out, color .3s ease-out;
  padding: 10px 25px;
  min-width: 150px;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  border-radius: 1rem 1rem 1rem 0;
  line-height: 1;
}

.section-video .webinar-player .like-options .button-download ion-icon { margin-right: 8px; }

.section-video .webinar-player .like-options .button-download:hover {
  background-color: #0dabdc;
}*/


.orange .section-video .block-right { background-image: url('../images/orange-video-cuadrados.png'); }
.orange .section-video .block-right .breadcrumb span:last-child { color: #ef7a18; }
.orange .section-video .block-left .group-logo-aula-digital .cabeza { background-image: url('../images/cabeza-small-orange.png') }
.orange .section-video .block-left { background-image: url('../images/orange-bg-image-video.jpg'); }
.orange .section-video .block-left h1 {color: #ef7a18;}


.green .section-video .block-right { background-image: url('../images/green-video-cuadrados.png'); }
.green .section-video .block-right .breadcrumb span:last-child { color: #24998e; }
.green .section-video .block-left .group-logo-aula-digital .cabeza { background-image: url('../images/cabeza-small-green.png') }
.green .section-video .block-left { background-image: url('../images/green-bg-image-video.jpg'); }
.green .section-video .block-left h1 {color: #24998e;}


.purple .section-video .block-right { background-image: url('../images/purple-video-cuadrados.png'); }
.purple .section-video .block-right .breadcrumb span:last-child { color: #8c378c; }
.purple .section-video .block-left .group-logo-aula-digital .cabeza { background-image: url('../images/cabeza-small-purple.png') }
.purple .section-video .block-left { background-image: url('../images/purple-bg-image-video.jpg'); }
.purple .section-video .block-left h1 {color: #8c378c;}


.grey .section-video .block-right { background-image: url('../images/grey-video-cuadrados.png'); }
.grey .section-video .block-right .breadcrumb span:last-child { color: #7a7d80; }
.grey .section-video .block-left .group-logo-aula-digital .cabeza { background-image: url('../images/cabeza-small-grey.png') }
.grey .section-video .block-left { background-image: url('../images/grey-bg-image-video.jpg'); }
.grey .section-video .block-left h1 {color: #7a7d80;}


.blue .section-video .block-right { background-image: url('../images/blue-video-cuadrados.png'); }
.blue .section-video .block-right .breadcrumb span:last-child { color: #0080c8; }
.blue .section-video .block-left .group-logo-aula-digital .cabeza { background-image: url('../images/cabeza-small-blue.png') }
.blue .section-video .block-left { background-image: url('../images/blue-bg-image-video.jpg'); }
.blue .section-video .block-left h1 {color: #0080c8;}

.red .section-video .block-right { background-image: url('../images/red-video-cuadrados.png'); }
.red .section-video .block-right .breadcrumb span:last-child { color: #8C1631; }
.red .section-video .block-left .group-logo-aula-digital .cabeza { background-image: url('../images/cabeza-small-red.png') }
.red .section-video .block-left { background-image: url('../images/red-bg-image-video.jpg'); }
.red .section-video .block-left h1 {color: #8C1631;}

.orange .section-video .webinar-player .video-options a { color: #ef7a18  }
.green .section-video .webinar-player .video-options a { color: #24998e  }
.purple .section-video .webinar-player .video-options a { color: #8c378c  }
.grey .section-video .webinar-player .video-options a { color: #7a7d80  }
.blue .section-video .webinar-player .video-options a { color: #0080c8  }
.red .section-video .webinar-player .video-options a { color: #8C1631  }


.orange .like-options button,
.orange .dropdown-content li a { background-color: #ef7a18  }
.green .like-options button,
.green .dropdown-content li a { background-color: #24998e  }
.purple .like-options button,
.purple .dropdown-content li a { background-color: #8c378c  }
.grey .like-options button,
.grey .dropdown-content li a { background-color: #7a7d80  }
.blue .like-options button,
.blue .dropdown-content li a { background-color: #0080c8  }
.bluedark .like-options button,
.bluedark .dropdown-content li a { background-color: #094681  }
.red .like-options button,
.red .dropdown-content li a { background-color: #8C1631  }



.section-video .webinar-player .video-options a:hover {
  color: #0dabdc !important;
}




.section-noticias {
  padding: 2rem 2rem;
  background-color: #e9edf0;
}



.grid-noticias {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
}


.grid-noticias .noticia {
  width: 33.33333%;
  padding: 1.5rem 1.5rem;
}

.grid-noticias .noticia .inner {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}

.grid-noticias .noticia .foto {
  width: 160px;
  aspect-ratio: 1; 
  border-radius: 1.25rem;
  overflow: hidden;
}

.grid-noticias .noticia .foto > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.5s ease-in-out;
}

.grid-noticias .noticia .title {
  display: block;
  font-size: 1.15rem;
  line-height: 1.25;
  color: #094681;
}

.grid-noticias .noticia .date {
  display: block;
  font-size: 0.85rem;
  line-height: 1.25;
  color: #0f0f0f;
  margin-top: 0.25rem;
}

.grid-noticias .noticia .medio {
  display: block;
  font-size: 0.85rem;
  line-height: 1.25;
  font-weight: 700;
  color: #0f0f0f;
  margin-top: 0.25rem;
}


.grid-noticias .noticia:hover .title {
  text-decoration: underline;
}



.section-noticia {
  display: flex;
  background-color: #fff;
  /*height: 100vh;*/
  min-height: 100vh;
}

.section-noticia .block-left {
  position: relative;
  width: 45%;
  padding: 150px 3rem 172px;
  text-align: center;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  text-align: left;
}

.section-noticia .block-right {
  position: relative;
  width: 55%;
  padding: 128px 3rem 2rem;
  background-color: #e9edf0;
}

.section-noticia .block-left h1 {
    font-size: 2rem;
    font-weight: 500;
    line-height: 1.2em;
    margin: 0 0 2rem 0;
    text-align: left;
    color: #094681;
}

.section-noticia .block-left .date {
  display: block;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.25;
  color: #393939;
  margin-top: 0.25rem;
}

.section-noticia .block-left .medio {
  display: block;
  font-size: 1rem;
  line-height: 1.25;
  font-weight: 500;
  color: #393939;
  margin-top: 0.25rem;
}

.section-noticia .block-left .medio a:hover { text-decoration: underline; }

.section-noticia .block-left .noticia-images {
  margin-top: 2rem;
  display: flex;
  gap: 1.5rem;
}

.section-noticia .block-left .noticia-images > img {
  display: block;
  border-radius: 1rem;
  aspect-ratio: 4/3;
  width: calc(50% - 0.75rem);
  object-fit: cover;
}

.section-noticia .body-noticia {
  padding: 0 10% 0 0;
}

.section-noticia .body-noticia .excerpt {
  font-size: 1.25em
}

.section-noticia .body-noticia h2 {
  font-size: 1.5em;
  color: #094681;
  /*text-transform: uppercase;*/
  line-height: 1.2;
  margin: 1.5rem 0 0.25rem;
}

.section-noticia .body-noticia h3 {
  font-size: 1.25em;
  color: #094681;
  /*text-transform: uppercase;*/
  line-height: 1.2;
  margin: 1rem 0 0.5rem;
}

.section-noticia .body-noticia a:hover { text-decoration: underline; }



.section-noticia .noticia-options {
  padding: 1rem 0;
}

.section-noticia .noticia-options a {
  font-size: 1.375rem;
  line-height: 1;
  font-weight: 500;
  transition: color 0.5s ease-in-out
}

.section-noticia .noticia-options a:hover {
  color: #0dabdc;
}

.section-noticia .noticia-options ion-icon {  vertical-align: middle; }

.bluedark .section-noticia .noticia-options {
  color: #094681;
}


.footer {
  position: absolute;
  bottom: 0;
  left:0;
  width: 100%;
  z-index: 0;
}


.footer-inner {
  padding: 2rem 3rem 1rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; 
}

.footer-inner .footer-menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer-inner .footer-menu li {
  display: inline-block;
  padding: 1px 15px;
  font-size: 0.1px;
  line-height: 1em;
  border-right: 2px solid #fff;

}

.footer-inner .footer-menu li:last-of-type { border-right: none;}

.footer-inner .footer-menu li a {
  font-size: 13px;
  line-height: 1em;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
  text-decoration: none !important
}


.footer-inner .footer-menu li a:hover { text-decoration: underline !important;}


.footer-inner .logo-gr-footer {
  width: 408px;
  margin-bottom: 2rem;
}


/* FORMS */


.box-form .label,
.box-form label {   
  display: block;
  font-size: 15px;
  margin-bottom: 5px;
  line-height: 1.1em;
  color: #004289;
  font-weight: 500;
}

.box-form .box-error {
  display: none;
  margin-top: 0;
  text-align: center;
  font-size: 15px;
  color: #161616;
}


.box-form textarea.has-error,
.box-form input.has-error,
.box-form select.has-error {  
  border: 1px solid #f43319 !important;
  background-color: #fff !important;
}

.box-form .form-options {
  text-align: left;
  margin-top: 0
}

.box-form .input-field-container {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -10px;  
}

.box-form .field-container {
  flex: 0 0 50%;
  max-width: 50%;
  padding: 0 10px;
  margin-bottom: 15px;
}

.box-form .field-container.field-container--full {
  flex: 0 0 100%;
  max-width: 100%;
}

.box-form .form-heading {
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
  padding: 0;
  margin-bottom: 45px;
}


.box-form .form-heading h2 {
  font-size: 1.5em;
  margin: 0;
}

.box-form input[type="text"],
.box-form input[type="email"],
.box-form input[type="password"],
.box-form textarea {   
    display: block;
    width: 100%;
    height: auto;
    padding: 6px 15px;
    font-size: 1em;
    line-height: 1.25;
    background-clip: padding-box;
    border: 1px solid transparent;
    background-color: #fafafa;
    border-radius: 3px;
    color: #3c3c3c;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    background-clip: border-box;

}

.box-form textarea { line-height: 1.5 }

.box-form select {

    padding: 9px 15px;
    font-size: 15px;
    font-weight: 400;
    line-height: 1em;
    outline: none;
    background-color: #fff;
    width: 100%;
    color: #3c3c3c;
    border: 1px solid transparent;
    cursor: pointer;
    height: 38px; 
    border-radius: 3px;
}

.box-form select option {
    color: #3c3c3c;
}

.box-form input[type="text"]:focus,
.box-form input[type="email"]:focus,
.box-form input[type="password"]:focus,
.box-form textarea:focus,
.box-form select:focus {
    border: 1px solid #004289;
    color: #3c3c3c;
    box-shadow: none;
    background-color: #fafafa;
    outline: 0;
}



.box-form .mandatory {
  margin: 0;
  line-height: 15px;
  font-size: 14px;
}

.custom-check {
    display: block;
    text-align: left;
}

.custom-check label {
    display: inline-block; 
    text-align: left;
    margin: 0;
    background-color: transparent;
    padding-left: 24px;
    line-height: 16px;
    font-size: 16px;
    font-weight: 400
}

.custom-check label a { text-decoration: underline; font-weight: 700 }
.custom-check label a:hover {  text-decoration: underline; }

.custom-check input[type="checkbox"],
.custom-check input[type="radio"] { display: none; }
.custom-check input[type="checkbox"] + label span,
.custom-check input[type="radio"] + label span {
    display:block;
    float: left;
    vertical-align:text-top;
    cursor:pointer;
    width:15px;
    height:15px;

    border: 2px solid #004289;
    background-color: #f6eeec;
    margin-left: -24px;
    border-radius: 3px;
}

.custom-check input[type="radio"] + label span {
  border-radius: 50%;
}


.custom-check input[type="checkbox"]:checked + label span,
.custom-check input[type="radio"]:checked + label span {
     background-color:  #004289;
     border-color: #004289 !important;
}

.custom-check input[type="checkbox"].has-error + label span,
.custom-check input[type="radio"].has-error + label span {
  border-color: #f00;
}


.legal-link {
  text-decoration: underline;
}


.btn {
  display: inline-block;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  user-select: none;
  border: 1px solid transparent;
  line-height: 1.5
}


.btn--primary {
  display: inline-block;  
  font-size: 18px;
  font-weight: 400;
  border: 2px solid #1e3a7f;
  color: #fff;
  background-color: #1e3a7f;
  border-radius: 25px;
  transition: background .3s ease-out, border .3s ease-out, color .3s ease-out; 
  padding: 10px 25px;
  min-width: 150px;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  border-radius: 1rem 1rem 1rem 0 
}

.btn--primary:hover,
.btn--primary:focus {
  color: #fff;
  background-color: #0dabdc;
  border-color: #0dabdc;
}




.btn--primary:disabled {
  cursor: not-allowed;
  border-color: #aaa;
  color: #aaa
}

.btn--primary:disabled:hover {
  border-color: #aaa;
  color: #aaa;
  background-color: #fff
}

.btn--primary.btn--waiting {
  color: #666;
  background-color: #FFE3AA;
  border-color: #FFE3AA;
  cursor: wait;
  opacity: 0.75
}

.btn--secondary {
  display: inline-block;
  font-size: 1em;
  font-weight: 700;
  color: #006881;
  background-color: #fff;
  border: 2px solid #006881;
  border-radius: 15px;
  transition: background .3s ease-out, border .3s ease-out, color .3s ease-out; 
  padding: 8px 25px;
  min-width: 130px;
  text-transform: uppercase;
  text-align: center;
  border-radius: 1rem 1rem 1rem 0
}

@media(min-width:768px) {
  .btn--primary 
  .btn--secondary {
    font-size: 16px;
    font-size: 1rem;
    padding: 12px
  }
}

.btn--secondary:hover,
.btn--secondary:focus {
  /*
  color: #1B988F;
  background-color: #fff;
  border: 2px solid #1B988F;
  */
  color: #fff;
  background-color: #006881;
  border-color: #006881;
}

.btn:not(:disabled):not(.disabled) {
    cursor: pointer;
}



.btn--with-icon {
  vertical-align: middle;
}

.btn--with-icon ion-icon {
  font-size: 18px;
  margin-right: 15px;
  vertical-align: middle;
}

.btn--with-icon span { vertical-align: middle; }





#cookiesBlock {
  position: fixed;
  display:none;
  z-index: 98;
  top:0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #787878;
  background-color: rgba(0,0,0,0.7);
  cursor: wait;
}

#cookiesBar {
  width:100%;
    display:none;
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    text-align:center;  
    background-color:#111;
    color:#fff;
    z-index:99;
}
 
#cookiesBar .inner {
    padding:10px 20px 20px 20px;
    font-size:1em;
}

#cookiesBar p {
  text-align:center;
  font-size:14px;
  line-height:1.3em;
  color:#fff
}

#cookiesBar a {
  color:#fff;
  text-decoration:underline;
}

#cookiesBar a.ok {
  display:inline-block;
  margin:10px 0 0;
  padding:6px 15px;
  color:#fff;
  background-color:#6fbd86;
  font-size:14px;
  line-height:1em;
    text-decoration:none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  text-transform:uppercase;
}

#cookiesBar a.ok:hover {
  background-color:#1B988F;
  color:#fff;
}




.legal-container {
  width: 100%;
  max-width: 1024px;
  margin: 0 auto;
  background-color: #fff;
  padding: 50px 50px;
}


.legal-wrap { 
  font-size: 0.875rem;
  font-weight: 300;
}

.legal-wrap h1 {
  font-size: 1.5em;
  font-weight: 500;
  margin: 0;

}

.legal-wrap h2 {
  font-size: 1.25em;
  font-weight: 500;
  margin-top: 1.5em;

}

.legal-wrap h3 {
  font-size: 1.25em;
  font-weight: 500;
  margin-top: 1em;

}

.legal-wrap a { color: #1e3a7f; font-weight: 400 }

.legal-wrap p,
.legal-wrap li {  line-height: 1.5; margin: 0.5em 0 }
/* ==========================================================================
   Helper classes
   ========================================================================== */

/*!
 * animsition v4.0.2
 * A simple and easy jQuery plugin for CSS animated page transitions.
 * http://blivesta.github.io/animsition
 * License : MIT
 * Author : blivesta (http://blivesta.com/)
 */

 .animsition,.animsition-overlay{position:relative;opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animsition-overlay-slide{position:fixed;z-index:1;width:100%;height:100%;background-color: #95C0D6}.animsition-loading,.animsition-loading:after{width:32px;height:32px;position:fixed;top:50%;left:50%;margin-top:-16px;margin-left:-16px;border-radius:50%;z-index:2}.animsition-loading{background-color:transparent;border-top:5px solid rgba(32,129,175,1);border-right:5px solid rgba(32,129,175,1);border-bottom:5px solid rgba(255,255,255,1);border-left:5px solid #eee;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-duration:.8s;animation-duration:.8s;-webkit-animation-name:animsition-loading;animation-name:animsition-loading}@-webkit-keyframes animsition-loading{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes animsition-loading{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@-webkit-keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.fade-in{-webkit-animation-name:fade-in;animation-name:fade-in}@-webkit-keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}.fade-out{-webkit-animation-name:fade-out;animation-name:fade-out}@-webkit-keyframes fade-in-up{0%{-webkit-transform:translateY(500px);transform:translateY(500px);opacity:0}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}@keyframes fade-in-up{0%{-webkit-transform:translateY(500px);transform:translateY(500px);opacity:0}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}.fade-in-up{-webkit-animation-name:fade-in-up;animation-name:fade-in-up}@-webkit-keyframes fade-out-up{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}to{-webkit-transform:translateY(-500px);transform:translateY(-500px);opacity:0}}@keyframes fade-out-up{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}to{-webkit-transform:translateY(-500px);transform:translateY(-500px);opacity:0}}.fade-out-up{-webkit-animation-name:fade-out-up;animation-name:fade-out-up}@-webkit-keyframes fade-in-up-sm{0%{-webkit-transform:translateY(100px);transform:translateY(100px);opacity:0}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}@keyframes fade-in-up-sm{0%{-webkit-transform:translateY(100px);transform:translateY(100px);opacity:0}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}.fade-in-up-sm{-webkit-animation-name:fade-in-up-sm;animation-name:fade-in-up-sm}@-webkit-keyframes fade-out-up-sm{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}to{-webkit-transform:translateY(-100px);transform:translateY(-100px);opacity:0}}@keyframes fade-out-up-sm{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}to{-webkit-transform:translateY(-100px);transform:translateY(-100px);opacity:0}}.fade-out-up-sm{-webkit-animation-name:fade-out-up-sm;animation-name:fade-out-up-sm}@-webkit-keyframes fade-in-up-lg{0%{-webkit-transform:translateY(1000px);transform:translateY(1000px);opacity:0}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}@keyframes fade-in-up-lg{0%{-webkit-transform:translateY(1000px);transform:translateY(1000px);opacity:0}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}.fade-in-up-lg{-webkit-animation-name:fade-in-up-lg;animation-name:fade-in-up-lg}@-webkit-keyframes fade-out-up-lg{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}to{-webkit-transform:translateY(-1000px);transform:translateY(-1000px);opacity:0}}@keyframes fade-out-up-lg{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}to{-webkit-transform:translateY(-1000px);transform:translateY(-1000px);opacity:0}}.fade-out-up-lg{-webkit-animation-name:fade-out-up-lg;animation-name:fade-out-up-lg}@-webkit-keyframes fade-in-down{0%{-webkit-transform:translateY(-500px);transform:translateY(-500px);opacity:0}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}@keyframes fade-in-down{0%{-webkit-transform:translateY(-500px);transform:translateY(-500px);opacity:0}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}.fade-in-down{-webkit-animation-name:fade-in-down;animation-name:fade-in-down}@-webkit-keyframes fade-out-down{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}to{-webkit-transform:translateY(500px);transform:translateY(500px);opacity:0}}@keyframes fade-out-down{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}to{-webkit-transform:translateY(500px);transform:translateY(500px);opacity:0}}.fade-out-down{-webkit-animation-name:fade-out-down;animation-name:fade-out-down}@-webkit-keyframes fade-in-down-sm{0%{-webkit-transform:translateY(-100px);transform:translateY(-100px);opacity:0}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}@keyframes fade-in-down-sm{0%{-webkit-transform:translateY(-100px);transform:translateY(-100px);opacity:0}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}.fade-in-down-sm{-webkit-animation-name:fade-in-down-sm;animation-name:fade-in-down-sm}@-webkit-keyframes fade-out-down-sm{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}to{-webkit-transform:translateY(100px);transform:translateY(100px);opacity:0}}@keyframes fade-out-down-sm{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}to{-webkit-transform:translateY(100px);transform:translateY(100px);opacity:0}}.fade-out-down-sm{-webkit-animation-name:fade-out-down-sm;animation-name:fade-out-down-sm}.fade-in-down-lg{-webkit-animation-name:fade-in-down;animation-name:fade-in-down}@-webkit-keyframes fade-out-down-lg{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}to{-webkit-transform:translateY(1000px);transform:translateY(1000px);opacity:0}}@keyframes fade-out-down-lg{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}to{-webkit-transform:translateY(1000px);transform:translateY(1000px);opacity:0}}.fade-out-down-lg{-webkit-animation-name:fade-out-down-lg;animation-name:fade-out-down-lg}@-webkit-keyframes fade-in-left{0%{-webkit-transform:translateX(-500px);transform:translateX(-500px);opacity:0}to{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}@keyframes fade-in-left{0%{-webkit-transform:translateX(-500px);transform:translateX(-500px);opacity:0}to{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}.fade-in-left{-webkit-animation-name:fade-in-left;animation-name:fade-in-left}@-webkit-keyframes fade-out-left{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}to{-webkit-transform:translateX(-500px);transform:translateX(-500px);opacity:0}}@keyframes fade-out-left{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}to{-webkit-transform:translateX(-500px);transform:translateX(-500px);opacity:0}}.fade-out-left{-webkit-animation-name:fade-out-left;animation-name:fade-out-left}@-webkit-keyframes fade-in-left-sm{0%{-webkit-transform:translateX(-100px);transform:translateX(-100px);opacity:0}to{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}@keyframes fade-in-left-sm{0%{-webkit-transform:translateX(-100px);transform:translateX(-100px);opacity:0}to{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}.fade-in-left-sm{-webkit-animation-name:fade-in-left-sm;animation-name:fade-in-left-sm}@-webkit-keyframes fade-out-left-sm{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}to{-webkit-transform:translateX(-100px);transform:translateX(-100px);opacity:0}}@keyframes fade-out-left-sm{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}to{-webkit-transform:translateX(-100px);transform:translateX(-100px);opacity:0}}.fade-out-left-sm{-webkit-animation-name:fade-out-left-sm;animation-name:fade-out-left-sm}@-webkit-keyframes fade-in-left-lg{0%{-webkit-transform:translateX(-1500px);transform:translateX(-1500px);opacity:0}to{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}@keyframes fade-in-left-lg{0%{-webkit-transform:translateX(-1500px);transform:translateX(-1500px);opacity:0}to{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}.fade-in-left-lg{-webkit-animation-name:fade-in-left-lg;animation-name:fade-in-left-lg}@-webkit-keyframes fade-out-left-lg{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}to{-webkit-transform:translateX(-1500px);transform:translateX(-1500px);opacity:0}}@keyframes fade-out-left-lg{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}to{-webkit-transform:translateX(-1500px);transform:translateX(-1500px);opacity:0}}.fade-out-left-lg{-webkit-animation-name:fade-out-left-lg;animation-name:fade-out-left-lg}@-webkit-keyframes fade-in-right{0%{-webkit-transform:translateX(500px);transform:translateX(500px);opacity:0}to{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}@keyframes fade-in-right{0%{-webkit-transform:translateX(500px);transform:translateX(500px);opacity:0}to{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}.fade-in-right{-webkit-animation-name:fade-in-right;animation-name:fade-in-right}@-webkit-keyframes fade-out-right{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}to{-webkit-transform:translateX(500px);transform:translateX(500px);opacity:0}}@keyframes fade-out-right{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}to{-webkit-transform:translateX(500px);transform:translateX(500px);opacity:0}}.fade-out-right{-webkit-animation-name:fade-out-right;animation-name:fade-out-right}@-webkit-keyframes fade-in-right-sm{0%{-webkit-transform:translateX(100px);transform:translateX(100px);opacity:0}to{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}@keyframes fade-in-right-sm{0%{-webkit-transform:translateX(100px);transform:translateX(100px);opacity:0}to{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}.fade-in-right-sm{-webkit-animation-name:fade-in-right-sm;animation-name:fade-in-right-sm}@-webkit-keyframes fade-out-right-sm{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}to{-webkit-transform:translateX(100px);transform:translateX(100px);opacity:0}}@keyframes fade-out-right-sm{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}to{-webkit-transform:translateX(100px);transform:translateX(100px);opacity:0}}.fade-out-right-sm{-webkit-animation-name:fade-out-right-sm;animation-name:fade-out-right-sm}@-webkit-keyframes fade-in-right-lg{0%{-webkit-transform:translateX(1500px);transform:translateX(1500px);opacity:0}to{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}@keyframes fade-in-right-lg{0%{-webkit-transform:translateX(1500px);transform:translateX(1500px);opacity:0}to{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}}.fade-in-right-lg{-webkit-animation-name:fade-in-right-lg;animation-name:fade-in-right-lg}@-webkit-keyframes fade-out-right-lg{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}to{-webkit-transform:translateX(1500px);transform:translateX(1500px);opacity:0}}@keyframes fade-out-right-lg{0%{-webkit-transform:translateX(0);transform:translateX(0);opacity:1}to{-webkit-transform:translateX(1500px);transform:translateX(1500px);opacity:0}}.fade-out-right-lg{-webkit-animation-name:fade-out-right-lg;animation-name:fade-out-right-lg}@-webkit-keyframes rotate-in{0%{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);transform-origin:center center;opacity:0}0%,to{-webkit-transform-origin:center center}to{-webkit-transform:rotate(0);transform:rotate(0);transform-origin:center center;opacity:1}}@keyframes rotate-in{0%{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);transform-origin:center center;opacity:0}0%,to{-webkit-transform-origin:center center}to{-webkit-transform:rotate(0);transform:rotate(0);transform-origin:center center;opacity:1}}.rotate-in{-webkit-animation-name:rotate-in;animation-name:rotate-in}@-webkit-keyframes rotate-out{0%{-webkit-transform:rotate(0);transform:rotate(0);transform-origin:center center;opacity:1}0%,to{-webkit-transform-origin:center center}to{-webkit-transform:rotate(90deg);transform:rotate(90deg);transform-origin:center center;opacity:0}}@keyframes rotate-out{0%{-webkit-transform:rotate(0);transform:rotate(0);transform-origin:center center;opacity:1}0%,to{-webkit-transform-origin:center center}to{-webkit-transform:rotate(90deg);transform:rotate(90deg);transform-origin:center center;opacity:0}}.rotate-out{-webkit-animation-name:rotate-out;animation-name:rotate-out}@-webkit-keyframes rotate-in-sm{0%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);transform-origin:center center;opacity:0}0%,to{-webkit-transform-origin:center center}to{-webkit-transform:rotate(0);transform:rotate(0);transform-origin:center center;opacity:1}}@keyframes rotate-in-sm{0%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);transform-origin:center center;opacity:0}0%,to{-webkit-transform-origin:center center}to{-webkit-transform:rotate(0);transform:rotate(0);transform-origin:center center;opacity:1}}.rotate-in-sm{-webkit-animation-name:rotate-in-sm;animation-name:rotate-in-sm}@-webkit-keyframes rotate-out-sm{0%{-webkit-transform:rotate(0);transform:rotate(0);transform-origin:center center;opacity:1}0%,to{-webkit-transform-origin:center center}to{-webkit-transform:rotate(45deg);transform:rotate(45deg);transform-origin:center center;opacity:0}}@keyframes rotate-out-sm{0%{-webkit-transform:rotate(0);transform:rotate(0);transform-origin:center center;opacity:1}0%,to{-webkit-transform-origin:center center}to{-webkit-transform:rotate(45deg);transform:rotate(45deg);transform-origin:center center;opacity:0}}.rotate-out-sm{-webkit-animation-name:rotate-out-sm;animation-name:rotate-out-sm}@-webkit-keyframes rotate-in-lg{0%{-webkit-transform:rotate(-180deg);transform:rotate(-180deg);transform-origin:center center;opacity:0}0%,to{-webkit-transform-origin:center center}to{-webkit-transform:rotate(0);transform:rotate(0);transform-origin:center center;opacity:1}}@keyframes rotate-in-lg{0%{-webkit-transform:rotate(-180deg);transform:rotate(-180deg);transform-origin:center center;opacity:0}0%,to{-webkit-transform-origin:center center}to{-webkit-transform:rotate(0);transform:rotate(0);transform-origin:center center;opacity:1}}.rotate-in-lg{-webkit-animation-name:rotate-in-lg;animation-name:rotate-in-lg}@-webkit-keyframes rotate-out-lg{0%{-webkit-transform:rotate(0);transform:rotate(0);transform-origin:center center;opacity:1}0%,to{-webkit-transform-origin:center center}to{-webkit-transform:rotate(180deg);transform:rotate(180deg);transform-origin:center center;opacity:0}}@keyframes rotate-out-lg{0%{-webkit-transform:rotate(0);transform:rotate(0);transform-origin:center center;opacity:1}0%,to{-webkit-transform-origin:center center}to{-webkit-transform:rotate(180deg);transform:rotate(180deg);transform-origin:center center;opacity:0}}.rotate-out-lg{-webkit-animation-name:rotate-out-lg;animation-name:rotate-out-lg}@-webkit-keyframes flip-in-x{0%{-webkit-transform:perspective(550px) rotateX(90deg);transform:perspective(550px) rotateX(90deg);opacity:0}to{-webkit-transform:perspective(550px) rotateX(0deg);transform:perspective(550px) rotateX(0deg);opacity:1}}@keyframes flip-in-x{0%{-webkit-transform:perspective(550px) rotateX(90deg);transform:perspective(550px) rotateX(90deg);opacity:0}to{-webkit-transform:perspective(550px) rotateX(0deg);transform:perspective(550px) rotateX(0deg);opacity:1}}.flip-in-x{-webkit-animation-name:flip-in-x;animation-name:flip-in-x;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flip-out-x{0%{-webkit-transform:perspective(550px) rotateX(0deg);transform:perspective(550px) rotateX(0deg);opacity:1}to{-webkit-transform:perspective(550px) rotateX(90deg);transform:perspective(550px) rotateX(90deg);opacity:0}}@keyframes flip-out-x{0%{-webkit-transform:perspective(550px) rotateX(0deg);transform:perspective(550px) rotateX(0deg);opacity:1}to{-webkit-transform:perspective(550px) rotateX(90deg);transform:perspective(550px) rotateX(90deg);opacity:0}}.flip-out-x{-webkit-animation-name:flip-out-x;animation-name:flip-out-x;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flip-in-x-nr{0%{-webkit-transform:perspective(100px) rotateX(90deg);transform:perspective(100px) rotateX(90deg);opacity:0}to{-webkit-transform:perspective(100px) rotateX(0deg);transform:perspective(100px) rotateX(0deg);opacity:1}}@keyframes flip-in-x-nr{0%{-webkit-transform:perspective(100px) rotateX(90deg);transform:perspective(100px) rotateX(90deg);opacity:0}to{-webkit-transform:perspective(100px) rotateX(0deg);transform:perspective(100px) rotateX(0deg);opacity:1}}.flip-in-x-nr{-webkit-animation-name:flip-in-x-nr;animation-name:flip-in-x-nr;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flip-out-x-nr{0%{-webkit-transform:perspective(100px) rotateX(0deg);transform:perspective(100px) rotateX(0deg);opacity:1}to{-webkit-transform:perspective(100px) rotateX(90deg);transform:perspective(100px) rotateX(90deg);opacity:0}}@keyframes flip-out-x-nr{0%{-webkit-transform:perspective(100px) rotateX(0deg);transform:perspective(100px) rotateX(0deg);opacity:1}to{-webkit-transform:perspective(100px) rotateX(90deg);transform:perspective(100px) rotateX(90deg);opacity:0}}.flip-out-x-nr{-webkit-animation-name:flip-out-x-nr;animation-name:flip-out-x-nr;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flip-in-x-fr{0%{-webkit-transform:perspective(1000px) rotateX(90deg);transform:perspective(1000px) rotateX(90deg);opacity:0}to{-webkit-transform:perspective(1000px) rotateX(0deg);transform:perspective(1000px) rotateX(0deg);opacity:1}}@keyframes flip-in-x-fr{0%{-webkit-transform:perspective(1000px) rotateX(90deg);transform:perspective(1000px) rotateX(90deg);opacity:0}to{-webkit-transform:perspective(1000px) rotateX(0deg);transform:perspective(1000px) rotateX(0deg);opacity:1}}.flip-in-x-fr{-webkit-animation-name:flip-in-x-fr;animation-name:flip-in-x-fr;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flip-out-x-fr{0%{-webkit-transform:perspective(1000px) rotateX(0deg);transform:perspective(1000px) rotateX(0deg);opacity:1}to{-webkit-transform:perspective(1000px) rotateX(90deg);transform:perspective(1000px) rotateX(90deg);opacity:0}}@keyframes flip-out-x-fr{0%{-webkit-transform:perspective(1000px) rotateX(0deg);transform:perspective(1000px) rotateX(0deg);opacity:1}to{-webkit-transform:perspective(1000px) rotateX(90deg);transform:perspective(1000px) rotateX(90deg);opacity:0}}.flip-out-x-fr{-webkit-animation-name:flip-out-x-fr;animation-name:flip-out-x-fr;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flip-in-y{0%{-webkit-transform:perspective(550px) rotateY(90deg);transform:perspective(550px) rotateY(90deg);opacity:0}to{-webkit-transform:perspective(550px) rotateY(0deg);transform:perspective(550px) rotateY(0deg);opacity:1}}@keyframes flip-in-y{0%{-webkit-transform:perspective(550px) rotateY(90deg);transform:perspective(550px) rotateY(90deg);opacity:0}to{-webkit-transform:perspective(550px) rotateY(0deg);transform:perspective(550px) rotateY(0deg);opacity:1}}.flip-in-y{-webkit-animation-name:flip-in-y;animation-name:flip-in-y;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flip-out-y{0%{-webkit-transform:perspective(550px) rotateY(0deg);transform:perspective(550px) rotateY(0deg);opacity:1}to{-webkit-transform:perspective(550px) rotateY(90deg);transform:perspective(550px) rotateY(90deg);opacity:0}}@keyframes flip-out-y{0%{-webkit-transform:perspective(550px) rotateY(0deg);transform:perspective(550px) rotateY(0deg);opacity:1}to{-webkit-transform:perspective(550px) rotateY(90deg);transform:perspective(550px) rotateY(90deg);opacity:0}}.flip-out-y{-webkit-animation-name:flip-out-y;animation-name:flip-out-y;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flip-in-y-nr{0%{-webkit-transform:perspective(100px) rotateY(90deg);transform:perspective(100px) rotateY(90deg);opacity:0}to{-webkit-transform:perspective(100px) rotateY(0deg);transform:perspective(100px) rotateY(0deg);opacity:1}}@keyframes flip-in-y-nr{0%{-webkit-transform:perspective(100px) rotateY(90deg);transform:perspective(100px) rotateY(90deg);opacity:0}to{-webkit-transform:perspective(100px) rotateY(0deg);transform:perspective(100px) rotateY(0deg);opacity:1}}.flip-in-y-nr{-webkit-animation-name:flip-in-y-nr;animation-name:flip-in-y-nr;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flip-out-y-nr{0%{-webkit-transform:perspective(100px) rotateY(0deg);transform:perspective(100px) rotateY(0deg);opacity:1}to{-webkit-transform:perspective(100px) rotateY(90deg);transform:perspective(100px) rotateY(90deg);opacity:0}}@keyframes flip-out-y-nr{0%{-webkit-transform:perspective(100px) rotateY(0deg);transform:perspective(100px) rotateY(0deg);opacity:1}to{-webkit-transform:perspective(100px) rotateY(90deg);transform:perspective(100px) rotateY(90deg);opacity:0}}.flip-out-y-nr{-webkit-animation-name:flip-out-y-nr;animation-name:flip-out-y-nr;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flip-in-y-fr{0%{-webkit-transform:perspective(1000px) rotateY(90deg);transform:perspective(1000px) rotateY(90deg);opacity:0}to{-webkit-transform:perspective(1000px) rotateY(0deg);transform:perspective(1000px) rotateY(0deg);opacity:1}}@keyframes flip-in-y-fr{0%{-webkit-transform:perspective(1000px) rotateY(90deg);transform:perspective(1000px) rotateY(90deg);opacity:0}to{-webkit-transform:perspective(1000px) rotateY(0deg);transform:perspective(1000px) rotateY(0deg);opacity:1}}.flip-in-y-fr{-webkit-animation-name:flip-in-y-fr;animation-name:flip-in-y-fr;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flip-out-y-fr{0%{-webkit-transform:perspective(1000px) rotateY(0deg);transform:perspective(1000px) rotateY(0deg);opacity:1}to{-webkit-transform:perspective(1000px) rotateY(90deg);transform:perspective(1000px) rotateY(90deg);opacity:0}}@keyframes flip-out-y-fr{0%{-webkit-transform:perspective(1000px) rotateY(0deg);transform:perspective(1000px) rotateY(0deg);opacity:1}to{-webkit-transform:perspective(1000px) rotateY(90deg);transform:perspective(1000px) rotateY(90deg);opacity:0}}.flip-out-y-fr{-webkit-animation-name:flip-out-y-fr;animation-name:flip-out-y-fr;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes zoom-in{0%{-webkit-transform:scale(.7);transform:scale(.7);opacity:0}to{opacity:1}}@keyframes zoom-in{0%{-webkit-transform:scale(.7);transform:scale(.7);opacity:0}to{opacity:1}}.zoom-in{-webkit-animation-name:zoom-in;animation-name:zoom-in}@-webkit-keyframes zoom-out{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}50%{-webkit-transform:scale(.7);transform:scale(.7)}50%,to{opacity:0}}@keyframes zoom-out{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}50%{-webkit-transform:scale(.7);transform:scale(.7)}50%,to{opacity:0}}.zoom-out{-webkit-animation-name:zoom-out;animation-name:zoom-out}@-webkit-keyframes zoom-in-sm{0%{-webkit-transform:scale(.95);transform:scale(.95);opacity:0}to{opacity:1}}@keyframes zoom-in-sm{0%{-webkit-transform:scale(.95);transform:scale(.95);opacity:0}to{opacity:1}}.zoom-in-sm{-webkit-animation-name:zoom-in-sm;animation-name:zoom-in-sm}@-webkit-keyframes zoom-out-sm{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}50%{-webkit-transform:scale(.95);transform:scale(.95)}50%,to{opacity:0}}@keyframes zoom-out-sm{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}50%{-webkit-transform:scale(.95);transform:scale(.95)}50%,to{opacity:0}}.zoom-out-sm{-webkit-animation-name:zoom-out-sm;animation-name:zoom-out-sm}@-webkit-keyframes zoom-in-lg{0%{-webkit-transform:scale(.4);transform:scale(.4);opacity:0}to{opacity:1}}@keyframes zoom-in-lg{0%{-webkit-transform:scale(.4);transform:scale(.4);opacity:0}to{opacity:1}}.zoom-in-lg{-webkit-animation-name:zoom-in-lg;animation-name:zoom-in-lg}@-webkit-keyframes zoom-out-lg{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}50%{-webkit-transform:scale(.4);transform:scale(.4)}50%,to{opacity:0}}@keyframes zoom-out-lg{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}50%{-webkit-transform:scale(.4);transform:scale(.4)}50%,to{opacity:0}}.zoom-out-lg{-webkit-animation-name:zoom-out-lg;animation-name:zoom-out-lg}@-webkit-keyframes overlay-slide-in-top{0%{height:100%}to{height:0}}@keyframes overlay-slide-in-top{0%{height:100%}to{height:0}}.overlay-slide-in-top{top:0;height:0;-webkit-animation-name:overlay-slide-in-top;animation-name:overlay-slide-in-top}@-webkit-keyframes overlay-slide-out-top{0%{height:0}to{height:100%}}@keyframes overlay-slide-out-top{0%{height:0}to{height:100%}}.overlay-slide-out-top{top:0;height:100%;-webkit-animation-name:overlay-slide-out-top;animation-name:overlay-slide-out-top}@-webkit-keyframes overlay-slide-in-bottom{0%{height:100%}to{height:0}}@keyframes overlay-slide-in-bottom{0%{height:100%}to{height:0}}.overlay-slide-in-bottom{bottom:0;height:0;-webkit-animation-name:overlay-slide-in-bottom;animation-name:overlay-slide-in-bottom}@-webkit-keyframes overlay-slide-out-bottom{0%{height:0}to{height:100%}}@keyframes overlay-slide-out-bottom{0%{height:0}to{height:100%}}.overlay-slide-out-bottom{bottom:0;height:100%;-webkit-animation-name:overlay-slide-out-bottom;animation-name:overlay-slide-out-bottom}@-webkit-keyframes overlay-slide-in-left{0%{width:100%}to{width:0}}@keyframes overlay-slide-in-left{0%{width:100%}to{width:0}}.overlay-slide-in-left{width:0;-webkit-animation-name:overlay-slide-in-left;animation-name:overlay-slide-in-left}@-webkit-keyframes overlay-slide-out-left{0%{width:0}to{width:100%}}@keyframes overlay-slide-out-left{0%{width:0}to{width:100%}}.overlay-slide-out-left{left:0;width:100%;-webkit-animation-name:overlay-slide-out-left;animation-name:overlay-slide-out-left}@-webkit-keyframes overlay-slide-in-right{0%{width:100%}to{width:0}}@keyframes overlay-slide-in-right{0%{width:100%}to{width:0}}.overlay-slide-in-right{right:0;width:0;-webkit-animation-name:overlay-slide-in-right;animation-name:overlay-slide-in-right}@-webkit-keyframes overlay-slide-out-right{0%{width:0}to{width:100%}}@keyframes overlay-slide-out-right{0%{width:0}to{width:100%}}.overlay-slide-out-right{right:0;width:100%;-webkit-animation-name:overlay-slide-out-right;animation-name:overlay-slide-out-right}



/*
 *  Remodal - v1.0.7
 *  Responsive, lightweight, fast, synchronized with CSS animations, fully customizable modal window plugin with declarative configuration and hash tracking.
 *  http://vodkabears.github.io/remodal/
 *
 *  Made by Ilya Makarov
 *  Under MIT License
 */

/* ==========================================================================
   Remodal's necessary styles
   ========================================================================== */

/* Hide scroll bar */

html.remodal-is-locked {
  overflow: hidden;

  -ms-touch-action: none;
  touch-action: none;
}

/* Anti FOUC */

.remodal,
[data-remodal-id] {
  display: none;
}

/* Necessary styles of the overlay */

.remodal-overlay {
  position: fixed;
  z-index: 9999;
  top: -5000px;
  right: -5000px;
  bottom: -5000px;
  left: -5000px;

  display: none;
}

/* Necessary styles of the wrapper */

.remodal-wrapper {
  position: fixed;
  z-index: 10000;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  display: none;
  overflow: auto;

  text-align: center;

  -webkit-overflow-scrolling: touch;
}

.remodal-wrapper:after {
  display: inline-block;

  height: 100%;
  margin-left: -0.05em;

  content: "";
}

/* Fix iPad, iPhone glitches */

.remodal-overlay,
.remodal-wrapper {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Necessary styles of the modal dialog */

.remodal {
  position: relative;

  outline: none;

  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

.remodal-is-initialized {
  /* Disable Anti-FOUC */
  display: inline-block;
}

.modalBody {
  width: 100% !important;
}

/*
 *  Remodal - v1.0.7
 *  Responsive, lightweight, fast, synchronized with CSS animations, fully customizable modal window plugin with declarative configuration and hash tracking.
 *  http://vodkabears.github.io/remodal/
 *
 *  Made by Ilya Makarov
 *  Under MIT License
 */

/* ==========================================================================
   Remodal's default mobile first theme
   ========================================================================== */

/* Default theme styles for the background */

.remodal-bg.remodal-is-opening,
.remodal-bg.remodal-is-opened {
  -webkit-filter: blur(3px);
  filter: blur(3px);
}

/* Default theme styles of the overlay */

.remodal-overlay {
  background: rgba(43, 46, 56, 0.9);
}

.remodal-overlay.remodal-is-opening,
.remodal-overlay.remodal-is-closing {
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

.remodal-overlay.remodal-is-opening {
  -webkit-animation-name: remodal-overlay-opening-keyframes;
  animation-name: remodal-overlay-opening-keyframes;
}

.remodal-overlay.remodal-is-closing {
  -webkit-animation-name: remodal-overlay-closing-keyframes;
  animation-name: remodal-overlay-closing-keyframes;
}

/* Default theme styles of the wrapper */

.remodal-wrapper {
  padding: 10px 10px 0;
}

/* Default theme styles of the modal dialog */

.remodal {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  margin-bottom: 10px;
  padding: 35px;

  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);

  color: #3a3a3a;
  background: #fff;

  border-radius: 0;
}

.remodal.remodal-is-opening,
.remodal.remodal-is-closing {
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

.remodal.remodal-is-opening {
  -webkit-animation-name: remodal-opening-keyframes;
  animation-name: remodal-opening-keyframes;
}

.remodal.remodal-is-closing {
  -webkit-animation-name: remodal-closing-keyframes;
  animation-name: remodal-closing-keyframes;
}

/* Vertical align of the modal dialog */

.remodal,
.remodal-wrapper:after {
  vertical-align: middle;
}

/* Close button */

.remodal-close {
  position: absolute;
  top: 0;
  right: 0;

  display: block;
  overflow: visible;

  width: 50px;
  height: 50px;
  margin: 0;
  padding: 0;

  cursor: pointer;
  -webkit-transition: color 0.2s;
  transition: color 0.2s;
  text-decoration: none;

  color: #1e3a7f;
  border: 0;
  outline: 0;
  background: transparent;
}

.remodal-close:hover,
.remodal-close:focus {
  color: #0dabdc;
}

.remodal-close:before {
  font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif !important;
  font-size: 45px;
  line-height: 50px;

  position: absolute;
  top: 0;
  left: 0;

  display: block;

  width: 50px;

  content: "\00d7";
  text-align: center;
}

/* Dialog buttons */

.remodal-confirm,
.remodal-cancel {
  font: inherit;

  display: inline-block;
  overflow: visible;

  min-width: 110px;
  margin: 0;
  padding: 12px 0;

  cursor: pointer;
  -webkit-transition: background 0.2s;
  transition: background 0.2s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;

  border: 0;
  outline: 0;
}

.remodal-confirm {
  color: #fff;
  background: #81c784;
}

.remodal-confirm:hover,
.remodal-confirm:focus {
  background: #66bb6a;
}

.remodal-cancel {
  color: #fff;
  background: #e57373;
}

.remodal-cancel:hover,
.remodal-cancel:focus {
  background: #ef5350;
}

/* Remove inner padding and border in Firefox 4+ for the button tag. */

.remodal-confirm::-moz-focus-inner,
.remodal-cancel::-moz-focus-inner,
.remodal-close::-moz-focus-inner {
  padding: 0;

  border: 0;
}

/* Keyframes
   ========================================================================== */

@-webkit-keyframes remodal-opening-keyframes {
  from {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);

    opacity: 0;
  }
  to {
    -webkit-transform: none;
    transform: none;

    opacity: 1;
  }
}

@keyframes remodal-opening-keyframes {
  from {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);

    opacity: 0;
  }
  to {
    -webkit-transform: none;
    transform: none;

    opacity: 1;
  }
}

@-webkit-keyframes remodal-closing-keyframes {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);

    opacity: 1;
  }
  to {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);

    opacity: 0;
  }
}

@keyframes remodal-closing-keyframes {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);

    opacity: 1;
  }
  to {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);

    opacity: 0;
  }
}

@-webkit-keyframes remodal-overlay-opening-keyframes {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes remodal-overlay-opening-keyframes {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-webkit-keyframes remodal-overlay-closing-keyframes {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes remodal-overlay-closing-keyframes {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

/* Media queries
   ========================================================================== */

@media only screen and (min-width: 641px) {
  .remodal {
    max-width: 700px;
  }
}

/* IE8
   ========================================================================== */

.lt-ie9 .remodal-overlay {
  background: #2b2e38;
}

.lt-ie9 .remodal {
  width: 700px;
}


.hidden {
  display: none !important;
}


/* TOAST */
.jq-toast-wrap,.jq-toast-wrap *{margin:0;padding:0}.jq-toast-wrap{display:block;position:fixed;width:250px;pointer-events:none!important;letter-spacing:normal;z-index:9000!important}.jq-toast-wrap.bottom-left{bottom:20px;left:20px}.jq-toast-wrap.bottom-right{bottom:20px;right:40px}.jq-toast-wrap.top-left{top:20px;left:20px}.jq-toast-wrap.top-right{top:20px;right:40px}.jq-toast-single{display:block;width:100%;padding:10px;margin:0 0 5px;border-radius:4px;font-size:12px;font-family:arial,sans-serif;line-height:17px;position:relative;pointer-events:all!important;background-color:#444;color:#fff}.jq-toast-single h2{font-family:arial,sans-serif;font-size:14px;margin:0 0 7px;background:0 0;color:inherit;line-height:inherit;letter-spacing:normal}.jq-toast-single a{color:#eee;text-decoration:none;font-weight:700;border-bottom:1px solid #fff;padding-bottom:3px;font-size:12px}.jq-toast-single ul{margin:0 0 0 15px;background:0 0;padding:0}.jq-toast-single ul li{list-style-type:disc!important;line-height:17px;background:0 0;margin:0;padding:0;letter-spacing:normal}.close-jq-toast-single{position:absolute;top:3px;right:7px;font-size:14px;cursor:pointer}.jq-toast-loader{display:block;position:absolute;top:-2px;height:5px;width:0;left:0;border-radius:5px;background:red}.jq-toast-loaded{width:100%}.jq-has-icon{padding:10px 10px 10px 50px;background-repeat:no-repeat;background-position:10px}.jq-icon-info{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=);background-color:#31708f;color:#d9edf7;border-color:#bce8f1}.jq-icon-warning{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=);background-color:#8a6d3b;color:#fcf8e3;border-color:#faebcc}.jq-icon-error{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=);background-color:#a94442;color:#f2dede;border-color:#ebccd1}.jq-icon-success{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==);color:#dff0d8;background-color:#3c763d;border-color:#d6e9c6}


/*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner,
.fancybox-image,
.fancybox-wrap iframe,
.fancybox-wrap object,
.fancybox-nav,
.fancybox-nav span,
.fancybox-tmp
{
  padding: 0;
  margin: 0;
  border: 0;
  outline: none;
  vertical-align: top;
}

.fancybox-wrap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8020;
}

.fancybox-skin {
  position: relative;
  background: #f9f9f9;
  color: #444;
  text-shadow: none;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}

.fancybox-opened {
  z-index: 8030;
}

.fancybox-opened .fancybox-skin {
  -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
     -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
          box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}

.fancybox-outer, .fancybox-inner {
  position: relative;
}

.fancybox-inner {
  overflow: hidden;
}

.fancybox-type-iframe .fancybox-inner {
  -webkit-overflow-scrolling: touch;
}

.fancybox-error {
  color: #444;
  font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
  margin: 0;
  padding: 15px;
  white-space: nowrap;
}

.fancybox-image, .fancybox-iframe {
  display: block;
  width: 100%;
  height: 100%;
}

.fancybox-image {
  max-width: 100%;
  max-height: 100%;
}

#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
  background-image: url('../images/fancybox/fancybox_sprite.png');
}

#fancybox-loading {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -22px;
  margin-left: -22px;
  background-position: 0 -108px;
  opacity: 0.8;
  cursor: pointer;
  z-index: 8060;
}

#fancybox-loading div {
  width: 44px;
  height: 44px;
  background: url('../images/fancybox/fancybox_loading.gif') center center no-repeat;
}

.fancybox-close {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 36px;
  height: 36px;
  cursor: pointer;
  z-index: 8040;
}

.fancybox-nav {
  position: absolute;
  top: 0;
  width: 40%;
  height: 100%;
  cursor: pointer;
  text-decoration: none;
  background: transparent url('../images/fancybox/blank.gif'); /* helps IE */
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  z-index: 8040;
}

.fancybox-prev {
  left: 0;
}

.fancybox-next {
  right: 0;
}

.fancybox-nav span {
  position: absolute;
  top: 50%;
  width: 36px;
  height: 34px;
  margin-top: -18px;
  cursor: pointer;
  z-index: 8040;
  visibility: hidden;
}

.fancybox-prev span {
  left: 10px;
  background-position: 0 -36px;
}

.fancybox-next span {
  right: 10px;
  background-position: 0 -72px;
}

.fancybox-nav:hover span {
  visibility: visible;
}

.fancybox-tmp {
  position: absolute;
  top: -99999px;
  left: -99999px;
  visibility: hidden;
  max-width: 99999px;
  max-height: 99999px;
  overflow: visible !important;
}

/* Overlay helper */

.fancybox-lock {
    overflow: hidden !important;
    width: auto;
}

.fancybox-lock body {
    overflow: hidden !important;
}

.fancybox-lock-test {
    overflow-y: hidden !important;
}

.fancybox-overlay {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  display: none;
  z-index: 8010;
  background: rgba(43, 46, 56, 0.9);
}

.fancybox-overlay-fixed {
  position: fixed;
  bottom: 0;
  right: 0;
}

.fancybox-lock .fancybox-overlay {
  overflow: auto;
  overflow-y: scroll;
}

/* Title helper */

.fancybox-title {
  visibility: hidden;
  font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
  position: relative;
  text-shadow: none;
  z-index: 8050;
}

.fancybox-opened .fancybox-title {
  visibility: visible;
}

.fancybox-title-float-wrap {
  position: absolute;
  bottom: 0;
  right: 50%;
  margin-bottom: -35px;
  z-index: 8050;
  text-align: center;
}

.fancybox-title-float-wrap .child {
  display: inline-block;
  margin-right: -100%;
  padding: 2px 20px;
  background: transparent; /* Fallback for web browsers that doesn't support RGBa */
  background: rgba(0, 0, 0, 0.8);
  -webkit-border-radius: 15px;
     -moz-border-radius: 15px;
          border-radius: 15px;
  text-shadow: 0 1px 2px #222;
  color: #FFF;
  font-weight: bold;
  line-height: 24px;
  white-space: nowrap;
}

.fancybox-title-outside-wrap {
  position: relative;
  margin-top: 10px;
  color: #fff;
}

.fancybox-title-inside-wrap {
  padding-top: 10px;
}

.fancybox-title-over-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
  padding: 10px;
  background: #000;
  background: rgba(0, 0, 0, .8);
}

/*Retina graphics!*/
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
     only screen and (min--moz-device-pixel-ratio: 1.5),
     only screen and (min-device-pixel-ratio: 1.5){

  #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
    background-image: url('../images/fancybox/fancybox_sprite@2x.png');
    background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/
  }

  #fancybox-loading div {
    background-image: url('../images/fancybox/fancybox_loading@2x.gif');
    background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/
  }
}

/*
* Hide only visually, but have it available for screen readers:
* https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
*
* 1. For long content, line feeds are not interpreted as spaces and small width
*    causes content to wrap 1 word per line:
*    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
*/

.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
  /* 1 */
}

/*
* Extends the .sr-only class to allow the element
* to be focusable when navigated to via the keyboard:
* https://www.drupal.org/node/897638
*/

.sr-only.focusable:active,
.sr-only.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  white-space: inherit;
  width: auto;
}

/*
* Hide visually and from screen readers, but maintain layout
*/

.invisible {
  visibility: hidden;
}

/*
* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
*    `contenteditable` attribute is included anywhere else in the document.
*    Otherwise it causes space to appear at the top and bottom of elements
*    that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
*    `:before` to contain the top-margins of child elements.
*/

.clearfix:before,
.clearfix:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}

.clearfix:after {
  clear: both;
}



/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

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

    .slide-intro .anim-logo { transform: translate(-50%,-50%) scale(0.75); }

    .slide-intro .block-left { background-size: auto 35vh}
    .slide-intro .block-left .pill-gr { height: 55vh; }
    .slide-intro .block-right h1 { font-size: 3rem }


    .section-intro .block-left h1 { font-size: 2.6rem }
    .section-intro .block-left p { font-size: 1.2rem }
    .section-intro .block-left .logo-aula-digital { width: 376px }
    .section-intro .block-right .anim-cabeza { transform: translate(-50%,-50%) scale(0.75); }

    .section-header .inner { height: 150px; }
    .section-header .cabeza { width: 106px; height: 128px; }
    .section-header h2 { font-size: 1.75rem }

    .grid-videos .item { width: 25% }
    .section-videos .curso-container .grid-videos .item { width: 33.333%; }
    .section-video .block-left h1 { font-size: 1.75rem }


    .section-video .block-left .group-logo-aula-digital .cabeza { width: 106px; height: 128px; }
    .section-video .block-left .group-logo-aula-digital > img { width: 376px; }
}

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

  body, html { font-size: 14px }

  .wrap { padding-bottom: 135px }

  .header .logo-aula-digital { width: 120px; }
  .header.header-fixed.header-hide { top: -72px;}
  .header .header-inner { height: 84px; border-width: 12px; }
 /* .header .top-menu li a { font-size: 0.875rem }
  .header .logo-aula-digital { margin-right: 2rem; }*/

  .slide-intro .anim-logo { top: calc(50% + 42px); transform: translate(-50%,-50%) scale(0.65); }
  .slide-intro .block-right { padding: 110px 0; }
 /* .slide-intro .block-right h1 { font-size: 2.5rem }*/

  .section-intro .block-left { padding: calc(84px + 2rem) 2rem 2.5rem; }

  .section-intro { min-height: 600px }
  /*.section-intro .block-left h1 { font-size: 2.1rem }
  .section-intro .block-left p { font-size: 1rem }*/
  .section-intro .block-left .logo-aula-digital { width: 310px; margin-top: 2rem }

  .section-intro .block-right .anim-cabeza {
    top: calc(50% + 42px);
    transform: translate(-50%,-50%) scale(0.65);
  } 

  .slide-intro .block-right .logo-aula-digital { top: calc(50% + 42px); }

  .section-header {
    background-size: auto 240px;
    border-width: 12px;
  }

  .section-header.no-intro { padding-top:84px }
  .section-header .inner { height: 132px; }
  .section-header .cabeza { width: 90px; height: 109px; }



  .red .section-header .button-biblioteca {
    position: absolute;
    left: 128px;
    bottom: 15px;
    padding: 6px 22px 5px 12px;
  }


  /*.section-header h2 { font-size: 1.75rem }

  .grid-videos .item .item-info .title { font-size: 0.8rem }

  .section-video .block-left h1 { font-size: 1.4rem; margin: 0 0 1.5em 0 }*/

  .dropdown-content { top: 34px; }


  .footer-inner .logo-gr-footer { width: 284px;  }
}



@media only screen and (max-width: 1280px) {
  
  .wrap { padding-bottom: 125px;  }
  
  .header .header-inner { padding: 0 1rem }
  .header .logo-aula-digital { margin-right: 1rem }
  .header .top-menu li { margin: 0 0.35rem }
  .header .top-menu li a { padding: 4px 4px; font-size: 0.85rem }


  .slide-intro .block-left .pill-gr { height: auto; width: 70%; }
  .slide-intro .block-right { width: 56%; }
  .slide-intro .block-left { background-size: 85% auto; }
  .slide-intro .anim-logo { left: 44%; transform: translate(-50%, -50%) scale(0.60, 0.60)}
  .slide-intro .block-right .logo-aula-digital { width: 250px; }

  .slide-gr .section-inner,
  .slide-contents .section-inner {
    padding-left: 5rem;
    padding-right: 5rem
  }

  .slide-gr .top-gr .top-gr-left { font-size: 3.6rem }
  .slide-gr .top-gr .top-gr-left > strong { font-size: 9rem }
  .slide-gr .top-gr .top-gr-left > strong small { font-size: 3.25rem }
  .slide-gr .top-gr .top-gr-right { font-size: 1.2rem }

  .slide-gr .bottom-gr { font-size: 1.1rem }

  .slide-gr .logo-center img { width:  360px }

  .slide-contents h2 { font-size: 2.25rem }
  .slide-contents .grid-areas .area h3 { font-size: 2rem }

  .slide-contents .claim-aula-digital { margin-top: 3rem; }
  .slide-contents .claim-aula-digital .head { width: 280px; }
  .slide-contents .claim-aula-digital .claim .logo-aula-digital { width: 315px; }
  .slide-contents .claim-aula-digital .claim .claim {font-size: 2.25rem}


  .section-intro .block-left h1 { font-size: 2rem }
  .section-intro .block-left p { font-size: 1.125rem }
  .section-intro .block-left .logo-aula-digital { width: 256px; }
  .section-intro .block-right .anim-cabeza { transform: translate(-50%, -50%) scale(0.60, 0.60)  }




  .grid-videos .item {
    width: 25%;
    padding: 0.5rem 0.75rem;
  }


  .section-video .block-left,
  .section-noticia .block-left { width: 42%; padding: 120px 2rem 100px }
  .section-video .block-right,
  .section-noticia .block-right { width: 58%; padding: 120px 2rem 150px }

  .section-video .block-left h1,
  .section-noticia .block-left h1 { font-size: 1.375rem }

  .section-video .block-left .group-logo-aula-digital .cabeza { width: 68px; height: 82px; }
  .section-video .block-left .group-logo-aula-digital > img { width: 256px; }

  .remodal { max-width: 600px; }
  #modalPopupLogin.remodal { padding: 1.5rem 2rem }

  .btn--primary { font-size: 1.115rem; padding: 8px 20px; }


  .footer-inner { height: 125px; }

}


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


  .header .header-inner {  padding: 0 2rem; }
  .header .logo-aula-digital { width: 150px; }

  .header .button-menu-resp {
    display: block;
    visibility: visible;
  }

  
  .header .button-menu-resp {
    position: absolute;
    width: 40px;
    height: 32px;
    line-height: 32px;
    right: 2rem;
    top: 20px;
  }

  .header .button-menu-resp ion-icon {
    font-size: 32px;
    vertical-align: middle;
    color: #1e3a7f;
  }


  .header ul.top-menu {
    position: absolute;
    width: 290px;
    background-color: #1e3a7f;
    display: block;
    right: 2rem;
    top: 56px;
    z-index: 99;
    padding: 1.5rem 1rem;

    visibility: hidden;
    opacity: 0;
    transform: translate(100%, 0%);
    -webkit-transition: visibility 0.3s, opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    -moz-transition: visibility 0.3s, opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    transition: visibility 0.3s, opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    pointer-events: none;
    will-change: transform opacity
  }

  .header ul.top-menu.expanded {
      opacity: 1;  
      visibility: visible;
      pointer-events: auto;
      transform: translate(0%, 0%);   
    }


  .header ul.top-menu > li { 
    display: block;
    padding: 0;
  }

  .header ul.top-menu > li > a {
    font-size: 1.125rem;
    font-weight: 500;
    padding: 12px 15px;
    text-align: right;
    color: #fff;
  }

  .slide-intro { display: block; }
    
  .slide-intro .block-left { width: 100%; height: 50vh; background-image: none; }
  .slide-intro .block-right { 
    width: 100%;
    height: 50vh;
    padding: 75px 0 75px;
    background-image: url(../images/corner-cuadros.png);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 45% auto;
  }

  

  .slide-intro .block-left .pill-gr { height: auto; width: 45%; }

  .slide-intro .block-right h1 { font-size: 4rem }

  .slide-intro .block-right .logo-aula-digital {
    width: 320px;
    position: relative;
    transform: none;
    left: inherit;
    top: inherit;
    margin-top: 2rem;
  }

  .slide-intro .anim-logo { left: 50%; transform: translate(-50%, -75%) scale(0.6, 0.6); }
  .slide-intro .block-right .logo-gr { left: 50%; transform: translate(-50%,0); }

  .slide-gr {
    padding: 64px 0;
    background-size: 25vw auto;
  }

  .slide-gr .logo-center img { width: 256px; }

  .slide-contents { padding: 64px 0; }

  .slide-contents h2 { font-size: 2rem }
  .slide-contents .grid-areas .area { width: calc(33.333% - 2rem) ; margin: 1rem 1rem; }
  .slide-contents .grid-areas .area a { background-size: 120px auto; }
  .slide-contents .grid-areas .area h3 { font-size: 1.5rem }


  .slide-contents .claim-aula-digital .head { width: 192px; margin-right: 2.5rem; }
  .slide-contents .claim-aula-digital .claim .logo-aula-digital { width: 224px; }
  .slide-contents .claim-aula-digital .claim .claim { font-size: 1.75rem }

    
  .section-intro { flex-direction: column; }
  .section-intro .block-left { width: 100%; height: 50vh; order: 2} 
  .section-intro .block-right { width: 100%; height: 50vh; order: 1 }
  .section-intro .block-right .anim-cabeza { left: 50%; transform: translate(-50%, -45%) scale(0.60, 0.60) }
  .section-intro .block-right .logo-gr { width: 172px; }

  .section-intro .block-left {
    padding: 72px 2rem 2.5rem;
    background-size: 60% auto;
  }

  .section-intro .block-left h1 { font-size: 2.5rem }


  .grid-videos .item {
    width: 33.3333%;
    padding: 0.5rem 0.75rem;
  }


  .section-video,
  .section-noticia { flex-direction: column; }

  .section-video .block-left,
  .section-noticia .block-left { width: 100%; }
  .section-video .block-right,
  .section-noticia .block-right { width: 100%; padding: 32px 2rem 150px; }


  .section-videos .curso-container { display: block; }
  .section-videos .curso-container .info-curso { width: 100%; }
  .section-videos .curso-container .grid-videos { width: 100%; }
  .section-videos .curso-container .curso-header .title-curso { font-size: 1.5rem }


  .legal-container { padding: 20px 20px; }

}


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

  

  .wrap { padding: 0; }

  .header .button-menu-resp {
    right: 1rem;
    top: 12px;
  }

  .header .header-inner {
    height: 60px;
    border-width: 8px;
  }

  .header ul.top-menu { right: 0; padding: 1rem; }
  .header ul.top-menu > li > a { font-size: 1rem }
  .header ul.top-menu > li > a { padding: 8px 12px; }


  .slide-intro .block-left .pill-gr {
    height: auto;
    width: 55%;
  }
  .slide-intro .block-left { height: 55vh; }
  .slide-intro .block-right { height: 45vh; }

  .slide-intro .block-right { padding: 24px 0 50px; }
  .slide-intro .block-right h1 { font-size: 2.25rem }
  .slide-intro .block-right .logo-aula-digital { width: 256px; margin-top: 1.75rem; }
  .slide-intro .anim-logo {
    top: calc(50% + 30px);
    transform: translate(-50%, -68%) scale(0.35, 0.35)
  }

  .slide-gr { padding: 32px 0; }
  .slide-gr .section-inner, .slide-contents .section-inner { padding-left: 2rem; padding-right: 2rem; }

  .slide-gr .top-gr { flex-direction: column; }
  .slide-gr .top-gr .top-gr-left { font-size: 3rem; margin: 0 0 1.5rem 0; }

  .slide-gr .top-gr .top-gr-left > strong { font-size: 7.5rem }
  .slide-gr .top-gr .top-gr-left > strong small { font-size: 2.75rem }


  .slide-contents { padding: 32px 0; }
  .slide-contents h2 { font-size: 1.5rem }
  .slide-contents .grid-areas { margin-left: -0.5rem; margin-right: -0.5rem; }
  .slide-contents .grid-areas .area {
    width: calc(50% - 2rem);
    margin: 0.5rem;
  }
  .slide-contents .grid-areas .area a { padding: 1rem; }
  .slide-contents .grid-areas .area h3 { font-size: 1.125rem }


  .slide-contents .claim-aula-digital .head { width: 128px; margin-right: 1.5rem; }
  .slide-contents .claim-aula-digital .claim .logo-aula-digital { width: 150px; }
  .slide-contents .claim-aula-digital .claim .claim { font-size: 1.25rem }







  .section-intro .block-left { width: 100%; height: 55vh; order: 2} 
  .section-intro .block-right { width: 100%; height: 45vh; order: 1 }
  .section-intro .block-right .anim-cabeza { left: 50%; transform: translate(-50%, -48%) scale(0.35, 0.35) }
  .section-intro .block-right .logo-gr { width: 92px; bottom: 1rem; right: 1rem; }

  .section-intro .block-left {
    padding: 48px 2rem 2.5rem;
    background-size: 75% auto;
  }

  .section-intro .block-left h1 { font-size: 1.5rem }
  .section-intro .block-left .logo-aula-digital {
    width: 208px;
    margin-top: 1rem;
  }


  .section-header { background-size: auto 120px; }
  .section-header .inner {
    height: 96px;
    padding: 0 1rem;
  }
  .section-header .cabeza {
    width: 68px;
    height: 82px;
    margin-right: 0.75rem;
  }

  .section-header h2 {font-size: 1.25rem;}


  .button-biblioteca {
    font-size: 0.925rem;
    padding: 5px 20px 4px 10px;
    
  }
  .red .section-header h2 { margin:0 }
  .red .section-header .button-biblioteca {
    position: relative;
    left: inherit;
    bottom: inherit;
    margin-left: 24px;
  }


  .section-videos {
    padding: 2rem 1rem;
  }
  .grid-videos .item {
    width: 50%;
    padding: 0.5rem 0.65rem;
  }

  .section-noticias {
    padding: 2rem 1rem;
  }
  .grid-noticias .noticia {
    width: 100%;
    padding: 1rem 0rem;
  }



  .section-video .block-left { padding: 32px 1.5rem 100px; order:2 }
  .section-video .block-right { padding: 96px 1.5rem 1rem; order:1; background-position: right bottom -1rem; }

  .section-noticia .block-left { padding: 96px 1.5rem 32px; }
  .section-noticia .block-right { padding: 32px 1.5rem 1rem; background-position: right bottom -1rem; }
  .section-noticia .body-noticia { padding: 0; }

  .section-videos .curso-container .grid-videos .item { width: 50%; }
  .section-videos .curso-container .curso-header .title-curso { font-size: 1.25rem }

  .section-video .webinar-player .video-options { padding: 0; }

  .section-video .webinar-player .like-options,
  .section-noticia .body-noticia .like-options {
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .section-video .webinar-player .like-options .dropdown,
  .section-noticia .body-noticia .like-options .dropdown  { margin: 1rem 0 0; }

  .register-container { padding: 72px 1.5rem; }


  .footer { position: relative; }
  .footer-inner { height: auto; padding: 1rem 2rem; }
  .footer-inner .footer-menu li {
    display: block;
    width: 100%;
    padding: 5px 0;
    border-right: none;
  }

  .footer-inner .logo-gr-footer { width: 158px; margin-bottom: 1rem; }


  #modalPopupLogin.remodal {
    padding: 20px 30px;
  }
}


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


}

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

}


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


}

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


}



@media print,
  (-webkit-min-device-pixel-ratio: 1.25),
  (min-resolution: 1.25dppx),
  (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   https://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    /* Black prints faster */
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }
  a,
  a:visited {
    text-decoration: underline;
  }
  a[href]:after {
    content: " (" attr(href) ")";
  }
  abbr[title]:after {
    content: " (" attr(title) ")";
  }
  /*
     * Don't show links that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */
  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: "";
  }
  pre {
    white-space: pre-wrap !important;
  }
  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }
  /*
     * Printing Tables:
     * https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
     */
  thead {
    display: table-header-group;
  }
  tr,
  img {
    page-break-inside: avoid;
  }
  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }
  h2,
  h3 {
    page-break-after: avoid;
  }
}

