/**
 * DIXAN library css: classes
 *
 * @description: override/expand henkel-lib helper classes
 */

@media all {
	/* skiplinks */
	#ui .skiplink a:active,
	#ui .skiplink a:focus {
		background-color: #0254CF;
		color: #fff;
	}


	/* generic link like button */
	#ui .button {
		color: #fff;
	}	
	
	/* button colors (default) */
	#ui .button,
	#ui .panel .button,
	#ui .panel .panel .button,
	#ui .panel .panel .panel .button {
		background-color: #00caff;
		background-image: -webkit-gradient(linear,left top,left bottom,from(#00caff), to(#0067ce));
   		background-image: -moz-linear-gradient(center top, #00caff 0, #0067ce 100%);
		background-image: -o-linear-gradient(top, #00caff, #0067ce);
		background-image: linear-gradient(top, #00caff, #0067ce);
		-pie-background: linear-gradient(#00caff, #0067ce); 
	}
	#ui .button:hover,
	#ui .panel .button:hover,
	#ui .panel .panel .button:hover,
	#ui .panel .panel .panel .button:hover{
		background-color: #006eb6;
		background-image: -webkit-gradient(linear,left top,left bottom,from(#006eb6), to(#003867));
   		background-image: -moz-linear-gradient(center top, #006eb6 0, #003867 100%);
		background-image: -o-linear-gradient(top, #006eb6, #003867);
		background-image: linear-gradient(top, #006eb6, #003867);
		-pie-background: linear-gradient(#006eb6, #003867); 
	}	
	
	/* button colors (default = light-blue) */
	#ui .light-blue .button,
	#ui .panel.light-blue .button,
	#ui .panel .panel.light-blue .button,
	#ui .panel .panel .panel.light-blue .button,	
	#ui .button.button-light-blue {
		background-color: #4DBBD3;
		background-image: -webkit-gradient(linear,left top,left bottom,from(#36639A),color-stop(50%,#50A0B5),color-stop(50%,#21849E),to(#015974));
   		background-image: -moz-linear-gradient(center top, #4DBBD3 0, #50A0B5 50%, #21849E 50%, #015974 100%);
		background-image: -o-linear-gradient(top, #4DBBD3, #015974);
		background-image: linear-gradient(top, #4DBBD3, #015974);
		-pie-background: linear-gradient(#4DBBD3, #015974); 
	}
	#ui .light-blue .button:hover,
	#ui .panel.light-blue .button:hover,
	#ui .panel .panel.light-blue .button:hover,
	#ui .panel .panel .panel.light-blue .button:hover,
	#ui .button:hover.button-light-blue {
		background-color: #085D76;
		background-image: -webkit-gradient(linear,left top,left bottom,from(#085D76),color-stop(50%,#50A0B5),color-stop(50%,#268CA6),to(#46B7D0));
   		background-image: -moz-linear-gradient(center top, #085D76 0, #50A0B5 50%, #268CA6 50%, #46B7D0 100%);
		background-image: -o-linear-gradient(top, #085D76, #46B7D0);
		background-image: linear-gradient(top, #085D76, #46B7D0);
		-pie-background: linear-gradient(#085D76, #46B7D0); 
	}	

	#ui .facebook-blue .button,
	#ui .panel.facebook-blue .button,
	#ui .panel .panel.facebook-blue .button,
	#ui .panel .panel .panel.facebook-blue .button,
	#ui .button.button-facebook-blue {
		background-color: #36639A;
		background-image: -webkit-gradient(linear,left top,left bottom,from(#36639A),color-stop(50%,#466995),color-stop(50%,#164177),to(#012A5D));
		background-image: -moz-linear-gradient(center top, #36639A 0, #466995 50%, #164177 50%, #012A5D 100%);
		background-image: -o-linear-gradient(top, #36639A, #012A5D);
		background-image: linear-gradient(top, #36639A, #012A5D);
		-pie-background: linear-gradient(#36639A, #012A5D); 
	}
	#ui .facebook-blue .button:hover,
	#ui .panel.facebook-blue .button:hover,
	#ui .panel .panel.facebook-blue .button:hover,
	#ui .panel .panel .panel.facebook-blue .button:hover,
	#ui .button:hover.button-facebook-blue {
		background-color: #083061;
		background-image: -webkit-gradient(linear,left top,left bottom,from(#083061),color-stop(50%,#466995),color-stop(50%,#19467C),to(#2E5D96));
    	background-image: -moz-linear-gradient(center top, #083061 0, #466995 50%, #19467C 50%, #2E5D96 100%);
		background-image: -o-linear-gradient(top, #083061, #2E5D96);
		background-image: linear-gradient(top, #083061, #2E5D96);
		-pie-background: linear-gradient(#083061, #2E5D96); 
	}

	#ui .green .button,
	#ui .panel.green .button,
	#ui .panel .panel.green .button,
	#ui .panel .panel .panel.green .button,		
	#ui .button.button-green {
		background-color: #60BB1B;
		background-image: -webkit-gradient(linear,left top,left bottom,from(#60BB1B),color-stop(50%,#4CA949),color-stop(50%,#1B921D),to(#057220));
		background-image: -moz-linear-gradient(center top, #60BB1B 0, #4CA949 50%, #1B921D 50%, #057220 100%);
		background-image: -o-linear-gradient(top, #60BB1B, #057220);
		background-image: linear-gradient(top, #60BB1B, #057220);
		-pie-background: linear-gradient(#60BB1B, #057220); 
	}
	#ui .green .button:hover,
	#ui .panel.green .button:hover,
	#ui .panel .panel.green .button:hover,
	#ui .panel .panel .panel.green .button:hover,
	#ui .button:hover.button-green {
		background-color: #0F7527;
		background-image: -webkit-gradient(linear,left top,left bottom,from(#0F7527),color-stop(50%,#4CA949),color-stop(50%,#24971B),to(#5AB815));
   		background-image: -moz-linear-gradient(center top, #0F7527 0, #4CA949 50%, #24971B 50%, #5AB815 100%);
		background-image: -o-linear-gradient(top, #0F7527, #5AB815);
		background-image: linear-gradient(top, #0F7527, #5AB815);
		-pie-background: linear-gradient(#0F7527, #5AB815); 
	}

	#ui .purple .button,
	#ui .panel.purple .button,
	#ui .panel .panel.purple .button,
	#ui .panel .panel .panel.purple .button,	
	#ui .button.button-purple {
		background-color: #884DC3;
		background-image: -webkit-gradient(linear,left top,left bottom,from(#884DC3),color-stop(50%,#8B5BBE),color-stop(50%,#6734AD),to(#5E26A3));
   		background-image: -moz-linear-gradient(center top, #884DC3 0, #8B5BBE 50%, #6734AD 50%, #5E26A3 100%);
		background-image: -o-linear-gradient(top, #884DC3, #5E26A3);
		background-image: linear-gradient(top, #884DC3, #5E26A3);
		-pie-background: linear-gradient(#884DC3, #5E26A3); 
	}
	#ui .purple .button:hover,
	#ui .panel.purple .button:hover,
	#ui .panel .panel.purple .button:hover,
	#ui .panel .panel .panel.purple .button:hover,
	#ui .button:hover.button-purple {
		background-color: #632DA6;
		background-image: -webkit-gradient(linear,left top,left bottom,from(#632DA6),color-stop(50%,#966DC4),color-stop(50%,#7E4CB6),to(#8B5BBE));
   		background-image: -moz-linear-gradient(center top, #632DA6 0, #966DC4 50%, #7E4CB6 50%, #8B5BBE 100%);
		background-image: -o-linear-gradient(top, #632DA6, #8B5BBE);
		background-image: linear-gradient(top, #632DA6, #8B5BBE);
		-pie-background: linear-gradient(#632DA6, #8B5BBE); 
	}	
	
	#ui .button span,
	#ui .button input {
		background-image: url(/etc/designs/persil/common/img/icons-dixan.png);
		color: #fff !important;
	}
}

/**
 * DIXAN library css: colors
 *
 * @description: base color definitions for background and text colors
 */

@media all {
	/* white */
	#heli .white {
		background-color: #fff;
		color: #0254cf;
	}
	#heli .white a,
	#heli .panel.white a,
	#heli .panel .panel.white a,
	#heli .panel .panel .panel.white a {
		color: #0254cf;
	}
	#heli .white .inverted,
	#heli .panel.white .inverted,
	#heli .panel .panel.white .inverted,
	#heli .panel .panel .panel.white .inverted {
		background-color: #09a2dc;
		color: #fff;
	}

	/* light-grey */
	#heli .light-grey {
		background-color: #DDDADA;		
		color: #0254cf;
	}
	#heli .light-grey a,
	#heli .panel.light-grey a,
	#heli .panel .panel.light-grey a,
	#heli .panel .panel .panel.light-grey a {
		color: #0254cf;
	}
	#heli .light-grey .inverted,
	#heli .panel.light-grey .inverted,
	#heli .panel .panel.light-grey .inverted,
	#heli .panel .panel .panel.light-grey .inverted {
		background-color: #09a2dc;
		color: #DDDADA;
	}
	#heli .light-grey.gradient {		
		background-image: -webkit-gradient(linear, left top, left bottom, color-stop(.19, #F5F5F5), color-stop(.7, #DDDADA), color-stop(1, #F5F5F5));
		background-image: -moz-linear-gradient(center top, #F5F5F5 0pt, #DDDADA 70%, #F5F5F5 100%);
		background-image: -ms-linear-gradient(top, #F5F5F5 19%, #DDDADA 70%, #F5F5F5 100%);
		background-image: -o-linear-gradient(top, #F5F5F5 19%, #DDDADA 70%, #F5F5F5 100%);
		background-image: linear-gradient(top, #F5F5F5 19%, #DDDADA 70%, #F5F5F5 100%);		
		-pie-background: linear-gradient(#F5F5F5, #DDDADA);		
	}
	
	/*default: icon middle next*/
	#heli .ic,
	#heli .light-green .ic,
	#heli .panel.light-green .ic,
	#heli .panel .panel.light-green .ic,
	#heli .panel .panel .panel.light-green .ic,
	#heli .green .ic,
	#heli .panel.green .ic,
	#heli .panel .panel.green .ic,
	#heli .panel .panel .panel.green .ic,
	#heli .dark-green .ic,
	#heli .panel.dark-green .ic,
	#heli .panel .panel.dark-green .ic,
	#heli .panel .panel .panel.dark-green .ic,
	#heli .petrol .ic,
	#heli .panel.petrol .ic,
	#heli .panel .panel.petrol .ic,
	#heli .panel .panel .panel.petrol .ic
	#heli .light-blue .ic,
	#heli .panel.light-blue .ic,
	#heli .panel .panel.light-blue .ic,
	#heli .panel .panel .panel.light-blue .ic,
	#heli .sea-blue .ic,
	#heli .panel.sea-blue .ic,
	#heli .panel .panel.sea-blue .ic,
	#heli .panel .panel .panel.sea-blue .ic,
	#heli .blue .ic,
	#heli .panel.blue .ic,
	#heli .panel .panel.blue .ic,
	#heli .panel .panel .panel.blue .ic,
	#heli .dark-blue .ic,
	#heli .panel.dark-blue .ic,
	#heli .panel .panel.dark-blue .ic,
	#heli .panel .panel .panel.dark-blue .ic,
	#heli .facebook-blue .ic,
	#heli .panel.facebook-blue .ic,
	#heli .panel .panel.facebook-blue .ic,
	#heli .panel .panel .panel.facebook-blue .ic,
	#heli .yellow .ic,
	#heli .panel.yellow .ic,
	#heli .panel .panel.yellow .ic,
	#heli .panel .panel .panel.yellow .ic,
	#heli .pink .ic,
	#heli .panel.pink .ic,
	#heli .panel .panel.pink .ic,
	#heli .panel .panel .panel.pink .ic,
	#heli .purple .ic,
	#heli .panel.purple .ic,
	#heli .panel .panel.purple .ic,
	#heli .panel .panel .panel.purple .ic{
		background-image: url(/etc/designs/persil/common/img/icons-dixan.png);
	}
}

/**
 * comp: page (theme: dixan)
 */

@media all {
	/* footer */
	#ui > footer {
		background-image: url(/etc/designs/persil/components/page/img/bg-footer-dixan.png);
	}
}

/**
 * comp: input-box (theme: dixan)
 */

@media all {
	#ui .search.input-box input.searchfield {
		background-color: #f1f1f1;
		border-color: #eee;
		color: #7f7f7f;
	}
	#ui .search.input-box input.searchfield::-webkit-input-placeholder {
		color: #7f7f7f;
	}

	#ui .search.input-box input.searchbutton {
		background-color: transparent;
		background-image: url(/etc/designs/persil/common/img/icons-dixan.png);
	}
}

/**
 * comp: main-nav (theme: dixan)
 */

@media all {

	/* first level */
	#ui .main-nav li {
		background-color: #00caff;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#00caff), to(#0067ce));
		background-image: -moz-linear-gradient(top, #00caff 0, #0067ce 100%);
		background-image: -o-linear-gradient(top, #00caff, #0067ce);
		background-image: linear-gradient(top, #00caff, #0067ce);
		-pie-background: linear-gradient(#00caff, #0067ce); 
	}
	#ui .main-nav li.current,
	#ui .main-nav li:hover {
		background-color: #006eb6;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#006eb6), to(#003867));
		background-image: -moz-linear-gradient(top, #006eb6 0, #003867 100%);
		background-image: -o-linear-gradient(top, #006eb6, #003867);
		background-image: linear-gradient(top, #006eb6, #003867);
		-pie-background: linear-gradient(#006eb6, #003867);
	}
	#ui .main-nav li a {
		background-image: url(/etc/designs/persil/components/navigation/main-nav/img/divider-dixan.png);
		color: #fff;
		text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	}

	/* second level */
	#ui .main-nav li .dropdown {
		background: #fff;
		border-left: 1px solid #eaeaea;
		-moz-box-shadow: 0 5px 10px #505050;
		-webkit-box-shadow: 0 5px 10px #505050;
		box-shadow: 0 5px 10px #505050;
	}
	#ui .main-nav li .dropdown li {
		background-color: #fff;
		border-color: #eaeaea;
	}
	#ui .main-nav li .dropdown li a {
		background-color: transparent;
		background-image: url(/etc/designs/persil/common/img/icons-dixan.png);
		color: #0254cf;
	}
	#ui .main-nav li .dropdown li:hover {
		background-color: #006eb6;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#006eb6), to(#003867));
		background-image: -moz-linear-gradient(top, #006eb6 0, #003867 100%);
		background-image: -o-linear-gradient(top, #006eb6, #003867);
		background-image: linear-gradient(top, #006eb6, #003867);
		-pie-background: linear-gradient(#006eb6, #003867);
	}
	#ui .main-nav li .dropdown li:hover a {
		background-position: 15px 14px;
		color: #fff;
	}
}

/**
 * comp: stage (theme: dixan)
 */

@media all {
	 #ui .stage {
		color: #0254cf;
	}
}
/**
 * comp: sub-nav (theme: dixan)
 */

@media all {
	 #ui .sub-nav li {
		background-color: #fff;
		border-bottom-color: #e8e8e8;
	}
	 #ui .sub-nav li.current,
	 #ui .sub-nav li:hover {
		background-color: #006eb6;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#006eb6), to(#003867));
		background-image: -moz-linear-gradient(top, #006eb6 0, #003867 100%);
		background-image: -o-linear-gradient(top, #006eb6, #003867);
		background-image: linear-gradient(top, #006eb6, #003867);
		-pie-background: linear-gradient(#006eb6, #003867);
	}

	 #ui .sub-nav li a {
		background-color: transparent;
		background-image: url(/etc/designs/persil/common/img/icons-dixan.png);
		color: #0254cf;
	}
	 #ui .sub-nav li.current a,
	 #ui .sub-nav li.current a:active,
	 #ui .sub-nav li.current a:focus,
	 #ui .sub-nav li:hover a {
		background-position: 100% -389px;
		color: #fff;
	}
}

/**
 * comp: form (theme: dixan)
 */

@media all {

	/* form elements */
	#ui .form .text input, 
	#ui .form .select select,
	#ui .form .textarea textarea {
		color: #0254cf;
	}
	#ui .panel.white .form .text input,
	#ui .panel.white .form .select select,
	#ui .panel.white .form .textarea textarea {
		color: #fff;
	}

	#ui .form .text input,
	#ui .form .textarea textarea {
		background: #f1f1f1;
		border-color: #eee;
		/*-webkit-box-shadow: inset 0 0 6px #ebebeb;*/
		-moz-box-shadow: inset 0 0 6px #ebebeb;
		box-shadow: inset 0 0 6px #ebebeb;
	}
	#ui .panel.white .form .text input,
	#ui .panel.white .form .textarea textarea {
		border-color: #09a2dc;
		background: #006eb6;
	}
	
	#ui .form .select p,
	#ui .form .select select {
		background-color: #f1f1f1;
	}
	#ui .panel.white .form .select select {
		/*border: 3px solid #09a2dc;*/
		background: #006eb6;
	}
	#ui .panel.white .form .select select option {
		background-color: #006eb6;
	}


	/*Checkboxes and Radiobuttons*/
	#ui .form .styledCheckbox,
	#ui .form .styledRadio {
		background-image: url(/etc/designs/persil/components/form/img/forms-dixan.png);
	}


	/*Captcha*/
	#ui .form .form_captcha_img {
		background-color: #f2f2f2;
	}
	#ui .panel.white .form .form_captcha_img {
		background-color: #f1f1f1;
	}
	#ui .form .form_captcha_refresh input {
		background-color: transparent;
		background-image: url(/etc/designs/persil/common/img/icons-dixan.png);
		color: #fff;
	}
	#ui .panel.white .form .form_captcha_refresh input {
		color: #0254cf;
	}


	/* error */
	#ui .form p.error-message {
		background-color: #fff;
		color: #d52b1e;
	}
	#ui .form .text input.error,
	#ui .form .select p.error, 
	#ui .form .textarea textarea.error {
		border-color: #d52b1e;
	}
}

/**
 * comp: panel (theme: dixan)
 */

@media all {

	/* expandable header */
	#ui .panel.panel-expandable > header .icon {
		background-image: url(/etc/designs/persil/common/img/icons-dixan.png);
	}

	/**
	 * color definitions
	 */
	/* default */
	#ui .panel.panel-border.default {
		border: 1px solid #444;
	}
	#ui .panel.panel-solid.default {
		background-color: #ddd;
	}
	#ui .panel.panel-solid.panel-expandable.default header {
		background-color: #fff;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
		background-image: -moz-linear-gradient(top, #fff, #ccc);
		background-image: -ms-linear-gradient(top, #fff, #ccc);
		background-image: -o-linear-gradient(top, #fff, #ccc);
		background-image: linear-gradient(top, #fff, #ccc);		
		-pie-background: linear-gradient(#fff, #ccc);
	}
	#ui .panel.panel-solid.panel-expandable.default > header.hover,
	#ui .panel.panel-solid.panel-expandable.default > header.open {
		background-color: #fff;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#999));
		background-image: -moz-linear-gradient(top, #fff, #999);
		background-image: -ms-linear-gradient(top, #fff, #999);
		background-image: -o-linear-gradient(top, #fff, #999);
		background-image: linear-gradient(top, #fff, #999);
		-pie-background: linear-gradient(#fff, #999);
		color: #444;
	}
	#ui .panel.panel-expandable.default > header .icon {
		background-position: 0 -3200px;
	}
	#ui .panel.panel-expandable.default > header.hover .icon,
	#ui .panel.panel-expandable.default > header.open .icon {
		background-position: 0 -3500px;
	}
	#ui .panel.panel-expandable.default > header.open.hover .icon {
		background-position: 0 -3400px;
	}

	/* white */
	#ui .panel.panel-solid.white.panel-border {
		border-color: #e5e5e5;
	}
	#ui .panel.panel-solid.white > header.hover {
		background-color: #006eb6;
		color: #fff;
	}
	#ui .panel.panel-solid.panel-expandable.white > header {
		background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e9e9e9));
		background-image: -moz-linear-gradient(top, #fff, #e9e9e9);
		background-image: -ms-linear-gradient(top, #fff, #e9e9e9);
		background-image: -o-linear-gradient(top, #fff, #e9e9e9);
		background-image: linear-gradient(top, #fff, #e9e9e9);
		-pie-background: linear-gradient(#fff, #e9e9e9);
	}
	#ui .panel.panel-solid.panel-expandable.white > header.hover,
	#ui .panel.panel-solid.panel-expandable.white > header.open {
		background-color: #00b0ef;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#006eb6), to(#003867));
		background-image: -moz-linear-gradient(top , #006eb6, #003867);
		background-image: -ms-linear-gradient(top, #006eb6, #003867);
		background-image: -o-linear-gradient(top, #006eb6, #003867);
		background-image: linear-gradient(top, #006eb6, #003867);
		-pie-background: linear-gradient(#006eb6, #003867);
		color: #fff;
	}
	#ui .panel.panel-expandable.white > header .icon {
		background-position: 0 -2000px;
	}
	#ui .panel.panel-expandable.white > header.hover .icon,
	#ui .panel.panel-expandable.white > header.open .icon {
		background-position: 0 -1100px;
	}
	#ui .panel.panel-expandable.white > header.open.hover .icon {
		background-position: 0 -1000px;
	}
}

/**
 * comp: search (theme: dixan)
 */

@media all {
	#ui .search .searchresults li.result.odd {
		background: #ebebeb;
	}
	#ui .search .searchresults li.result.even {
		background: #f5f5f5;
	}
	#ui .search .paging a.previous,
	#ui .search .paging a.next {
		background-color: transparent;
		background-image: url(/etc/designs/persil/common/img/icons-dixan.png);
	}
}

/**
 * comp: teaser-expandable (theme: dixan)
 */

@media all {
	#ui .teaser-expandable a.ir {
		background: url(/etc/designs/persil/common/img/gui-dixan.png);
	}
}

/**
 * comp: productshapes (theme: dixan)
 */

@media all {
	/* tooltip */
	 #ui .productshapes li .tooltip {
		background-color: #dddada;
		background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#f5f5f5),color-stop(1,#dddada));
		background-image: -moz-linear-gradient(top,#f5f5f5 0,#dddada 100%);
		background-image: linear-gradient(top,#f5f5f5,#dddada);
		border-color: #fff;
		color: #0254cf;
	}
}

/**
 * comp: footer-nav (theme: dixan)
 */

@media all {
	#ui .footer-nav {
		width: 66em;
	}
	 #ui .footer-nav small {
		color: #666666;
	}
	.homepage #ui .footer-nav small {
		color: #848484;
	}
	 #ui .footer-nav a {
		border-left: 1px solid #666666;
		color: #666666;
	}
	.homepage #ui .footer-nav a {
		border-left-color: #848484;
		color: #848484;
	}
}

/*
    ColorBox Core Style (theme: dixan)
*/

@media all {
	#cboxClose {
		background-image: url(/etc/designs/persil/components/colorbox/img/close-dixan.png);
	}
}