/*             CSS  -  RESET             */

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td{margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;
}

body{line-height: 1;}

ol,
ul {list-style: none;}

blockquote,
q {quotes: none;}

blockquote:before,
blockquote:after,
q:before,
q:after {content: '';content: none;}
focus {outline: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse;border-spacing: 0;}
/* RESET */

/*
@font-face {
  font-family: 'Oswald';
  src: url('../fonts/Oswald-Regular.eot');
  src: url('../fonts/Oswald-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Oswald-Regular.woff') format('woff'), url('../fonts/Oswald-Regular.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: 'Oswald-Bold';
  src: url('../fonts/Oswald-Bold.eot');
  src: url('../fonts/Oswald-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/Oswald-Bold.woff') format('woff'), url('../fonts/Oswald-Bold.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
}
*/



body {
  color: #333333;
  font-size: 14px;
  font-family: Arial, Tahoma, Verdana;
  /*font-family: 'Oswald', Arial, Tahoma, Verdana;*/
  line-height: 18px;
  text-align: center;
  background: #e9ebee;
}









/*             SET PRIMARIOS             */

h1,
h2,
h3,
h4,
h5{
  color: #0A3A65;
  font-family: 'Oswald-Bold', Arial, Tahoma, Verdana;
  font-weight: 100;
  margin: 20px 0;
}



h1 {
  font-size: 40px;
  line-height: 44px;
}
h2 {
  font-size: 34px;
  line-height: 36px;
}
h3 {
  font-size: 28px;
  line-height: 30px;
}
h4 {
  font-size: 22px;
  line-height: 24px;
}
h5 {
  font-size: 18px;
  line-height: 20px;
}
h6 {
  font-size: 16px;
  line-height: 18px;
}


img{
  display: block;
}

a,
button{
  -webkit-transition: all .3s;
  -moz-transition: all .3s;
  -ms-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s;
}



/*             SET PRIMARIOS             */


/*             HEADER             */


header{
  display: block;
  background: #0A3C65;
  height: 80px;
}






a.logo:link,
a.logo:visited{
  display: block;
  float: left;
  outline: none;
  text-indent: -9000px;
  text-decoration: none;
  background: url(../lib/cegos_virtual_b.png) no-repeat center;
  width: 158px;
  height: 58px;
  margin: 12px 0 0 5px;
}



header nav{
  float: right;
  font-weight: 100;
  height: 55px;
  margin-top: 25px;
}
header nav ul {
  overflow: hidden;
  color: #23a950;
  font-size: 13px;
  line-height: 24px;
  margin: 0 auto;
  height: 70px;
}
header nav ul li{
  float: left;
  margin: 0 5px;
}
header nav ul li a{
  display: inline-block;
  color: #ffffff;
  line-height: 14px;
  text-align: center;
  text-decoration: none;
  border-right: 1px solid #ffffff;
  padding: 3px 24px 4px 24px;
}
header nav ul li:last-child a{
  border-right: 0;
}
header nav ul li a:hover{
}
header nav ul li .active{
  color: #EE9B15;
}
header nav ul li .close{
  display: none;
}



ul.menu-usuario{
  display: block;
  float: right;
  position: relative;
  text-decoration: none;
  width: 170px;
  margin: 18px 10px 0 10px;
}
ul.menu-usuario li{
  float: left;
  color: #264354;
  width: 100%;
}
ul.menu-usuario a.disp-btn{
  float: left;
  display: block;
  color: #ffffff;
  text-decoration: none;
  background: url(../lib/ico_abajo_b.png) no-repeat 96% center;
}
ul.menu-usuario li a.disp-btn:hover{
  background: url(../lib/ico_abajo_b.png) no-repeat 96% center;
}
ul.menu-usuario a.disp-btn ico{
  float: left;
  display: block;
  overflow: hidden;
  margin: 5px 10px 0 0;
  -webkit-border-radius: 160px;
     -moz-border-radius: 160px;
          border-radius: 160px;  
}


ul.menu-usuario li a{
  display: block;
  color: #ffffff;
  line-height: 41px;
  text-align: left;
  text-decoration: none;
  background: #0a3c65;
  width: 90%;
  padding: 0 5%;
  -webkit-transition: all .4s;
  -moz-transition: all .4s;
  -ms-transition: all .4s;
  -o-transition: all .4s;
  transition: all .4s;
}
ul.menu-usuario li a:hover{
  background: #f7941e;
}

ul.menu-usuario li ul{
  top: 40px;
  right: -4px;
  display: none;
  overflow: hidden;
  z-index: 2000 !important;
  position: absolute !important;
  background: #ffffff;
  width: 100%;
  height: auto !important;
  margin: 0 !important;

  -webkit-transition: all .4s;
  -moz-transition: all .4s;
  -ms-transition: all .4s;
  -o-transition: all .4s;
  transition: all .4s;
}
ul.menu-usuario li:hover ul{
  display: block;
  height: auto !important;
}
ul.menu-usuario li ul li{
  float: left;
  display: block;
  font-size: 12px;
  border-bottom: 1px solid #0E558F;
  width: 100%;
  margin: 0;
}
ul.menu-usuario li ul li:last-child{
  border-bottom: 0;
}
ul.menu-usuario li ul li img{
  float: left;
  display: block;
  margin: 13px 20px 0 0;
}






/* MENÚ DESPLEGABLE MOBILE */

#pageslide {
  overflow-y: scroll;
  overflow-x: hidden;
  position: fixed;
    display: none;
    top: 0;
    z-index: 999999;
    color: #595959;
    background: #23a950;
    width: 100%;
    height: 100%;
}



.open {
  display: none;
  position: absolute;
  top: 15px !important;
  right: 4px !important;
  text-indent: -999999px;
  background: url(../lib/nav.png) no-repeat center;
  width: 55px;
  height: 50px;
}



@media screen and (min-width:200px) and (max-width:920px) {
  #menu-responsive {
    display: none;
    width: 100%;
    margin: 15px 0 50px 0;
  }
  .open {
    display: block;
  }
  #pageslide #menu-responsive li{
    clear: both;
    overflow: hidden;
    font-size: 18px;
    font-family: 'Oswald-Bold', Arial,Tahoma;
    font-weight: 100;
    line-height: 18px;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(255, 255, 255, 0.20);
    width: 90%;
    margin: 0 5%;
  }
  #pageslide #menu-responsive li:first-child{
    border-bottom: 0;
  }
  #pageslide #menu-responsive li a{
    display: block;
    color: #ffffff;
    text-align: left;
    text-decoration: none;
    padding: 20px 10px;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -ms-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s;
  }
  #pageslide #menu-responsive .close{
    float: right;
    display: block;
    font-size: 28px;
    font-family: 'Roboto Condensed', Arial, Tahoma, Verdana;
    line-height: 48px;
    text-align: center;
    background: url(../lib/ico_cls_b.png) no-repeat center;
    width: 50px;
    height: 50px;
    padding: 0;
  }
  #pageslide #menu-responsive .close:hover{
    background: #f58220 url(../lib/ico_cls.png) no-repeat center;
    -webkit-border-radius: 160px;
       -moz-border-radius: 160px;
        -ms-border-radius: 160px;
            border-radius: 160px;
    filter: alpha(opacity=100);
    -moz-opacity: 1.00;
    -khtml-opacity: 1.00;
    opacity: 1.00;
  }
  
  #pageslide #menu-responsive li ul{
    background: rgba(255,255,255,0.10);
    width: 90%;
    margin: 0 5% 20px 5%;
  } 
  #pageslide #menu-responsive li ul li{
    width: 100%;
    margin: 0;
  }
  #pageslide #menu-responsive li ul li a{
    padding: 15px 10px;
  }

  #pageslide #menu-responsive li ico{
    margin: 0 5px 0 0;
  }


/* MENÚ DESPLEGABLE MOBILE */



}







/*             HEADER             */





/*             CONTENT             */



.cnt-banner{
  overflow: hidden;
  text-align: center !important;
  background: #ffffff;
  width: 100%;
  min-height: 30px !important;
}
.cnt-banner img{
  display: block;
  margin: 10px auto 0 auto;
}



.content{
  overflow: hidden;
  position: relative;
  text-align: center;
  width: 100%;
  min-height: 80vh;
  padding-bottom: 30px;
}

.content h1,
.content h3,
.content h4,
.content h5,
.content p,
.content ul{
  margin: 15px auto;
}


.content p{
  text-align: justify;
}

.box-tit-sec{
  display: inline-block;
  color: #0A3965;
  font-size: 18px;
  line-height: 27px;
  text-align: left;
  width: 96%;
  margin: 15px 0 0 0;
}
.box-tit-sec img{
  float: left;
  display: block;
  margin: 0 10px 0 0;
}

.content-Mb .box-tit-sec{
  width: 100%;
}

.content-Mb .box-disp-video,
.content-Mb .box-disp-videob{
  float: left;
  width: 80%;
  margin: 20px 0;
}




.content-Mb{
  box-sizing: border-box;
  display: inline-block;
  vertical-align: top;
  overflow: visible;
  /*overflow: hidden;*/
  width: 100%;
  margin: 10px 5px;
  padding: 20px 30px;
}

.content-Md{
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  width: 48%;
  margin: 10px 5px;
}

.content-Md .bx-Item-opb{
  margin: 2px auto;
  padding-bottom: 0;
}
.content-Md .bx-Item-opb .tit-itm{
  width: 86%;
}


.content-Md .bx-Item-opb .disp-itm .bx-Item-opb{
  float: right;
  width: 90%;
  margin: 4px 0 0 0 !important;
}





.content-MdB{
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  width: 64%;
  margin: 10px 5px 40px 5px;
  padding: 20px 30px;
}

.content-MdB h5{
  float: left;
  text-align: left;
  border-bottom: 2px solid #FF800B;
  widows: auto;
  padding-bottom: 6px;
}



.content-MdC{
  float: left;
  box-sizing: border-box;
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  width: 67%;
  margin: 0 2% 10px 2%;
  padding: 0;
}

.content-Sm{
  float: right;
  box-sizing: border-box;
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  line-height: 24px;
  width: 25%;
  margin: 10px 2%;
  padding: 10px 30px;
}
.content-Sm h1,
.content-Sm h2,
.content-Sm h3,
.content-Sm h4,
.content-Sm h5,
.content-Sm h6{
  text-align: left;
}
.content-Sm p{
  margin: 10px 10px 10px 0 !important;
}
.content-Sm .p-wm{
  clear: none;
  width: 45%;
}

.content-Sm .table-msj{
  width: 80%;
  margin: 10px auto;
}
.content-Sm .table-msj tbody td{
  vertical-align: middle;
  text-align: left;
  padding: 0 6px !important;
}
.content-Sm .table-msj tbody .chbx{
  margin: 0 auto !important;
}


.bx-certificaciones{
  text-align: center !important;
  background: #ffffff;
  width: 100%;
  margin: 50px auto 20px auto;
}
/*
.bx-certificaciones a{
  float: none;
  display: inline-block;
  color: #333333;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
  width: auto;
  margin: 0 auto;
}
*/
.bx-certificaciones img{
  clear: both;
  opacity: 0.60;
  display: inline-block;
  width: 80px;
  height: auto;
  margin: 0 auto -10px auto;
	transition: all .31s;
}
.bx-certificaciones a:hover{
  opacity: 0.70;
}

.bx-certificaciones.in_tit_mat{
  float: right;
  text-align: center;
  width: 110px;
  height: 100px;
  margin: 4px 10px 10px 10px;
}
.bx-certificaciones.in_tit_mat img{
  float: none !important;
  margin: 0 auto -24px auto !important;
}

.bx-certificaciones.in_tit_mat a{
  display: block;
  pointer-events: none;
  position: relative;
  box-sizing: border-box;
  color: #333333;
  outline: none;
  text-indent: -9000px;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  background: url(../lib/ico-certificado.svg) no-repeat center;
  background-size: 80px auto;
  width: 100%;
  height: 100%;
  padding: 76px 0 0 0;
}
.bx-certificaciones.in_tit_mat a:hover{
  opacity: 1.00;
}

