/*
Originally from
PURE CSS GUI ICONS (2010-11) by Nicolas Gallagher
at http://nicolasgallagher.com/pure-css-gui-icons/
Dual licensed under MIT and GNU GPLv2 � Nicolas Gallagher

Reduced for study purposes by
Xah Lee
http://xahlee.org/
2010-11-29
*/

ul {
    padding:0;
    margin:0;
}

li {
    position:relative;
    z-index:1;
    overflow:hidden;
    list-style:none;
    padding:0;
    margin:0 0 0.25em;
}

li a:link,
li a:visited {
    display:block;
    border:0;
    padding-left:28px;
    color:#c55500;
}

li a:hover,
li a:focus,
li a:active {
    color:#730800;
    background:transparent;
}

li:before,
li:after,
li a:before,
li a:after {
    content:"";
    position:absolute;
    top:50%;
    left:0;
}

li a:before,
li a:after {
    margin:-8px 0 0;
    background:#c55500;
}

li a:hover:before,
li a:focus:before,
li a:active:before {
    background:#730800;
}

/* DELETE */

.delete a:before {
    width:16px;
    height:16px;
    /* css3 */
    -webkit-border-radius:16px;
    -moz-border-radius:16px;
    border-radius:16px;
}

.delete a:after {
    left:3px;
    width:10px;
    height:2px;
    margin-top:-1px;
    background:#fff;
    /* css3 */
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);
}

.delete:before {
    z-index:10;
    left:7px;
    width:2px;
    height:10px;
    margin-top:-5px;
    background:#fff;
    /* css3 */
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);
}

/* Alternative style */

.delete-alt a:before {
    left:6px;
    width:5px;
    height:15px;
    margin-top:-7px;
    background:#c55500;
    /* css3 */
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);
}

.delete-alt a:after {
    left:1px;
    width:15px;
    height:5px;
    margin-top:-2px;
    background:#c55500;
    /* css3 */
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);
}

.delete-alt a:hover:after,
.delete-alt a:focus:after,
.delete-alt a:active:after {
    background:#730800;
}

/* CALL */

.call a:before {
    left:5px;
    width:4px;
    height:8px;
    border-width:5px 0 5px 2px;
    border-style:solid;
    border-color:#c55500;
    background:transparent;
    /* css3 */
    -webkit-border-top-left-radius:3px 5px;
    -webkit-border-bottom-left-radius:3px 5px;
    -moz-border-radius-topleft:3px 5px;
    -moz-border-radius-bottomleft:3px 5px;
    border-top-left-radius:3px 5px;
    border-bottom-left-radius:3px 5px;
    -webkit-transform:rotate(-30deg);
    -moz-transform:rotate(-30deg);
    -o-transform:rotate(-30deg);
    transform:rotate(-30deg);
}

.call-on a:after {
    left:10px;
    width:6px;
    height:6px;
    margin-top:-8px;
    border:4px double #c55500;
    border-width:4px 4px 0 0;
    background:transparent;
    /* css3 */
    -webkit-border-radius:0 15px 0 0;
    -moz-border-radius:0 15px 0 0;
    border-radius:0 15px 0 0;
    -webkit-transform:rotate(15deg);
    -moz-transform:rotate(15deg);
    -o-transform:rotate(15deg);
    transform:rotate(15deg);
}

.call a:hover:before,
.call a:focus:before,
.call a:active:before,
.call a:hover:after,
.call a:focus:after,
.call a:active:after {
    border-color:#730800;
    background:transparent;
}