@font-face {font-family: 'Poppins-Light';src: url('../fonts/poppins-light.ttf') format('truetype');font-display: swap;}
@font-face {font-family: 'Metamorphous';src: url('../fonts/metamorphous-regular.ttf') format('truetype');font-display: swap;}
*,*::before,*::after {box-sizing: border-box;margin: 0;padding: 0;}
html, body {margin:0 auto;padding:0;}
body {text-align: center;font-family: "Poppins-Light", sans-serif;color: #222;margin: 0;background: url(../img/backspidergratis.webp);background-repeat: repeat;}
p {margin:6px;color:#59595b;font-size: 18px;text-aling:justify;line-height:1.8rem;}
p:last-of-type {margin-bottom: 0;}
h1,h2 {margin: 2rem 0 1.38rem;font-family: "Lucida Calligraphy Italic", sans-serif;font-weight: 400;line-height: 1.3;}
h1 {font-size: 2.2rem;}
h2 {font-size: 2.441rem;}
a:link, a:visited, a:active {text-decoration:none;}
small,.text_small {font-size: 1.8rem;}
.responsive {width: 100%;height: auto;padding:40px;}
.logo {width: 100%;height: auto;max-width: 120px; margin: 18px;}
.ad {margin:50px 0 30px 0; text-align:center;}
a{text-align:center;margin: 10px auto;color: #2c3e50;}
.active {visibility: visible !important;opacity: 1 !important;}
@media only screen and (max-width: 600px) {h1 {font-size: 2.652rem;}}
#contenedor {margin: 10px auto;max-width: 1000px;}
.wrapper {margin: 10px auto;padding: 20px;max-width: 1000px;display: grid;grid-gap: 20px;grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));grid-auto-flow: dense;border-radius: 5px;border:solid 1px #4d8e5a;background-color:rgba(218, 213, 168, 0.7);}
.container {max-width:1000px;margin: 10px auto;padding:20px;align-content: center;margin-top:50px;border-radius: 5px;border:solid 1px #4d8e5a;background-color:rgba(218, 213, 168, 0.7);}
.container p {text-align:justify;}
.scrollToTop{width:64px; height:64px;padding:10px;position:fixed;bottom:50px;right:30px;display:none;background: url("../img/top.png") no-repeat;opacity:0.7;}
.scrollToTop:hover{text-decoration:none;opacity:1;}
.page {border:solid 1px #4d8e5a;max-width:1000px;height:100%;margin: 0 auto;text-align:center;padding: 10px 10px;position:relative;z-index:2;border-radius: 8px;background-color:rgba(218, 213, 168, 0.7);-webkit-box-shadow: 0px -2px 11px 1px rgba(181,175,181,0.59);-moz-box-shadow: 0px -2px 11px 1px rgba(181,175,181,0.59);box-shadow: 0px -2px 11px 1px rgba(181,175,181,0.59);}
.iframe-container {position: relative;overflow: hidden;padding-top: 68.25%;background:#67030f;}
.iframe-container iframe {position: absolute;top:0;left:0;height: 100%;width: 100%;border:none;}
.content {width: 100%;max-width: 700px;height: 100%;margin: 0 auto;}
.adholder {width: 100%;overflow: hidden;position: absolute;top: 550px;left: 0;z-index:1;}
.adinner {max-width:1120px;margin:auto;}
.adright, .adleft {width:300px;position: relative;margin:0;float:left;height:auto;overflow: hidden;display:inline;}
.adright {float:right;left:300px;}
.adleft {left:-300px;text-align:right;}
.fixed{height:600px;width:300px;overflow: hidden;}
.play-btn-video {position:absolute;z-index:666;top:50%;left:50%;transform:translate(-50%, -50%);border:0;width:406px;height:437px;background: transparent;}
.play-btn-video:hover {cursor:pointer;width:426px;height:459px;}
.play-btn-video:focus {outline:0;}
.page-footer {padding: 10px;text-align:center;font-weight: 300;color:#52440a;font-size: 16px;margin:50px 0}
.active {visibility: visible !important;opacity: 1 !important;}
#portfolio {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;width:23%;margin:1%;display:none;float:left;overflow:hidden;
-webkit-box-shadow: 0px 0px 4px 0px rgba(110,106,110,0.59);-moz-box-shadow: 0px 0px 4px 0px rgba(110,106,110,0.59);box-shadow: 0px 0px 4px 0px rgba(110,106,110,0.59);}
.portfolio-wrapper {overflow:hidden;position: relative !important;background: #fff;cursor:pointer;padding:3px;}
.portfolio img {display: block;width: 100%;margin: 0;-webkit-transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1);transition:all 600ms cubic-bezier(0.645, 0.045, 0.355, 1);	}
.portfolio .label {position: absolute;width: 100%;height:auto;bottom: -200px;-webkit-transition:all 300ms cubic-bezier(0.645, 0.045, 0.355, 1);transition:all 300ms cubic-bezier(0.645, 0.045, 0.355, 1);}
.portfolio .label-bg {background: #fff;opacity: 0.8;width: 100%;height:100%;position: absolute;top:0;left:-3px;}
.portfolio .label-text {color:#322802;position: relative;z-index:500;padding:5px 8px;font-size:14px;font-family:"tahoma";font-weight:normal;}
.portfolio:hover .label {bottom:0;}
.icon {position: absolute;right: 8px;bottom: 8px;width: 32px;height: 32px;}
#portfolio:hover {-webkit-box-shadow: 0px 0px 25px 0px rgba(110,106,110,0.70);-moz-box-shadow: 0px 0px 25px 0px rgba(110,106,110,0.70);box-shadow: 0px 0px 25px 0px rgba(110,106,110,0.70);transform: translateY(-2px);}
.brown  {height: auto;width: 100%;font-size: 18px;text-indent: 5px;margin:0;padding:10px 0 10px 0;color: white;line-height: 150%;text-alignalign:center;
overflow:hidden;white-space:nowrap;text-overflow: ellipsis; font-size:16px;font-weight: 100;font-family: 'Raleway', Arial, sans-serif;}
.brown {background-image: linear-gradient(to bottom, #bc9703, #9c7d02, #856b02, #695401, #3e3201);}
.ribbon {background-color: #f4f5d1;overflow:hidden;white-space:nowrap;text-align: center;font-size:12px;height:12px;}
/* #Tablet (Portrait) */
@media only screen and (min-width: 1099px) and (max-width: 1200px) {.container {width: 96%; }}
/*  #Mobile (Portrait) - Note: Design for a width of 320px */
@media only screen and (min-width: 760px) and (max-width: 1099px) {.container { width: 96%; }#portfolio {width:31.3%;}}
/* #Mobile (Landscape) - Note: Design for a width of 480px */
@media only screen and (min-width: 401px) and (max-width: 759px) {.container {width: 100%;}#portfolio {width:48%;margin:1%;}}
@media only screen and (min-width: 300px) and (max-width: 400px) {.container {width: 100%;}#portfolio {width:98%;margin:1%;}}
@media (max-width: 1200px) {.scrollToTop,.adholder,.alineadoTextoImagenArriba {display: none;}}

.facebook-share-btn {background-image: url('../img/icons/facebook-icon.png');background-repeat: no-repeat;display: inline-block;width: 42px;height: 42px;background-size: contain;margin-right: 10px;margin-top:20px;}
.x-share-btn {background-image: url('../img/icons/x-icon.png');background-repeat: no-repeat;display: inline-block;width: 42px;height: 42px;background-size: contain;margin-right: 10px;}
.whatsapp-share-btn {background-image: url('../img/icons/whatsapp-icon.png');background-repeat: no-repeat;display: inline-block;width: 42px;height: 42px;background-size: contain;margin-right: 10px;}
.telegram-share-btn {background-image: url('../img/icons/telegram-icon.png');background-repeat: no-repeat;display: inline-block;width: 42px;height: 42px;background-size: contain;margin-right: 10px;}
.favorite-btn {background-image: url('../img/icons/favorite-icon.png');background-repeat: no-repeat;display: inline-block;width: 42px;height: 42px;background-size: contain;}
.facebook-share-btn:hover, .x-share-btn:hover, .whatsapp-share-btn:hover, .telegram-share-btn:hover, .favorite-btn:hover {opacity: 0.5;cursor: pointer;}