h1 {
    font-size: 30px;
    margin-bottom: 40px;
    display: block;
    margin-block-start: 0.67em;
    margin-block-end: 0.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

body {
    color: #333;
    font-family: 'Open Sans', sans-serif;
    margin: 0;
    padding: 0;
}

main {
    margin: 40px;
}

h1 {
     font-size: 30px;
     margin-bottom: 40px;
}

.button_container {
    border: 1px solid #ddd;
    margin: 0 10px 10px 0;
    padding: 20px;
    width: 300px;
    height: 300px;
    float: left;
    overflow: hidden;
    box-sizing: border-box;
    text-align: center;
}



a#btn_spotify {
    display: inline-block;
    height: 50px;
    box-sizing: border-box;
    border-radius: 25px;
    margin: auto;
    margin-top: 100px;
    padding: 10px 40px 0 40px;
    background-color: #2ebd59;
    border: 2px solid #2ebd59;
    color: #fff;
    font-size: 20px;
    font-family: 'Montserrat', sans-serif;
    text-decoration: none;
    transition: all .5s;
}

a#btn_spotify:hover {
    background-color: #fff;
    border: 2px solid #000;
    color: #000;
}

a#btn_amazon {
    display: block;
    width: 100px;
    height: 100px;
    box-sizing: border-box;
    border-radius: 50px;
    margin: auto;
    margin-top: 75px;
    padding-top: 8px;
    background-color: #232f3e;
    color: #fff;
    text-align: center;
    font-size: 60px;
    transition: all .2s;
}

a#btn_amazon:hover {
    background-color: #fc9a18;
}

a#btn_twitter {
    display: inline-block;
    height: 40px;
    box-sizing: border-box;
    border-radius: 4px;
    margin: auto;
    margin-top: 105px;
    padding: 10px 30px 0 30px;
    background-color: #56cdf1;
    color: #fff;
    font-size: 18px;
    font-family: 'Arial', sans-serif;
    font-weight: bold;
    text-decoration: none;
}

a#btn_twitter:hover {

   
    background: rgb(46,191,236); 
    background: -moz-linear-gradient(-45deg,  rgba(46,191,236,1) 0%, rgba(40,165,203,1) 100%); 
    background: -webkit-linear-gradient(-45deg,  rgba(46,191,236,1) 0%,rgba(40,165,203,1) 100%); 
    background: linear-gradient(135deg,  rgba(46,191,236,1) 0%,rgba(40,165,203,1) 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2ebfec', endColorstr='#28a5cb',GradientType=1 ); 

}


a#btn_indiegogo {
    display: inline-block;
    position: relative;
    margin:auto;
    margin-top: 100px;
    padding: 8px 16px;
    background-color: #fff;
    color: #eb1478;
    font-family: 'Ubuntu', sans-serif;
    font-size: 30px;
    font-weight: bold;
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: -2px;
    transition: all .2s;
}

a#btn_indiegogo:before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    z-index: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    background-color: #eb1478;
    transition: all .5s;
}

a#btn_indiegogo:hover {
    color: #fff;
}

a#btn_indiegogo:hover:before {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

a#btn_indiegogo span {
    position: relative;
    z-index: 10;
}






a#btn_lyft {
    display: inline-block;
    text-decoration: none;
    font-family: 'Righteous', cursive;
    color: #F504EE;
    font-size: 45px;
    margin-top: 85px;
    transition: all 0.4s;
}

a#btn_lyft:hover {
    background-color: #ff00f2;
    color: white;
    padding: 10px;
    box-shadow: 0 0 8px #533752;
    transition: background-color .1s, padding 0.4s, box-shadow 0.8s;
}



a#btn_hsn {
    display: inline-block;
    position: relative;
    margin:auto;
    margin-top: 70px;
    width: 100px;
    height: 100px;
    border-radius: 50px;
    color: white;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#c5deea+0,8abbd7+31,066dab+100;Web+2.0+Blue+3D+%231 */
