/**
 * @name		Beautiful CK
 * @package		com_beautifulck
 * @copyright	Copyright (C) 2016. All rights reserved.
 * @license		GNU General Public License version 2 or later; see LICENSE.txt
 * @author		Cedric Keiflin - http://www.template-creator.com - http://www.joomlack.fr
 */


/*------------------
 -	Banner			-
 --------------------*/

.beautifulck.banner {
	position: relative;
	z-index: 10;
}

.beautifulck.banner .beautifulckbg {
	position: relative;
}

.beautifulck.banner .beautifulck-title * {
	color: inherit;
	margin: 0;
	padding: 0;
	line-height: inherit;
	background: none;
	font-size: inherit;
	font-weight: inherit;
}

.beautifulck.banner .beautifulck-title:before {
	content: " ";
	display: block;
	position: absolute;
	z-index: 12;
	height: 45px;
	width: 100%;
	max-width: 193px;
	left: -12px;
	top: -7px;
	background-repeat: no-repeat;
	background-position: left top;
}

.beautifulck.banner .beautifulck-title:after {
	content: " ";
	display: block;
	height: 45px;
	width: 17px;
	position: absolute;
	z-index: 11;
	right: -13px;
	top: -7px;
	background-repeat: no-repeat;
	background-position: right top;
}

.beautifulck.banner .beautifulck-title {
	height: 31px;
	position: relative;
}

