/* Button
---------------------- */
a.taq-button{
    border: none;
    cursor: pointer;
    padding: 0 15px 0 60px;
    display: inline-block;
    margin: 10px 0 0;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
    outline: none;
    position: relative;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    background: #c7c7c7;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 14px;
    height: 45px;
    line-height: 45px;
    opacity: .9;
    overflow: hidden;
}
a.taq-button.without-icon{padding: 0 15px !important;}
a.taq-button:hover{ opacity: 1; }
a.taq-button i{
    background: rgba(0,0,0,0.07);
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    line-height: 45px;
    width: 45px;
    text-align: center;
}

/* Button Types
---------------------- */
a.taq-gradient{
    background-image: -webkit-linear-gradient(bottom,rgba(0,0,0,0.3) 0, rgba(0,0,0,0) 100%);
    background-image: -moz-linear-gradient(bottom,rgba(0,0,0,0.3) 0, rgba(0,0,0,0) 100%);
    background-image: -ms-linear-gradient(bottom,rgba(0,0,0,0.3) 0, rgba(0,0,0,0) 100%);
    background-image: -o-linear-gradient(bottom,rgba(0,0,0,0.3) 0, rgba(0,0,0,0) 100%);
    background-image: linear-gradient(to top,rgba(0,0,0,0.3) 0, rgba(0,0,0,0) 100%);
}

/* Button Size
---------------------- */
/* LARGE BUTTON */
a.taq-button.taq-large{
    font-size: 24px;
    height: 65px;
    line-height: 65px;
    padding: 0 20px 0 80px;
}
a.taq-button.taq-large.without-icon{padding: 0 20px !important;}
a.taq-button.taq-large i{
    line-height: 65px;
    width: 65px;
}
/* SMALL BUTTON */
a.taq-button.taq-small{
    font-size: 10px;
    height: 25px;
    line-height: 25px;
    padding: 0 10px 0 35px;
}
a.taq-button.taq-small.without-icon{padding: 0 10px !important;}
a.taq-button.taq-small i{
    line-height: 25px;
    width: 25px;
}

/* Button Shape
---------------------- */
a.taq-round{
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
a.taq-pill{
    -webkit-border-radius: 200px;
    border-radius: 200px;
}

/* RTL
---------------------- */
body.rtl a.taq-button i {
    left: auto;
    right: 0;
}
body.rtl a.taq-button {
    padding: 0 60px 0 15px;
}
body.rtl a.taq-button.taq-large{
    padding: 0 80px 0 20px;
}
body.rtl a.taq-button.taq-small{
    padding: 0 35px 0 10px;
}

/* Button Back-end ========================================= */
#taq-button-wrapper{ display: none; }
#taq-button-colour{margin: 0; display: table;}
#taq-button-colour li {
    margin: 0 3px 3px 0;
    float: left;
}
#taq-button-colour li input{
   display: none;
}
#taq-button-colour a {
    text-decoration: none;
    color: #FFF;
}
#taq-button-colour a span {
    padding: 0 8px;
    display: block;
    height: 25px;
    line-height: 25px;
}
#taq-button-preview{
    text-align: center;
    margin: 10px 0;
}
#taq-button-icons{
    height: 250px;
    overflow-y: scroll;
    background: #fafafa;
    border: 1px solid #eee;
    padding: 10px;
    clear: both;
    margin-top: 10px;
}
#taq-button-icons li{
    margin: 0;
    list-style: none;
    display: inline;
}
#taq-button-icons li a{
    font-size: 0;
    background: #FFF;
    margin: 2px;
    float: left;
    width: 4%;
    padding: 5px 5px 0 5px;
    text-align: center;
    line-height: 4%;
    display: block;
    border: 1px solid #e5e5e5;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.04);
    box-shadow: 0 1px 1px rgba(0,0,0,.04);
    color: #888;
}
#taq-button-icons li a.active{
    color:#0074a2 !important;
    box-shadow: inset 0 0 0 3px #0074a2;
}
#taq-button-icons li a:hover{ color: #333;}
#taq-button-icons li a i {
    font-size: 16px;
    line-height: 2;
}
#taq-button-icons li a i.none:before {
    content: '.';
    color: #FFF;
}
/* RTL
---------------------- */
body.rtl #taq-button-colour li {
    margin: 0 0 3px 3px;
    float: right;
}
body.rtl #taq-button-icons li a{
    float: right;
}