body {font-family: 'Arial', Helvetica, sans-serif;
			font-size: 16px;
            line-height: 1.5;
		}
        
        p.a
        { color:black;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1.5;
        }
@media(max-width:900px){p.a{color:darkred;}}

  p.b
        { color:black;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1;
            letter-spacing: normal;
        }
@media(max-width:900px){p.b{color:whitesmoke;}}

p.c 
 { color:white;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1.5;
     font-size: 90%;
    text-align: center;
     padding: 10px;
     letter-spacing: normal;
        }
  p.d
        { color:black;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1;
            text-align: center;
            letter-spacing: 1px; 
            font-size:110%;
        }
  p.e
        { color:black;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1;
            text-align: center;
            letter-spacing: 1px; 
            font-size:160%;
            padding:10px;
             text-shadow: rgb(163, 65, 96) 0px 0px 5px, #FFF 0px 0px 10px, #FFF 0px 0px 15px, #FF2D95 0px 0px 20px, #FF2D95 0px 0px 30px, #FF2D95 0px 0px 40px, #FF2D95 0px 0px 50px, #FF2D95 0px 0px 75px;
        }
 p.s
        { color:white;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1.5;
            text-align: left;
            letter-spacing: 3px;
            padding:10px;
            text-transform: uppercase;
            font-size:80%;
           
        }
 p.zz
        { color:white;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1.5;
            text-align: center;
            letter-spacing: 3px;
            padding:10px;
            text-transform: uppercase;
            font-size:100%;
           
        }

 p.bcamp
        { color:white;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1.5;
            text-align: left;
            letter-spacing: 3px;
            padding:10px;
            text-transform: uppercase;
            font-size:80%;
         text-shadow: 0 0 5px #FFF, 0 0 12px #49ff18, 0 0 3px rgb(0, 21, 185), 0 0 34px rgb(5, 0, 1);
           
        }
 p.t
        { color:white;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1.5;
            text-align: center;
            letter-spacing: 3px;
            padding:10px;
            text-transform: uppercase;
            font-size:80%;
             text-shadow: rgb(163, 65, 96) 0px 0px 5px, #FFF 0px 0px 10px, #FFF 0px 0px 15px, #FF2D95 0px 0px 20px, #FF2D95 0px 0px 30px, #FF2D95 0px 0px 40px, #FF2D95 0px 0px 50px, #FF2D95 0px 0px 75px;
        }

span.line-through {
    text-decoration: line-through;
}

 p.store
        { color:white;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1.5;
            text-align: center;
            letter-spacing: 3px;
            padding:10px;
            text-transform: uppercase;
            font-size:100%;
            word-spacing: 30px;
            text-shadow: rgb(163, 65, 96) 0px 0px 5px, #FFF 0px 0px 10px, #FFF 0px 0px 15px, #FF2D95 0px 0px 20px, #FF2D95 0px 0px 30px, #FF2D95 0px 0px 40px, #FF2D95 0px 0px 50px, #FF2D95 0px 0px 75px;
        }

p.footer
        { color:white;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1.5;
            text-align: center;
            font-size: 80%;
            letter-spacing: 1px;
 text-shadow: 1px 1px 5px #2d55ff;
        }

@media(max-width:900px){p.b{color:whitesmoke;}}

p.foot
        { color:white;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1.5;
            text-align: left;
            padding-left: 20px;
            padding-right: 20px;
            font-size: 80%;
            letter-spacing: 1px;
        }


p.nested
        { color:black;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1.5;
        }
p.f
        { color:black;
            font-family: 'Arial', Helvetica, sans-serif;
            line-height: 1.5;
            text-align: justify;
            text-align:center;
            letter-spacing:3px;
        }

#neontext {
color: #FFFFFF;
background: #333333;
text-shadow: #FFF 0px 0px 5px, #FFF 0px 0px 10px, #FFF 0px 0px 15px, #FF2D95 0px 0px 20px, #FF2D95 0px 0px 30px, #FF2D95 0px 0px 40px, #FF2D95 0px 0px 50px, #FF2D95 0px 0px 75px;
color: #FFFFFF;
background: #333333;
}


