@font-face {

	font-family: 'general';
    src: url('../imgs/swis721-cn-bt-roman.ttf');
    font-weight: normal;
    font-style: normal;
	color: white;
   
}

html {
	background-image: url("../imgs/FondoPromoX4N.jpg");

/*	background-color: #2a9e49;*/
	
}


.wrapper {
  display: flex;  
  flex-flow: row wrap;
  font-weight: bold;
  text-align: center;
  

}

.wrapper > * {
  padding: 10px,200px,10px,0px;
  flex: 1 100%;
  color: White;
  font-size: 1.8em;

  
   
}

.nombre {
   color: #000000;
     text-align: center;
    font-size: 2.5em;
  flex-flow: row wrap;
  font-weight: bold;

   }

.sala {
		color: #000022;*/

	/*color: #99fcf8;*/
   /*color: #0aede4;*/
     text-align: center;
    font-size: 1.8em;


   }
   
   .detalle {
   color: #000000;
     text-align: center;
    font-size: 1.0em;


   }

.footer {
color: #fae1c7;
     text-align: left;
	     font-size: 1.2em;
		 


}

.serv1 {
	  background-color: rgba(255, 255, 255, 0.9);

	 border-color: white;
  border-width: 3px;
  border-style: groove;
  
  border-radius: 25px;              /* 1 parámetro */
    border-radius: 25px;              /* 1 parámetro */
  border-radius: 25px;              /* 1 parámetro */
  border-radius: 25px;              /* 1 parámetro */
  padding: 10px 10px 10px 10px;
  margin-top: 20px;
}

.serv2 {
	  background-color: rgba(255, 255, 255, 0.9);

	 border-color: white;
  border-width: 3px;
  border-style: groove;
  
  border-radius: 25px;              /* 1 parámetro */
    border-radius: 25px;              /* 1 parámetro */
  border-radius: 25px;              /* 1 parámetro */
  border-radius: 25px;              /* 1 parámetro */
  padding: 10px 10px 10px 10px;
  margin-top: 20px;
}

.serv3 {
  background-color: rgba(0, 0, 0, 0.9);

 border-color: white;
border-width: 3px;
border-style: groove;

border-radius: 25px;              /* 1 parámetro */
  border-radius: 25px;              /* 1 parámetro */
border-radius: 25px;              /* 1 parámetro */
border-radius: 25px;              /* 1 parámetro */
padding: 10px 10px 10px 10px;
margin-top: 20px;
}

.main {
  text-align: center;
  
   color: #fff;
    font-size: 1.3em;
    font-weight: bold;
	

}

.aside-1 {

 
}

.aside-2 {
  
}

@media all and (min-width: 600px) {
  .aside { flex: 1 0 0; }
}

@media all and (min-width: 800px) {
  .main    { flex: 3 0px; }
  .aside-1 { order: 3; } 
  .main    { order: 2; }
  .aside-2 { order: 1; }
  .footer  { order: 4; }
}

body {
  padding: 2em; 
}
Resources