.modal-full {
    min-width: 100%;
    margin: 0;
}

.modal-full .modal-content {
    min-height: 100vh;
}
.RayarActivo {
	/*touch-action: none;*/
	position: absolute;
	z-index: 5;
	/*z-index: 7;*/
}
.RayarInactivo {
	position: absolute;
	z-index: 5;
	/*z-index: 7;*/
}

.Subrayar{
	/*background-color: yellow;*/
   	/*opacity: 0.5;*/
   	z-index: 6;
   	position: absolute;
   	/*border-radius: 8px;*/
    padding: 8px;
    /*margin: 20px 10px;*/
    /*box-sizing: border-box;*/
    mix-blend-mode: multiply;
    -webkit-tap-highlight-color : rgba(0,0,0,0);
}
#idFavoritos{
    position: absolute;
    background: red;
    z-index: 1;
}
.IndiceSelector {
    padding: 8px;
}
/*Tool bar color*/
.pwColor {
    display: inline-block;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    margin-right: 5px;
    border: 2px solid transparent;
}
.pwColorSelector {
    list-style: none;
}
/***************/
/*Float buttuon*/
	 .float{
		position:fixed;
		bottom:40px;
		right:40px;
		display: none;
	}

	.my-float{
		margin-top:22px;
	}
	.btn-group a{
		width:60px;
		height:60px;
		background-color:#0C9;
		color:#FFF;
		border-radius:50px;
		text-align:center;
		box-shadow: 2px 2px 3px #999;
		margin-top:	18px;
		display: block; /* Make the buttons appear below each other */
	}
@media only screen and (max-width: 500px) {
	 .float{
		position:fixed;
		bottom:140px;
		right:16px;
		display: none;
	}

	.my-float{
		margin-top:12px;
	}
	.btn-group a{
		width: 39px;
	    height: 39px;
	    background-color: #0C9;
	    color: #FFF;
	    border-radius: 50px;
	    text-align: center;
	    box-shadow: 2px 2px 3px #999;
	    margin-top: 9px;
	    display: block;
	}
}
/****************/
.cuaderno {
	width:500px;
	/*overflow:auto;*/
	background-color:#FFF;
	color:#222;
	font-family:Courier, monospace;
	font-weight:normal;
	font-size:18px;
	resize:none;
	line-height:40px;
	padding-left:5px;
	padding-right:5px;
	padding-top:45px;
	padding-bottom:34px;
	/*background-image:url(https://static.tumblr.com/maopbtg/E9Bmgtoht/lines.png), url(https://static.tumblr.com/maopbtg/nBUmgtogx/paper.png);
	background-repeat:repeat-y, repeat;
	-webkit-border-radius:12px;
	border-radius:12px;
	-webkit-box-shadow: 0px 2px 14px #000;
	box-shadow: 0px 2px 14px #000;
	border-top:1px solid #FFF;
	border-bottom:1px solid #FFF;*/
}
.readProgressBar {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 8;
    height: 4px;
    width: 100%;
}
.progressTop {
    background-color: #f61111;
    height: 4px;
    -webkit-transition: height 0.3s;
  	transition: height 0.3s;
 }

.nextArticleModule.module {
	 position: fixed;
	 /*bottom: 30px;
	 right: 35px;*/
	 padding: 0;
	 /*background-color: transparent;*/
	 opacity: 0;
	 z-index: 2;
	 -webkit-transform-origin: 100% 100%;
	 -ms-transform-origin: 100% 100%;
	 transform-origin: 100% 100%;
	 display: none; 
}
@media (min-width: 0px) {
	.nextArticleModule.module {
  		display: block; 
  	} 
}
.nextArticleModule.module a img {
      border-radius: 50%;
      width: 100%;
      height: 100%;
}
@media (min-width: 768px) and (max-width: 1024px) {
  
  .nextArticleModule.module a {
		display: inline-block;
		width: 80px;
		height: 80px;
		position: relative; 
	}
}
@media (min-width: 320px) and (max-width: 480px) {

 .nextArticleModule.module a {
		display: inline-block;
		width: 50px;
		height: 50px;
		position: relative; 
	} 
  
}
.nextArticleModule.module a:hover .textOverlay {
	visibility: visible; 
}
.nextArticleModule.module a:hover img {
	visibility: hidden; 
}
.nextArticleModule.module a .textOverlay {
	position: absolute;
	top: 0;
	left: 0;
	background-color: #ee1d23;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	visibility: hidden;
}
.nextArticleModule.module a .textOverlay svg {
	width: 100%;
	height: 100%;
}
.nextArticleModule.module a img {
	border-radius: 50%;
	width: 100%;
	height: 100%;
}
.animateBounceIn {
  opacity: 0;
  animation-name: bounceIn;
  animation-duration: 450ms;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
}
.animateBounceOut {
  opacity: 0;
  animation-name: bounceOut;
  animation-duration: 350ms;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
}