background: #c5deea; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #c5deea 0%, #8abbd7 31%, #066dab 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #c5deea 0%,#8abbd7 31%,#066dab 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #c5deea 0%,#8abbd7 31%,#066dab 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c5deea', endColorstr='#066dab',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

    font-family: 'Montserrat', sans-serif;
    font-size: 25px;
    font-weight: 600;
    text-decoration: none;
    text-transform: uppercase;
    transform-origin: center;
}

#hsn {
    position: relative;
    top: 25px;
}

a#btn_hsn:hover #hsn {
    text-shadow: 2px 2px 2px rgb(85, 21, 74);
    transition: 0.5s;
}

#button-moo {
    font-size: 20px;
    font-family: 'Ubuntu', sans-serif;
    background-color: white;
    color: #303ca3;
    display: inline-block;
    box-sizing: border-box;
    text-decoration: none;
    border: 2px solid #6478ce; 
    height: 50px;
    margin: auto;
    margin-top: 100px;
    padding: 13px 20px 10px 20px;
    transition: all .3s;
    text-transform: uppercase;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);

}

#button-moo:hover {
    background-color: #85d8e7; 
    color: white;
    box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
}

#button-coke {
    font-size: 13pt;
    font-family: 'Montserrat', sans-serif;
   
    border-radius: 50px;
    color: #5f0a0a;
    display: inline-block;
    
    text-decoration: none;
   
    margin: auto;
    margin-top: 100px;
    padding: 30px 5px 50px 10px;


 
}

#button-coke:hover {
    
    
    color: #f40000;
    font-size: 20pt;
    
}

#button-mo-garden {
    font-size: 20px;
    font-family: 'Righteous', cursive;
    font-style: normal;
    background-color: rgb(255, 255, 255);
    border: 4px rgb(0, 63, 0);
    color: rgb(39, 65, 39);
    font-weight: bold;
    display: inline-block;
    box-sizing: border-box;
    text-decoration: none;
    height: 80px;
    width: 230px;
    margin: auto;
    margin-top: 100px;
    padding: 13px 20px 10px 20px;
    
}

#button-mo-garden:hover {
    background: rgb(181, 192, 181);;
   
    color: white;
    border: green;
    font-style: italic;
    text-shadow: 2px 2px 2px rgb(8, 43, 11);
    transition: 1s;
}

#button-ideo {
    font-size: 30px;
    font-family: 'Space Mono', monospace;
    background-color: white;
    border: 1px solid #333333;
    color: #000000;
    display: inline-block;
    box-sizing: border-box;
    text-decoration: none;
    height: 50px;
    width: 80px;
    margin: auto;
    margin-top: 100px;
    padding: 13px 20px 10px 20px;
    transition: all .2s;
    

    
}

#button-ideo:hover {
    font-size: 30px;
    height: 90px;
    width: 110px;
    border: 1px solid #333333;
    text-transform: uppercase;
}

#button-nike {
    font-size: 25px;
    font-family: 'Oswald', sans-serif;
    font-style: italic;
    background-color: #000000;
    border: 2px solid #000000;
    color: rgb(255, 255, 255);
    display: inline-block;
    box-sizing: border-box;
    text-decoration: none;
    text-transform: uppercase;
    height: 50px;
    margin: auto;
    margin-top: 100px;
    padding: 10px 20px 10px 18px;
    font-weight: bold;
    transition: all .5s;

}

#button-nike:hover {
    color: rgb(0, 0, 0);
    background-color: white;
}

#button-color-run {
    font-size: 25px;
    text-transform: uppercase;
    font-family: Arial, Helvetica, sans-serif;
   /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fcecfc+0,fba6e1+50,fd89d7+51,ff7cd8+100;Pink+Gloss+%232 */