.beautifulck.banner.pink .beautifulck-title { background: #bf0067; }
.beautifulck.banner.red .beautifulck-title { background: #CD0000; }
.beautifulck.banner.orange .beautifulck-title { background: #FB7A00; }
.beautifulck.banner.yellow .beautifulck-title { background: #F0A20E; }
.beautifulck.banner.green .beautifulck-title { background: #7BA915; }
.beautifulck.banner.blue .beautifulck-title { background: #0566ad; }
.beautifulck.banner.grey .beautifulck-title { background: #696969; }


.beautifulck.banner.pink .beautifulck-title:before, .beautifulck.banner.pink .beautifulck-title:after {background-image: url(../images/banner_pink.png);}
.beautifulck.banner.red .beautifulck-title:before, .beautifulck.banner.red .beautifulck-title:after {background-image: url(../images/banner_red.png);}
.beautifulck.banner.orange .beautifulck-title:before, .beautifulck.banner.orange .beautifulck-title:after {background-image: url(../images/banner_orange.png);}
.beautifulck.banner.yellow .beautifulck-title:before, .beautifulck.banner.yellow .beautifulck-title:after {background-image: url(../images/banner_yellow.png);}
.beautifulck.banner.green .beautifulck-title:before, .beautifulck.banner.green .beautifulck-title:after {background-image: url(../images/banner_green.png);}
.beautifulck.banner.blue .beautifulck-title:before, .beautifulck.banner.blue .beautifulck-title:after {background-image: url(../images/banner_blue.png);}
.beautifulck.banner.grey .beautifulck-title:before, .beautifulck.banner.grey .beautifulck-title:after {background-image: url(../images/banner_grey.png);}

.beautifulck.banner img.beautifulck-icon {
	position: relative;
	z-index: 15;
	float: left;
	margin: 7px;
}

.beautifulck.banner .beautifulck-titletext {
	position: absolute;
	z-index: 15;
}

/*-------------------
 -	Corner Left		-
 --------------------*/
 
 .beautifulck.cornerleft {
	position: relative;;
}

.beautifulck.cornerleft .beautifulck-title-outer {
	width: 85px;
	height: 88px;
	overflow: hidden;
	position: absolute;
	top: -3px;
	left: -3px;
	pointer-events: none;
	color: #6a6340;
	text-shadow: rgba(255,255,255,0.5) 0px 1px 0px;
	font: bold 15px Sans-Serif;
}

.beautifulck.cornerleft .beautifulck-title {
	text-align: center;
	-webkit-transform: rotate(-45deg);
	-moz-transform:    rotate(-45deg);
	-ms-transform:     rotate(-45deg);
	-o-transform:      rotate(-45deg);
	position: relative;
	padding: 7px 0;
	left: -30px;
	top: 15px;
	width: 120px;
	height: 20px;
	background-color: #BFDC7A;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#BFDC7A), to(#8EBF45)); 
	background-image: -webkit-linear-gradient(top, #BFDC7A, #8EBF45); 
	background-image:    -moz-linear-gradient(top, #BFDC7A, #8EBF45); 
	background-image:     -ms-linear-gradient(top, #BFDC7A, #8EBF45); 
	background-image:      -o-linear-gradient(top, #BFDC7A, #8EBF45); 
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow:    0px 0px 3px rgba(0,0,0,0.3);
	box-shadow:         0px 0px 3px rgba(0,0,0,0.3);
}

.beautifulck.cornerleft .beautifulck-title:before, .beautifulck.cornerleft .beautifulck-title:after {
	content: "";
	border-top:   3px solid #6e8900;   
	border-left:  3px solid transparent;
	border-right: 3px solid transparent;
	position:absolute;
	bottom: -3px;
}

.beautifulck.cornerleft .beautifulck-title:before {
	left: 0;
}
.beautifulck.cornerleft .beautifulck-title:after {
	right: 0;
}

.beautifulck.cornerleft.pink .beautifulck-title  {
	background-color: #f869a0;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#f869a0), to(#c3086b)); 
	background-image: -webkit-linear-gradient(top, #f869a0, #c3086b); 
	background-image:    -moz-linear-gradient(top, #f869a0, #c3086b); 
	background-image:     -ms-linear-gradient(top, #f869a0, #c3086b); 
	background-image:      -o-linear-gradient(top, #f869a0, #c3086b); 
}

.beautifulck.cornerleft.red .beautifulck-title  {
	background-color: #fa5757;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#fa5757), to(#cf0404)); 
	background-image: -webkit-linear-gradient(top, #fa5757, #cf0404); 
	background-image:    -moz-linear-gradient(top, #fa5757, #cf0404); 
	background-image:     -ms-linear-gradient(top, #fa5757, #cf0404); 
	background-image:      -o-linear-gradient(top, #fa5757, #cf0404); 
}

.beautifulck.cornerleft.orange .beautifulck-title {
	background-color: #f7b850;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#f7b850), to(#fb7e05)); 
	background-image: -webkit-linear-gradient(top, #f7b850, #fb7e05); 
	background-image:    -moz-linear-gradient(top, #f7b850, #fb7e05); 
	background-image:     -ms-linear-gradient(top, #f7b850, #fb7e05); 
	background-image:      -o-linear-gradient(top, #f7b850, #fb7e05); 
}

.beautifulck.cornerleft.yellow .beautifulck-title {
	background-color: #ffff00;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#ffff00), to(#cccc33)); 
	background-image: -webkit-linear-gradient(top, #ffff00, #cccc33); 
	background-image:    -moz-linear-gradient(top, #ffff00, #cccc33); 
	background-image:     -ms-linear-gradient(top, #ffff00, #cccc33); 
	background-image:      -o-linear-gradient(top, #ffff00, #cccc33); 
}

.beautifulck.cornerleft.green .beautifulck-title {
	background-color: #BFDC7A;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#BFDC7A), to(#8EBF45)); 
	background-image: -webkit-linear-gradient(top, #BFDC7A, #8EBF45); 
	background-image:    -moz-linear-gradient(top, #BFDC7A, #8EBF45); 
	background-image:     -ms-linear-gradient(top, #BFDC7A, #8EBF45); 
	background-image:      -o-linear-gradient(top, #BFDC7A, #8EBF45); 
}
.beautifulck.cornerleft.blue .beautifulck-title {
	background-color: #3fbffd;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#3fbffd), to(#0a7dec)); 
	background-image: -webkit-linear-gradient(top, #3fbffd, #0a7dec); 
	background-image:    -moz-linear-gradient(top, #3fbffd, #0a7dec); 
	background-image:     -ms-linear-gradient(top, #3fbffd, #0a7dec); 
	background-image:      -o-linear-gradient(top, #3fbffd, #0a7dec); 
}
.beautifulck.cornerleft.grey .beautifulck-title {
	background-color: #8b8b8b;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#8b8b8b), to(#6b6b6b)); 
	background-image: -webkit-linear-gradient(top, #8b8b8b, #6b6b6b); 
	background-image:    -moz-linear-gradient(top, #8b8b8b, #6b6b6b); 
	background-image:     -ms-linear-gradient(top, #8b8b8b, #6b6b6b); 
	background-image:      -o-linear-gradient(top, #8b8b8b, #6b6b6b); 
}

/*-------------------
 -	Corner Right	-
 --------------------*/
 
.beautifulck.cornerright {
	position: relative;;
}

.beautifulck.cornerright .beautifulck-title-outer {
	width: 85px;
	height: 88px;
	overflow: hidden;
	position: absolute;
	top: -3px;
	right: -3px;
	pointer-events: none;
	color: #6a6340;
	text-shadow: rgba(255,255,255,0.5) 0px 1px 0px;
	font: bold 15px Sans-Serif;
}

.beautifulck.cornerright .beautifulck-title {
	text-align: center;
	-webkit-transform: rotate(45deg);
	-moz-transform:    rotate(45deg);
	-ms-transform:     rotate(45deg);
	-o-transform:      rotate(45deg);
	position: relative;
	padding: 7px 0;
	left: -5px;
	top: 15px;
	width: 120px;
	height: 20px;
	box-sizing: content-box;
	background-color: #BFDC7A;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#BFDC7A), to(#8EBF45)); 
	background-image: -webkit-linear-gradient(top, #BFDC7A, #8EBF45); 
	background-image:    -moz-linear-gradient(top, #BFDC7A, #8EBF45); 
	background-image:     -ms-linear-gradient(top, #BFDC7A, #8EBF45); 
	background-image:      -o-linear-gradient(top, #BFDC7A, #8EBF45); 
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow:    0px 0px 3px rgba(0,0,0,0.3);
	box-shadow:         0px 0px 3px rgba(0,0,0,0.3);
}

.beautifulck.cornerright .beautifulck-title:before, .beautifulck.cornerright .beautifulck-title:after {
	content: "";
	border-top:   3px solid #6e8900;   
	border-left:  3px solid transparent;
	border-right: 3px solid transparent;
	position:absolute;
	bottom: -3px;
}

.beautifulck.cornerright .beautifulck-title:before {
	left: 0;
}
.beautifulck.cornerright .beautifulck-title:after {
	right: 0;
}

.beautifulck.cornerright.pink .beautifulck-title  {
	background-color: #f869a0;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#f869a0), to(#c3086b)); 
	background-image: -webkit-linear-gradient(top, #f869a0, #c3086b); 
	background-image:    -moz-linear-gradient(top, #f869a0, #c3086b); 
	background-image:     -ms-linear-gradient(top, #f869a0, #c3086b); 
	background-image:      -o-linear-gradient(top, #f869a0, #c3086b); 
}

.beautifulck.cornerright.red .beautifulck-title  {
	background-color: #fa5757;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#fa5757), to(#cf0404)); 
	background-image: -webkit-linear-gradient(top, #fa5757, #cf0404); 
	background-image:    -moz-linear-gradient(top, #fa5757, #cf0404); 
	background-image:     -ms-linear-gradient(top, #fa5757, #cf0404); 
	background-image:      -o-linear-gradient(top, #fa5757, #cf0404); 
}

.beautifulck.cornerright.orange .beautifulck-title  {
	background-color: #f7b850;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#f7b850), to(#fb7e05)); 
	background-image: -webkit-linear-gradient(top, #f7b850, #fb7e05); 
	background-image:    -moz-linear-gradient(top, #f7b850, #fb7e05); 
	background-image:     -ms-linear-gradient(top, #f7b850, #fb7e05); 
	background-image:      -o-linear-gradient(top, #f7b850, #fb7e05); 
}

.beautifulck.cornerright.yellow .beautifulck-title  {
	background-color: #ffff00;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#ffff00), to(#cccc33)); 
	background-image: -webkit-linear-gradient(top, #ffff00, #cccc33); 
	background-image:    -moz-linear-gradient(top, #ffff00, #cccc33); 
	background-image:     -ms-linear-gradient(top, #ffff00, #cccc33); 
	background-image:      -o-linear-gradient(top, #ffff00, #cccc33); 
}

.beautifulck.cornerright.green .beautifulck-title  {
	background-color: #BFDC7A;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#BFDC7A), to(#8EBF45)); 
	background-image: -webkit-linear-gradient(top, #BFDC7A, #8EBF45); 
	background-image:    -moz-linear-gradient(top, #BFDC7A, #8EBF45); 
	background-image:     -ms-linear-gradient(top, #BFDC7A, #8EBF45); 
	background-image:      -o-linear-gradient(top, #BFDC7A, #8EBF45); 
}
.beautifulck.cornerright.blue .beautifulck-title  {
	background-color: #3fbffd;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#3fbffd), to(#0a7dec)); 
	background-image: -webkit-linear-gradient(top, #3fbffd, #0a7dec); 
	background-image:    -moz-linear-gradient(top, #3fbffd, #0a7dec); 
	background-image:     -ms-linear-gradient(top, #3fbffd, #0a7dec); 
	background-image:      -o-linear-gradient(top, #3fbffd, #0a7dec); 
}
.beautifulck.cornerright.grey .beautifulck-title  {
	background-color: #8b8b8b;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#8b8b8b), to(#6b6b6b)); 
	background-image: -webkit-linear-gradient(top, #8b8b8b, #6b6b6b); 
	background-image:    -moz-linear-gradient(top, #8b8b8b, #6b6b6b); 
	background-image:     -ms-linear-gradient(top, #8b8b8b, #6b6b6b); 
	background-image:      -o-linear-gradient(top, #8b8b8b, #6b6b6b); 
}

/*-------------------
 -	Glossy			-
 --------------------*/
 
 .beautifulck.glossy {
	position: relative;
	z-index: 10;
}

.beautifulck.glossy .beautifulckbg  {
	position: relative;
}

.beautifulck.glossy .beautifulck-title * {
	color: inherit;
	margin: 0;
	padding: 0;
	line-height: inherit;
	background: none;
	font-size: inherit;
	font-weight: inherit;
}

.beautifulck.glossy .beautifulck-title:before {
	content: " ";
	display: block;
	position: absolute;
	z-index: 12;
	height: 47px;
	width: 100%;
	max-width: 106px;
	left: -12px;
	top: 0px;
	background-repeat: no-repeat;
	background-position: left top;
}

.beautifulck.glossy .beautifulck-title:after {
	content: " ";
	display: block;
	height: 47px;
	width: 57px;
	position: absolute;
	z-index: 11;
	right: -25px;
	top: 0px;
	background-repeat: no-repeat;
	background-position: right top;
}

.beautifulck.glossy .beautifulck-title {
	height: 47px;
	position: relative;
}

.beautifulck.glossy.pink .beautifulck-title { background: url(../images/glossy_pink_center.png) left top repeat-x; }
.beautifulck.glossy.red .beautifulck-title { background: url(../images/glossy_red_center.png) left top repeat-x; }
.beautifulck.glossy.orange .beautifulck-title { background: url(../images/glossy_orange_center.png) left top repeat-x; }
.beautifulck.glossy.yellow .beautifulck-title { background: url(../images/glossy_yellow_center.png) left top repeat-x; }
.beautifulck.glossy.green .beautifulck-title { background: url(../images/glossy_green_center.png) left top repeat-x; }
.beautifulck.glossy.blue .beautifulck-title { background: url(../images/glossy_blue_center.png) left top repeat-x; }
.beautifulck.glossy.grey .beautifulck-title { background: url(../images/glossy_grey_center.png) left top repeat-x; }


.beautifulck.glossy.pink .beautifulck-title:before, .beautifulck.glossy.pink .beautifulck-title:after {background-image: url(../images/glossy_pink.png);}
.beautifulck.glossy.red .beautifulck-title:before, .beautifulck.glossy.red .beautifulck-title:after {background-image: url(../images/glossy_red.png);}
.beautifulck.glossy.orange .beautifulck-title:before, .beautifulck.glossy.orange .beautifulck-title:after {background-image: url(../images/glossy_orange.png);}
.beautifulck.glossy.yellow .beautifulck-title:before, .beautifulck.glossy.yellow .beautifulck-title:after {background-image: url(../images/glossy_yellow.png);}
.beautifulck.glossy.green .beautifulck-title:before, .beautifulck.glossy.green .beautifulck-title:after {background-image: url(../images/glossy_green.png);}
.beautifulck.glossy.blue .beautifulck-title:before, .beautifulck.glossy.blue .beautifulck-title:after {background-image: url(../images/glossy_blue.png);}
.beautifulck.glossy.grey .beautifulck-title:before, .beautifulck.glossy.grey .beautifulck-title:after {background-image: url(../images/glossy_grey.png);}

.beautifulck.glossy img.beautifulck-icon {
	position: relative;
	z-index: 15;
	float: left;
	margin: 12px 7px 7px 7px;
}

.beautifulck.glossy .beautifulck-titletext {
	position: absolute;
	z-index: 15;
}


/*-------------------
 -	Simple			-
 --------------------*/
 
.beautifulck.simple {
	position: relative;
	z-index: 10;
}

.beautifulck.simple .beautifulckbg  {
	position: relative;
}

.beautifulck.simple .beautifulck-title * {
	color: inherit;
	margin: 0;
	padding: 0;
	line-height: inherit;
	background: none;
	font-size: inherit;
	font-weight: inherit;
}

.beautifulck.simple .beautifulck-title:before {
	content: " ";
	display: block;
	position: absolute;
	z-index: 12;
	width: 0px;
	height: 0px;
	top: 40px;
	border-style: solid;
	border-width: 0 10px 10px 0;
	border-color: transparent #333 transparent transparent;
}

.beautifulck.simple .beautifulck-title {
	height: 40px;
	position: relative;
	left: -10px;
}

.beautifulck.simple.pink .beautifulck-title {background: #e144d6;}
.beautifulck.simple.red .beautifulck-title {background: #bf4f4f;}
.beautifulck.simple.orange .beautifulck-title {background: #eaa024;}
.beautifulck.simple.yellow .beautifulck-title {background: #e3df2b;}
.beautifulck.simple.green .beautifulck-title {background: #62b25f;}
.beautifulck.simple.blue .beautifulck-title {background: #5d70b1;}
.beautifulck.simple.grey .beautifulck-title {background: #646464;}

.beautifulck.simple img.beautifulck-icon {
	position: relative;
	z-index: 15;
	float: left;
	margin: 12px 7px 7px 7px;
}

.beautifulck.simple .beautifulck-titletext {
	position: absolute;
	z-index: 15;
	/*float: left;
	margin: 10px 0 0 30px;*/
}