@keyframes bounceIn {
  0%{
    opacity: 0;
    transform: scale(0.3) translate3d(0,0,0);
  }
  50%{
    opacity: 0.9;
    transform: scale(1.1);
  }
  80%{
    opacity: 1;
    transform: scale(0.89);
  }
  100%{
    opacity: 1;
    transform: scale(1) translate3d(0,0,0);
  }
}

@keyframes bounceOut {
  0%{
    opacity: 1;
    transform: scale(1) translate3d(0,0,0);
  }
  50%{
    opacity: 1;
    transform: scale(0.89);
  }
  80%{
    opacity: 0.9;
    transform: scale(0.5);
  }
  100%{
    opacity: 0;
    transform: scale(0.3) translate3d(0,0,0);
  }
}
/***Parallax************/
.parallaxbackup {
  position: relative;
  min-height: 100vh;
  width: 100%;
  transform-style: inherit;
  z-index: -1;
  perspective-origin-x: 100%;
  /*z-index: 2;*/
}
.parallaxbackup::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  display: block;
  background: url(parallax.jpg) top center;
  background-size: cover;
  /*transform: translateZ(-1px) scale(2);*/
  transform: translateZ(-2px) scale(3);
  min-height: 100%;
  /*z-index: -2;*/
  /*z-index: 3;*/
}
.textoParallaxbackup {
  /*font-size: 4rem;*/
  font-size: 8vw;
  text-align: center;
  position: absolute;
  padding: 1rem;
  background: #fafafa;
  box-shadow: 0 0 20px #333;
  top: 50%;
  left: 50%;
  transform: translateZ(-.3px) scale(1.3) translate(-35%, -35%);
  /*transform: translateZ(-1px) scale(2) translate(-25%, -25%);*/
  /*transform: translateZ(-1px) scale(2) translate(-25%, -25%);*/
}
/**********************/
/***Parallax2***********/
.parallax2backup {
  position: absolute;
  min-height: 100vh;
  width: 100%;
  transform-style: inherit;
  z-index: -1;
  perspective-origin-x: 100%;
  /*z-index: 2;*/
}
.parallax2backup::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  display: block;
  background: url(parallax.jpg) top center;
  background-size: cover;
  /*transform: translateZ(-1px) scale(2);*/
  transform: translateZ(-2px) scale(3);
  min-height: 100%;
  /*z-index: -2;*/
  /*z-index: 3;*/
}
.textoParallax2backup {
  /*font-size: 4rem;*/
  font-size: 8vw;
  text-align: center;
  position: absolute;
  padding: 1rem;
  background: #fafafa;
  box-shadow: 0 0 20px #333;
  top: 50%;
  left: 50%;
  transform: translateZ(-.3px) scale(1.3) translate(-35%, -35%);
  /*transform: translateZ(-1px) scale(2) translate(-25%, -25%);*/
  /*transform: translateZ(-1px) scale(2) translate(-25%, -25%);*/
}
/**********************/
@media (min-width: 768px) and (max-width: 1024px) {
	.circle{	
		border-radius: 50%;
		width: 50px;
		height: 50px; 
		/*position:absolute;*/
		bottom: 80px;
		right: 25px;
		position: fixed;
		background: rgb(255, 0, 0, 1);
		opacity:1;
		-webkit-transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
		   -moz-transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
		    -ms-transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
		     -o-transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
		        /*transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);*/
		        transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	}

	#iconBurbuja {
		color: white;
	    font-size: 40px;
	    position: absolute;
	    top: 18px;
	    left: 34px;
	}

}
@media (min-width: 320px) and (max-width: 480px) {
	.circle{	
		border-radius: 50%;
		width: 50px;
		height: 50px; 
		/*position:absolute;*/
		bottom: 80px;
		right: 25px;
		position: fixed;
		background: rgb(255, 0, 0, 1);
		opacity:1;
		-webkit-transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
		   -moz-transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
		    -ms-transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
		     -o-transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
		        /*transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);*/
		        transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	}

	#iconBurbuja {
		color: white;
	    font-size: 21px;
	    position: absolute;
	    top: 13px;
	    left: 22px;
	}
}
.expand{
	width:2500px;
	height:2500px;
	/*top: -560px;
	left: -565px;*/
	/*bottom: -388px;
	right: -300px;*/
	bottom: -676px;
	right: -900px;
	/*transform: translate3d(500px,500px,0px) scale(50)*/;
	position: fixed;
	-webkit-transition: all 400ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	   -moz-transition: all 400ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	    -ms-transition: all 400ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	     -o-transition: all 400ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	        /*transition: all 400ms cubic-bezier(0.000, 0.995, 0.990, 1.000);*/
	        transition: all 3500ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	
}
div.burger {
	/*height: 50px; 
	width: 50px;
	position: fixed;
	/*top: 11px; 
	left: 21px;
	z-index: 2;
	opacity: 1;*/

	width: 50px;
    height: 50px;
    bottom: 80px;
    right: 25px;
    position: fixed;
    padding: 0;
    z-index: 0;
    transform-origin: 100% 100%;
    align-items: center;
    justify-content: center;
    display: flex;
    opacity: 0;
}
div.x,
div.y,
div.z {
	position: absolute;
	margin: auto;
	top: 0px; 
	bottom: 0px;
	/*right:  0px;*/
	background: #fff;
	border-radius:2px;
	-webkit-transition: all 200ms ease-out;
	   -moz-transition: all 200ms ease-out;
	    -ms-transition: all 200ms ease-out;
	     -o-transition: all 200ms ease-out;
	        transition: all 200ms ease-out;
}		
div.x, div.y, div.z { height: 3px; width: 26px; z-index: 2 }
div.y{top: 18px;}
div.z{top: 37px;}
div.collapseClose{
	top: 20px;
	background:#ffffff;
	-webkit-transition: all 70ms ease-out;
	   -moz-transition: all 70ms ease-out;
	    -ms-transition: all 70ms ease-out;
	     -o-transition: all 70ms ease-out;
	        transition: all 70ms ease-out;
}
 