background: #fcecfc; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #fcecfc 0%, #fba6e1 50%, #fd89d7 51%, #ff7cd8 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #fcecfc 0%,#fba6e1 50%,#fd89d7 51%,#ff7cd8 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #fcecfc 0%,#fba6e1 50%,#fd89d7 51%,#ff7cd8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcecfc', endColorstr='#ff7cd8',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

    color: white;
    border: 2px solid #ffffff;
    border-radius: 50px;
    text-shadow: 1px 1px 16px rgb(150 150 150);
    display: inline-block;
    box-sizing: border-box;
    text-decoration: none;
    height: 70px;
    width: 200px;
    margin: auto;
    margin-top: 100px;
    padding-top: 17px;
}

#button-color-run:hover {
    color: #4962cd;
    background: white;
    border: 2px solid #4962cd;
    text-shadow: none;
}


#button-new-yorker {
    font-size: 15pt;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-style: italic;
    color: #27113a;
    display: inline-block;
    box-sizing: border-box;
    text-decoration: none;
    height: 50px;
    width: 179px;
    text-align: left;
    margin: auto;
    margin-top: 100px;
    transition: all .4s;
    padding-top: 12px;
    padding-left: 10px;
}

#button-new-yorker:hover {
    letter-spacing: 3px;
}

#button-army {
    font-size: 20pt;
    font-family: Arial, Helvetica, sans-serif;
    font-style: normal;
    color: #440918;
    display: inline-block;
    box-sizing: border-box;
    text-decoration: none;
   
    text-align: left;
    margin: auto;
    margin-top: 100px;
    transition: all .4s;
    padding-top: 12px;
    padding-left: 10px;
}

#button-army:hover {
    font-weight: bold;
    background: white;
   
    color: #ff0606;
}


#button-harley {
    font-size: 15pt;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    background-color: #110b46;
    color: #ffffff;
    display: inline-block;
    box-sizing: border-box;
    text-decoration: none;
    height: 50px;
    width: 179px;
    text-align: left;
    margin: auto;
    margin-top: 100px;
    transition: all .4s;
    padding-top: 12px;
    padding-left: 10px;
    border-radius: 15px;
}

#button-harley:hover {
    font-style: italic;
    background-color: #3326a8;
}

#button-facebook {
    font-size: 20px;
    font-family: 'Arial', sans-serif;
    font-weight: bold;
    text-decoration: none;
    display: inline-block;
    height: 40px;
    box-sizing: border-box;
    border-radius: 4px;
    margin: auto;
    margin-top: 105px;
    padding: 10px 30px 0 30px;
    background-color: #1a77f2;
    color: rgb(255, 255, 255);
    text-transform: lowercase;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    
}

#button-facebook:hover {
    background-color: #11315c;
    text-shadow: 2px 2px 2px rgb(8, 43, 11);
}

#button-apple {
    font-size: 20px;
    font-family: 'Inter', sans-serif;
    font-style: Bold;
    background-color: #ffffff;
    border: 2px solid #d6d6d6;
    color: #000000;
    display: inline-block;
    box-sizing: border-box;
    text-decoration: none;
    height: 50px;
    border-radius: 25px;
    margin: auto;
    margin-top: 100px;
    padding: 10px 20px 10px 20px;
    transition: all .5s;

}

#button-apple:hover {
    color: #ffffff;
    background-color: rgb(22, 20, 20);
    border: 2px solid #d6d6d6;
    letter-spacing: 1px;
}


#button-pottermore {
    font-size: 30px;
    font-family: 'Inter', sans-serif;
  
    background: #fceabb; /* Old browsers */
    background: -moz-linear-gradient(-45deg,  #fceabb 0%, #fccd4d 50%, #f8b500 51%, #fbdf93 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    
    border: 5px;
    border-radius: 5px;
    color: rgb(255, 255, 255);
    font-weight: bold;
    display: inline-block;
    box-sizing: border-box;
    text-decoration: none;
    height: 70px;
    width: 200px;
    margin: auto;
    margin-top: 100px;
    padding: 13px 20px 10px 20px;
}

#button-pottermore:hover {
  
    color: rgba(90, 63, 45, 0.37);
  
}