body {font-size:120%;} 
@media(min-width:60em){body{font-size: 110%}}

        #content{
            display: grid;
            grid-template-columns: repeat(8, 1fr);
            grid-auto-rows: minmax(100px, auto);
            grid-gap: 10px;
            max-width: 960px;
            margin: 0 auto;
            grid-template-areas:
                "header header header header header header header header"
                "nav nav nav nav nav nav nav nav"
                "section section section section section section section section"
                "section section section section section section section section"
                "aside aside aside aside aside aside aside aside"
                "aside aside aside aside aside aside aside aside"
                "footer footer footer footer footer footer footer footer";


        }
        /* desktop grid */
        @media screen and (min-width: 760px){
    		#content{
    			display: grid;
    			grid-template-columns: repeat(8, 1fr);
    			grid-auto-rows: minmax(100px, auto);
    			grid-gap: 10px;
    			max-width: 960px;
    			margin: 0 auto;
                grid-template-areas:
                    "nav nav nav header header header header header"
                    "aside aside aside aside aside aside aside aside"
                   "aside aside aside aside aside aside aside aside"
                    "section section section section section section section section"
                    "section section section section section section section section"
                    "footer footer footer footer footer footer footer footer";
    		}
        }
		#content > *{
			padding: 10px;
		}

        header{
            grid-area: header;
             background:transparent;
        } 
        main{
            grid-area: main;
            background:transparent;
            align-self:center;
        }
        aside{
            grid-area: aside;
            background: transparent;
            align-self:center;
            transform: scale(0.9);
        }

        nav{
            grid-area: nav;
             background:transparent;
            align-self:center;
            border-radius: 10px;
             border: black solid 1px;
            box-shadow: 0 6px 9px 0 rgba(0, 0, 0, 0.7);
            transform:scale(0.9);
        }
@media(max-width:900px){nav {transform:scale(0.9);}} 

        section{
            grid-area: section;
            background:rgb(47, 53, 87);
        }

section2{
            grid-area: section2;
            background:rgba(226, 189, 176, 0.52);
    align-self: center;
        }
        footer{
            grid-area: footer;
            background: rgb(0, 0, 0) !important;
        }
        galleria{
            grid-area: galleria;
            background: rgb(240, 170, 143);
            border: 1px solid #fff;
        }
        galleria1 {
            grid-area: galleria1;
            background: rgb(244, 237, 164);
            border: 1px solid #fff;
        }
          galleria2 {
            grid-area: galleria2;
            background: #c1baba;
            border: 1px solid #fff;
        }
 galleria3 {
            grid-area: galleria3;
            background: rgb(244, 237, 164);
        }
 galleria4 {
            grid-area: galleria4;
            background: #f8cdcd;
        }


        .nested {
            display: grid;
            grid-template-columns: repeat (3,1 fr);
            grid-auto-rows: minmax(100px, auto);
    			grid-gap: 10px;
    			max-width: 960px;
    			margin: 0 auto;
            padding: 10px;
                grid-template-areas:
                    "galleria galleria1 galleria2"
                    "galleria galleria1 galleria2"
                 
}


* {
  box-sizing: border-box;
}

.column {
  float: left;
  width: 50%;
  padding: 10px;
}

/* Clearfix (clear floats) */
.row::after {
  content: "";
  clear:both;
  display:inline-block;
}



       
       h1 {
            font-family: 'Arial', Helvetica, sans-serif;
            padding: 10 px;
            margin: 0;
        }
h2 {
            font-family: 'Arial', Helvetica, sans-serif;
            border: 1px solid #fff;
            padding: 20 px;
            margin: 0;
        }