div.rotate30{
	-ms-transform: rotate(30deg); 
	-webkit-transform: rotate(30deg); 
    transform: rotate(30deg);	
	-webkit-transition: all 50ms ease-out;
	   -moz-transition: all 50ms ease-out;
	    -ms-transition: all 50ms ease-out;
	     -o-transition: all 50ms ease-out;
	        transition: all 50ms ease-out;					
}
div.rotate150{
	-ms-transform: rotate(150deg); 
	-webkit-transform: rotate(150deg); 
    transform: rotate(150deg);	
	-webkit-transition: all 50ms ease-out;
	   -moz-transition: all 50ms ease-out;
	    -ms-transition: all 50ms ease-out;
	     -o-transition: all 50ms ease-out;
	        transition: all 50ms ease-out;					
}

div.rotate45{
	-ms-transform: rotate(45deg); 
	-webkit-transform: rotate(45deg); 
    transform: rotate(45deg);	
	-webkit-transition: all 100ms ease-out;
	   -moz-transition: all 100ms ease-out;
	    -ms-transition: all 100ms ease-out;
	     -o-transition: all 100ms ease-out;
	        transition: all 100ms ease-out;					
}
div.rotate135{
	-ms-transform: rotate(135deg); 
	-webkit-transform: rotate(135deg); 
    transform: rotate(135deg);	
	-webkit-transition: all 100ms ease-out;
	   -moz-transition: all 100ms ease-out;
	    -ms-transition: all 100ms ease-out;
	     -o-transition: all 100ms ease-out;
	        transition: all 100ms ease-out;					
}

.textCirculo {
		font-size: 4vw;
	    color: white;
	    z-index: 2;
	    position: fixed;
	    width: 75%;
	    /*height: 200px;*/
	    position: fixed;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	    text-align: justify;
	    opacity: 0;
	    -webkit-transition: opacity 1s; /* Safari prior 6.1 */
	  	transition: opacity 1s;
	    display: none;
}
