﻿/* Pattern 1 */
.btn_1 {
    background: #e3e3e3;
    border: 1px solid #bbb;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 0 1px 1px #f6f6f6;
    box-shadow: inset 0 0 1px 1px #f6f6f6;
    color: black;
    padding: 8px 0 9px;
    text-align: center;
    text-shadow: 0 1px 0 #fff;
	font-size:small;
}

.btn_1:hover {
    background: #d9d9d9;
    -webkit-box-shadow: inset 0 0 1px 1px #eaeaea;
    box-shadow: inset 0 0 1px 1px #eaeaea;
    color: black;
}

.btn_1:active {
    border: 1px solid #aaa;
    border-bottom: 1px solid #888;
    -webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
    box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
}

.btn_1:focus {
    border: 1px solid grey;
    border-bottom: 1px solid #888;
}

/* Pattern 2 */
.btn_2 {
    margin: 1px;
    padding: 4px;
    background-color: #ededed;
    text-indent: 0;
    border: 1px solid #dcdcdc;
    color: #000000;
}

.btn_2:hover {
    background-color: #d9d9d9;
}

.btn_2:active {
    background-color: #d9d9d9;
    border: 1px solid #aaa;
}

.btn_2:focus {
    background-color: #d9d9d9;
    border: 1px solid #aaa;
}

/* Pattern 3 */
.btn_3 {
    background: #e3e3e3;
    border: 1px solid #bbb;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 0 1px 1px #f6f6f6;
    box-shadow: inset 0 0 1px 1px #f6f6f6;
    color: black;
    padding: 7px 0 3px;
    text-align: center;
    text-shadow: 0 1px 0 #fff;
}

.btn_3:hover {
    background: #d9d9d9;
    -webkit-box-shadow: inset 0 0 1px 1px #eaeaea;
    box-shadow: inset 0 0 1px 1px #eaeaea;
    color: black;
}

.btn_3:active {
    border: 1px solid #aaa;
    border-bottom: 1px solid #888;
    -webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
    box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
}

.btn_3:focus {
    border: 1px solid grey;
    border-bottom: 1px solid #888;
}

/* Pattern 4 */
.btn_4 {
    background: #013A6B;
    border: 1px solid #013A6B;
    border-radius: 3px;
    /*-webkit-box-shadow: inset 0 0 1px 1px #f6f6f6;
    box-shadow: inset 0 0 1px 1px #f6f6f6;*/
    color: white;
    padding: 8px 0 9px;
    text-align: center;
    text-shadow: 0 1px 0 #fff;
	font-size:small;
}

.btn_4:hover {
    background: #002c51;
    /*-webkit-box-shadow: inset 0 0 1px 1px #eaeaea;
    box-shadow: inset 0 0 1px 1px #eaeaea;*/
    color: white;
}

.btn_4:active {
    border: 1px solid #aaa;
    border-bottom: 1px solid #888;
    -webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
    box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
}

.btn_4:focus {
    border: 1px solid grey;
    border-bottom: 1px solid #888;
}

/* Hexadecimal entities for the icons */

.s1_add:before {
    content: "\271A";
}

.s1_edit:before {
    content: "\270E";        
}

.s1_delete:before {
    content: "\2718";        
}

.s1_save:before {
    content: "\2714";        
}

.s1_email:before {
    content: "\2709";        
}

.s1_like:before {
    content: "\2764";        
}

.s1_next:before {
    content: "\279C";
}

.s1_star:before {
    content: "\2605";
}

.s1_spark:before {
    content: "\2737";
}

.s1_play:before {
    content: "\25B6";
}