.bx-certificaciones.in_tit_mat a.down_certificado{
  pointer-events: inherit;
  color: #0791e6;
  text-indent: 0;
  background: url(../lib/ico-certificado-on.svg) no-repeat center top;
  background-size: 80px auto;
}
.bx-certificaciones.in_tit_mat a.down_certificado:after{
  top: 30px;
  left: 50%;
  position: absolute;
  pointer-events: inherit;
  content: "Descargar";
  color: #fff;
  font-size: 8px;
  font-weight: 100;
  line-height: 20px;
  text-align: center;
  background: #cc4b4c;
  width: 70px;
  height: 20px;
  margin-left: -35px;
  opacity: 0;
}
.bx-certificaciones.in_tit_mat a.down_certificado:hover:after{
  opacity: 1.00;
}



.cont-curso{
  overflow: hidden;
  position: relative;
  background: #E9EBEE;
  margin: 0 !important;
  padding: 0 !important;
}


.cont-curso .content-curso-lec{
  float: left;
  overflow: hidden;
  z-index: 200;
  position: absolute;
  background: #F5F5F5 url(../lib/barra_pleg.png) repeat-y right top;
  width: 22%;
  height: 100%;
  padding-right: 30px;
}

a.lnk-pleg:link,a.lnk-pleg:visited{
  top: 0;
  right: 0;
  display: block;
  position: absolute;
  outline: none;
  text-indent: -9000px;
  text-decoration: none;
  background: url(../lib/ico_plegado.png) no-repeat center;
  width: 30px;
  height: 60px;
}

.cont-curso .content-curso-lec ul{

}
.cont-curso .content-curso-lec ul li{
  text-align: left;
  width: 100%;
}

.cont-curso .content-curso-lec ul li a{
  overflow: hidden;
  display: block;
  color: #333333;
  text-decoration: none;
  border-bottom: 1px solid #DDDDDC;
  border-left: 10px solid #F5F5F5;
  width: 90%;
  padding: 15px 5% 15px 2%;
}


.cont-curso .content-curso-lec ul li ico{
  display: block;
  float: right;
  margin: 4px 0;
}

.cont-curso .content-curso-lec ul .left{
  margin-right: 10px;
}




.cont-curso .content-MdB{
  float: left;
  overflow: hidden;
  width: 71%;
  margin: 0 !important;
  padding: 0 !important;
}
.cont-curso .content-MdB .bx-video{
  width: 100%;
}
.cont-curso .content-MdB .bx-video img,
.cont-curso .content-MdB .bx-video iframe{
  display: block;
  width: 96.6%;
  margin: 0 auto;
}

.cont-curso .content-MdB .bx-btn-curso{
  float: right;
  width: auto;
  margin: 10px;
}
.cont-curso .content-MdB .bx-btn-curso a:first-child{
  float: left;
  color: #333333;
  font-weight: 700;
  line-height: 31px;
  text-align: left;
  text-decoration: none;
  background: #ffffff;
  width: 260px;
  height: 32px;
}
.cont-curso .content-MdB .bx-btn-curso a:first-child img{
  float: right;
  display: block;
  margin: 4px 10px;
}


.cont-curso .content-MdB .bx-btn-curso a:last-child{
  float: left;
  color: #ffffff;
  font-weight: 700;
  line-height: 31px;
  text-align: left;
  text-decoration: none;
  background: #0791E6;
  width: 260px;
  height: 32px;
}
.cont-curso .content-MdB .bx-btn-curso a:last-child img{
  float: left;
  display: block;
  margin: 4px 10px;
}

.cont-curso .content-MdB .content-curso-info{
  float: left;
  overflow: hidden;
  position: relative;
  background: #ffffff;
  width: 95%;
  margin: 20px 0 20px 1%;
  padding-bottom: 10px;
}
.cont-curso .content-MdB ul.principal-tabs{
  top: 0;
  left: 0;
  overflow: hidden;
  position: sticky;
  display: block;
  font-size: 13px;
  background: #ffffff;
  width: 100%;
  margin: 0;
  padding: 0;
}
.cont-curso .content-MdB ul.principal-tabs li{
  float: left;
  cursor: pointer;
  color: #666666;
  background: #ffffff;
  border: 1px solid #dddddf;
  margin: 0 auto;
  padding: 10px 15px;
}

.cont-curso .content-MdB ul.principal-tabs li.current{
  color: #333333;
  background: #dddddf;
}


.cont-curso .content-MdB .tab-contenido{
  display: none;
  clear: both;
  text-align: left;
  border: 0;
  border-top: 1px solid #dddddf;
  width: 96%;
  padding: 25px 2% 15px 2%;
}

.cont-curso .content-MdB .tab-contenido.current{
  display: block;
  margin: -10px 25px 20px 0 !important;
}





.box-carrera-info{
  float: left;
  overflow: hidden;
  position: relative;
  font-size: 16px;
  line-height: 45px;
  text-align: left;
  background: #ffffff;
  border: 1px solid #DDDDDC;
  width: 97%;
  margin: 3px 0;
  padding: 6px 1% 6px 2%;
}
.box-carrera-info .grado-tit{
  float: left;
  display: block;
  overflow: hidden;
  font-size: 15px;
  font-weight: 700;
  line-height: 45px;
  text-align: center;
  background: #ffffff;
  border: 1px solid #DDDDDC;
  width: 47%;
  padding: 6px 1%;
    -webkit-transform: rotate(-90deg);
     -moz-transform: rotate(-90deg);
      -ms-transform: rotate(-90deg);
        transform: rotate(-90deg);
}

.box-carrera-info ul{
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: start;
  align-items: auto;
  align-content: start;
  font-size: 12px;
  line-height: 14px;
  text-align: center;
  margin: 0;
}
.box-carrera-info ul li{
  float: left;
  background: #F0F2F4;
  width: 19%;
  margin: 0 3px;
}
.box-carrera-info ul li img{
  display: block;
  width: 100%;
  height: auto;
  margin: 0 auto 10px auto;
}

.box-carrera-info .curso-estado{
  float: left;
  display: block;
  overflow: hidden;
  font-size: 11px;
  line-height: 14px;
  text-align: left;
  width: 90%;
  margin: 16px 10px 6px 10px;
}
.box-carrera-info .curso-estado ico{
  float: left;
  display: block;
  width: 8px;
  height: 8px;
  margin: 3px 6px 2px 0;
}

.box-carrera-info .curso-estado .aprobado{
  background: #FF800B;
}
.box-carrera-info .curso-estado .activo{
  background: #00B400;
}
.box-carrera-info .curso-estado .noactivo{
  background: #0072B6;
}




.bx-Doc{
  float: left;
  overflow: hidden;
  font-size: 16px;
  line-height: 45px;
  text-align: left;
  width: 87%;
  margin: 10px 0 50px 0;
  padding: 6px 1% 6px 2%;
}
.bx-Doc img{
  float: left;
  display: block;
  margin: -4px 14px 5px 0;
  -webkit-border-radius: 160px;
  -moz-border-radius: 160px;
  border-radius: 160px;
}





.cont-curso .content-Sm{
  float: left;
  overflow: hidden;
  text-align: left;
  background: #ffffff;
  width: 27%;
  margin: 0 !important;
  padding: 10px 1%;
}


.cont-curso .content-Sm .bx-Item-opb{
  border: 1px solid #DDDDDC;
  margin-bottom: 10px;
  padding-bottom: 0;
}
.cont-curso .content-Sm .bx-Item-opb .disp-itm{
  border: 0;
  width: 100%;
  margin-bottom: 0;
}


.cont-curso .box-tit-curso{
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  color: #333333;
  font-size: 15px;
  line-height: 20px;
  text-align: left;
  background: #ffffff;
  width: 96%;
  margin: 0;
  padding: 20px 2% 16px 2%;
}
.cont-curso .box-tit-curso h1{
  font-size: 24px;
  line-height: 26px;
  margin: 0 0 10px 0;
}
.cont-curso .box-tit-curso img{
  float: left;
  display: block;
  width: 80px;
  height: auto;
  margin: 0 20px 0 0;
}
.cont-curso .box-tit-curso .tit-curso-txt{
  float: left;
  display: block;
  width: 76%;
  margin-bottom: 15px;
}
.cont-curso .box-tit-curso ul{
  width: 100%;
  margin-top: 0;
}
.cont-curso .box-tit-curso ul li{
  float: left;
  width: 30%;
  margin: 2px 3% 2px 0;
}





.box-char-curso{
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  color: #333333;
  font-size: 15px;
  line-height: 20px;
  text-align: left;
  background: #ffffff;
  width: 96%;
  margin: 0;
  padding: 20px 2% 16px 2%;
}
.box-char-curso h1{
  font-size: 24px;
  line-height: 26px;
  margin: 0 0 10px 0;
}
.box-char-curso img{
  float: left;
  display: block;
  width: 80px;
  height: auto;
  margin: 0 20px 0 0;
}
.box-char-curso .tit-curso-txt{
  float: left;
  display: block;
  width: 76%;
  margin-bottom: 15px;
}
.box-char-curso ul.char-a{
  float: left;
  width: 70%;
  margin-top: 0;
}
.box-char-curso ul.char-a li{
  float: left;
  width: 100%;
  margin: 2px 0;
}
.box-char-curso ul.char-b{
  float: right;
  box-sizing: border-box;
  border-left: 1px solid #e9ebee;
  width: 22%;
  min-height: 70px;
  margin-top: 0;
  padding-left: 2%;
}
.box-char-curso ul.char-b li{
  float: left;
  width: 100%;
  margin: 2px 0;
}




ul.li-acc-curso{
  overflow: hidden;
  width: 100%;
  margin: 40px 0 60px 0;
}
ul.li-acc-curso li{
  display: inline-block;
  width: 260px;
  height: 260px;
  margin: 20px 4%;
}
ul.li-acc-curso li a{
  overflow: hidden;
  display: block;
  box-sizing: border-box;
  color: #0a3c65;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  background: #fff;
  border: 2px solid #fff;
  width: 100%;
  height: 100%;
  padding: 40px 0 0 0;
}
ul.li-acc-curso li a:hover{
  border: 2px solid #0a3c65;
}
ul.li-acc-curso li ico{
  display: block;
  width: 100px;
  height: 100px;
  margin: 20px auto;
}
ul.li-acc-curso li ico img{
  display: block;
  width: 100%;
  height: auto;
}
ul.li-acc-curso li.ico-eval ico img{
  width: 70%;
  height: auto;
  margin: 0 auto;
}






.bg-color-9 .box-tit-sec{
  color: #ffffff;
}





.cont-curso .content-paso{
  float: left;
  background: #3D4F73 url(../lib/linea_01.png) no-repeat center 40px;
  width: 31px;
  height: 100%;
  -webkit-background-size: 14% 100%;
  -moz-background-size: 14% 100%;
  background-size: 14% 100%;
}

.cont-curso .content-paso ol{
  float: left;
  list-style-type: decimal !ie; /*IE 7- hack*/  
  counter-reset: li-counter;
  margin: 10px 3px 200px 3px;
}
.cont-curso .content-paso ol li{
  display: block;
  overflow: hidden;
  position: relative;
  text-align: center;
  background: #6179AB;
  width: 23px;
  height: 23px;
  margin: 15px auto 30px auto;
  -webkit-border-radius: 160px;
     -moz-border-radius: 160px;
          border-radius: 160px;
}
.cont-curso .content-paso ol li.paso-act{
  background: #ffffff;
}
.cont-curso .content-paso ol li:before{
  top: 0;
  left: 0;
  position: absolute;
  content: counter(li-counter)"";
  counter-increment: li-counter;
  color: #3D4E72;
  font-size: 14px;
  font-weight: 700;
  line-height: 23px;
  text-align: center;
  width: 23px;
}





.dsp-ms{  
  width: 96%;
  padding: 0;
}


.dsp-ms .content-Sm{
  float:left;
  width: 20%;
  margin: 0;
  padding: 10px 0;
}

.dsp-ms .content-Sm p{
  width: 80%;
  margin: 0 auto !important;
}
.dsp-ms .content-MdB{
  float:left;
  border-left: 1px solid #E3E3E3;
  width: 79.9%;
  min-height: 450px;
  margin: 0;
  padding: 12px 0 20px 0;
}


.dsp-ms .formulario-default fieldset{
  width: 100%;
  margin: 0 auto;
  padding: 0;
}

.dsp-ms .sep-lin{
  width: 80%;
}