a.external:link {color: #f83030; font-weight: bold; }
a.external:visited {color: #c76cb1; font-weight: bold; }
a.external:hover {text-decoration: overline;}
a.external:active {color: #c44182; }

.myButton {
	-moz-box-shadow:inset 0px 1px 0px 0px rgba(223, 45, 255, 0.86);
	-webkit-box-shadow:inset 0px 1px 0px 0px rgba(223, 45, 255, 0.86);
	box-shadow:inset 0px 1px 0px 0px rgba(223, 45, 255, 0.86);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #184a81), color-stop(1, #1e62d0));
	background:-moz-linear-gradient(top, #184a81 5%, #1e62d0 100%);
	background:-webkit-linear-gradient(top, #184a81 5%, #1e62d0 100%);
	background:-o-linear-gradient(top, #184a81 5%, #1e62d0 100%);
	background:-ms-linear-gradient(top, #184a81 5%, #1e62d0 100%);
	background:linear-gradient(to bottom, #184a81 5%, #1e62d0 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#3d94f6', endColorstr='#1e62d0',GradientType=0);
	background-color:#3d94f6;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #337fed;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #1570cd;
}
.myButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #1e62d0), color-stop(1, #ffa9ff));
	background:-moz-linear-gradient(top, #1e62d0 5%, #ffa9ff 100%);
	background:-webkit-linear-gradient(top, #1e62d0 5%, #ffa9ff 100%);
	background:-o-linear-gradient(top, #1e62d0 5%, #ffa9ff 100%);
	background:-ms-linear-gradient(top, #1e62d0 5%, #ffa9ff 100%);
	background:linear-gradient(to bottom, #1e62d0 5%, #ffa9ff 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e62d0', endColorstr='#3d94f6',GradientType=0);
	background-color:#1e62d0;
}
.myButton:active {
	position:relative;
	top:1px;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #d01ec9), color-stop(1, #3d94f6));
	background:-moz-linear-gradient(top, #FF2D95 5%, #3d94f6 100%);
	background:-webkit-linear-gradient(top, #FF2D95 5%, #3d94f6 100%);
	background:-o-linear-gradient(top, #FF2D95 5%, #3d94f6 100%);
	background:-ms-linear-gradient(top, #FF2D95 5%, #3d94f6 100%);
	background:linear-gradient(to bottom, #FF2D95 5%, #3d94f6 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF2D95', endColorstr='#3d94f6',GradientType=0);
	background-color:#FF2D95;
}

.dot:before {
  content: ' \25CF';
  font-size: normal;
}


ul {
  list-style-type:none;
  margin:5;
    padding-left: 34px;
  overflow:hidden;
  background-color:black;
}
  


li {
  float:left;
     
}

li a {
  display:block;
  color: whitesmoke;
  text-align: center;
  padding: 10px 18px 8px 20px;
  text-decoration: none;
    font-family: 'Comfortaa', sans-serif;
}

li a:hover:not(.active){
  background-color: whitesmoke;
    color:black;
}

li a:active:{
  background-color:rgb(244, 237, 164);
  color: black;
    text-shadow: 0 0 3px #FF0000;
}
.active {
  background-color: rgb(244, 237, 164);
    color: black;
    text-shadow: 0 0 3px #FF0000;
}
 img {
   width: 100%;
     padding:10px;
 }

.cinta {
position: relative;
text-align: center;
display: inline-block; *display: inline;
}
.uno:before,
.dos:before, .dos:after,
.tres:before, .tres:after,
.cuatro:before, .cuatro:after {
content: "";
background: rgba(255, 238, 191, 0.72);
-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.4);
box-shadow: 0px 1px 3px rgba(0,0,0,0.4);
}

.dos:before {
width: 40px;
height: 90px;
position:absolute;
top: 20%;
margin-top: -80px;
}


.dos:before {
width: 40px;
height: 90px;
position:absolute;
top: 20%;
margin-top: -80px;
}
.dos:after {
width: 40px;
height: 70px;
position:absolute;
    left:90%;
top: 100%;
}
.dos:before {
left: 0px;
-webkit-transform: rotate(30deg);
-moz-transform: rotate(30deg);
transform: rotate(30deg);
    z-index:1;
}
.dos:after {
    -webkit-transform: rotate(40deg);
-moz-transform: rotate(40deg);
transform: rotate(40deg);
margin-top: -40px;
right: 10px;
}
.tres:before, .tres:after {
position:absolute;
    top:1;
}
.tres:before {
left: 0;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.tres:after {
top: inherit;
bottom: 4px;
right: 0;
    left:inherit;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.cuatro:before {
width: 40px;
height: 150px;
position:absolute;
top:20%;
    right:auto;
margin-top: -80px;
    z-index:1;
}
.cuatro:after {
width: 40px;
height: 150px;
position:absolute;
    left:auto;
top: 80%;
    z-index: :1;
}


.cuatro:before {
left: 0px;
-webkit-transform: rotate(3deg);
-moz-transform: rotate(3deg);
transform: rotate(3deg);
}
.cuatro:after {
margin-top: -60px;
right: 10px;
}

.cinta img {
border: 1px solid #ddd;
padding: 8px;
background: #fff;
  text-align:center;
  vertical-align:top;
-webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
-moz-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.8), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    transform: scale(0.96);
   position:
  z-index: -1;

       
}
    

img.header {
   width: 100%;
    object-fit: contain;
 }
@media(max-width:900px){img.header {transform:scale(0.9);}} 


.fill {object-fit: fill;}
.contain {object-fit: contain;}
.cover {object-fit: cover;}
.scale-down {object-fit: scale-down;}
.none {object-fit: none;}

}

/* smartphones, touchscreens */
@media (hover: none) and (pointer: coarse) {
    /* ... */
}
/* stylus-based screens */
@media (hover: none) and (pointer: fine) {
    /* ... */
}
/* Nintendo Wii controller, Microsoft Kinect */
@media (hover: hover) and (pointer: coarse) {
    /* ... */
}
/* mouse, touch pad */
@media (hover: hover) and (pointer: fine) {
    /* ... */
}

