#gesuch {
width: 500px; /* Breite des Codes */ 
background:url(http://serienportal.de/blanko/codes/bilder/white.png); /* Hintergrundbild des Codes, hier weiß-gestreift */
margin: 10px 0px;
color: #151515; /* Schriftfarbe, die nicht in den einzelnen Containern bereits definiert ist */
}

#gesuch .ueberschrift {
font: italic bold 32px/120% 'Cambria', sans-serif; /* Ueberschrift der Abschnitte */
text-transform: uppercase;
text-align: center;
color: #963737;
letter-spacing: 1px;
margin-top: 5px;
padding: 0px 10px;
}

#gesuch .untertitel {
font: normal 8px/99% 'calibri', sans-serif; /* Untertitel der Abschnitte */
text-transform: uppercase;
text-align: center;
color: #963737;
letter-spacing: 3px;
word-spacing: 3px;
margin-bottom: 5px;
padding: 0px 40px;
}

#gesuch b {
color: #963737;
font-weight: bold;
letter-spacing: 1px;
}

#gesuch i {
color: #963737;
font-style: italic;
letter-spacing: 1px;
}

#gesuch u {
color: #963737;
letter-spacing: 1px;
 text-decoration: underline #963737;
}

#gesuch s {
color: #963737;
letter-spacing: 1px;
text-decoration: line-through #963737;
opacity: 0.6;
}

#gesuch span {
background:url(http://serienportal.de/blanko/codes/bilder/red.png);
font: bold 10px/90% 'Source Sans Pro', sans-serif; /* Ueberschrift im Textabschnitt */
color: #fff;
text-transform: uppercase;
letter-spacing: 1px;
padding: 1px 3px 1px 5px;
margin: 0px 10px 0px -10px;
opacity: 0.9;
}

#gesuch hr {
color: #963737; /* IE */
background-color: #963737; 
height: 2px;
opacity: 0.8;
border: none;
}

/* Alle Links im Gesuch */

#gesuch a:link, #gesuch a:visited, #gesuch a:active {
text-decoration: underline;
font: bold 12px/120% 'Source Sans Pro', sans-serif;
color: #963737;
text-transform: uppercase;
letter-spacing: 1px;
padding: 0px 2px 1px 2px;
margin: 0px;
opacity: 0.9;
}

#gesuch a:hover {
text-decoration: underline;
text-transform: lowercase;
}

/* Kopftei */

#gesuch .gesuch-header {
padding: 20px 35px 40px 35px;
background:url(http://serienportal.de/blanko/codes/bilder/red.png);
color: #fff;
text-align: right;
}

#gesuch h1 {
font: bold 30px/90% 'Poppins', sans-serif;
color: #fff;
text-transform: uppercase;
}

#gesuch h2 {
font: normal 8px/90% 'Source Sans Pro', sans-serif;
color: #fff;
text-transform: uppercase;
letter-spacing: 1px;
margin-top: -20px;
}

/* Fussteil */

#gesuch .gesuch-footer {
padding: 20px 35px 40px 35px;
background:url(http://serienportal.de/blanko/codes/bilder/red.png);
color: #fff;
text-align: left;
}


/* ABSCHNITT 1: DER SUCHENDE */

#suchender { 
width: 200px; 
height: 150px;   
background: url(http://placehold.it/200x150); /* Kleines Bild */
background-repeat: no-repeat; 
position: relative; 
overflow: hidden;
margin: 0px auto;
border-top: solid 3px #963737;
border-bottom: solid 3px #963737;
}

#suchender b {
color: #ffffff;
font-weight: 900;
}

#suchender i {
color: #ffffff;
}

#suchender u {
color: #ffffff;
}

/* Stichpunkte Textdefinition Hover-Bild klein */

#suchender .stext1 {
color: #fff;
font: normal 8px/110% 'Source Sans Pro', sans-serif;
letter-spacing: 1px;
text-transform: uppercase;
float: left; /* links */
margin: 20px 20px 20px 20px;
}

#suchender .stext2 {
color: #fff;
font: normal 8px/110% 'Source Sans Pro', sans-serif;
letter-spacing: 1px;
text-transform: uppercase;
float: right; /* rechts */
margin: 20px 20px 20px 20px;
}

/* Stichpunkte Hover Bild klein */

#suchender .stichpunkt1 { 
background:url(http://serienportal.de/blanko/codes/bilder/red.png); 
width: 200px; 
height: 50px; 
position: absolute; 
top: 0px; 
left: -230px; 
opacity: 0.9; 
-webkit-transition: 0.8s; transition: 0.8s; -moz-transition: 0.8s; -o-transition: 0.8s;
}

#suchender .stichpunkt2 {  
background:url(http://serienportal.de/blanko/codes/bilder/red.png); 
width: 200px; 
height: 50px; 
position: absolute; 
top: 50px; 
left: 230px; 
opacity: 0.9; 
-webkit-transition: 0.8s; transition: 0.8s; -moz-transition: 0.8s; -o-transition: 0.8s;
}