.box-head-ms{
  border-bottom: 1px solid #E3E3E3;
  min-height: 40px;
  padding: 0 1.5%;
}
.box-head-ms .paginador{
  float: right;
  display: block;
  font-size: 15px;
  line-height: 30px;
}
.box-head-ms .paginador a.btn-ar{
  float: right;
  display: block;
  outline: none;
  text-align: center;
  text-indent: -9000px;
  text-decoration: none;
  background: #E8E8E8;
  width: 30px;
  height: 30px;
  margin: 0 4px;
  -webkit-border-radius: 180px;
     -moz-border-radius: 180px;
          border-radius: 180px;
}
.box-head-ms .paginador a.btn-ar img{
  display: block;
  margin: 10px auto;
}

.box-head-ms .paginador a:last-child{
  margin-left: 20px;
}


.box-srch{
  overflow: hidden;
  border-bottom: 1px solid #E3E3E3;
  padding: 14px 0;
}
.box-srch input{
  float: left;
  width: 30%;
  padding: 4px 10px;
  margin: 0 20px;
}


.user-iden{
  float: left;
  display: block;
  color: #333333;
  font-size: 25px;
  line-height: 27px;
  text-align: left;
  width: 92%;
  margin: 10px 0;
}
.user-iden img{
  float: left;
  display: block;
  margin: 0 20px 0 0;
}



.bx-Item{
  vertical-align: top;
  overflow: hidden;
  position: relative;
  background: #ffffff;
  border: 1px solid #DDDDDC;
  width: 99%;
  margin: 6px auto;
  padding-bottom: 10px;
}


.bx-Item div{
  overflow: hidden;
  position: relative;
  text-align: left;
  border-bottom: 1px solid #DDDDDC;
  width: 96%;
  padding: 10px 2%;
}
.bx-Item div:last-child{
  border-bottom: 0;
}

.bx-Item header{
  color: #ffffff;
  font-size: 20px;
  font-family: 'Oswald', Arial, Tahoma, Verdana;
  text-align: left;
  width: 96%;
  height: 38px;
  padding: 12px 2% 10px 2%;
}
.bx-Item header img{
  float: right;
  display: block;
  margin: 2px 0 0 0;
  filter: alpha(opacity=50);
  -webkit-opacity: 0.50;
     -moz-opacity: 0.50;
      -ms-opacity: 0.50;
       -o-opacity: 0.50;
          opacity: 0.50;
}
.bx-Item .small{
  font-size: 14px;
}


.bx-Item .tit-itm{
  float: left;
  display: block;
  line-height: 24px;
  width: 90%;
  padding: 5px 0;
}
.bx-Item .img-ico{
  float: left;
  display: block;
  overflow: hidden;
  width: 31px;
  height: 31px;
  margin-right: 10px;
  -webkit-border-radius: 160px;
     -moz-border-radius: 160px;
          border-radius: 160px;
}
.bx-Item .img-ico img{
  width: 100%;
}

.bx-Item ul{
  float: right;
  width: 92%;
}

.bx-Item ul li{
  text-align: left;
  width: 100%;
  margin: 8px 0;
}
.bx-Item ul li a{
  color: #333333;
  text-decoration: none;
}
.bx-Item .estado{
  display: block;
  float: right;
  margin: 0 10px;
}

.bx-Item a.del-ico{
  top: 12px;
  right: 0;
  position: absolute;
  display: block;
  text-decoration: none;
  padding: 6px 10px;
}





.bx-Item-opc{
  float: left;
  box-sizing: border-box;
  position: relative;
  text-align: left;
  background: #ffffff;
  width: 100%;
  margin: 20px 0;
  padding: 20px;
}

.bx-Item-opc a.btn-am:link,
.bx-Item-opc a.btn-bm:link{
  float: none;
  display: inline-block !important;
  font-size: 16px !important;
  width: auto;
  margin: 5px 10px !important;
  padding: 0 30px !important;
}

.bx-Item-opc .table-b{
  float: left;
  clear: both;
  width: 94%;
}
.bx-Item-opc .table-b .med{
  margin-top: 5px;
}
.bx-Item-opc .table-b .box-np{
  float: left;
  display: block;
  color: #ffffff;
  font-size: 20px;
  line-height: 32px;
  text-align: center;
  background: #0791E6;
  width: 34px;
  height: 34px;
  margin-right: 8px;
}

.bx-Item-opc .table-b .labCh{
  display: block;
  cursor: pointer;
  position: relative;
  margin: 0 44px;
  padding: 8px 0;
}
.bx-Item-opc .table-b .labCh input{
  margin-right: 8px;
}
.bx-Item-opc .table-b .lab_qcr:after{
  top: 8px;
  left: -26px;
  pointer-events: none;
  content: "";
  position: absolute;
  background: url(../lib/ico_correcto.png) no-repeat center;
  background-size: 16px auto;
  width: 20px;
  height: 20px;
}
.bx-Item-opc .table-b .lab_qer:after{
  top: 8px;
  left: -26px;
  pointer-events: none;
  content: "";
  position: absolute;
  background: url(../lib/ico_incorrecto.png) no-repeat center;
  background-size: 16px auto;
  width: 20px;
  height: 20px;
}


.bx-Item-opc p.align-right{
  overflow: hidden;
  width: 94%;
}

.bx-Item-opc p.align-center img{
  display: inline-block !important;
  margin: 0 5px -4px 0;
}


.bx-Item-opb{
  vertical-align: top;
  overflow: hidden;
  position: relative;
  background: #ffffff;
  width: 99%;
  margin: 6px auto;
  padding-bottom: 10px;
}


.bx-Item-opb .disp-itm{
  overflow: hidden;
  text-align: left;
  border: 1px solid #DDDDDC;
  width: 99%;
  min-height: 44px;
  margin-bottom: 8px;
}
.bx-Item-opb .disp-itm a{
  display: block;
  color: #333333;
  text-decoration: none;
}

.bx-Item-opb header{
  overflow: hidden;
  color: #ffffff;
  font-size: 20px;
  font-family: 'Oswald', Arial, Tahoma, Verdana;
  text-align: left;
  background: #EEEEEE;
  width: 96%;
  height: auto;
  min-height: 10px;
  padding: 8px 2%;
}
.bx-Item-opb header img{
  float: right;
  display: block;
  margin: 2px 0 0 0;
}
.bx-Item-opb .small{
  font-size: 14px;
}


.bx-Item-opb .tit-itm{
  float: left;
  display: block;
  font-size: 19px;
  line-height: 18px;
  width: 90%;
  margin-top: 4px;
}
.bx-Item-opb .img-ico{
  float: left;
  display: block;
  overflow: hidden;
  width: 44px;
  height: 44px;
  margin: 0 10px 0 0;
  /*
  -webkit-border-radius: 160px;
     -moz-border-radius: 160px;
          border-radius: 160px;
  */
}
.bx-Item-opb .img-ico img{
  width: 100%;
}

.bx-Item-opb .disp-ico{
  float: right;
  display: block;
  margin-top: 14px;
}

.bx-Item-opb .bx-content{
  display: block;
  overflow: hidden;
  width: 96%;
  padding: 5px 2%;
}

.bx-Item-opb ul{
  float: left;
  width: 92% !important;
  padding-left: 8% !important;
}

.bx-Item-opb ul li{
  overflow: hidden;
  position: relative;
  text-align: left;
  border-bottom: 1px solid #DDDDDC;
  width: 100% !important;
  margin: 0 !important;
  padding: 10px 0 !important; 
}
.bx-Item-opb .estado{
  display: block;
  float: right;
  margin: 0 10px;
}

.bx-Item-opb .disp-star{
  top: 0;
  right: 5px;
  display: block;
  position: absolute;
}


/*             CONTENT             */





/*             FOOTER             */
.footer{
  color: #ffffff !important;
  background: #0A3C65;
  height: 85px;
}


.footer p {
  float: left;
  text-align: left;
  widows: 20%;
  margin: 25px 0 0 10px;
}

.footer ul {
  float: right;
  overflow: hidden;
  color: #23a950;
  font-size: 13px;
  line-height: 24px;
  margin: 26px auto 0 auto;
}
.footer ul li{
  float: left;
  margin: 0 5px;
}
.footer ul li a{
  display: inline-block;
  color: #ffffff;
  line-height: 14px;
  text-align: center;
  text-decoration: none;
  padding: 3px 10px 4px 10px;
}
.footer ul li a:hover{
}
.footer ul li .act{
}




/*             FOOTER             */




/*             LOGIN             */
.bg_log{
  overflow: hidden;
  position: relative;
  height: 100vh;
}
.cntbg{
  top: 0;
  left: 0;
  z-index: -2;
  overflow: hidden;
  position: absolute;
  width: 100%;
  height: 100vh;
}
.cntbg:after{
  top: 0;
  left: 0;
  z-index: 1;
  content: "";
  position: absolute;
  background: rgba(0,0,0,0.70);
  width: 100%;
  height: 100vh;
}
.cntbg .bg_video{
  width: 140%;
  height: auto;
  margin-top: -20%;
}

.bg_log p{
  color: #ffffff;
  margin: 8px 0;
}


.content-login-user{
  display: inline-block;
  text-align: center;
  background: #ffffff;
  border: 1px solid #d9dbe1;
  width: 300px;
  padding: 20px;
  margin: 80px auto 20px auto;
}
.content-login-user img{
  margin: 0 auto;
}

.content-login-user p{
  margin: 8px 0;
}

.content-login-user form{
  margin-top: 20px;
}
.content-login-user form p{
  margin: 8px 0;
}

.content-login-user .formulario-default .button{
  float: none !important;
  display: block !important;
  margin: 10px auto !important;

}

.content-login-user .inp-Lg{
  width: 84% !important;
}
.content-login-user select{
  width: 98% !important;
}


.content-login-footer{
  float: none;
  margin: 10px auto 0 auto;
}


/*             LOGIN             */


/*             CAMBIO DE CONTRASEÑA             */

.content-contrasena{
  display: inline-block;
  text-align: center;
  background: #ffffff;
  border: 1px solid #d9dbe1;
  width: 480px;
  padding: 20px;
  margin: 80px auto;
}
.content-contrasena h4{
  text-align: center;
}

.content-contrasena p{
  margin: 8px 0;
}

.content-contrasena form{
  margin-top: 20px;
}
.content-contrasena form p{
  clear: none;
  width: 64%;
  margin-left: 150px !important;
}
.content-contrasena form input{
  width: 80% !important;
}


/*             CAMBIO DE CONTRASEÑA             */




.content-msj{
  float: left;
  color: #333333;
  font-size: 14px;
  line-height: 18px;
  width: 90%;
  margin: 20px auto 20px 2%;
}

.content-msj p{
  text-align: left;
  margin: 20px 0;
}
.content-msj h5{
  color: #333333;
  font-size: 23px;
  line-height: 24px;
  text-align: left;
  width: 100%;
  margin: -16px 0 10px 0; 
}


.content-msj .box-user-rem{
  float: left;
  clear: both;
  display: block;
  overflow: hidden;
  font-size: 14px;
  text-align: left;
  width: 100%;
  margin-bottom: 20px;
}
.content-msj .box-user-rem img{
  display: block;
  float: left;
  margin: 0 20px 10px 0;  
}
.content-msj .box-user-rem h2{
  color: #333333;
  font-size: 28px;
  margin: 24px 0 10px 0; 
}

.content-msj .box-msj-vw{
  display: block;
  text-align: left;
  margin: 10px 0; 
}

.content-msj .box-msj-vw{
  display: block;
  text-align: left;
  margin: 10px 0; 
}
.content-msj .box-msj-vw .box-txt-msj{
  display: block;
  text-align: left;
  border-left: 2px solid #E3E3E3;
  margin: 10px 0;
  padding: 10px;
}
.content-msj .box-msj-vw .box-txt-msj h5{
  margin: 6px 0; 
}


.content-msj .sep-lin{
  width: 100%;
}



.img-ico-md{
  float: left;
  display: block;
  overflow: hidden;
  margin-right: 10px;
  -webkit-border-radius: 160px;
     -moz-border-radius: 160px;
          border-radius: 160px;
}

.txt-tit-md{
  float: left;
  display: block;
  overflow: hidden;
  color: #0A3965;
  font-size: 17px;
  line-height: 24px;
  width: 80%;
}
.txt-tit-md h4{
  margin: 10px 0 0 0;
}


