/* Copyright (C) YOOtheme GmbH, http://www.gnu.org/licenses/gpl.html GNU/GPL */

@import url(tools.css);


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

/* Default */
.button-default {
	padding: 5px 10px;
        color: #444;
	border: 1px solid #ddd;
        border-radius: 2px;
        background: #fff;
        -moz-box-shadow: 0px -1px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -1px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -1px 0px 0px rgba(0,0,0,0.2) inset;
}

/* Primary */
.button-primary {
        color: #fff;
	padding: 5px 10px;
        display:inline-block;
        background-color:#3c3c3c;
        border-bottom: none;
        border-radius: 2px;
        -moz-box-shadow: 0px -1px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -1px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -1px 0px 0px rgba(0,0,0,0.2) inset;
}

.button-primary:hover {
        color: #fff;
	background: #6d727a;
        transition: all 0.3s ease-in-out 0s;
}


.button, .button:visited {
	display: inline-block; 
	padding: 5px 10px 6px; 
	color: #fff; 
	text-decoration: none;
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
	position: relative;
	cursor: pointer

}

.button, .button:visited {
	display: inline-block; 
	padding: 5px 10px 6px; 
	color: #fff; 
	text-decoration: none;
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
	position: relative;
	cursor: pointer
}

.mybutton { transition: all 0.3s ease-in-out 0s; }

.mybutton, .mybutton:visited {
	display: inline-block;
        font-family: 'Montserrat', sans-serif;
	color: #fff;
	position: relative;
	cursor: pointer;
}
 
	.mybutton:hover { color: #fff; transition: all 0.3s ease-in-out 0s; }
	.mybutton:active { top: 1px; }
	.small.mybutton, .small.mybutton:visited { font-size: 12px; border-radius: 8px; padding: 7px;}
	.mybutton, .mybutton:visited,
	.medium.mybutton, .medium.mybutton:visited {
	padding: 10px;
        font-size: 14px;
        line-height: 1; 
}
												  
	.large.mybutton, .large.mybutton:visited { font-size: 16px; padding: 13px; }
	
	.highlight.mybutton, .highlight.mybutton:visited {
        border-radius: 2px;
        -moz-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        color: #ffffff;
	background: #dd555f;
}
	.highlight.mybutton:hover {
	background: #ee7b84;
}
	.light.mybutton, .light.mybutton:visited {
        color: #444;
	border: 1px solid #eaeaea;
        border-radius: 2px;
        background: #fff;
        -moz-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
}
	.light.mybutton:hover {
        background: #f5f5f5;
}
	.blue.mybutton, .blue.mybutton:visited { 
        display:inline-block;
        background-color:#018fff;
        border-bottom: none;
        border-radius: 2px;
        -moz-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
}
	.blue.mybutton:hover {
        background-color:#4bb0ff;
}

	.green.mybutton, .green.mybutton:visited { 
        display:inline-block;
        background-color:#86be48;
        border-bottom: none;
        border-radius: 2px;
        -moz-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
}
	.green.mybutton:hover {
        background-color:#96cb5a;
}

	.sunny.mybutton, .sunny.mybutton:visited { 
        display:inline-block;
        background-color:#d69a1c;
        border-bottom: none;
        border-radius: 2px;
        -moz-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
}
	.sunny.mybutton:hover {
        background-color:#e0a321;
}

	.orange.mybutton, .orange.mybutton:visited { 
        display:inline-block;
        background-color:#dd4b32;
        border-bottom: none;
        border-radius: 2px;
        -moz-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
}
	.orange.mybutton:hover {
        background-color:#ef654e;
}

	.pink.mybutton, .pink.mybutton:visited { 
        display:inline-block;
        background-color:#de5aa7;
        border-bottom: none;
        border-radius: 2px;
        -moz-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
}
	.pink.mybutton:hover {
        background-color:#ed72ba;
}

	.purple.mybutton, .purple.mybutton:visited { 
        display:inline-block;
        background-color:#8b6ed6;
        border-bottom: none;
        border-radius: 2px;
        -moz-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
}
	.purple.mybutton:hover {
        background-color:#a48ae7;
}

	.mint.mybutton, .mint.mybutton:visited { 
        display:inline-block;
        background-color:#2ec49f;
        border-bottom: none;
        border-radius: 2px;
        -moz-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
}
	.mint.mybutton:hover {
        background-color:#3ed6b1;
}

	.dark.mybutton, .dark.mybutton:visited { 
        display:inline-block;
        background-color:#3c3c3c;
        border-bottom: none;
        border-radius: 2px;
        -moz-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
}
	.dark.mybutton:hover {
        background-color:#545454;
}

/* 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 10px;

}

ul.check > li:before {
    padding-right: 10px;
    font-family: FontAwesome;
    font-size: 25px;
    font-style: normal;
    font-weight: normal;
    content: "\f058";
    }
    
/* 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; }

/* Pricing Table 
----------------------------------------------------------------------------------------------------*/
.ptable-dot-row:after {
        margin: -1px auto;
        background-color: #ccc;
        content: "";
        display: block;
        height: 1px;
        position: relative;
        width: 150px;
        vertical-align: middle;
        top: 7px;
}

.ptable {
	border: 1px solid #ccc;
	background: #fff;
	text-align: center;
	overflow: hidden;
        -moz-box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.2) inset;
        transition: all 0.3s ease-in-out 0s;
}


