/*
-----------------------------------------------
		Lichtsignale
	ein Lichtsignale.de Design
----------------------------------------------- */


/*		W E B F O N T S
----------------------------------------------- */

@font-face {
		font-family: "Profile";
		src: url("../fonts/ProfileWeb-Light.eot");
		src: url("../fonts/ProfileWeb-Light.eot?#iefix") format("embedded-opentype"),
			 url("../fonts/ProfileWeb-Light.woff") format("woff"),
			 url("../fonts/ProfileComp-Light.ttf") format("truetype");
		font-weight: normal;
		font-style: normal;
}

@font-face {
		font-family: "Profile";
		src: url("../fonts/ProfileWeb-Bold.eot");
		src: url("../fonts/ProfileWeb-Bold.eot?#iefix") format("embedded-opentype"),
			 url("../fonts/ProfileWeb-Bold.woff") format("woff"),
			 url("../fonts/ProfileComp-Bold.ttf") format("truetype");
		font-weight: bold;
		font-style: normal;
}

@font-face {
		font-family: "ProfileSc";
		src: url("../fonts/ProfileScWeb-Light.eot");
		src: url("../fonts/ProfileScWeb-Light.eot?#iefix") format("embedded-opentype"),
			 url("../fonts/ProfileScWeb-Light.woff") format("woff"),
			 url("../fonts/ProfileScComp-Light.ttf") format("truetype");
		font-weight: normal;
		font-style: normal;
}

@font-face {
		font-family: "ProfileBdSc";
		src: url("../fonts/ProfileScWeb-Bold.eot");
		src: url("../fonts/ProfileScWeb-Bold.eot?#iefix") format("embedded-opentype"),
			 url("../fonts/ProfileScWeb-Bold.woff") format("woff"),
			 url("../fonts/ProfileScComp-Bold.ttf") format("truetype");
		font-weight: normal;
		font-style: normal;
}


/*		B A S I C   S E T U P
----------------------------------------------- */


* {
		margin: 0;
		padding: 0;
}

:focus, a {
		-moz-outline-style: none;
		outline: none;
}

*::-moz-selection {
		background-color: #ccc;
}

*::selection {
		background-color: #ccc;
}

img {
		border: none;
}

body {
		color: #000;
		background: #fff;
		font: 16px/18px Profile, "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", Calibri, Tahoma, "Helvetica Neue", Helvetica, Verdana, sans-serif;
}

#hidden {
		display: none;
}

em {
		font-style: normal;
		font-family: ProfileSc;
		text-transform: lowercase;
}

strong em {
		font-style: normal;
		font-weight: normal;
		font-family: ProfileBdSc;
		text-transform: lowercase;
}


/*		L I N K S
----------------------------------------------- */

a {
		text-decoration: none;
}

a:link span, a:visited span {
		display: none;
}

a:hover span, a:active span {
		display: block;
}

ul a {
		background: #000;
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
		ul a { background: #fff }
		* { -webkit-text-size-adjust: 100%; }
}

@media only screen and (max-device-width: 480px) {
		ul a { background: #fff }
		* { -webkit-text-size-adjust: 100%; }
}

ul a:link img, ul a:visited img {
		opacity: 1;
		-webkit-transition: opacity 0.2s linear;
		-moz-transition: opacity 0.2s linear;
		-o-transition: opacity 0.2s linear;
		transition: opacity 0.2s linear;
}

ul a:hover img {
		opacity: 0.15;
		-webkit-transition: opacity 0.2s linear;
		-moz-transition: opacity 0.2s linear;
		-o-transition: opacity 0.2s linear;
		transition: opacity 0.2s linear;
}


/*		G E N E R A L
----------------------------------------------- */

#wrapper {
		text-align: left;
		width: 964px;
		margin: 0 auto;
		padding-left: 6px;
}

h1 {
		display: block;
		width: 475px;
		float: left;
		font-size: 16px;
		-webkit-font-smoothing: antialiased;
}

p {
		margin-bottom: 18px;
}

#lichtsignale {
		width: 958px;
		height: 120px;
		margin-top: 18px;
		border-top: 1px solid #000;
}

#lichtsignale div {
		float: right;
		width: 475px;
}

#lichtsignale a:link, #lichtsignale a:visited {
		color: #000;
		margin-right: 12px;
		-webkit-transition: color 0.3s linear;
		-moz-transition: color 0.3s linear;
		-o-transition: color 0.3s linear;
		transition: color 0.3s linear;
}

#lichtsignale a:hover, #lichtsignale a:active {
		text-decoration: none;
		color: #888;
		-webkit-transition: color 0.15s linear;
		-moz-transition: color 0.15s linear;
		-o-transition: color 0.15s linear;
		transition: color 0.15s linear;
}

.infodiv {
		width: 958px;
		border-top: 1px solid #000;
		color: #888;
}

h2 {
		color: #000;
		font-size: 16px;
		margin-bottom: 18px;
		-webkit-font-smoothing: antialiased;
}

h3 {
		color: #000;
		font-size: 16px;
		font-weight: normal;
}

.infodiv p {
		width: 475px;
}

.onefour {
		width: 235px;
		float: left;
		margin-right: 6px;
}

.onefour h3, .onefour p {
		width: 235px;
}

