* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}



.section-menu {
	
	
  color: #fff;
  background-color: #000000 ;
  
  padding: 20px 0;
  display: flex;
  justify-content: space-around ; 
  flex-direction: column;
   
   font-size : 80% ;
}

.section {
  width: 100%;
  height: 500px;
  display: flex;
  justify-content: center;
  align-items: center;
}


img{
     width : 95% ;
     height : auto ;
     }
     
video{
     width : 95% ;
     height : auto ;
     }

.feature-1 {
  justify-content: space-around;
  align-items: center;
  flex-direction : column ;

  padding-left: 20px;
  padding-right: 20px;
 
}


.feature-2 {
   text-align: center;

   }

.feature-3 {
   justify-content: space-around;
  align-items: center;
   flex-direction : column ;

  padding-left: 20px;
  padding-right: 20px;
}


.feature-4 {
   justify-content: space-around;
  align-items: center;
   flex-direction : column ;
  
     padding-left: 20px;
  padding-right: 20px;

}

.feature-5 {

	  text-align: center

}


.feature-6 {
     justify-content: space-around;
  align-items: center;
   flex-direction : column ;
   
    padding-left: 20px;
  padding-right: 20px;
}

.feature-7{
   justify-content: space-around;
  align-items: center;
   flex-direction : column ;
  
    padding-left: 20px;
  padding-right: 20px;
  
}


.feature-8{

 text-align: center ;

}

.feature-9 {
    justify-content: space-around;
  align-items: center;
   flex-direction : column ;
  
    padding-left: 20px;
  padding-right: 20px;
}

.feature-10 {
   justify-content: space-around;
  align-items: center;
   flex-direction : column ;
  
      padding-left: 20px;
  padding-right: 20px;
}


.feature-11 {
    text-align: center;
}


.feature-12 {
   justify-content: space-around;
  align-items: center;
   flex-direction : column ;
  

  padding-left: 20px;
  padding-right: 20px;
  
}

.feature-13 {
   text-align: center;
}


.feature-14 {
   flex-direction : column ;
 text-align: center;
}


.feature-15 {
   justify-content: space-around;
  align-items: center;
   flex-direction : column ;
    
 padding-left: 20px;
  padding-right: 20px;

}

.feature-16 {
   text-align: center ;
    flex-grow : 3 ;
}


.header {
  background-color:  #C74350;
}

nav {
  display : flex;
  justify-content: space-around;
}

nav a      { text-decoration: none;
  height: 50px;
  line-height: 50px; 
 background: #000000 ;
	 color : #FFFFFF ;}
	 
	 nav a:hover {
    text-decoration: none;
	 background : #C74350 ;
}

 .active{
   background: #C74350;
}


.principal  a {
	 color : #C74350;}


.principal {
  
  display: flex;
  flex-wrap: wrap;
  
    font-size : 80% ;
}



.feature-1 {
  background-color: GhostWhite ;
}

.feature-2 {
  background-color: Gainsboro  ;
}

.feature-3 {
  background-color: Beige  ;
}

.feature-4 {
  background-color:  LightGrey    ;
}

.feature-5 {
  background-color: GhostWhite   ;
}

.feature-6 {
  background-color: Gainsboro  ;
}


.feature-7 {
  background-color: Beige ;
}

.feature-8 {
  background-color: LightGrey   ;
}

.feature-9 {
  background-color: GhostWhite  ;
}

.feature-10 {
  background-color: Gainsboro ;
}

.feature-11 {
  background-color: Beige  ;
}

.feature-12 {
  background-color: LightGrey  ;
}

.feature-13 {
  background-color: GhostWhite ;
}

.feature-14 {
  background-color: Gainsboro ;
}

.feature-15 {
  background-color: Beige ;
}

.feature-16 {
  background-color: LightGrey  ;
}


.footer {
  height: 100px;
  justify-content: center;
  align-items: center;
  order: 20;
}






/* Mobile Styles */
@media only screen and (max-width: 400px) {

.principal {
     }
	
		nav {
  display : flex;
  flex-direction : column  ;
  align-self :center ;
}

  .section-menu {
   height: 380px;
}

.section {
  height: 500px;
}

.footer {
  height: 100px;
}
	
}


/* Tablet Styles */
@media only screen and (min-width: 401px) and (max-width: 960px) {


.principal {
     font-size : 80% ;
     }
	
nav {
  display : flex;
  flex-direction : column  ;
  align-self :center ;
}

  .section-menu {
   height: 400px;
}

.section {
  height: 660px;
}

.footer {
  height: 100px;
}


  .sign-up,
  .feature-1,
  .feature-2,
  .feature-3,
  .feature-4,
  .feature-5,
  .feature-6,
  .feature-7, 
  .feature-8,
  .feature-9,
  .feature-10,
  .feature-11,
  .feature-12,
  .feature-13,
  .feature-14,
  .feature-15,
  .feature-16  { 
    width: 50%;
  }

}

/* Desktop Styles */
@media only screen and (min-width: 961px) {
  .page {
    width: 960px;
    margin: 0 auto;
  }
  
  .section-menu {
   height: 180px;
}

.section {
  height: 480px;
}

.footer {
  height: 100px;
}

  .feature-1,
  .feature-2,
  .feature-3,
  .feature-4,
  .feature-5,
  .feature-6,
  .feature-7, 
  .feature-8,
  .feature-9,
  .feature-10,
  .feature-11,
  .feature-12,
  .feature-13,
  .feature-14,
  .feature-15,
  .feature-16  {
    width: 33.3%;
  }


}