#suchender .stichpunkt3 { 
background:url(http://serienportal.de/blanko/codes/bilder/red.png);
width: 200px; 
height: 50px; 
position: absolute; 
top: 100px; 
left: -230px; 
opacity: 0.9; 
-webkit-transition: 0.8s; transition: 0.8s; -moz-transition: 0.8s; -o-transition: 0.8s;
}

#suchender:hover .stichpunkt1, #suchender:hover .stichpunkt2,#suchender:hover .stichpunkt3 {
position: absolute; 
left: 0px; 
}

/* Stichpunkte rechts vom Bild */

.punkt {
width: 134px;
background:url(http://serienportal.de/blanko/codes/bilder/red.png);
color: #fff;
font: normal 8px/110% 'Source Sans Pro', sans-serif;
letter-spacing: 1px;
text-transform: uppercase;
text-align: center;
margin: 1px; 
padding: 5px 2px;
display: inline-block;
opacity: 0.9;
}

/* Schrifttext Suchender */

.suchender-text {
text-align: justify;
font: normal 12px/120% 'Source Sans Pro', sans-serif;
color: #151515;
margin: 5px 15px 25px 15px;
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
    -webkit-column-gap: 20px; /* Chrome, Safari, Opera */
    -moz-column-gap: 20px; /* Firefox */
    column-gap: 20px;
}

/* ABSCHNITT 2: DER GESUCHTE */

#gesuchter { 
width: 500px; 
height: 250px;   
background: url(http://placehold.it/500x250); /* grosses Bild */
background-repeat: no-repeat; 
position: relative; 
overflow: hidden;
margin: 0px auto;
border-top: solid 5px #963737;
border-bottom: solid 5px #963737;
margin: 15px 0px 5px 0px;
}


#gesuchter b {
color: #ffffff;
font-weight: 900;
}

#gesuchter i {
color: #ffffff;
}

#gesuchter u {
color: #ffffff;
}

/* Stichpunkte Textdefinition Hover-Bild gross */

#gesuchter .stext1 {
color: #fff;
font: normal 8px/110% 'Source Sans Pro', sans-serif;
letter-spacing: 1px;
text-transform: uppercase;
float: left;
margin: 20px 20px 20px 20px;
}

#gesuchter .stext2 {
color: #fff;
font: normal 8px/110% 'Source Sans Pro', sans-serif;
letter-spacing: 1px;
text-transform: uppercase;
float: right;
margin: 20px 20px 20px 20px;
}

/* Stichpunkte Hover Bild groß */

#gesuchter .stichpunkt1 { 
background:url(http://serienportal.de/blanko/codes/bilder/red.png); 
width: 500px; 
height: 50px; 
position: absolute; 
top: 0px; 
left: -530px; 
opacity: 0.9; 
-webkit-transition: 0.8s; transition: 0.8s; -moz-transition: 0.8s; -o-transition: 0.8s;
}

#gesuchter .stichpunkt2 {  
background:url(http://serienportal.de/blanko/codes/bilder/red.png);  
width: 500px; 
height: 50px; 
position: absolute; 
top: 50px; 
left: 530px; 
opacity: 0.9; 
-webkit-transition: 0.8s; transition: 0.8s; -moz-transition: 0.8s; -o-transition: 0.8s;
}

#gesuchter .stichpunkt3 { 
background:url(http://serienportal.de/blanko/codes/bilder/red.png);
width: 500px; 
height: 50px; 
position: absolute; 
top: 100px; 
left: -530px; 
opacity: 0.9; 
-webkit-transition: 0.8s; transition: 0.8s; -moz-transition: 0.8s; -o-transition: 0.8s;
}

#gesuchter .stichpunkt4 { 
background:url(http://serienportal.de/blanko/codes/bilder/red.png);
width: 500px; 
height: 50px; 
position: absolute; 
top: 150px; 
left: 530px; 
opacity: 0.9; 
-webkit-transition: 0.8s; transition: 0.8s; -moz-transition: 0.8s; -o-transition: 0.8s;
}

#gesuchter .stichpunkt5 {  
background:url(http://serienportal.de/blanko/codes/bilder/red.png);  
width: 500px; 
height: 50px; 
position: absolute; 
top: 200px; 
left: -530px; 
opacity: 0.9; 
-webkit-transition: 0.8s; transition: 0.8s; -moz-transition: 0.8s; -o-transition: 0.8s;
}

#gesuchter:hover .stichpunkt1, #gesuchter:hover .stichpunkt2, #gesuchter:hover .stichpunkt3,  #gesuchter:hover .stichpunkt4, #gesuchter:hover .stichpunkt5 {
position: absolute; 
left: 0px; }

/* Schrifttext Gesuchter */

#gesuchter-text {
text-align: justify;
font: normal 12px/120% 'Source Sans Pro', sans-serif;
color: #151515;
margin: 15px 15px 25px 15px;
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
    -webkit-column-gap: 20px; /* Chrome, Safari, Opera */
    -moz-column-gap: 20px; /* Firefox */
    column-gap: 20px;
}

/* ABSCHNITT 3: SONSTIGES */

.sonstiges-text {
text-align: justify;
font: normal 12px/120% 'Source Sans Pro', sans-serif;
color: #151515;
margin: 15px 15px;
}