.p-wm{
  float: left;
  text-align: left;
  width: 40%;
  margin: 10px 5% 10px 0;
}




ul.tabs{
  overflow: hidden;
  font-size: 13px;
  background: #0791E6;
  width: 104%;
  margin: -10px 0 0 -3%;
  padding: 10px 2% 0 3%;
}
ul.tabs li{
  float: left;
  cursor: pointer;
  color: #666666;
  background: #ffffff;
  border: 1px solid #dddddf;
  border-bottom: 1px solid #dddddf;
  margin: 0 auto;
  padding: 10px 15px;
}

ul.tabs li.current{
  color: #333333;
  background: #ffffff;
  border-bottom: 1px solid #ffffff;
}
ul.tabs li.exa_des{
  pointer-events: none;
  color: #575757;
  background: #dddddd;
}

.tab-content{
  display: none;
  text-align: left;
  border: 1px solid #dddddf;
  width: 96%;
  margin-top: -1px;
  padding: 15px 2%;
}

.tab-content.current{
  display: inherit;
}


.tab-content .cntInBx{
  border: 1px solid #ededed;
  border-bottom: 1px solid #dddddf;
  padding-bottom: 2px;
}
.tab-content .cntInBx b{
  font-size: 16px;
}

.tab-content .formA fieldset{
  background: none;
  width: 100%;
  margin: 0 auto;
  padding: 0;
}

.tab-content .formA label{
  color: #000000;
}

.tab-content .formA .inpB{
  width: 92%;
}
.tab-content .formA textarea{
  font-size: 16px;
  line-height: 18px;
  font-weight: 100;
  width: 93%;
  height: 40px;
  padding: 6px 10px;
}
.tab-content .formA p{
  margin: 15px 0 !important;
}




.cntUsMs{
  width: 99%;
  margin-bottom: 40px;
  padding-bottom: 10px;
}

.bxIcoC{
  float: left;
  overflow: hidden;
  font-size: 16px;
  line-height: 20px;
  text-align: center;
  background: #ffffff;
  width: 7%;
  margin: 0 2% 10px -5%;
  padding: 15px 1% 10px 1%;
}
.bxIcoC img{  
  cursor: pointer;
  width: 100%;
  margin-bottom: 5px;
}


.box-esc-comentario{
  float: left;
  background: #E9EBEE;
  width: 96%;
  padding: 5px 2%;
}
.box-esc-comentario img{
  float: left;
  display: block;
  margin: 2px 10px 5px 0;
  -webkit-border-radius: 160px;
  -moz-border-radius: 160px;
  border-radius: 160px;
}
.box-esc-comentario textarea{
  float: left;
  clear: none;
  display: block;
  width: 80%;
  height: 22px;
  margin-top: 2px;
  padding: 4px 10px;
}



.bxUsMs{
  float: left;
  overflow: hidden;
  font-size: 14px;
  line-height: 16px;
  width: 94%;
  margin: 10px 0;
  padding: 6px 1% 6px 2%;
}
.bxUsMs .usImg{
  float: left;
  display: block;
  overflow: hidden;
  background: #dddddf;
  width: 31px;
  height: 31px;
  margin: -4px 8px 5px 0;
  -webkit-border-radius: 160px;
  -moz-border-radius: 160px;
  border-radius: 160px;
}
.bxUsMs .usImg img{
  display: block;
  width: 100%;
}


.bxUsMs .bx-cnTxt{
  float: left;
  display: block;
  width: 88%;
}
.bxUsMs b{
  float: left;
  display: block;
  color: #0691E5;
  font-size: 14px !important;
}

.cnt-bxM{
  float: right;
  border-left: 2px solid #DDDFE2;
  width: 90%;
}

.bxUsMsR{
  float: left;
  overflow: hidden;
  font-size: 14px;
  line-height: 16px;
  width: 94%;
  margin: 5px 0;
  padding: 6px 1% 6px 2%;
}
.bxUsMsR .usImg{
  float: left;
  display: block;
  overflow: hidden;
  background: #dddddf;
  width: 20px;
  height: 20px;
  margin: -4px 8px 5px 0;
  -webkit-border-radius: 160px;
  -moz-border-radius: 160px;
  border-radius: 160px;
}
.bxUsMsR .usImg img{
  display: block;
  width: 100%;
}

.bxUsMsR .bx-cnTxt{
  float: left;
  display: block;
  width: 88%;
  margin-top: -4px;
}
.bxUsMsR b{
  float: left;
  display: block;
  color: #0691E5;
  font-size: 14px !important;
}

.cnt-bxM .box-esc-comentario{
  background: #ffffff !important;
}
.cnt-bxM .box-esc-comentario img{
  width: 20px;
  height: 20px;
  margin: 6px 10px 5px 0;
}







.bxBtm{
  float: left;
  background: #ffffff;
  width: 90%;
  margin: -10px 0 0 4%;
  padding: 5px 2% 5px 4%;
}
.bxBtm a.btnR{
  float: left;
  display: block;
  color: #ffffff;
  font-size: 14px;
  line-height: 18px;
  text-decoration: none;
  background: #f4983d;
  padding: 8px 14px;

  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
}

.bxBtm .formA fieldset{
  width: 90%;
  margin: 0 auto 0 -5px !important;
  padding: 0 !important;
}
.bxBtm .formA fieldset p{
  margin: 0 auto !important;
  padding: 0 !important;
}
.bxBtm .formA fieldset .hTxt{
  display: block;
  overflow: hidden;
  border: 1px solid #d1d1d1;
  height: 66px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}
.bxBtm .formA fieldset textarea{
  border: 0;
  height: 80px !important;
}
.bxBtm .formA fieldset .button{
  float: right;
  font-size: 14px;
  text-transform: uppercase;
  height: 34px;
  margin: 4px 5px;
  padding: 0 20px;
}






.table-b{
  clear: both;
  font-size: 12px;
  width: 99%;
  margin: 20px auto;
}
.table-b thead th {
  color: #ffffff;
  font-weight: 100;
  text-align: center;
  background: #0A3C65;
  border: 1px solid #dddddd;
  padding: 10px;
}

.table-b tbody td {
  vertical-align: middle;
  text-align: center;
  background: #F4F5F7;
  border: 1px solid #dddddd;
  padding: 10px;
}



.color-info{
  float: left;
  display: block;
  margin-right: 40px;  
}
.color-info ico{
  float: left;
  display: block;
  width: 18px;
  height: 18px;
  margin-right: 10px;  
}

.color-info .cal-inicio{
  background: #A3D362;
}
.color-info .cal-proximos{
  background: #5AC4E3;
}



.table-c{
  clear: both;
  font-size: 14px;
  font-weight: 700;
  width: 99%;
  margin: 20px auto;
}
.table-c thead th{
  color: #ffffff;
  text-align: center;
  background: #0A3C65;
  border: 1px solid #dddddd;
  padding: 10px;
}

.table-c tbody td{
  text-align: center;
  font-size: 13px;
  background: #E9ECF3;
  border: 2px solid #ffffff;
  width: 14%;
  padding: 10px;
}
.table-c tbody td:first-child{
  width: 7%;
}

.table-c tbody .cal-inicio{
  color: #ffffff;
  background: #A3D362;
}
.table-c tbody .cal-proximos{
  color: #ffffff;
  background: #5AC4E3;
}

.table-c tbody a{
  color: #ffffff;
  text-decoration: none;
}




.table-msj{
  clear: both;
  font-size: 14px;
  width: 105%;
  margin: 0 auto 0 -2.5%;
}
.table-msj tbody td {
  text-align: center;
  border: 1px solid #dddddd;
  padding: 7px 10px;
}



.bx-options-r{
  text-align: center;
  border: 1px solid #dddddd;
  margin: 20px 0 50px 0;
  padding: 20px 10px;
}






.breadcrumb{
  float: left;
  overflow: hidden;
  font-size: 12px;
  text-align: left;
  text-transform: uppercase;
  width: 100%;
  height: 60px;
  margin: 0;
  padding: 0;
}
.breadcrumb ul{
  float: left;
  white-space: nowrap;
  margin: 10px 0;
}
.breadcrumb ul li{
  float: left;
  display: block;
  position: relative;
  white-space: nowrap;
  height: 40px;
  margin: 0 10px;
}
.breadcrumb ul li a{
  float: left;
  display: block;
  color: #0a8ecd;
  font-size: 12px;
  font-weight: 100;
  line-height: 39px;
  text-decoration: none;
  width: auto;
  height: 40px;
  padding: 0 10px;
}
.breadcrumb ul li a:hover{
  text-decoration: underline;
}

.breadcrumb ul li:last-child a{
  pointer-events: none;
  color: #0a3c65;
  font-size: 13px;
  font-weight: 700;
}




.tabs-resultados{
  float: left;
  overflow: hidden;
  font-size: 14px;
  text-align: left;
  text-transform: uppercase;
  width: 100%;
  height: 70px;
  margin: 0 0 40px 0;
  padding: 0;
}
.tabs-resultados ul{
  float: left;
  background: #0a8ecd;
  width: 100%;
  margin: 10px 0;
}
.tabs-resultados ul li{
  float: left;
  display: block;
  position: relative;
  white-space: nowrap;
  height: 60px;
  margin: 0;
}
.tabs-resultados ul li a{
  float: left;
  display: block;
  color: #ffffff;
  font-weight: 100;
  line-height: 59px;
  text-decoration: none;
  width: auto;
  height: 60px;
  padding: 0 60px;
}
.tabs-resultados ul li a:hover{
  background: rgba(255,255,255,0.12);
}

.tabs-resultados ul li.act-tab a{
  pointer-events: none;
  color: #ffffff;
  font-size: 15px;
  font-weight: 700;
  background: #0a3c65;
}



ul.resultados-res{
  float: left;
  overflow: hidden;
  color: #595959;
  width: 100%;
  margin: 20px 0 50px 0;
}
ul.resultados-res li{
  float: left;
  display: block;
  box-sizing: border-box;
  position: relative;
  text-align: left;
  background: rgba(255,255,255,0.40);
  border: 1px solid #e0e0e0;
  width: 32%;
  height: 240px;
  margin: 0 0.5%;
}
ul.resultados-res li a{
  float: left;
  display: block;
  color: #0a8ecd;
  font-weight: 100;
  line-height: 59px;
  text-decoration: none;
  width: auto;
  height: 60px;
  padding: 0 60px;
}
ul.resultados-res li a:hover{
  background: rgba(255,255,255,0.60);
}

ul.resultados-res li .ptj_l{
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 20px;
}
ul.resultados-res li .ptj{
  display: block;
  box-sizing: border-box;
  font-size: 50px;
  text-align: center;
  width: 100%;
  margin-top: 45px;
}

ul.resultados-res li .pt-ref{
  left: 0;
  bottom: 0;
  display: block;
  position: absolute;
  box-sizing: border-box;
  font-size: 12px;
  text-align: left;
  background: rgba(0,0,0,0.06);
  width: 100%;
  padding: 10px;
}
ul.resultados-res li .pt-ref .num-ref{
  float: right;
  display: block;
  font-size: 12px;
  text-align: center;
  width: 40px;
}




ul.resultados-graf{
  float: left;
  overflow: hidden;
  color: #595959;
  width: 100%;
  margin: 20px 0 50px 0;
}
ul.resultados-graf li{
  float: left;
  display: block;
  box-sizing: border-box;
  position: relative;
  font-weight: 600;
  text-align: center;
  vertical-align: middle;
  background: rgba(255,255,255,0.60);
  width: 50%;
  height: auto;
  margin: 0;
  padding: 20px 0 40px 0;
}
ul.resultados-graf li .bx_img{
  display: block;
  box-sizing: border-box;
  width: auto;
  margin: 20px auto 10px auto;
}
ul.resultados-graf li .bx_img img{
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}



.content-video{
	overflow: hidden;
	position: relative;
  width: 96%;
	height: 0;
	margin: 40px auto;
	padding-bottom: 56.25%;
	padding-top: 30px;
}

.content-video iframe, .content-video object, .content-video embed{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}