#button-tonight-show {
    font-size: 20pt;
    font-family: 'Oswald', sans-serif;
    font-weight: bold;
    background-color: #041125;
    
    color: #ffffff;
    display: inline-block;
    box-sizing: border-box;
    text-decoration: none;
   
    text-align: left;
   
    margin: auto;
    margin-top: 100px;
    padding: 13px 20px 10px 20px;
}

#button-tonight-show:hover {
    background-color: #5d688b;
    color: #ffffff;
    text-shadow: 2px 2px 2px rgb(8, 43, 11);
}

#button-pastaria {
    display: inline-block;
    height: 50px;
    box-sizing: border-box;
    
    margin: auto;
    margin-top: 100px;
    padding: 10px 40px 0 40px;
    background-color: #802662;
    border: 5px solid #802662;
    color: #fff;
    font-size: 20px;
    font-family: 'Montserrat', sans-serif;
    text-decoration: none;
    transition: all .5s;
}

#button-pastaria:hover {
    background-color: #fff;
    border: 2px solid #000;
    color: #000;
}

a#btn_samsung {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    box-sizing: border-box;
    margin: auto;
    margin-top: 100px;
    padding: 10px 30px;
    background:#12279e;
    border-radius: 25px;
    border: 1px solid #12279e;
    color: white;
    font-size: 28px;
    font-family: 'Samsung Sharp Sans Medium', sans-serif;
    font-weight: normal;
    text-decoration: none;
    transition: all .3s;
}

a#btn_samsung:hover{
    background-color: transparent;
    color: #12279e;
   
}
a#btn_craigslist {
    display: inline-flex;
    position: relative;
    justify-content: center;
    align-items: center;
    margin-top: 100px;
    font-family: 'Times New Roman', Times, serif;
    color: #1a80a8;
    width: 200px;
    height: 50px;
    padding: 10px 20px;
    text-decoration: none;
    font-size: 24pt;
    transition: all 0.3s;
    text-transform: uppercase;

}

a#btn_craigslist:hover {
    filter: blur(2px);
}

a#btn_stjude {
    display: inline-flex;
    position: relative;
    justify-content: center;
    align-items: center;
    width:170px;
    height: 55px;
    box-sizing: border-box;
    margin: auto;
    margin-top: 100px;
    border-radius: px;
    background-color: rgba(128, 126, 168, 0.15);
    padding: 5px 20px;
    color: #28263f;
    font-family: 'bluu', serif;
    font-size: 16pt;
    text-decoration: none;
    transition: all .3s;
    animation: floating 3s ease-in-out infinite;   
    }
    
    @keyframes floating {
    0% { transform: translate(0,  0px); }
    50%  { transform: translate(0, 10px); }
    100%   { transform: translate(0, 0px); }   
    }
    

  a#btn_stjude:hover {
    color: white;
    background-color: #4F4C8D;
    text-shadow: 0 0 10px #ffffff, 0 0 8px #6965B0;
    animation-play-state: paused;
}



a#btn_fitbit {
    display: inline-flex;
    position: relative;
    justify-content: center;
    align-items: center;
    width: 200px;
    height: 55px;
    box-sizing: border-box;
    margin: auto;
    margin-top: 100px;
    border-radius: 10px;
    background-color: rgb(255, 255, 255);
    padding: 5px 20px;
    color: #4F4C8D;
    font-family: 'bluu', serif;
    font-size: 16pt;
    text-decoration: none;
    transition: all .3s;
    animation: floating 3s ease-in-out infinite;
   
 }

 @keyframes floating {
    0% { transform: translate(0,  0px); }
    50%  { transform: translate(0, 10px); }
    100%   { transform: translate(0, 0px); }   
}


 a#btn_fitbit:hover {
   
    color: white;
    background-color: #ffffff;
    text-shadow: 0 0 10px #946ac5, 0 0 8px #6965B0;
    animation-play-state: paused;
 }