/*
 * Standart styling
 * ------------------------------------------------------ 
 * Helper classes for styling the shortcodes + regular ones
 * that can be used on normal content.
 * */
.clearfix:before,
.clearfix:after {
    content:"";
    display:table;
}
.clearfix:after {
    clear:both;
}
/* For IE 6/7 (trigger hasLayout) */
.clearfix {
    zoom:1;
}

/*
 * Style columns.
 * ------------------------------------------------------ 
 * Only precentage were used, so that the sizes will fit 
 * perfectly in any content width. 
 * */

.wt-row {
	margin-top: 20px;
	margin-bottom: 20px;
	overflow: hidden;
}

.wt-row .one-half { 
	width: 48%; 
}

.wt-row  .one-third { 
	width: 30.6666%; 
}

.wt-row  .two-third { 
	width: 65.3332%; 
}

.wt-row  .one-fourth { 
	width: 22%; 
}

.wt-row  .three-fourth { 
	width: 74%; 
}

.wt-row  .one-fifth {
	width: 16.8%; 
}

.wt-row  .two-fifth { 
	width: 37.6%; 
}

.wt-row  .three-fifth { 
	width: 58.4%; 
}

.wt-row  .four-fifth { 
	width: 79.2%; 
}

.wt-row  .one-sixth {
	width: 13.3333%; 
}

.wt-row  .two-sixth {
	width: 30.6666%; 
}

.wt-row  .three-sixth {
	width: 47.9998%; 
}

.wt-row  .four-sixth {
	width: 65.3332%; 
}

.wt-row  .five-sixth {
	width: 82.6665%;
}


.wt-row .one-half, 
.wt-row .one-third, 
.wt-row .two-third, 
.wt-row .one-fourth, 
.wt-row .three-fourth, 
.wt-row .one-fifth, 
.wt-row .two-fifth, 
.wt-row .three-fifth, 
.wt-row .four-fifth, 
.wt-row .one-sixth, 
.wt-row .five-sixth { 
	position: relative; 
	margin-right: 4%; 
	float: left; 
	min-height: 1px;
}

.wt-row .wt-column-last { margin-right: 0; }

/*
 * Message boxes
 * ------------------------------------------------------ 
 * This is the default design of the boxes.
 * */
.wt-msgbox {
	color:#555;
	padding: 10px 30px 10px 13px;
	display: block;
	margin: 20px 0;
	border-radius: 3px;
}

.wt-msgbox .msgbox-content:last-child {
	margin-bottom: 0;
}

.wt-msgbox i {
	margin-right: 8px;
}