a.lnk-ttp:link,a.lnk-ttp:visited{
  display: block;
  text-decoration: none;
  color: rgba(0,0,0,0);
  background: url(../lib/ico-tooltip.svg) no-repeat center;
  background-size: 40px auto;
  width: 60px;
  height: 40px;
  margin: 0 auto;
}
a.lnk-ttp:hover{
}
/* Add this attribute to the element that needs a tooltip */
[data-tooltip] {
  position: relative;
  z-index: 2;
  cursor: pointer;
  transition: all .3s;
}
/* Hide the tooltip content by default */
[data-tooltip]:before,
[data-tooltip]:after {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: all .3s;
  margin-bottom: 5px;
}
/* Position tooltip above the element */
[data-tooltip]:before {
  position: absolute;
  bottom: 150%;
  left: 50%;
  margin-bottom: 5px;
  margin-left: -200px;
  padding: 7px;
  width: 400px;
  border-radius: 3px;
  background-color: #000;
  background-color: hsla(0, 0%, 20%, 0.9);
  color: #fff;
  content: attr(data-tooltip);
  text-align: center;
  font-size: 12px;
  line-height: 16px;
  transition: all .3s;
}
/* Triangle hack to make tooltip look like a speech bubble */
[data-tooltip]:after {
  position: absolute;
  bottom: 138%;
  left: 50%;
  margin-left: -5px;
  width: 0;
  border-top: 5px solid #000;
  border-top: 5px solid hsla(0, 0%, 20%, 0.9);
  border-right: 5px solid transparent;
  border-left: 5px solid transparent;
  content: " ";
  font-size: 0;
  line-height: 0;
}
/* Show tooltip content on hover */
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
  visibility: visible;
  opacity: 1;
  margin-bottom: 0;
  transition: all .3s;
}



.wrap_fir{
  top: 0;
  left: 0;
  z-index: 1000;
  background: rgba(0,0,0, 0.50);
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  position: fixed;
}

.cnt_graf_cal{
  position: absolute;
  top: 20%;
  left: 50%;
  z-index: 200;
  box-sizing: border-box;
  color: #51d69b;
  font-size: 28px;
  font-weight: 400;
  text-align: center;
  background: #ffffff;
  border: 10px solid #51d69b;
  border-radius: 50%;
  width: 400px;
  height: 400px;
  margin-left: -200px;
  padding: 70px;
}
.cnt_graf_cal_rep{
  position: absolute;
  top: 20%;
  left: 50%;
  z-index: 200;
  box-sizing: border-box;
  color: #e41d39;
  font-size: 28px;
  font-weight: 400;
  text-align: center;
  background: #ffffff;
  border: 10px solid #e41d39;
  border-radius: 50%;
  width: 400px;
  height: 400px;
  margin-left: -200px;
  padding: 70px;
}

.firework {
  position: absolute;
  top: 105%;
  left: 50%;
  z-index: 100;
  backface-visibilty: hidden;
}

.c {
  background: #fff;
  height: 5px;
  width: 5px;
  position: absolute;
  border-radius: 50%;
}

@keyframes shoot1 {
  0% {
    transform: translate3d(0, 0, 0) scale(0.1);
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translate3d(-300px, -78vh, 0) scale(1.4);
    opacity: 0;
  }
}
.firework:nth-child(1) {
  animation: shoot1 3s infinite;
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(1) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(2) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(3) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(4) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(5) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(6) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(7) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(8) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(9) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(10) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(11) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(12) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(13) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(14) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(15) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(16) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(17) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(18) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(19) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(20) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(21) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(22) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(23) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(24) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(25) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(26) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(27) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(28) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(29) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(30) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(31) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(32) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(33) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(34) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(35) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(36) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(37) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(38) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(39) {
  animation-delay: 0.3s;
}

.firework:nth-child(1) .c {
  background: #ff9900;
  box-shadow: 0 0 3px 0px rgba(255, 153, 0, 0.8);
}
.firework:nth-child(1) .c:nth-child(40) {
  animation-delay: 0.3s;
}

@keyframes shoot2 {
  0% {
    transform: translate3d(0, 0, 0) scale(0.1);
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translate3d(400px, -79vh, 0) scale(1.4);
    opacity: 0;
  }
}
.firework:nth-child(2) {
  animation: shoot2 3s infinite;
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(1) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(2) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(3) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(4) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(5) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(6) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(7) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(8) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(9) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(10) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(11) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(12) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(13) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(14) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(15) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(16) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(17) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(18) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(19) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(20) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(21) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(22) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(23) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(24) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(25) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(26) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(27) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(28) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(29) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(30) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(31) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(32) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(33) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(34) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(35) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(36) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(37) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(38) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(39) {
  animation-delay: 0.6s;
}

.firework:nth-child(2) .c {
  background: #ccff00;
  box-shadow: 0 0 3px 0px rgba(204, 255, 0, 0.8);
}
.firework:nth-child(2) .c:nth-child(40) {
  animation-delay: 0.6s;
}

@keyframes shoot3 {
  0% {
    transform: translate3d(0, 0, 0) scale(0.1);
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translate3d(-600px, -95vh, 0) scale(1.4);
    opacity: 0;
  }
}
.firework:nth-child(3) {
  animation: shoot3 3s infinite;
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(1) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(2) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(3) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(4) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(5) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(6) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(7) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(8) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(9) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(10) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(11) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(12) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(13) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(14) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(15) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(16) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(17) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(18) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(19) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(20) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(21) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(22) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(23) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(24) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(25) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(26) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(27) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(28) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(29) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(30) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(31) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(32) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(33) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(34) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(35) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(36) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(37) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(38) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(39) {
  animation-delay: 0.9s;
}

.firework:nth-child(3) .c {
  background: #33ff00;
  box-shadow: 0 0 3px 0px rgba(51, 255, 0, 0.8);
}
.firework:nth-child(3) .c:nth-child(40) {
  animation-delay: 0.9s;
}

@keyframes shoot4 {
  0% {
    transform: translate3d(0, 0, 0) scale(0.1);
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translate3d(500px, -83vh, 0) scale(1.6);
    opacity: 0;
  }
}
.firework:nth-child(4) {
  animation: shoot4 3s infinite;
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(1) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(2) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(3) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(4) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(5) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(6) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(7) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(8) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(9) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(10) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(11) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(12) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(13) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(14) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(15) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(16) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(17) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(18) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(19) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(20) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(21) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(22) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(23) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(24) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(25) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(26) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(27) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(28) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(29) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(30) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(31) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(32) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(33) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(34) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(35) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(36) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(37) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(38) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(39) {
  animation-delay: 1.2s;
}

.firework:nth-child(4) .c {
  background: #00ff66;
  box-shadow: 0 0 3px 0px rgba(0, 255, 102, 0.8);
}
.firework:nth-child(4) .c:nth-child(40) {
  animation-delay: 1.2s;
}

@keyframes shoot5 {
  0% {
    transform: translate3d(0, 0, 0) scale(0.1);
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translate3d(-300px, -83vh, 0) scale(1.8);
    opacity: 0;
  }
}
.firework:nth-child(5) {
  animation: shoot5 3s infinite;
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(1) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(2) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(3) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(4) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(5) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(6) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(7) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(8) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(9) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(10) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(11) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(12) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(13) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(14) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(15) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(16) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(17) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(18) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(19) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(20) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(21) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(22) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(23) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(24) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(25) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(26) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(27) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(28) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(29) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(30) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(31) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(32) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(33) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(34) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(35) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(36) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(37) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(38) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(39) {
  animation-delay: 1.5s;
}

.firework:nth-child(5) .c {
  background: aqua;
  box-shadow: 0 0 3px 0px rgba(0, 255, 255, 0.8);
}
.firework:nth-child(5) .c:nth-child(40) {
  animation-delay: 1.5s;
}

@keyframes shoot6 {
  0% {
    transform: translate3d(0, 0, 0) scale(0.1);
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translate3d(600px, -77vh, 0) scale(1.4);
    opacity: 0;
  }
}
.firework:nth-child(6) {
  animation: shoot6 3s infinite;
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(1) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(2) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(3) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(4) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(5) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(6) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(7) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(8) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(9) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(10) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(11) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(12) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(13) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(14) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(15) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(16) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(17) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(18) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(19) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(20) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(21) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(22) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(23) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(24) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(25) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(26) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(27) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(28) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(29) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(30) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(31) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(32) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(33) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(34) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(35) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(36) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(37) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(38) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(39) {
  animation-delay: 1.8s;
}

.firework:nth-child(6) .c {
  background: #0066ff;
  box-shadow: 0 0 3px 0px rgba(0, 102, 255, 0.8);
}
.firework:nth-child(6) .c:nth-child(40) {
  animation-delay: 1.8s;
}

@keyframes shoot7 {
  0% {
    transform: translate3d(0, 0, 0) scale(0.1);
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translate3d(-200px, -73vh, 0) scale(1.6);
    opacity: 0;
  }
}
.firework:nth-child(7) {
  animation: shoot7 3s infinite;
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(1) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(2) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(3) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(4) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(5) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(6) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(7) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(8) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(9) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(10) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(11) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(12) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(13) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(14) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(15) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(16) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(17) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(18) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(19) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(20) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(21) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(22) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(23) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(24) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(25) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(26) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(27) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(28) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(29) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(30) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(31) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(32) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(33) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(34) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(35) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(36) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(37) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(38) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(39) {
  animation-delay: 2.1s;
}

.firework:nth-child(7) .c {
  background: #3300ff;
  box-shadow: 0 0 3px 0px rgba(51, 0, 255, 0.8);
}
.firework:nth-child(7) .c:nth-child(40) {
  animation-delay: 2.1s;
}

@keyframes shoot8 {
  0% {
    transform: translate3d(0, 0, 0) scale(0.1);
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translate3d(-600px, -75vh, 0) scale(1.6);
    opacity: 0;
  }
}
.firework:nth-child(8) {
  animation: shoot8 3s infinite;
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(1) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(2) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(3) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(4) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(5) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(6) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(7) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(8) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(9) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(10) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(11) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(12) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(13) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(14) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(15) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(16) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(17) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(18) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(19) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(20) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(21) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(22) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(23) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(24) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(25) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(26) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(27) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(28) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(29) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(30) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(31) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(32) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(33) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(34) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(35) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(36) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(37) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(38) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(39) {
  animation-delay: 2.4s;
}

.firework:nth-child(8) .c {
  background: #cc00ff;
  box-shadow: 0 0 3px 0px rgba(204, 0, 255, 0.8);
}
.firework:nth-child(8) .c:nth-child(40) {
  animation-delay: 2.4s;
}

@keyframes shoot9 {
  0% {
    transform: translate3d(0, 0, 0) scale(0.1);
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translate3d(500px, -83vh, 0) scale(1.8);
    opacity: 0;
  }
}
.firework:nth-child(9) {
  animation: shoot9 3s infinite;
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(1) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(2) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(3) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(4) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(5) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(6) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(7) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(8) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(9) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(10) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(11) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(12) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(13) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(14) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(15) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(16) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(17) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(18) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(19) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(20) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(21) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(22) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(23) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(24) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(25) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(26) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(27) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(28) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(29) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(30) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(31) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(32) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(33) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(34) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(35) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(36) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(37) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(38) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(39) {
  animation-delay: 2.7s;
}

.firework:nth-child(9) .c {
  background: #ff0099;
  box-shadow: 0 0 3px 0px rgba(255, 0, 153, 0.8);
}
.firework:nth-child(9) .c:nth-child(40) {
  animation-delay: 2.7s;
}

@keyframes shoot10 {
  0% {
    transform: translate3d(0, 0, 0) scale(0.1);
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translate3d(700px, -73vh, 0) scale(1.4);
    opacity: 0;
  }
}
.firework:nth-child(10) {
  animation: shoot10 3s infinite;
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(1) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(2) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(3) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(4) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(5) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(6) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(7) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(8) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(9) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(10) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(11) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(12) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(13) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(14) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(15) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(16) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(17) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(18) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(19) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(20) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(21) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(22) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(23) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(24) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(25) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(26) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(27) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(28) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(29) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(30) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(31) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(32) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(33) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(34) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(35) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(36) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(37) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(38) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(39) {
  animation-delay: 3s;
}

.firework:nth-child(10) .c {
  background: red;
  box-shadow: 0 0 3px 0px rgba(255, 0, 0, 0.8);
}
.firework:nth-child(10) .c:nth-child(40) {
  animation-delay: 3s;
}

@keyframes explode1 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-57.9005486742px, 13.5538957613px, 0) scale(0.1);
  }
}
.c:nth-child(1) {
  animation: explode1 3s infinite linear;
}

@keyframes explode2 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-0.2460155557px, 114.02958647px, 0) scale(0.1);
  }
}
.c:nth-child(2) {
  animation: explode2 3s infinite linear;
}

@keyframes explode3 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-1.1915378394px, 14.0241630138px, 0) scale(0.1);
  }
}
.c:nth-child(3) {
  animation: explode3 3s infinite linear;
}

@keyframes explode4 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-53.406080552px, -1.5279700491px, 0) scale(0.1);
  }
}
.c:nth-child(4) {
  animation: explode4 3s infinite linear;
}

