/* CSS Document */
body {
	margin: 0 auto;
	padding: 0;
	background-color: #000;
	color: #c5c5c5;
	font-family: Arial, Helvetica, sans-serif;
	background-image: url('images/background.jpg');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center;
}
.wrapper {
	width: 90%;
	margin: 0 auto;
	padding: 0;
		background-image: url('images/background.jpg');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center;
}
.wrapper_gris {
	background-color: #121212;
	width: 100%;
	margin: 30px auto;
	padding: 20px 0;
}
.wrapper-inicio-slider {
	background-color: #121212;
	width: 90%;
	margin: 25px auto;
	padding: 0;
}
header {
	height: auto;
	margin: 0 auto;
}
#logo {
	width: 25%;
	text-align: left;
	float: left;
	margin-top: 25px;
	margin-bottom: 25px;
}
#logo img {
	width: 95%;
}
#header-slider {
	width: 74%;
	float: left;
	margin-top: 25px;
	margin-bottom: 25px;
	margin-left: 1%;
}
.golden-base {
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-weight: bold;
	-webkit-margin-before: 0.3em;
	-webkit-margin-after: 0.2em;
}
.golden1 {
	background-image: -webkit-linear-gradient(#FFF65C, #3A2C00);
	text-shadow: -0.02em -0.03em 0.005em rgba(255, 223, 0, 0.60);
}
nav {
	width: 100%;
	float: left;
	margin: auto 0;
}
#slider {
	background-color: #313336;
	height: 340px;
	margin: auto;
}
#contenido {
	margin-top: 25px;
	padding: 5%;
	height: 100%;
	font-size: 14px;
	color: #c5c5c5;
	text-align: justify;
	letter-spacing: 1px;
	border: 1px solid #cc9832;
	    background-image: images/bg-era.jpg;
		}