.ptable:hover {
	border: 1px solid #ccc;
  	background: #f7f7f7;
	text-align: center;
	overflow: hidden;
        -moz-box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.2) inset;
        transition: all 0.3s ease-in-out 0s;
}      

.ptable-bestseller {
	border: 1px solid #ddd;
	background: #fff;
	text-align: center;
	overflow: hidden;
        -moz-box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.2) inset;
        transition: all 0.3s ease-in-out 0s;
}

.ptable-bestseller:hover {
	background: #f7f7f7;
	text-align: center;
	overflow: hidden;
        -moz-box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -5px 0px 0px rgba(0,0,0,0.2) inset;
        transition: all 0.3s ease-in-out 0s;
}

.ptable .price {
        display: block;
        position: relative;
        width: 140px;
        color: #fff;
        text-align: center;
	background: #3c3c3c;
        font-size: 30px;
        line-height: 55px;
        margin: 0 auto;
        -moz-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
}

.ptable-bestseller .price {
        display: block;
        position: relative;
        width: 140px;
        color: #fff;
        text-align: center;
	background: #f2aa0f;
        font-size: 30px;
        line-height: 55px;
        margin: 0 auto;
        -moz-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -2px 0px 0px rgba(0,0,0,0.2) inset;
}

/* 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(/kuaiji/images/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;
    border-color: #d2dce1;
    }
    
.box-info:before {
    margin-left: -15px;
    padding-right: 10px;
    font-family: FontAwesome;
    font-size: 25px;
    font-style: normal;
    font-weight: normal;
    content: "\f05a";
    color: #444;
}

.box-warning {
	background: #fff0eb;
	border-color: #ffd7cd;
}
.box-warning:before {
    margin-left: -15px;
    padding-right: 10px;
    font-family: FontAwesome;
    font-size: 25px;
    font-style: normal;
    font-weight: normal;
    content:  "\f071";
    color: #444;
}

.box-hint {
	background: #fffae6;
	border-color: #fae6be;
}
.box-hint:before {
    margin-left: -15px;
    padding-right: 10px;
    font-family: FontAwesome;
    font-size: 25px;
    font-style: normal;
    font-weight: normal;
    content:  "\f084";
    color: #444;
}

.box-download {
	background: #faffe6;
	border-color: #dce6be;
}
.box-download:before {
    margin-left: -15px;
    padding-right: 10px;
    font-family: FontAwesome;
    font-size: 25px;
    font-style: normal;
    font-weight: normal;
    content:  "\f0ed";
    color: #444;
}

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

form.box fieldset { border: 1px solid #ddd; }
form.box legend { background: #fff; }

form.style input[type="button"],  
form.style input[type="submit"],  
form.style button  {
        height: 40px;
        display:inline-block;
        padding: 10px;
        color: #fff;
        background-color:#3c3c3c;
        border: none;
        border-radius: 2px;
        -moz-box-shadow: 0px -3px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -3px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -3px 0px 0px rgba(0,0,0,0.2) inset;
}

form.style input[type="button"],  
form.style input[type="submit"],   
form.style button:hover {
        display:inline-block;
        padding: 10px;
        color: #fff;
        background-color:#545454;
        border: none;
        border-radius: 2px;
        -moz-box-shadow: 0px -3px 0px 0px rgba(0,0,0,0.2) inset;
        -webkit-box-shadow: 0px -3px 0px 0px rgba(0,0,0,0.2) inset;
        box-shadow: 0px -3px 0px 0px rgba(0,0,0,0.2) inset;
}

/* Social Icons
----------------------------------------------------------------------------------------------------*/
ul.social-icons {
 list-style: none;
 padding: 5px;
 overflow: hidden;
}
 