@keyframes explode5 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-8.1733811603px, 8.0710387781px, 0) scale(0.1);
  }
}
.c:nth-child(5) {
  animation: explode5 3s infinite linear;
}

@keyframes explode6 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(28.6147935145px, -62.4686933573px, 0) scale(0.1);
  }
}
.c:nth-child(6) {
  animation: explode6 3s infinite linear;
}

@keyframes explode7 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-18.1461852942px, -34.8336544493px, 0) scale(0.1);
  }
}
.c:nth-child(7) {
  animation: explode7 3s infinite linear;
}

@keyframes explode8 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-58.9794071236px, -104.8056681841px, 0) scale(0.1);
  }
}
.c:nth-child(8) {
  animation: explode8 3s infinite linear;
}

@keyframes explode9 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(69.9823787081px, -19.8186957485px, 0) scale(0.1);
  }
}
.c:nth-child(9) {
  animation: explode9 3s infinite linear;
}

@keyframes explode10 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(7.6511371099px, -23.8959286656px, 0) scale(0.1);
  }
}
.c:nth-child(10) {
  animation: explode10 3s infinite linear;
}

@keyframes explode11 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(6.6463712069px, 51.9682216347px, 0) scale(0.1);
  }
}
.c:nth-child(11) {
  animation: explode11 3s infinite linear;
}

@keyframes explode12 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(7.1226247993px, -82.6026816016px, 0) scale(0.1);
  }
}
.c:nth-child(12) {
  animation: explode12 3s infinite linear;
}

@keyframes explode13 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-1.2130780923px, 47.035415746px, 0) scale(0.1);
  }
}
.c:nth-child(13) {
  animation: explode13 3s infinite linear;
}

@keyframes explode14 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(2.635584289px, -21.2537202734px, 0) scale(0.1);
  }
}
.c:nth-child(14) {
  animation: explode14 3s infinite linear;
}

@keyframes explode15 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-3.2607650052px, 43.5438472396px, 0) scale(0.1);
  }
}
.c:nth-child(15) {
  animation: explode15 3s infinite linear;
}

@keyframes explode16 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-17.45404269px, -17.3195616652px, 0) scale(0.1);
  }
}
.c:nth-child(16) {
  animation: explode16 3s infinite linear;
}

@keyframes explode17 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-23.525975068px, -5.135129926px, 0) scale(0.1);
  }
}
.c:nth-child(17) {
  animation: explode17 3s infinite linear;
}

@keyframes explode18 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(30.1270750289px, -31.1011129879px, 0) scale(0.1);
  }
}
.c:nth-child(18) {
  animation: explode18 3s infinite linear;
}

@keyframes explode19 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(11.5926256739px, 56.0147390092px, 0) scale(0.1);
  }
}
.c:nth-child(19) {
  animation: explode19 3s infinite linear;
}

@keyframes explode20 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-18.0928943953px, -45.7026871091px, 0) scale(0.1);
  }
}
.c:nth-child(20) {
  animation: explode20 3s infinite linear;
}

@keyframes explode21 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(38.6456727435px, 83.9222217356px, 0) scale(0.1);
  }
}
.c:nth-child(21) {
  animation: explode21 3s infinite linear;
}

@keyframes explode22 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(41.7497644998px, 32.0092838473px, 0) scale(0.1);
  }
}
.c:nth-child(22) {
  animation: explode22 3s infinite linear;
}

@keyframes explode23 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(26.6631357204px, -28.1892542427px, 0) scale(0.1);
  }
}
.c:nth-child(23) {
  animation: explode23 3s infinite linear;
}

@keyframes explode24 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-54.4114342605px, -74.4446794609px, 0) scale(0.1);
  }
}
.c:nth-child(24) {
  animation: explode24 3s infinite linear;
}

@keyframes explode25 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-32.6986916343px, -59.6196358419px, 0) scale(0.1);
  }
}
.c:nth-child(25) {
  animation: explode25 3s infinite linear;
}

@keyframes explode26 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(56.8340481557px, -13.3282515013px, 0) scale(0.1);
  }
}
.c:nth-child(26) {
  animation: explode26 3s infinite linear;
}

@keyframes explode27 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-5.9379020976px, -9.5028625224px, 0) scale(0.1);
  }
}
.c:nth-child(27) {
  animation: explode27 3s infinite linear;
}

@keyframes explode28 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(14.6598585746px, 14.986326276px, 0) scale(0.1);
  }
}
.c:nth-child(28) {
  animation: explode28 3s infinite linear;
}

@keyframes explode29 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(2.0948544448px, 7.013730469px, 0) scale(0.1);
  }
}
.c:nth-child(29) {
  animation: explode29 3s infinite linear;
}

@keyframes explode30 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-54.0085536691px, -21.6577266419px, 0) scale(0.1);
  }
}
.c:nth-child(30) {
  animation: explode30 3s infinite linear;
}

@keyframes explode31 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-41.1485606019px, -117.7061451679px, 0) scale(0.1);
  }
}
.c:nth-child(31) {
  animation: explode31 3s infinite linear;
}

@keyframes explode32 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(22.2561291552px, -25.5708690096px, 0) scale(0.1);
  }
}
.c:nth-child(32) {
  animation: explode32 3s infinite linear;
}

@keyframes explode33 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-4.7614711958px, 7.5364519759px, 0) scale(0.1);
  }
}
.c:nth-child(33) {
  animation: explode33 3s infinite linear;
}

@keyframes explode34 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-35.6694513994px, -26.1462309633px, 0) scale(0.1);
  }
}
.c:nth-child(34) {
  animation: explode34 3s infinite linear;
}

@keyframes explode35 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-5.3870806717px, -10.5530004698px, 0) scale(0.1);
  }
}
.c:nth-child(35) {
  animation: explode35 3s infinite linear;
}

@keyframes explode36 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(7.0543530371px, -39.93898099px, 0) scale(0.1);
  }
}
.c:nth-child(36) {
  animation: explode36 3s infinite linear;
}

@keyframes explode37 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(16.8952983441px, 15.3020529472px, 0) scale(0.1);
  }
}
.c:nth-child(37) {
  animation: explode37 3s infinite linear;
}

@keyframes explode38 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-19.6147783936px, 68.3242346175px, 0) scale(0.1);
  }
}
.c:nth-child(38) {
  animation: explode38 3s infinite linear;
}

@keyframes explode39 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(-5.8472077091px, -49.1568226389px, 0) scale(0.1);
  }
}
.c:nth-child(39) {
  animation: explode39 3s infinite linear;
}

@keyframes explode40 {
  60% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  100% {
    transform: translate3d(10.5609886555px, 64.9163609227px, 0) scale(0.1);
  }
}
.c:nth-child(40) {
  animation: explode40 3s infinite linear;
}




.single-chart {
  width: 90%;
  justify-content: space-around ;
  margin: 0 auto 30px auto;
}

.circular-chart {
  display: block;
  margin: 10px auto;
  max-width: 80%;
  max-height: 250px;
}

.circle-bg {
  fill: none;
  stroke: #eee;
  stroke-width: 3.8;
}

.circle {
  fill: none;
  stroke-width: 2.8;
  stroke-linecap: round;
  animation: progress 1s ease-out forwards;
}

@keyframes progress {
  0% {
    stroke-dasharray: 0 100;
  }
}

.circular-chart.orange .circle {
  stroke: #ff9f00;
}

.circular-chart.green .circle {
  stroke: #4CC790;
}

.circular-chart.blue .circle {
  stroke: #3c9ee5;
}
.circular-chart.er .circle {
  stroke: #e41d39;
}

.percentage {
  fill: #666;
  font-family: sans-serif;
  font-size: 0.32em;
  font-weight: 400;
  letter-spacing: -0.8px;
  text-anchor: middle;
}




.select {
  vertical-align: middle;
  position: relative;
  display: block;
  color: #cccccc;
  text-align: left;
  width: 70%;
  margin: 20px auto;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-touch-callout: none;
}
.select .placeholder {
  position: relative;
  display: block;
  background-color: #0a3c65;
  z-index: 1;
  padding: 1em;
  border-radius: 2px;
  cursor: pointer;
}

.select .placeholder:hover {
  background: #34383c;
}
.select .placeholder:after {
  position: absolute;
  right: 1em;
  top: 50%;
  transform: translateY(-50%);
  font-family: "FontAwesome";
  content: "";
  z-index: 10;
  background: url(../lib/ar-dwn.svg) no-repeat center;
  background-size: auto 8px;
  width: 20px;
  height: 8px;
}
.select.is-open .placeholder:after {
  background: url(../lib/ar-up.svg) no-repeat center;
  background-size: auto 8px;
}
.select.is-open ul {
  display: block;
}

.select ul {
  display: none;
  position: absolute;
  overflow: hidden;
  width: 100%;
  background: #fff;
  border-radius: 2px;
  top: 100%;
  left: 0;
  list-style: none;
  margin: 5px 0 0 0;
  padding: 0;
  z-index: 100;
}
.select ul li {
  display: block;
  text-align: left;
  padding: 0.8em 1em 0.8em 1em;
  color: #999;
  cursor: pointer;
}
.select ul li:hover {
  background: #4ebbf0;
  color: #fff;
}





.p-msj-not{
  font-weight: 700;
  line-height: 22px;
  text-align: center !important;
  background: #fdf5e7;
  width: 70%;
  padding: 20px 20px 25px 20px;
}




.med{
  font-size: 18px;
  line-height: 24px;
}

.small{
  font-size: 12px;
}




.sep-lin{
  display: block;
  border-bottom: 1px solid #E3E3E3;
  margin: 20px auto;
}


.img-la{
  float: left;
  display: block;
  margin: 0 20px 0 0;
}



.img-ra{
  float: right;
  display: block;
  margin: 20px 0 20px 50px;
}



.align-center{
  text-align: center !important;
}
.align-right{
  text-align: right !important;
}
.align-left{
  text-align: left !important;
}





.left{
  float: left;
  display: block;
}
.right{
  float: right;
  display: block;
}

.clear{
  clear: both;
  display: block;
}






b {
  font-weight: 700;
}


.color-1{
  color: #ffffff !important;
}
.color-2{
  color: #4285F4 !important;
}
.color-3{
  color: #D81F16 !important;
}
.color-4{
  color: #FF9900 !important;
}
.color-5{
  color: #72C534 !important;
}
.color-6{
  color: #999999 !important;
}
.color-7{
  color: #ff0000 !important;
}
.color-8{
  color: #A3D362 !important;
}
.color-9{
  color: #103959 !important;
}



.bg-color-1{
  background-color: #ffffff !important;
}
.bg-color-2{
  background-color: #4285F4 !important;
}
.bg-color-3{
  background-color: #D81F16 !important;
}
.bg-color-4{
  background-color: #FF9900 !important;
}
.bg-color-5{
  background-color: #72C534 !important;
}
.bg-color-6{
  background-color: #0A8ECD !important;
}
.bg-color-7{
  background-color: #FF530F !important;
}
.bg-color-8{
  background-color: #A3D362 !important;
}
.bg-color-9{
  background-color: #103959 !important;
}




/*             LISTADOS             */


ul.list-imagen{
  float: left;
  clear: both;
  overflow: hidden;
  border-top: 1px solid #CACACA;
  width: 100%;
  margin: 15px 0;
}
ul.list-imagen li{
  float: left;
  clear: both;
  border-bottom: 1px solid #CACACA;
  width: 100%;
  margin: 2px 0;
  padding: 6px 0;
}

ul.list-imagen .img-avatar{
  display: block;
  float: left;
  overflow: hidden;
  width: 20%;
  height: 60px;
  margin-right: 15px;
}