.wt-msgbox.msgbox-doc {	background: #e3f7fc; }
.wt-msgbox.msgbox-error { background: #fcb8b8; }
.wt-msgbox.msgbox-download { background: #acd7a4; }
.wt-msgbox.msgbox-help { background: #96e4e9; }
.wt-msgbox.msgbox-info { background: #6dc8fc; }
.wt-msgbox.msgbox-media { background: #ffda93; }
.wt-msgbox.msgbox-new { background: #faefa4; }
.wt-msgbox.msgbox-note { background: #8ce8e3; }
.wt-msgbox.msgbox-success { background: #a2f0b1; }
.wt-msgbox.msgbox-warning { background: #e48080; }

/**	
 * List
 * ------------------------------------------------------
 * We will remove the list style for custom lists and add
 * custom font-awesome icons, the ones that the user picks.
 */
.wt-list li {
	list-style: none;
}

.wt-list li i {
	margin-right: 8px;
}

.wt-list.color-red li i { color: #f46565; }
.wt-list.color-green li i { color: #38d638; }
.wt-list.color-blue li i { color: #29a1fe; }
.wt-list.color-orange li i { color: #29a1fe; }
.wt-list.color-brown li i { color: #29a1fe; }
.wt-list.color-gray li i { color: #29a1fe; }
.wt-list.color-blue li i { color: #29a1fe; }

/**	
 * Buttons
 * ------------------------------------------------------
 * More about the buttons styles can be found in PANEL section
 * as there is set the shaded buttons state.
 */

.wt-button {
	text-decoration: none;
	padding: 7px 15px;
	color: white;

	/* IE7 inline-block hack */
	display: inline-block;
	*display: inline;

	margin: 5px;
	font-size: 14px;
	line-height: 20px;
	vertical-align: middle;
	cursor: pointer;

	background: #e05d22; /* Old browsers */
	background: -webkit-linear-gradient(top, #e05d22 0%, #d94412 100%); /* Chrome 10+, Safari 5.1+ */
	background:   linear-gradient(to bottom, #e05d22 0%, #d94412 100%); /* W3C */
	border: none;
	border-bottom: 3px solid #b93207;
	border-radius: 2px;
	color: #fff !important;
	display: inline-block;
	padding: 9px 20px 8px;
	text-decoration: none;
}

.wt-button i {
	margin-left: -2px;
	margin-right: 5px;
}

.wt-button:hover {
	opacity: 0.8;
	text-decoration: none !important;
	cursor: pointer;
	color: white;
}

.wt-button.size-small { padding: 3px 10px; font-size: 12px;}
.wt-button.size-medium { padding: 7px 18px; font-size: 14px; font-weight: bold; }
.wt-button.size-big { padding: 10px 20px; font-size: 16px; font-weight: bold; }

.wt-button.button-white,
.wt-button.button-white.shaded:active { 
	color: #999999 !important; 
	background: #FFFFFF; 
	border: 1px solid #e5e5e5;
	border-bottom: 3px solid #e0e0e0; 
}

.wt-button.button-red,
.wt-button.button-red.shaded:active { 
	background: #fe7272;  
	border-bottom: 3px solid #F26161;
}

.wt-button.button-blue, 
.wt-button.button-blue.shaded:active { 
	background: #00a2ff;  
	border-bottom: 3px solid #138ACF;
}

.wt-button.button-orange,
.wt-button.button-orange.shaded:active { 
	background: #ff7f1a;  
	border-bottom: 3px solid #D96E1A;
}

.wt-button.button-black,
.wt-button.button-black.shaded:active { 
	background: #393939;  
	border-bottom: 3px solid #212121;
}

.wt-button.button-green,
.wt-button.button-green.shaded:active { 
	background: #36e146;  
	border-bottom: 3px solid #27CC36;
}

.wt-button.button-magenta,
.wt-button.button-magenta.shaded:active { 
	background: #eb3899;  
	border-bottom: 3px solid #D11F80;
}

.wt-button.button-red:visited,		
.wt-button.button-blue:visited, 		
.wt-button.button-orange:visited,	
.wt-button.button-black:visited, 	
.wt-button.button-green:visited, 	
.wt-button.button-magenta:visited { color: white; }	
.wt-button.button-white:visited { color: #999; }

/**	
 * Highlights
 * ------------------------------------------------------
 */
.wt-highlight.wt-highlight-blue { background: #a3dffe; }
.wt-highlight.wt-highlight-red 	{ background: #fa8a8a; }
.wt-highlight.wt-highlight-green { background: #74ee88; }
.wt-highlight.wt-highlight-orange { background: #ffb38a; }
.wt-highlight.wt-highlight-yellow { background: #ffffaa; }

/**	
 * Slider
 * ------------------------------------------------------
 */
 
.wt-slider { 
	position: relative; 
	overflow: hidden; 
	border: 1px solid red;
	padding-bottom: 50px;
	border: 3px solid #f0f0f0;
	box-shadow: inset 0px 0px 1px #555;
}

.wt-slider .wt-slider-holder { 
	list-style: none; 
	padding: 0; 
	margin: 0; 	
}

.wt-slider .wt-slider-item { 
	float: left; 
	width: 100%; 
}

.wt-slider .dots {
	bottom: 8px;
	display: inline-block;
	left: 45%;
	position: absolute;
	background: rgba(0, 0, 0, 0.5);
	margin: 0;
	padding: 0px 10px;
	border-radius: 8px;
}
.wt-slider .dots li {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 0 4px;

	text-indent: -999em;

	border: 2px solid #fff;
	border-radius: 6px;

	cursor: pointer;
	opacity: .4;

	-webkit-transition: background .5s, opacity .5s;
	-moz-transition: background .5s, opacity .5s;
	transition: background .5s, opacity .5s;
}

.wt-slider .dots li.active {
	background: #fff;
	opacity: 1;
}

/**	
 * Tabs
 * ------------------------------------------------------
 */
.wt-tabs {
	border: 3px solid #f0f0f0;
	box-shadow: inset 0px 0px 1px #555;
}

.wt-tabs ul.ui-tabs-nav {
	border-bottom: 1px solid #f0f0f0;
	margin: 1px;
	padding: 0;
}

.wt-tabs ul.ui-tabs-nav li {
	float: left;
	display: block;
	margin: 0;
	padding: 0;
}

.wt-tabs ul.ui-tabs-nav li .ui-tabs-anchor {
	font-weight: bold;
	font-size: 13px;
	text-decoration: none;
	padding: 4px 40px;
	color: #777;
	display: table-cell;
	border-left: 1px solid #eee;
}

.wt-tabs ul.ui-tabs-nav li:last-child .ui-tabs-anchor {
	border-right: 1px solid #eee;
}

.wt-tabs ul.ui-tabs-nav li.ui-tabs-active a.ui-tabs-anchor {
	border-bottom: 2px solid #FF5D05;
	outline: none;
}

.wt-tabs .tab-content {
	padding: 20px;
}

/**	
 * Panels
 * ------------------------------------------------------
 */
.wt-panel { 
	display: block; 
	background: #f0f0f0;
	padding: 15px;
	margin: 20px 0;
}

.wt-panel::selection {
	background: black;
	color: white;
}

.wt-panel p:first-child {
	margin-top: 0;
}

.wt-panel p:last-child {
	margin-bottom: 0;
}

.wt-panel.flat.blue {
	background: #0096ff;
	color: white;
	border-bottom: 3px solid #168bdc;
}

.wt-panel.flat.orange {
	background: #ff6c00;
	border-bottom: 3px solid #ff5400;
	color:  white;
}

.wt-panel.flat.green {
	background: #28df1a;
	border-bottom: 3px solid #22d814;
	color:  white;
}

.wt-panel.flat.red {
	background: #FF706C;
	color: white;
	border-bottom: 3px solid #F2625E;
}

.wt-panel.flat.magenta {
	background: #ea3787;
	border-bottom: 3px solid #dd2b7b;
	color:  white;
}

.wt-panel.flat.black {
	background: #333333;
	border-bottom: 3px solid #222222;
	color:  white;
}

.wt-panel.flat.white {
	background: #ffffff;
	border: 1px solid #f0f0f0;
	color:  #555;
}

.wt-panel.shaded,
.wt-button.shaded,
.wt-label.shaded {
	font-weight: normal;
	font-size: 14px;
	border-radius: 5px;
	box-shadow: inset 0 1px 0px rgba(255, 255, 255, 0.3);
}

.wt-button.shaded:active {
	margin-bottom: 3px;
}

.wt-panel.shaded.blue,
.wt-button.shaded.button-blue,
.wt-label.shaded.wt-label-blue {
	color: white;
	border-bottom: 3px solid #168bdc;
	border: 1px solid #258dc8;
	background: #279dd1;
	background: linear-gradient(#3aa0db, #2281b7);
}

.wt-panel.shaded.red,
.wt-button.shaded.button-red ,
.wt-label.shaded.wt-label-red {
	color: white;
	background: #ff3019;
	background: linear-gradient(#ff3019, #cf0404);
	border: 1px solid #cf0404;
}

.wt-panel.shaded.green,
.wt-label.shaded.wt-label-green {
	color: white;
	background: #cdeb8e;
	background: linear-gradient(#cdeb8e, #a5c956);
	border: 1px solid #a5c956;
}

.wt-button.shaded.button-green {
	color: white;
	background: #cdeb8e;
	background: linear-gradient(#00C942, #008A0A);
	border: 1px solid #08740F;
}

.wt-panel.shaded.orange,
.wt-button.shaded.button-orange,
.wt-label.shaded.wt-label-orange {
	color: white;
	background: #ffaf4b;
	background: linear-gradient(#ffaf4b, #fc7f0a);
	border: 1px solid #fc7f0a;
}

.wt-panel.shaded.magenta,
.wt-button.shaded.button-magenta ,
.wt-label.shaded.wt-label-magenta {
	color: white;
	background: #ea3787;
	background: linear-gradient(#ea3787, #d32a65);
	border: 1px solid #d32a65;
}

.wt-panel.shaded.black,
.wt-button.shaded.button-black,
.wt-label.shaded.wt-label-black {
	color: white;
	background: #7d7e7d;
	background: linear-gradient(#7d7e7d, #0e0e0e);
	border: 1px solid #0e0e0e;
}

.wt-panel.shaded.white,
.wt-button.shaded.button-white,
.wt-label.shaded.wt-label-white {
	color: #333;
	background: #fafafa;
	background: linear-gradient(#fafafa, #e9e9e9);
	border: 1px solid #ddd;
}

.wt-label {
	color: white;
	padding: 0px 5px;
	font-size: 13px;
	margin: 0 3px;
}

.wt-label.rounded { 
	border-radius: 7px; 
}

.wt-label.wt-label-default { 
	color: #fff; 
	background: #ccc; 
}

.wt-label.wt-label-white { 
	color: #999999; 
	background: #FFFFFF; 
	border: 1px solid #e5e5e5;
}

.wt-label.wt-label-red { 
	background: #fe7272;  
}

.wt-label.wt-label-blue { 
	background: #00a2ff;  
}

.wt-label.wt-label-orange { 
	background: #ff7f1a;  
}

.wt-label.wt-label-black { 
	background: #393939;  
}

.wt-label.wt-label-green { 
	background: #36e146;  
}

.wt-label.wt-label-magenta { 
	background: #eb3899;  
}

/**	
 * Spoilers
 * ------------------------------------------------------
 */

.wt-spoiler,
.wt-spoiler a { color: transparent; text-shadow: 0 0 8px rgba(0,0,0,0.5); }

.wt-spoiler:hover,
.wt-spoiler:hover a { 
	color: #444; 
	background: transparent; 
	text-shadow: none;
}

/**	
 * Separator
 * ------------------------------------------------------
 */

.wt-separator { 
	display: block; 
	width: 100%; 
	clear: both;
	overflow: hidden;
	height: 1px;
}

.wt-separator.small {
	margin: 10px 0;
}

.wt-separator.medium {
	margin: 20px 0;
}

.wt-separator.big {
	margin: 30px 0;
}

.wt-separator.huge {
	margin: 40px 0;
}

.wt-separator.line {
	border-bottom: 1px solid #E5E5E5;
}

.wt-separator.double-line {
	border-bottom: 4px double #ededed
}

.wt-separator.shadow-1 {
	height: 32px;
	background: url("../img/shadow-1.png") no-repeat center center;
	max-width: 765px;
}

/**	
 * Dropcap
 * ------------------------------------------------------
 */

.wt-dropcap {
	display: inline-block;
	font-weight: bold;
	font-size: 4em;
	float: left;
	line-height: 1em;
	padding: 0 25px 5px 20px;
}

.wt-dropcap.square {
	background: #565656;
	color: white;
	padding: 5px 20px;
	margin: 5px 30px 5px 0;
}

.wt-dropcap.circle {
	background: #565656;
	color: white;
	padding: 5px 20px;
	margin: 5px 30px 5px 0;
	border-radius: 50%;
}