.social-icons li { 
 float: left;
 margin-left: 5px;
}
 
.social-icons li:first-child { margin-left: 0; }
 
.social-icons li a {
 display: block;
 width: 40px;
 height: 40px;
 background: url(/kuaiji/images/icons_social.png) 0 0 no-repeat;
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
 
.social-icons .deviantart a:hover { background-position: 0 -40px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
 
.social-icons .digg a { background-position: 0 -80px; }
.social-icons .digg a:hover { background-position: 0 -120px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
 
.social-icons .dribbble a { background-position: 0 -160px; }
.social-icons .dribbble a:hover { background-position: 0 -200px;
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
 }
 
.social-icons .facebook a { background-position: 0 -240px; }
.social-icons .facebook a:hover { background-position: 0 -280px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
 
.social-icons .flickr a { background-position: 0 -320px; }
.social-icons .flickr a:hover { background-position: 0 -360px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
 
.social-icons .google-plus a { background-position: 0 -400px; }
.social-icons .google-plus a:hover { background-position: 0 -440px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
 
.social-icons .icq a { background-position: 0 -480px; }
.social-icons .icq a:hover { background-position: 0 -520px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
 
.social-icons .instagram a { background-position: 0 -560px; }
.social-icons .instagram a:hover { background-position: 0 -600px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.social-icons .linkedin a { background-position: 0 -640px; }
.social-icons .linkedin a:hover { background-position: 0 -680px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.social-icons .picasa a { background-position: 0 -720px; }
.social-icons .picasa a:hover { background-position: 0 -760px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.social-icons .pinterest a { background-position: 0 -800px; }
.social-icons .pinterest a:hover { background-position: 0 -840px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.social-icons .rss a { background-position: 0 -880px; }
.social-icons .rss a:hover { background-position: 0 -920px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.social-icons .skype a { background-position: 0 -960px; }
.social-icons .skype a:hover { background-position: 0 -1000px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.social-icons .myspace a { background-position: 0 -1040px; }
.social-icons .myspace a:hover { background-position: 0 -1080px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.social-icons .twitter a { background-position: 0 -1120px; }
.social-icons .twitter a:hover { background-position: 0 -1160px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.social-icons .vimeo a { background-position: 0 -1200px; }
.social-icons .vimeo a:hover { background-position: 0 -1240px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.social-icons .wordpress a { background-position: 0 -1280px; }
.social-icons .wordpress a:hover { background-position: 0 -1320px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.social-icons .youtube a { background-position: 0 -1360px; }
.social-icons .youtube a:hover { background-position: 0 -1400px; 
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

/*  
 * blockquotes  
 */  
 
blockquote:before,
blockquote:after { content: ""; }
 
blockquote {
 padding-left: 60px;
 padding-right: 0;
 font-style: normal;
 line-height: 60px;
 font-size: 20px;
 background-image: url(/kuaiji/images/block.png);
 background-position:  0 -5px;
 background-repeat: no-repeat;
 border-right: 3px solid;
} 
 
blockquote:hover {
 padding-left: 60px;
 padding-right: 0;
 font-style: normal;
 line-height: 60px;
 font-size: 20px;
 background-image: url(/kuaiji/images/block-over.png);
 background-position: 0 -5px;
 background-repeat: no-repeat;
 border-right: 3px solid;
 border-right-color: #a8a8a8;
}