/* Responsive Full Background Image Using CSS
*/
body {
  /* Location of the image */
  background-image: url(img/background-1.jpg);
  
  /* Image is centered vertically and horizontally at all times */
  background-position: center center;
  
  /* Image doesn't repeat */
  background-repeat: no-repeat;
  
  /* Makes the image fixed in the viewport so that it doesn't move when 
     the content height is greater than the image height */
  background-attachment: fixed;
  
  /* This is what makes the background image rescale based on its container's size */
  background-size: 100% 100%;
  
  /* Pick a solid background color that will be displayed while the background image is loading */
  background-color:#464646;
  
}

  #container {
    width:100%;
    text-align:center;
}

#left {
    float:left;
    width:100px;
}

#center {
    display: inline-block;
    margin:0 auto;
    width:100px;
}

#right {
    float:right;
    width:48%;
    text-align: center;
}

.btn{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f7f7f7+0,e6e6e6+59 */
background: rgb(247,247,247); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(247,247,247,1) 0%, rgba(230,230,230,1) 59%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(247,247,247,1) 0%,rgba(230,230,230,1) 59%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(247,247,247,1) 0%,rgba(230,230,230,1) 59%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#e6e6e6',GradientType=0 ); /* IE6-9 */


-webkit-box-shadow: 4px 3px 9px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 4px 3px 9px 0px rgba(0,0,0,0.75);
box-shadow: 4px 3px 9px 0px rgba(0,0,0,0.75);

  /*Transición de sombra*/
  -webkit-transition: all 400ms ease;
  -moz-transition: all 400ms ease;
  -ms-transition: all 400ms ease;
  -o-transition: all 400ms ease;
  transition: all 400ms ease;
}

.btn:hover{
  background-position: 0 -105px;
}


/* For mobile devices */
@media only screen and (max-width: 767px) {
  body {
    /* The file size of this background image is 93% smaller
     * to improve page load speed on mobile internet connections */
    background-image: url(img/background-photo-mobile-devices.jpg) no-repeat;
   }
     
  #container {
    width:100%;
    text-align:center;
    display: block;
}
     #right {
    float:right;
    width: 95%;
    text-align: center;
}
  }