h8 {
	color: #CC981C;
	font-size: 36px;
	/*background-color: #333;*/
	letter-spacing: .1em;
	text-shadow: 0 -1px 0 #fff, 0 1px 0 #2e2e2e, 0 2px 0 #2c2c2c, 0 3px 0 #2a2a2a, 0 4px 0 #282828, 0 5px 0 #262626, 0 6px 0 #242424, 0 7px 0 #222, 0 8px 0 #202020, 0 9px 0 #1e1e1e, 0 10px 0 #1c1c1c, 0 11px 0 #1a1a1a, 0 12px 0 #181818, 0 13px 0 #161616, 0 14px 0 #141414, 0 15px 0 #121212, 0 22px 30px rgba(0, 0, 0, 0.9);
}
.box{
 display:block; width:240px; float:left; padding:20px;	
}
.gold {
	color: #CC9832;
	text-shadow: 2px 2px #000000;
	
}
.gold-title {
	color: #CC9832;
	text-shadow: 2px 2px #000000;
	font-size: 18px;
}
p.gold, ul.gold {
	color: #CC9832;
	text-shadow: 2px 2px #000000;
	line-height: 25px;
}
p.gold-title {
	color: #CC9832;
	text-shadow: 2px 2px #000000;
	line-height: 25px;
	font-size: 18px;
	font-weight: bold;
}
.gold-foto-titel {
	text-align: center;
	background: #ffc107;
	color: #000;
	padding: 3px;
	display: block;
	margin-top: -33px;
	color: #CC9832;
	text-shadow: 2px 2px #000000;
	font-size: 18px;
	text-transform: uppercase;
}
#servicios .jThumbnailScroller {
	width: 970px !important;
	padding: 0 10px;
	height: 114px
}
#servicios .jThumbnailScroller .jTscrollerContainer {
	margin-left: 0px;
	height: 114px
}
#marcas, #personal, #servicios {
	height: 182px;
	background: #202021;
	border-top: 1px solid #292929;
	margin-top: 30px;
	overflow: hidden;
	position: relative
}
.jThumbnailScroller {
	position: relative;
	width: 875px !important;
	height: 114px;
	margin: 30px auto 0 auto;
	padding: 0;
	overflow: hidden;
	padding-right: 85px
}
.jThumbnailScroller .jTscrollerContainer {
	position: absolute;
	margin-left: 47px
}
.jThumbnailScroller .jTscroller {
	position: relative;
	height: 100%;
	margin: 0;
	left: 0;
	top: 0;
	display: inline-block
}
.jTscrollerNextButton, .jTscrollerPrevButton {
	position: absolute !important;
	display: block;
	width: 29px;
	height: 35px;
	opacity: 0.7;
	background: url(../images/flechas.png);
	top: 35px;
	z-index: 9999
}
.jTscrollerNextButton {
	right: 0;
	background-position: right top
}
.jTscrollerPrevButton {
	left: 0;
	background-position: left top
}
.jTscrollerNextButton:hover, .jTscrollerPrevButton:hover {
	opacity: 1
}
.jThumbnailScroller .jTscroller a img {
	border: none
}
img.personal {
	margin: 12px auto 0 auto;
	width: 970px;
	display: block
}
#imagen {
	position: absolute;
	z-index: 99999;
	padding: 5px;
	background: #5E5E5E;
	border: 1px solid #000
}
#servicios .jThumbnailScroller {
	width: 970px !important;
	padding: 0 10px;
	height: 114px
}
#servicios .jThumbnailScroller .jTscrollerContainer {
	margin-left: 0px;
	height: 114px
}
h3, .titulo h2 {
	font-family: 'MyriadProSemiboldCondensed', arial;
	color: #fddc00;
	font-size: 36px;
	text-transform: uppercase;
	font-weight: normal
}
.titulo {
	height: 60px;
}
.titulo h2 {
	color: #FDDC27;
	float: left;
	display: block;
	width: 455px;
	margin: 0 auto;
	height: 40px;
	font-size: 24px;
	line-height: 40px;
	padding-left: 20px;
	font-weight: bold;
}
#main, #realizacion {
	width: 970px;
	margin: 20px auto 0 auto;
	font-size: 14px;
	color: #c5c5c5;
	letter-spacing: 1px;
	overflow: hidden
}
#main p {
	color: #c5c5c5;
	font-size: 14px;
	line-height: 21px;
	text-align: justify;
	margin-bottom: 9px
}
#main span {
	font-size: 14px;
	color: #c5c5c5;
}
#main img {
	margin-left: 18px
}
#foto-box {
	background-color: #000;
	height: 700px;
}
.fotobox-inhalt {
	width: 970px;
	margin: auto;
}
#iframe-box {
	background-color: #000;
	height: 500px;
}
.p7 {
	text-align: center;
	margin-left: 300px;
}
footer {
	width: 100%;
	color: #CC9835;
	margin: 20px 0 20px 0;
	font-size: 12px; /*background:#CC9835;*/
}
.footer-links {
	float: left;
	width: 30%px;
}
.footer-mitte {
	float: left;
	/*background-color: #FDDC27;*/
	width: 30%;
	padding-top: 10px;
	padding-left: 0px;
	font-size: 12px;
	color: #1D252D;
	font-weight: bolder;
}
.footer-mitte a:visited {
	color: #c5c5c5;
	text-decoration: mone;
}
.footer-mitte a:link {
	color: #c5c5c5;
	text-decoration: none;
}
.footer-mitte a:hover {
	color: #FB7301;
	text-decoration: underline;
}
.footer-mitte a:active {
	color: #FB7301;
	text-decoration: underline;
}
.footer-rechts {
	width: 30%;
	float: left;/*background-color: #FDDC27;*/
}
.footer-rechts a:visited {
	color: #000;
	text-decoration: mone;
}
.footer-rechts a:link {
	color: #000;
	text-decoration: none;
}
.footer-rechts a:hover {
	color: #005A9C;
	text-decoration: underline;
}
.footer-rechts a:active {
	color: #005A9C;
	text-decoration: underline;
}
#footer-design {
	float: left;
	width: 970px;
	background-color: #171717;
	color: #F3F3F3;
	height: 15px;
	text-align: right;
	padding-right: 85px;
}
.social {
	margin-right: 50px;
}
img-social {
	margin-top: 20px;
}
.social-icon {
	padding: 0 5px 0 0;
	width: 50px;
	height: 50px;
}
.img-footer {
	height: 170px;
	padding: 5px 20px 5px 50px;
}
.img-portada {

}

footer, p {
	line-height: 14px;
}
/* img:hover {
  opacity: 0.5;
}*/
.iframe-container{
  position: relative;
  width: 45%;
 
  display: inline-block;
}

.btn-whatsapp {
        display:block;
        width:70px;
        height:70px;
        color#fff;
        position: fixed;
        right:20px;
        bottom:20px;
        border-radius:50%;
        line-height:80px;
        text-align:center;
        z-index:999;
}

@media only screen and (max-width: 500px) {
.iframe-container{

  width: 100%;

}
.iframe-container iframe{

  width: 100%;

}
#logo {
	width: 100%;
	text-align: center;
	float: left;
}
#logo img {
	width: 60%;
}
#header-slider {
	width: 100%;
	padding-left: 0%;
	float: left;
}
.social-icon {
	padding: 0 5px 0 0;
	width: 50px;
	height: 50px;
}
.title-gold {
	font-size: 18px;
}
.title-gold-svg {
	font-size: 18px;
	text-align: center;
}
.title-gold-steel {
	font-size: 16px;
}
.title-gold-steel-svg {
	font-size: 16px;
	text-align: center;
}
.title-gold-12 {
	font-size: 12px;
}
#contenido {
	padding: 2%;
	height: 100%;
	font-size: 14px;
	color: #c5c5c5;
	text-align: left;
	letter-spacing: 1px;
	border: 1px solid #cc9832;
}
.wrapper {
	width: 95%;
	margin: 0 auto;
	padding: 0;
}
.img-footer {
	height: 100px;
	margin: auto 0;
	padding: 0 60px 15px 60px;
}
svg {
	text-shadow: -1px 0px 1px rgb(97, 100, 5);
}
.bild {
	max-width: 98%;
	height: auto;
}