.button-blue {
   border-top: 1px solid #96d1f8;
   background: #1873c7;
   background: -webkit-gradient(linear, left top, left bottom, from(#1873c7), to(#84b8e3));
   background: -webkit-linear-gradient(top, #1873c7, #84b8e3);
   background: -moz-linear-gradient(top, #1873c7, #84b8e3);
   background: -ms-linear-gradient(top, #1873c7, #84b8e3);
   background: -o-linear-gradient(top, #1873c7, #84b8e3);
   padding: 15px 30px;
   -webkit-border-radius: 9px;
   -moz-border-radius: 9px;
   border-radius: 9px;
   -webkit-box-shadow: rgba(2,2,2,1) 0 1px 0;
   -moz-box-shadow: rgba(2,2,2,1) 0 1px 0;
   box-shadow: rgba(2,2,2,1) 0 1px 0;
   text-shadow: rgba(2,2,2,.4) 0 1px 0;
   color: white;
   font-size: 18px; 
   font-family: Segoe UI, Georgia, Serif;
   text-decoration: none;
   vertical-align: middle;
   }
.button-blue:hover {
   border-top-color: #ffffff;
   background: #ffffff;
   color: #0068bd;
   text-decoration: none;
   }
.button-blue:active {
   border-top-color: #ffffff;
   background: #ffffff;
   }

.button-red {
   border-top: 1px solid #fab6b6;
   background: #e82626;
   background: -webkit-gradient(linear, left top, left bottom, from(#e82626), to(#ed9c9c));
   background: -webkit-linear-gradient(top, #e82626, #ed9c9c);
   background: -moz-linear-gradient(top, #e82626, #ed9c9c);
   background: -ms-linear-gradient(top, #e82626, #ed9c9c);
   background: -o-linear-gradient(top, #e82626, #ed9c9c);
   padding: 15px 30px;
   -webkit-border-radius: 9px;
   -moz-border-radius: 9px;
   border-radius: 9px;
   -webkit-box-shadow: rgba(2,2,2,1) 0 1px 0;
   -moz-box-shadow: rgba(2,2,2,1) 0 1px 0;
   box-shadow: rgba(2,2,2,1) 0 1px 0;
   text-shadow: rgba(2,2,2,.4) 0 1px 0;
   color: white;
   font-size: 18px;
   font-family: Segoe UI, Georgia, Serif;
   text-decoration: none;
   vertical-align: middle;
   }
.button-red:hover {
   border-top-color: #ffffff;
   background: #ffffff;
   color: #e00404;
   text-decoration: none;
   }
.button-red:active {
   border-top-color: #ffffff;
   background: #ffffff;
   }

.button-black {
   border-top: 1px solid #cccccc;
   background: #000000;
   background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#636363));
   background: -webkit-linear-gradient(top, #000000, #636363);
   background: -moz-linear-gradient(top, #000000, #636363);
   background: -ms-linear-gradient(top, #000000, #636363);
   background: -o-linear-gradient(top, #000000, #636363);
   padding: 15px 30px;
   -webkit-border-radius: 9px;
   -moz-border-radius: 9px;
   border-radius: 9px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 18px;
   font-family: Segoe UI, Georgia, Serif;
   text-decoration: none;
   vertical-align: middle;
   }
.button-black:hover {
   border-top-color: #ffffff;
   background: #ffffff;
   color: #000000;
   text-decoration: none;
   }
.button-black:active {
   border-top-color: #ffffff;
   background: #ffffff;
   }   

.button-black-small {
   border-top: 1px solid #cccccc;
   background: #636363;
   background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#636363));
   background: -webkit-linear-gradient(top, #000000, #636363);
   background: -moz-linear-gradient(top, #000000, #636363);
   background: -ms-linear-gradient(top, #000000, #636363);
   background: -o-linear-gradient(top, #000000, #636363);
   padding: 6.5px 13px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 16px;
   font-family: Segoe UI, Georgia, Serif;
   text-decoration: none;
   vertical-align: middle;
   }
.button-black-small:hover {
   border-top-color: #ffffff;
   background: #ffffff;
   color: #000000;
   text-decoration: none;
   }
.button-black-small:active {
   border-top-color: #ffffff;
   background: #ffffff;
   }   

.button-portal-tiny-blue {
   border-top: 1px solid #96d1f8;
   background: #1873c7;
   background: -webkit-gradient(linear, left top, left bottom, from(#1873c7), to(#65a9d7));
   background: -webkit-linear-gradient(top, #1873c7, #65a9d7);
   background: -moz-linear-gradient(top, #1873c7, #65a9d7);
   background: -ms-linear-gradient(top, #1873c7, #65a9d7);
   background: -o-linear-gradient(top, #1873c7, #65a9d7);
   padding: 3px 6px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   
   text-decoration: none;
   vertical-align: middle;
   }
.button-portal-tiny-blue:hover {
   border-top-color: #fff;
   background: #fff;
   color: #1873c7;
   text-decoration: none;
   }
.button-portal-tiny-blue:active {
   border-top-color: #fff;
   background: #fff;
   }

.button-portal-tiny-black {
   border-top: 1px solid #aaa;
   background: #444;
   background: -webkit-gradient(linear, left top, left bottom, from(#bbb), to(#444));
   background: -webkit-linear-gradient(top, #bbb, #444);
   background: -moz-linear-gradient(top, #bbb, #444);
   background: -ms-linear-gradient(top, #bbb, #444);
   background: -o-linear-gradient(top, #bbb, #444);
   /*   
   background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#bbb));
   background: -webkit-linear-gradient(top, #444, #bbb);
   background: -moz-linear-gradient(top, #444, #bbb);
   background: -ms-linear-gradient(top, #444, #bbb);
   background: -o-linear-gradient(top, #444, #bbb);
   */
   padding: 3px 6px 5px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   text-decoration: none;
   vertical-align: middle;   
   }
.button-portal-tiny-black:hover {
   border-top-color: #fff;
   background: #fff;
   color: #444;
   text-decoration: none;
   }
.button-portal-tiny-black:active {
   border-top-color: #fff;
   background: #fff;
   }   

.button-portal-tiny-red {
   border-top: 1px solid #fab6b6;
   background: #e82626;
   background: -webkit-gradient(linear, left top, left bottom, from(#e82626), to(#ed9c9c));
   background: -webkit-linear-gradient(top, #e82626, #ed9c9c);
   background: -moz-linear-gradient(top, #e82626, #ed9c9c);
   background: -ms-linear-gradient(top, #e82626, #ed9c9c);
   background: -o-linear-gradient(top, #e82626, #ed9c9c);
   padding: 3px 6px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   -webkit-box-shadow: rgba(2,2,2,1) 0 1px 0;
   -moz-box-shadow: rgba(2,2,2,1) 0 1px 0;
   box-shadow: rgba(2,2,2,1) 0 1px 0;
   text-shadow: rgba(2,2,2,.4) 0 1px 0;
   color: white;
   font-family: Segoe UI, Georgia, Serif;
   text-decoration: none;
   vertical-align: middle;
   }
.button-portal-tiny-red:hover {
   border-top-color: #ffffff;
   background: #ffffff;
   color: #e00404;
   text-decoration: none;
   }
.button-portal-tiny-red:active {
   border-top-color: #ffffff;
   background: #ffffff;
   }
.button-black,
.button-red,
.button-blue,
.button-portal-tiny-black,
.button-portal-tiny-red,
.button-portal-tiny-blue,
.button-black-small {
   transition: box-shadow 0.1s ease-out;
   }
.button-black:hover,
.button-red:hover,
.button-blue:hover,
.button-portal-tiny-black:hover,
.button-portal-tiny-red:hover,
.button-portal-tiny-blue:hover,
.button-black-small:hover {
   box-shadow: 3px 3px 10px black;
   /*position: relative;
   top: -2px;
   right: 2px;*/
   }