/**
 * @file
 * CSS toolbox - classes to use when needed.
 * @from http://knacss.com/css/knacss.css
 * @uses Object-Oriented CSS, http://oocss.org/
 */

/**
add to an <a> tag to not behave like a link at all
*/

.skip-links {
	position: absolute;
}
.skip-links a {
	position: absolute;
	left: -7000px;
	padding: 0.5em;
	background: #000;
	color:#fff;
	text-decoration: none;
}
.skip-links a:focus {
	position: static;
}

/**
flat <ul>, remove the default padding, margins and bullets from its <li>s
*/

ul.flat {
	margin: 0;
	padding: 0;
}
ul.flat li {
	list-style-type: none;
}

ul.flat li a, 
ul.flat li a:hover,
ul.flat li a:link,
ul.flat li a:active,
ul.flat li a:visited {
	text-decoration: none;
}

/**
Don't decorate <a>s
*/

a.dont-decorate-me, 
a.dont-decorate-me:hover,
a.dont-decorate-me:link,
a.dont-decorate-me:active,
a.dont-decorate-me:visited {
	text-decoration: none;
}

[dir="rtl"] #banner_mobile #banner_tool_inner_mobile ul {
	padding-left: 0;
}

/**
if you need to not transition for a time
*/

.gcui-skip-transition {
	transition: none !important;
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    -ms-transition: none !important;
}

/**
slideshow layout
*/

:lang(de) .slide-holder .center-readmore-overlay,
:lang(es_ES) .slide-holder .center-readmore-overlay,
:lang(es) .slide-holder .center-readmore-overlay {
    white-space: normal;
}

.slide {
    display: inline-block;
    vertical-align: top;
    opacity: 0.6;
}

.device-ios .slide {
	opacity: 1;
}

.slide.current-slide {
	opacity: 1;
}

.slide img {
    width: 100% !important;
    display: block;
    position: relative;
	/*
	top: 1px;
	*/
}

.slide-arrow {
    position: absolute;
    height: 100%;
    width: 48px;
    cursor: pointer;
    opacity: 0.5;
    -webkit-transition: opacity .8s cubic-bezier(0.165, 0.840, 0.440, 1.000);
    -moz-transition: opacity .8s cubic-bezier(0.165, 0.840, 0.440, 1.000);
    -o-transition: opacity .8s cubic-bezier(0.165, 0.840, 0.440, 1.000);
    transition: opacity .8s cubic-bezier(0.165, 0.840, 0.440, 1.000);
    z-index: 1;
}

.slide-arrow:hover {
    opacity: 1;
}

.slide-left-arrow {
    left: -48px;
    background: url(/theme/images/header-white-arrows-xtended.png) -1943px center no-repeat;
}
[dir="rtl"] .slide-left-arrow {
	right: -48px;
	left: auto;
	-moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}

.slide-right-arrow {
    right: -48px;
    background: url(/theme/images/header-white-arrows-xtended.png) -8px center no-repeat;
}
[dir="rtl"] .slide-right-arrow {
	left: -48px;
	right: auto;
	-moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}

/**
for untouchable elements
*/

.untouchable {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

/**
hiding content
*/

.visually-hidden {
	position: absolute;
	left: -7000px;
	overflow: hidden;
}
[dir=rtl] .visually-hidden {
	left: auto;
	right: -7000px;
}

/**
hidden on desktop
*/

.desktop-hidden { display: none; } 


/**
some nice animations
*/

.animation-bottom-up-appear-parent {
	-webkit-perspective: 1000px;
	-moz-perspective: 1000px;
	-o-perspective: 1000px;
	perspective: 1000px;
}

.animation-bottom-up-appear {
	-webkit-transform: rotateX(5deg) translate3d(0, 20px, 0);
	-moz-transform: rotateX(5deg) translate3d(0, 20px, 0);
	-o-transform: rotateX(5deg) translate3d(0, 20px, 0);
	transform: rotateX(5deg) translate3d(0, 20px, 0);
}

.animation-top-down-appear-parent {
	-webkit-perspective: 1000px;
	-moz-perspective: 1000px;
	-o-perspective: 1000px;
	perspective: 1000px;
}

.animation-top-down-appear {
	-webkit-transform: rotateX(-5deg) translate3d(0, -20px, 0);
	-moz-transform: rotateX(-5deg) translate3d(0, -20px, 0);
	-o-transform: rotateX(-5deg) translate3d(0, -20px, 0);
	transform: rotateX(-5deg) translate3d(0, -20px, 0);
}

/**
to show white text on dark background without bolding
*/

.white-text-on-dark-dont-bold {
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;	
}

/*
spin animation
*/

#outer_shell .gcui-spin {
	-webkit-animation-name: gcui-spin;
    -webkit-animation-duration: 1000ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: gcui-spin;
    -moz-animation-duration: 1000ms;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: gcui-spin;
    -ms-animation-duration: 1000ms;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
}

@-webkit-keyframes gcui-spin {
    0%  {-webkit-transform: rotate(0deg); }
    100% {-webkit-transform: rotate(360deg); }
}


/**
vertical centering ala http://css-tricks.com/centering-in-the-unknown/
*/

.center-parent:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -0.25em;
}

.centered {
    display: inline-block;
    vertical-align: middle;
}