ul.list-imagen .info-imagen{
  display: block;
  float: left;
  text-align: left;
  width: 50%;
  margin-right: 15px;
}

ul.list-imagen a.boton-delete{
  float: left;
}

ul.list-imagen a.boton-1{
  float: left;
  margin: 5px 0;
}




ul.listado-carrera-mat{
  float: left;
  clear: both;
  overflow: hidden;
  width: 100%;
  margin: 10px 0;
}
ul.listado-carrera-mat li{
  float: left;
  background: #ffffff;
  width: 47%;
  margin: 5px 2% 5px 0;
  padding: 8px;
}
ul.listado-carrera-mat li:nth-child(2n){
  margin: 2px 0;
}

ul.listado-carrera-mat img{
  float: left;
  display: block;
  margin-right: 16px;
}

ul.listado-carrera-mat .bx-mat-desc{
  float: left;
  display: block;
  overflow: hidden;
  text-align: left;
  width: 48%;
}

ul.listado-carrera-mat .curso-estado{
  float: left;
  display: block;
  overflow: hidden;
  font-size: 13px;
  line-height: 15px;
  text-align: left;
  width: 90%;
  margin: 10px 10px 6px 0;
}
ul.listado-carrera-mat li .curso-estado ico{
  float: left;
  display: block;
  width: 10px;
  height: 10px;
  margin: 2px 6px 2px 0;
}
ul.listado-carrera-mat li .curso-estado .aprobado{
  background: #FF800B;
}
ul.listado-carrera-mat li .curso-estado .activo{
  background: #00B400;
}
ul.listado-carrera-mat li .curso-estado .noactivo{
  background: #0072B6;
}





ul.listado-carrera-cursos{
  float: left;
  clear: both;
  overflow: hidden;
  width: 100%;
  margin: 10px 0;
}
ul.listado-carrera-cursos li{
  float: left;
	box-sizing: border-box;
  background: #ffffff;
  width: 24%;
  margin: 5px 1% 5px 0;
  padding: 8px;
}
ul.listado-carrera-cursos li:nth-child(4n){
  margin: 5px 0;
}

ul.listado-carrera-cursos a{
  display: block;
  color: #333333;
  text-decoration: none;
}

ul.listado-carrera-cursos img{
  float: left;
  display: block;
  width: 100%;
  margin-bottom: 16px;
}

ul.listado-carrera-cursos .curso-estado{
  float: left;
  display: block;
  overflow: hidden;
  font-size: 13px;
  line-height: 15px;
  text-align: left;
  width: 90%;
  margin: 15px 10px 0 0;
}
ul.listado-carrera-cursos li .curso-estado ico{
  float: left;
  display: block;
  width: 10px;
  height: 10px;
  margin: 2px 6px 2px 0;
}
ul.listado-carrera-cursos li .curso-estado .aprobado{
  background: #FF800B;
}
ul.listado-carrera-cursos li .curso-estado .activo{
  background: #00B400;
}
ul.listado-carrera-cursos li .curso-estado .noactivo{
  background: #0072B6;
}




ul.listado-cursos-rel{
  clear: both;
  overflow: hidden;
  font-size: 12px;
  line-height: 15px;
  width: 100%;
  margin: 0 auto;
}
ul.listado-cursos-rel li{
  float: left;
  clear: both;
  position: relative;
  text-align: left;
  width: 100%;
  margin: 10px 0;
  padding: 10px 0;
}

ul.listado-cursos-rel a{
  float: left;
  display: block;
  color: #333333;
  text-decoration: none;
  width: 100%;
}

ul.listado-cursos-rel img{
  float: left;
  display: block;
  margin-right: 14px;
}
ul.listado-cursos-rel .titulo-curso{
  color: #0A8CCC;
  font-size: 18px;
  margin: 15px 0;
}
ul.listado-cursos-rel .curso-descripcion{
  float: left;
  display: block;
  overflow: hidden;
  border-bottom: 1px solid #CED2D9;
  width: 82%;
  padding-bottom: 30px;
}
ul.listado-cursos-rel .curso-info{
  float: right;
  display: block;
  color: #0A8CCC;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  width: 10%;
  margin-left: 80px;
}

ul.listado-cursos-rel .curso-info .num-h{
  font-size: 28px;
  line-height: 40px;
}
ul.listado-cursos-rel .curso-info .num-pref{
  font-size: 18px;
}






ul.listado-box-cursos{
  float: left;
  clear: both;
  overflow: hidden;
  width: 100%;
  margin: 0;
}
ul.listado-box-cursos li{
  float: left;
  position: relative;
  text-align: left;
  background: #ffffff;
  width: 23%;
  min-height: 280px !important;
  margin: 5px 1% 5px 0;
  padding: 1px 1px 30px 1px;
}
ul.listado-box-cursos li:nth-child(4n){
  margin: 5px 0;
}

ul.listado-box-cursos a{
  display: block;
  box-sizing: border-box;
  color: #333333;
  font-size: 19px;
  line-height: 22px;
  text-align: left;
  text-decoration: none;
  width: 100%;
  padding: 5px 10px;
}

ul.listado-box-cursos img{
  float: left;
  display: block;
  width: 100%;
  margin-bottom: 10px;
}

ul.listado-box-cursos .curso-estado{
  float: left;
  display: block;
  overflow: hidden;
  font-size: 13px;
  line-height: 15px;
  text-align: left;
  width: 90%;
  margin: 15px 10px 0 0;
}

ul.listado-box-cursos .small{
  bottom: 6px;
  position: absolute;
  display: block;
  color: #777777;
  font-size: 12px;
  padding: 5px 10px;
}






ul.list-clas-msj{
  clear: both;
  overflow: hidden;
  font-size: 14px;
  width: 80%;
  margin: 20px auto;
}
ul.list-clas-msj li{
  float: left;
  clear: both;
  line-height: 20px;
  text-align: left;
  width: 100%;
  margin: 0;
  padding: 8px 0;
}

ul.list-clas-msj a{
  float: left;
  display: block;
  color: #333333;
  text-decoration: none;
  width: 100%;
}

ul.list-clas-msj img{
  float: left;
  display: block;
  margin-right: 15px;
}

ul.list-clas-msj .box-cont{
  float: right;
  display: block;
  color: #ffffff;
  font-size: 11px;
  font-weight: 700;
  line-height: 22px;
  text-align: center;
  width: 24px;
  height: 24px;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}

ul.list-clas-msj li:nth-child(1) .box-cont{
  background: #0BACD3;
}
ul.list-clas-msj li:nth-child(2) .box-cont{
  background: #FF9966;
}
ul.list-clas-msj li:nth-child(3) .box-cont{
  background: #DB5565;
}




ul.lista-msj-panel{
  clear: both;
  overflow: hidden;
  font-size: 12px;
  line-height: 15px;
  border-top: 1px solid #CED2D9;
  width: 100%;
  margin: 10px auto;
  padding: 10px 0;
}
ul.lista-msj-panel li{
  float: left;
  clear: both;
  position: relative;
  text-align: left;
  width: 100%;
  padding: 10px 0;
}

ul.lista-msj-panel a{
  float: left;
  display: block;
  color: #333333;
  text-decoration: none;
  width: 100%;
}

ul.lista-msj-panel img{
  float: left;
  display: block;
  margin-right: 14px;
  -webkit-border-radius: 180px;
     -moz-border-radius: 180px;
          border-radius: 180px;
}
ul.lista-msj-panel .msj-info{
  float: left;
  display: block;
  border-bottom: 1px solid #CED2D9;
  width: 76%;
  padding: 0 2% 10px 0;
}
ul.lista-msj-panel .msj-ref{
  color: #666666;
  font-size: 13px;
}
ul.lista-msj-panel .msj-ref .left{
  margin-right: 10px;
}
ul.lista-msj-panel .msj-tit{
  clear: both;
  display: block;
  color: #0A8ECD;
  font-size: 17px;
  line-height: 20px;
  width: 100%;
  margin: 8px 0;
}





ul.list-msj{
  float: left;
  clear: both;
  overflow: hidden;
  font-size: 15px;
  width: 100%;
  margin: 0;
}
ul.list-msj li{
  float: left;
  clear: both;
  text-align: left;
  border-left: 2px solid #ffffff;
  width: 100%;
  margin: 0;
  padding: 6px 0;
}
ul.list-msj li:hover{
  background: #EBFAFE;
  border-left: 2px solid #0BACD3;
}

ul.list-msj li.sel-msj{
  background: #EBFAFE;
  border-left: 2px solid #0BACD3;
}

ul.list-msj a{
  display: block;
  float: left;
  color: #666666;
  text-decoration: none;
  width: 94%;
}
ul.list-msj input{
  display: block;
  float: left;
  margin: 17px 15px;
}
ul.list-msj img{
  display: block;
  float: left;
  margin-right: 15px;
}

ul.list-msj .rem-user{
  display: block;
  float: left;
}

ul.list-msj .txt-msj{
  display: block;
  float: left;
  width: 92%;
  margin-top: 6px;
}


ul.list-msj .date{
  display: block;
  float: right;
}


.box-disp-video{
  display: block;
  overflow: hidden;
  width: 98%;
  margin: 20px 0 20px 2%;
}

.box-disp-video ul.list-temas{
  float: left;
  clear: none;
  box-sizing: border-box;
  overflow-y: scroll;
  width: 47%;
  height: 500px;
  margin: 0 auto;
  padding-right: 10px;
}
.box-disp-video ul.list-temas li{
  overflow: hidden;
}
.box-disp-video ul.list-temas .txt-tema-tit{
  font-size: 12px !important;
  line-height: 17px;
}
.box-disp-video ul.list-temas .txt-tema-tit b{
  font-size: 16px;
}
.box-disp-video ul.list-temas .ico-video{
  width: 22%;
  height: auto;
  margin-right: 0;
}
.box-disp-video ul.list-temas .ico-video img{
  width: 100%;
  height: auto;
}
.box-disp-video ul.list-temas .txt-tema-tit{
  float: right;
  width: 75%;
}

.box-disp-video .cnt_video{
  float: right;
  overflow: hidden;
  position: relative;
  width: 50%;
  height: 0;
  margin: 0 0 14px 0;
  padding-bottom: 32%;
  padding-top: 30px;
}
.box-disp-video .cnt_video iframe,
.box-disp-video .cnt_video object,
.box-disp-video .cnt_video embed{
  top:0;
  left:0;
  position:absolute;
  width: 100% !important;
  height: 100% !important;
}



.box-disp-videob{
  display: block;
  overflow: hidden;
  width: 98%;
  margin: 20px 0 20px 2%;
}

.box-disp-videob ul.list-temas{
  float: right;
  clear: none;
  box-sizing: border-box;
  overflow-y: scroll;
  width: 47%;
  height: 500px;
  margin: 0 auto;
  padding-right: 10px;
}
.box-disp-videob ul.list-temas li{
  overflow: hidden;
}
.box-disp-videob ul.list-temas .txt-tema-tit{
  font-size: 12px !important;
  line-height: 17px;
}
.box-disp-videob ul.list-temas .txt-tema-tit b{
  font-size: 16px;
}
.box-disp-videob ul.list-temas .ico-video{
  width: 22%;
  height: auto;
  margin-right: 0;
}
.box-disp-videob ul.list-temas .ico-video img{
  width: 100%;
  height: auto;
}
.box-disp-videob ul.list-temas .txt-tema-tit{
  float: right;
  width: 75%;
}

.box-disp-videob .cnt_video{
  float: left;
  overflow: hidden;
  position: relative;
  width: 50%;
  height: 0;
  margin: 0 0 14px 0;
  padding-bottom: 32%;
  padding-top: 30px;
}
.box-disp-videob .cnt_video iframe,
.box-disp-videob .cnt_video object,
.box-disp-videob .cnt_video embed{
  top:0;
  left:0;
  position:absolute;
  width: 100% !important;
  height: 100% !important;
}







ul.list-temas{
  clear: both;
  overflow: hidden;
  font-size: 15px;
  line-height: 28px;
  width: 100%;
  margin: 20px auto 50px auto;
}
ul.list-temas li{
  float: left;
  clear: both;
  position: relative;
  text-align: left;
  background: #ffffff;
  width: 100%;
  margin-bottom: 10px;
}

