/**
 * @author              Steven Palmer and Bradley Silk
 * @author url          http://coalaweb.com
 * @author email        support@coalaweb.com
 * @version             Version 0.0.1 January 2013
 * @copyright           Copyright (c) 2013 Steven Palmer and Bradley Silk All rights reserved.
 */

@import url(../warp/css/tools.css);

/* Buttons (Needed for System Markup)
----------------------------------------------------------------------------------------------------*/

/* Sets the attributes for all buttons */
#system .item > .links a, .button-primary, .button-default, button,
form.style #button, form.style input[type="button"], form.style input.button, input[type="button"], 
form.style #submit, form.style input[type="submit"], form.style input.submit, input[type="submit"],
.button-green, .button-blue, .button-orange, .button-pink, .button-red, .button-teal {
    background-color: #F5F5F5;
    background-image: -webkit-linear-gradient(#FFFFFF, #E6E6E6);
    background-image: linear-gradient(#FFFFFF, #E6E6E6);
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    border-image: none;
    border-radius: 4px 4px 4px 4px;
    border-style: solid;
    border-width: 1px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05);
    color: #333333;
    cursor: pointer;
    font-size: 14px;
    line-height: 18px;
    padding: 4px 10px;
    text-align: center;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    vertical-align: middle;
}

#system .item > .links a:hover, .button-primary:hover, .button-default:hover, 
.mod-box-color .button-primary:hover, form.style button:hover, 
form.style #button:hover, form.style input[type="button"]:hover, form.style input.button:hover, 
form.style #submit:hover, form.style input[type="submit"]:hover, form.style input.submit:hover,
.button-green:hover, .button-blue:hover, .button-orange:hover, .button-pink:hover, 
.button-red:hover, .button-teal:hover {
    background-color: #E6E6E6;
    background-position: 0 -15px;
    background-repeat: repeat-x;
    color: #333333;
    text-decoration: none;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    transition: background-position 0.1s linear 0s;
    cursor:pointer;
}

/* The default warp code caused issues in IE9 */
.button-more,
.button-default,
.button-primary { display: inline; }

/* Different colour buttons that can be used anywhere
------------------------------------------------------------------------------*/
.button-green, .button-blue, .button-orange, .button-pink, .button-red, .button-teal {
    color:#ffffff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.button-green:hover, .button-blue:hover, .button-orange:hover, .button-pink:hover, 
.button-red:hover, .button-teal:hover {
    color:#ffffff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.button-green {
    background-color: #5BB75B;
    background-image: -webkit-linear-gradient(#62C462, #51A351);
    background-image: linear-gradient(#62C462, #51A351); 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#62C462', endColorstr='#51A351');
}

.button-green:hover {
    background-color: #51A351;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#51A351', endColorstr='#51A351');
}

.button-orange {
    background-color: #FAA732;
    background-image: -webkit-linear-gradient(#FBB450, #F89406);
    background-image: linear-gradient(#FBB450, #F89406);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FBB450', endColorstr='#F89406');
}

.button-orange:hover {
    background-color: #F89406;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F89406', endColorstr='#F89406');
}

.button-pink {
    background-color: #D825C8;
    background-image: -webkit-linear-gradient(#F27BEA, #C843BF);
    background-image: linear-gradient(#F27BEA, #C843BF);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F27BEA', endColorstr='#C843BF');
}

.button-pink:hover {
    background-color: #C843BF;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#C843BF', endColorstr='#C843BF');
}

.button-red {
    background-color: #DA4F49;
    background-image: -webkit-linear-gradient(#EE5F5B, #BD362F);
    background-image: linear-gradient(#EE5F5B, #BD362F);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#EE5F5B', endColorstr='#BD362F');
}

.button-red:hover {
    background-color: #BD362F;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#BD362F', endColorstr='#BD362F');
}

.button-teal {
    background-color: #21AEA5;
    background-image: -webkit-linear-gradient(#46CBC7, #1A9E9A);
    background-image: linear-gradient(#46CBC7, #1A9E9A);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#46CBC7', endColorstr='#1A9E9A');
}

.button-teal:hover {
    background-color: #1A9E9A;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1A9E9A', endColorstr='#1A9E9A');
}

.button-blue {
    background-color: #49AFCD;
    background-image: -webkit-linear-gradient(#5BC0DE, #2F96B4);
    background-image: linear-gradient(#5BC0DE, #2F96B4);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5BC0DE', endColorstr='#2F96B4');
}

.button-blue:hover {
    background-color: #2F96B4;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2F96B4', endColorstr='#2F96B4');
}


/* Images and Objects (Needed for System Markup)
----------------------------------------------------------------------------------------------------*/
img.border-box { border: 1px solid #ddd; }


/* Lists and Tables (Needed for System Markup)
----------------------------------------------------------------------------------------------------*/

/* Line */
ul.line > li { border-top: 1px solid #ddd; }
ul.line > li:first-child { border: none; }

/* Check */
ul.check > li {
    padding: 4px 0 0 30px;
    background: url(../images/tools/list_check.png) 0 0 no-repeat;
}

/* Star */
ul.star {
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.star > li {
    margin-top: 5px;
    padding: 4px 0 0 30px;
    background: url(../images/tools/list_star.png) 0 0 no-repeat;
}

ul.star > li:first-child { margin-top: 0; }

ul.star > li > a:first-child { display: block; }

/* Zebra List and Table */
ul.zebra > li,
table.zebra tbody td { border-bottom: 1px solid #ddd; }

ul.zebra > li:first-child,
table.zebra tbody tr:first-child td { border-top: 1px solid #ddd; }

ul.zebra > li.odd,
table.zebra tbody tr.odd { background: #fafafa; }

ul.zebra > li:nth-of-type(odd),
table.zebra tbody tr:nth-of-type(odd) { background: #fafafa; }

table.zebra caption { color: #999; }

/* Admin Table */
ul.admintable > li,
table.admintable tbody td { border-bottom: 1px solid #ddd; }

ul.admintable > li:first-child,
table.admintable tbody tr:first-child td { border-top: 1px solid #ddd; }

ul.admintable > li.odd,
table.admintable tbody tr.odd { background: #fafafa; }

ul.admintable > li:nth-of-type(odd),
table.admintable tbody tr:nth-of-type(odd) { background: #fafafa; }

table.admintable caption { color: #999; }

table.admintable td * { vertical-align:middle; }

table.admintable th, table.admintable td { padding:5px;}


/* Inset Styles
------------------------------------------------------------------------------*/
span.inset-left {
    float: left;
    margin-right: 20px;
    margin-bottom:20px;
}

span.inset-right {
    float: right;
    margin-left: 20px;
    margin-bottom:20px;
}

span.inset-right-title, span.inset-left-title {
    position: absolute;
    display: block;
    top: -12px;left: 10px;
    padding: 3px 8px;
    font-size: 100%;

    text-transform:uppercase;
    background: #fff;
    color: #000;
}

span.inset-left, span.inset-right {
    display: block;
    padding: 12px 8px 8px 8px;
    width: 20%;
    font-size: 100%;
    margin-top: 25px;
    position: relative;
    text-align: left;
    border: 1px solid #b2b2b2;
    color: #333;
}

/* Definition Lists
----------------------------------------------------------------------------------------------------*/
dl.separator dt {	
	position: relative;
	padding-top: 5px;
	padding-bottom: 5px;
	text-transform: uppercase;
}

/* border code because of RTL */
dl.separator dd {
	padding-top: 5px;
	padding-bottom: 5px;
	border-width: 0 0 0 1px;
	border-style: solid;
	border-color: #DDD;
}

dl.separator dt:before {
	content: "";
	position: absolute;
	top: 0;
	right: -15px;
	width: 30px;
	border-top: 1px solid #DDD;
}

dl.separator dt:after {
	content: "";
	position:absolute;
	top: -3px;
	right: -3px;
	width: 5px;
	height: 5px;
	background: #FFF;
	border: 1px solid #DDD;
	border-radius:6px;
}

dl.separator dt:first-child:before,
dl.separator dt:first-child:after { display: none; }

/* Text
----------------------------------------------------------------------------------------------------*/

/* Inline Text Box */
em.box { 
	border: 1px dotted #bbb;
	background: #fafafa;
	color: #444;
}

/* Dotted Horizontal Rule */
hr.dotted { background: url(../images/tools/line_dotted.png) 0 0 repeat-x; }

/* Boxes
----------------------------------------------------------------------------------------------------*/
.box-content {
	background: #fafafa;
	border: 1px solid #ddd;
}

.box-note,
.box-info,
.box-warning,
.box-hint,
.box-download {
	background: #fafafa;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}

.box-info {
	background: #ebf5fa url(../images/tools/box_info.png) 0 0 no-repeat;
	border-color: #d2dce1;
}

.box-info a, .box-info em {
	color: #1272a5;
}

.box-info a:hover {
    color: #57abcc;
}

.box-warning {
	background: #fff0eb url(../images/tools/box_warning.png) 0 0 no-repeat;
	border-color: #ffd7cd;
}

.box-warning a, .box-warning em {
	color: #b1191c;
}

.box-warning a:hover {
    color: #d85863;
}

.box-hint {
	background: #fffae6 url(../images/tools/box_hint.png) 0 0 no-repeat;
	border-color: #fae6be;
}

.box-hint a, .box-hint em {
        color: #d50;
}

.box-hint a:hover {
    color: #ea9e72;
}

.box-download {
	background: #faffe6 url(../images/tools/box_download.png) 0 0 no-repeat;
	border-color: #dce6be;
}

.box-download a, .box-download em {
	color: #268413;
}

.box-download a:hover {
    color: #79c36b;
}


/* Forms (Needed for System Markup)
----------------------------------------------------------------------------------------------------*/
form.box fieldset { border: 1px solid #ddd; }
form.box legend { background: #fff; }

form.style input, form.style textarea, form.style select, textarea, 
input[type="text"], input[type="password"], select, input  {
border: solid 1px #C7C9CE;
padding: 6px;
background: #E7ECF2;
background-image: linear-gradient(#EAECF5, #F7FAFF);
background-image: -webkit-linear-gradient(#EAECF5, #F7FAFF);
box-shadow: inset 0px 0px 0px 1px white;
border-radius:1px;
margin:2px;
}

/* Social Icons
----------------------------------------------------------------------------------------------------*/
ul.cw-social-icons {
	margin: 0;
	padding: 0;
	list-style: none;
	overflow: hidden;
}

ul.cw-social-icons li {
	padding: 2px 3px 0px 3px;
	float: left;
}

.cw-social-icons a { 
	display: block;
	width: 16px;
	height: 16px;
	background: url(../images/cw_social.png) 0 0 no-repeat;
}

.cw-social-icons a.email:hover { background-position: 0 0;} 
.cw-social-icons a.email { background-position: 0 -66px;} 
.cw-social-icons a.facebook:hover { background-position: 0 -132px;} 
.cw-social-icons a.facebook { background-position: 0 -198px;} 
.cw-social-icons a.google_plus:hover { background-position: 0 -264px;} 
.cw-social-icons a.google_plus { background-position: 0 -330px;} 
.cw-social-icons a.linkedin:hover { background-position: 0 -396px;} 
.cw-social-icons a.linkedin { background-position: 0 -462px;} 
.cw-social-icons a.rss:hover { background-position: 0 -528px;} 
.cw-social-icons a.rss { background-position: 0 -594px;} 
.cw-social-icons a.twitter:hover { background-position: 0 -660px;} 
.cw-social-icons a.twitter { background-position: 0 -726px;} 

/* Contact Icons
----------------------------------------------------------------------------------------------------*/
ul.cw-contact-icons {
	margin: 5px;
	padding: 0;
	list-style: none;
}

ul.cw-contact-icons li { 
	margin-top: 5px;
	padding-left: 20px;
	background: url(../images/cw_contact.png) 0 0 no-repeat;
}

ul.cw-contact-icons li:first-child { margin-top: 0; }

ul.cw-contact-icons li.home{ background-position: 0 2px;}
ul.cw-contact-icons li.mail{ background-position: 0 -64px;}
ul.cw-contact-icons li.telephone{ background-position: 0 -130px;}