.twofour {
		width: 475px;
		float: left;
		margin-right: 6px;
}

.twofour h3, .twofour p {
		width: 475px;
}

.twofour p {
		margin-bottom: 0;
}

.twofour a:link, .twofour a:visited {
		color: #000 !important;
		text-decoration: underline;
		-webkit-transition: color 0.3s linear;
		-moz-transition: color 0.3s linear;
		-o-transition: color 0.3s linear;
		transition: color 0.3s linear;
}

.twofour a:hover, .twofour a:active {
		color: #888 !important;
		-webkit-transition: color 0.15s linear;
		-moz-transition: color 0.15s linear;
		-o-transition: color 0.15s linear;
		transition: color 0.15s linear;
}

.quote {
		text-indent: -6px;
}

.pauftraggeber a {
		margin-right: 2px;
		line-height: 24px;
}

.infodiv a:link, .infodiv a:visited {
		color: #888;
		text-decoration: underline;
		-webkit-transition: color 0.3s linear;
		-moz-transition: color 0.3s linear;
		-o-transition: color 0.3s linear;
		transition: color 0.3s linear;
}

.infodiv a:hover, .infodiv a:active {
		color: #000;
		-webkit-transition: color 0.15s linear;
		-moz-transition: color 0.15s linear;
		-o-transition: color 0.15s linear;
		transition: color 0.15s linear;
}

#filters {
		border-top: 1px solid #000;
		width: 958px;
		color: #ccc;
		margin-bottom: 9px;
}

#filters strong {
		font-weight: normal;
		color: #000;
}

#filters .selected {
		color: #000 !important;
}

#filters a:link, #filters a:visited {
		color: #888;
		margin: 0 4px 0 3px;
		-webkit-transition: color 0.3s linear;
		-moz-transition: color 0.3s linear;
		-o-transition: color 0.3s linear;
		transition: color 0.3s linear;
}

#filters a:hover, #filters a:active {
		color: #000;
		-webkit-transition: color 0.15s linear;
		-moz-transition: color 0.15s linear;
		-o-transition: color 0.15s linear;
		transition: color 0.15s linear;
}

li {
		list-style: none;
		display: block;
		float: left;
		margin: 6px 6px 0 0;
}

span {
		color: #fff;
		width: 210px;
		padding: 3px 15px 5px 10px;
		position: relative;
		top: -149px;
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
		span { color: #000 }
}

@media only screen and (max-device-width: 480px) {
		span { color: #000 }
}

span strong {
		display: block;
}

li a:link, li a:visited {
		display: block;
		width: 235px;
		height: 150px;
}


/*		C O L O R B O X
----------------------------------------------- */

#colorbox, #cboxOverlay, #cboxWrapper {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 9888;
		overflow: hidden;
}

#cboxOverlay {
		position: fixed;
		width: 100%;
		height: 100%;
}

#cboxMiddleLeft, #cboxBottomLeft {
		clear: left;
}

#cboxContent {
		position: relative;
		overflow: visible;
}

#cboxLoadedContent {
		overflow: auto;
}

#cboxLoadedContent iframe {
		display: block;
		width: 100%;
		height: 100%;
		border:0;
}

#cboxTitle {
		margin: 0;
}

#cboxLoadingOverlay, #cboxLoadingGraphic {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
}

#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {
		cursor: pointer;
}

#cboxOverlay {
		background: #fff;
}

#colorbox {
}

#cboxContent {
		margin-top: 32px;
		border: none;
}

#cboxContent {
		background: #fff;
		padding: 1px;
}

#cboxLoadingGraphic {
		background: url(loading.gif) center center no-repeat;
}

#cboxLoadingOverlay {
		background: #fff;
}

#cboxTitle {
		position: absolute;
		top: -22px;
		left: 0;
		color: #000;
}

#cboxCurrent {
		position: absolute;
		top: -20px;
		right: 80px;
		color: #888;
}

#cboxSlideshow, #cboxPrevious, #cboxNext, #cboxClose {
		text-indent: -9888px;
		width: 20px;
		height: 20px;
		position: absolute;
		top: -20px;
		background: url(controls.png) 0 0 no-repeat;
}

#cboxPrevious {
		background-position: 0px 0px;
		right: 44px;
}

#cboxPrevious.hover {
		background-position:0px -25px;
}

#cboxNext {
		background-position: -25px 0px;
		right: 22px;
}

#cboxNext.hover {
		background-position: -25px -25px;
}

#cboxClose {
		background-position: -50px 0px;
		right: 0;
}

#cboxClose.hover {
		background-position: -50px -25px;
}

.cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious {
		right: 66px;
}

.cboxSlideshow_on #cboxSlideshow {
		background-position: -75px -25px; right: 44px;
}

.cboxSlideshow_on #cboxSlideshow.hover {
		background-position: -100px -25px;
}

.cboxSlideshow_off #cboxSlideshow {
		background-position: -100px 0px; right: 44px;
}

.cboxSlideshow_off #cboxSlideshow.hover {
		background-position: -75px -25px;
}


/*		I S O T O P E
----------------------------------------------- */

.isotope-item {
		z-index: 2;
}

.isotope-hidden.isotope-item {
		pointer-events: none;
		z-index: 1;
}

.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
       -o-transition-property:         top, left, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}