ul.list-temas a{
  display: block;
  color: #333333;
  text-decoration: none;
  width: 100%;
}
ul.list-temas a:hover{
  opacity: 0.60;
}


ul.list-temas .ico-tema{
  float: left;
  display: block;
  text-align: center;
  width: 90px;
  height: 90px;
  margin-right: 20px;
}
ul.list-temas .ico-tema img{
  display: block;
  margin: 22px auto;
}

ul.list-temas .ico-video{
  float: left;
  display: block;
  text-align: center;
  width: 120px;
  height: 90px;
  margin-right: 20px;
}
ul.list-temas .ico-video img{
  display: block;
  margin: 0 auto;
}

ul.list-temas .txt-tema-tit{
  float: left;
  display: block;
  width: 86%;
  margin-top: 13px;
}
ul.list-temas .txt-tema-tit a{
  display: block;
  text-decoration: none;
}
ul.list-temas .txt-tema-tit b{
  font-size: 17px;
  line-height: 20px;
}
ul.list-temas .txt-tema-tit .bx-docente{
  float: left;
  display: block;
  clear: both;
  color: #666666;
  font-size: 14px;
  line-height: 34px;
  width: 100%;
}
ul.list-temas .txt-tema-tit img{
  float: left;
  display: block;
  margin-right: 10px;
  -webkit-border-radius: 180px;
     -moz-border-radius: 180px;
          border-radius: 180px;
}

ul.list-temas .ico-estado{
  right: 10px;
  bottom: 5px;
  display: block;
  position: absolute;
  font-size: 13px;
  line-height: 15px;
  height: 16px;
}
ul.list-temas .ico-estado img{
  float: left;
  display: block;
  margin-right: 4px;
}

ul.list-temas .btn-estado{
  right: 40px;
  top: 30px;
  display: block;
  position: absolute;
  height: 16px;
}

ul.list-temas .btn-estado a.btn-01{
  display: block;
  color: #ffffff;
  font-size: 17px;
  text-align: center;
  background: #D73B40;
  margin: 0 auto;
  padding: 4px 12px;
}



/*             LISTADOS             */



/*             LINKS             */




a.link-1:link,a.link-1:visited {
  color: #0A3A65;
  text-decoration: none;
}
a.link-1:hover {
  text-decoration: underline;
}



a.link-1u:link,a.link-1u:visited {
  color: #0A3A65;
  text-decoration: underline;
}
a.link-1u:hover {
  text-decoration: none;
}




a.lnk-agregar-curso:link,a.lnk-agregar-curso:visited{
  float: left;
  display: block;
  color: #0A8CCC;
  font-size: 15px;
  text-align: left;
  text-decoration: none;
  background: url(../lib/ico_star_2.png) no-repeat 15px center;
  width: 70%;
  padding: 14px 20px 8px 50px;
}



a.lnk-descargar:link,a.lnk-descargar:visited{
  float: left;
  display: block;
  color: #333333;
  font-size: 17px;
  font-weight: 700;
  text-decoration: none;
  width: 80%;
  margin: 15px 0;
}
a.lnk-descargar img{
  float: left;
  display: block;
  margin-right: 20px;
}
a.lnk-descargar span{
  float: left;
  display: block;
  font-size: 14px;
  background: url(../lib/ico_descargar.png) no-repeat left center;
  margin-top: 10px;
  padding-left: 20px;
}







a.btn-anterior:link,a.btn-anterior:visited{
  float: left;
  display: block;
  outline: none;
  text-indent: -9000px;
  text-decoration: none;
  background: #E8E8E8 url(../lib/ico_anterior.png) no-repeat center;
  width: 30px;
  height: 30px;
  margin-right: 5px;
}

a.btn-siguiente:link,a.btn-siguiente:visited{
  float: left;
  display: block;
  outline: none;
  text-indent: -9000px;
  text-decoration: none;
  background: #E8E8E8 url(../lib/ico_siguiente.png) no-repeat center;
  width: 30px;
  height: 30px;
  margin-right: 5px;
}


a.btn-actualizar:link,a.btn-actualizar:visited{
  float: left;
  display: block;
  outline: none;
  text-indent: -9000px;
  text-decoration: none;
  background: url(../lib/ico_actualizar.png) no-repeat center;
  width: 37px;
  height: 32px;
  margin-right: 5px;
}


a.btn-volver:link,a.btn-volver:visited{
  float: left;
  display: block;
  outline: none;
  text-indent: -9000px;
  text-decoration: none;
  background: url(../lib/ico_back.png) no-repeat center;
  width: 40px;
  height: 32px;
  margin-right: 5px;
}


a.btn-eliminar:link,a.btn-eliminar:visited{
  float: left;
  display: block;
  outline: none;
  text-indent: -9000px;
  text-decoration: none;
  background: url(../lib/ico_papelera_2.png) no-repeat center;
  width: 37px;
  height: 32px;
  margin-right: 5px;
}




a.boton-delete:link,a.boton-delete:visited {
  display: block;
  color: #ffffff;
  font-size: 12px;
  line-height: 14px;
  text-align: center;
  text-decoration: none;
  background-color: #D22B19;
  height: 16px;
  padding: 4px 10px;
}


a.boton-redactar:link,a.boton-redactar:visited {
  display: block;
  color: #ffffff;
  font-size: 14px;
  line-height: 32px;
  text-align: center;
  text-decoration: none;
  background-color: #DB5565;
  width: 80%;
  height: 32px;
  margin: 10px auto;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}


a.boton-op-envio:link,a.boton-op-envio:visited {
  display: block;
  color: #ffffff;
  font-size: 14px;
  line-height: 32px;
  text-align: center;
  text-decoration: none;
  background-color: #51BF87;
  width: 80%;
  height: 32px;
  margin: 10px auto;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}


a.boton-1:link,a.boton-1:visited {
  display: block;
  color: #ffffff;
  font-size: 12px;
  line-height: 14px;
  text-align: center;
  text-decoration: none;
  background-color: #08AE98;
  height: 16px;
  padding: 4px 10px;
}


a.boton-2:link,a.boton-2:visited {
  float: none;
  display: block;
  color: #ffffff;
  font-size: 12px;
  line-height: 14px;
  text-align: center;
  text-decoration: none;
  background-color: #A3D362;
  width: auto;
  height: 16px;
  margin: 10px auto;
  padding: 4px 0;
}




a.boton-3:link,a.boton-3:visited {
  float: none;
  clear: both;
  display: block;
  color: #ffffff;
  font-size: 12px;
  font-weight: 700;
  line-height: 50px;
  text-align: center;
  text-decoration: none;
  background-color: #4caf50;
  width: 50%;
  height: 50px;
  margin: 15px auto !important;
}
a.boton-3:hover{
  opacity: 0.70;
}


a.boton-4:link,a.boton-4:visited {
  float: none;
  clear: both;
  display: block;
  color: #ffffff;
  font-size: 12px;
  font-weight: 700;
  line-height: 50px;
  text-align: center;
  text-decoration: none;
  background-color: #1e88e5;
  width: 50%;
  height: 50px;
  margin: 15px auto !important;
}
a.boton-4:hover{
  opacity: 0.70;
}



/*             LINKS             */

/*             BOTÓNES             */


a.btn-a:link,a.btn-a:visited{
  display: inline-block;
  color: #ffffff;
  font-size: 19px;
  line-height: 32px;
  text-decoration: none;
  text-align: center;
  background: #EE9B15;
  height: 34px;
  margin: 5px auto !important;
  padding: 0 40px;
}

a.btn-am:link,a.btn-am:visited{
  display: inline-block;
  color: #ffffff;
  font-size: 18px;
  line-height: 45px;
  text-decoration: none;
  text-align: center;
  background: #EE9B15;
  height: 46px;
  margin: 5px auto !important;
  padding: 0 30px;
}
a.btn-am:hover{
  opacity: 0.70;
}

a.btn-bm:link,a.btn-bm:visited{
  display: inline-block;
  color: #ffffff;
  font-size: 18px;
  line-height: 45px;
  text-decoration: none;
  text-align: center;
  background: #666666;
  height: 46px;
  margin: 5px auto !important;
  padding: 0 30px;
}
a.btn-bm:hover{
  opacity: 0.70;
}



.btn-facebook{
  display: block;
  color: #ffffff;
  font-size: 16px;
  line-height: 38px;
  text-align: left;
  text-decoration: none;
  background: #3B5998 url(../lib/ico_facebook.png) no-repeat 14px center;
  width: 60% !important;
  height: 40px;
  margin: 4px auto;
  padding-left: 55px !important;
}

.btn-twitter{
  display: block;
  color: #ffffff;
  font-size: 16px;
  line-height: 38px;
  text-align: left;
  text-decoration: none;
  background: #00B6F1 url(../lib/ico_twitter.png) no-repeat 14px center;
  width: 60% !important;
  height: 40px;
  margin: 4px auto;
  padding-left: 55px !important;
}



/*             BOTÓNES             */


/*             FORMULARIOS             */

/* ÍCONOS SET INPUT */

.inp-us{
  background: url(../lib/ico_usuario.png) no-repeat 4px center;
  padding-left: 34px !important;
}
.inp-cnt{
  background: url(../lib/ico_contrasena.png) no-repeat 4px center;
  padding-left: 34px !important;
}

/* ÍCONOS SET INPUT */



.formulario-default fieldset{
  clear: both;
  overflow: hidden;
  color: #787878;
  font-size: 20px;
  text-align: center;
  background: #ffffff;
  width: 96%;
  margin: 20px auto 50px auto;
  padding: 10px 2%;
}

.formulario-default select, input, textarea{
  clear: both;
  color: #333333;
  font-size: 14px;
  font-family: 'Oswald', Arial, Tahoma, Verdana;
  line-height: 22px;
  border: 1px solid #d1d1d1;
}

.formulario-default label{
  display: block;
  float: left;
  clear: both;
  color: #787878;
  font-size: 13px;
  line-height: 22px;
  text-align: left;
  width: 80%;
  padding: 4px 0;
}
.formulario-default .lab-chbx{
  cursor: pointer;
  font-weight: 700;
  line-height: 30px;
  width: 80%;
  padding: 0;
}
.formulario-default .lab-chbx input{
  margin-right: 10px;
}


.formulario-default input{
  display: block;
  float: left;
  height: 24px;
  padding: 5px 2%;
}
.formulario-default input:focus{
  outline: 0;
  border: 1px solid #d1d1d1;
}

.formulario-default .inp-Lg{
  width: 90%;
}
.formulario-default .inp-Md{
  width: 60%;
}
.formulario-default .inp-Sm{
  width: 30%;
}

.formulario-default .chbx{
  float: none;
  display: block;
  margin: 10px auto;
}


.formulario-default select{
  display: block;
  float: left;
  height: 34px;
  padding: 5px 2%;
}
.formulario-default .sel-Lg{
  width: 90%;
}
.formulario-default .sel-Md{
  width: 60%;
}
.formulario-default .sel-Sm{
  width: 30%;
}





.formulario-default textarea{
  display: block;
  float: left;
  font-size: 14px;
  font-family: 'Arial', Tahoma, Verdana;
  width: 74%;
  height: 100px;
  padding: 6px 4px;
}
.table-b textarea{
  display: block;
  float: left;
  font-size: 14px;
  font-family: 'Arial', Tahoma, Verdana;
  width: 74%;
  height: 100px;
  margin: 20px 3%;
  padding: 6px 10px;
}



.button{
  float: none !important;
  display: inline-block;
  cursor: pointer;
  color: #ffffff;
  font-size: 14px;
  font-family: 'Oswald-Bold', Arial,Tahoma;
  font-weight: 100;
  text-align: center;
  border: none;
  background: #0A3C65;
  height: 40px;
  margin: 0 3px !important;
  padding: 0 20px;
  -webkit-appearance: none;
}

.button-D{
  float: none !important;
  display: inline-block;
  cursor: pointer;
  color: #333333;
  font-size: 14px;
  font-family: 'Oswald', Arial,Tahoma;
  font-weight: 100;
  text-align: center;
  border: none;
  background: #e8e8e8;
  height: 40px;
  margin: 0 3px !important;
  padding: 0 20px;
  -webkit-appearance: none;
}


.formulario-default p{
  clear: both;
  overflow: hidden;
  position: relative;
  text-align: justify;
  margin: 18px auto;
}

/*             FORMULARIOS             */