/*--				letzte Aenderung 14.07.2024		(C) Uli Blum			--*/
/*---  Roadstuff-Farben: 	magenta #de106b
							dkgrau #7E8C93
							mdgrau #8B9BA2
							hgrau #A2B4BD
							bgblau #B4C8D2
							text 000000  ---*/

*:focus{
 outline: none;
}
html {
	scroll-behavior: smooth;
}
*::selection {
	background: rgba(0, 0, 0, 0.0);
}
body {
	background-color: #010101; 	/* helle Farbe = TEMP !!!!*/
 	background-image: url(main_img/rs_bg.gif);
 	background-size: 120px;
	background-position: left;
	background-repeat: repeat;
	background-attachment: fixed;
	cursor: default;
}
#rs_background_overlay {	/*Background-Gradient*/
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(320deg, rgba(130 , 100, 150, 0.16), rgba(100 , 140, 130, 0.18));
	z-index: -10;
}

/*------------------------------------------- CONTENT DEFINITIONS ------------*/
#rs_content_bg {					/*------ black BG ------*/
	position: relative;
	width: 620px;
	background-color: #000;
	border-radius: 17px;
	border: none;
	margin: 12px auto 40px auto;
	padding-bottom: 22px;
	box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2) ;
}

#rs_content_area {				/*------ blauer Content BG ------*/
    position: relative;
	top: 5px;
	width: 600px;
	margin: 10px 10px 10px 10px;
    padding-bottom: 10px;
	background-color: #b4c8d2;
	background-image: linear-gradient(120deg, #b4c8d2, #96a7b0);
	border-radius: 12px;
	border: none;
	box-shadow: 2px 3px 2px 0px #7e8c93 inset;
}
.rs_content_text_full_width {		/*------ Text Content Vollflaeche ------*/
	position: relative;
	width: 580px;
	top: 18px;
	margin-left: 10px;
	padding-bottom: 10px;
}
.rs_content_text_right_100 {	/*--- Text Content m. 100px Spalte rechts ---*/
	position: relative;
	width: 380px;
	top: 18px;
	display: grid;
	grid-template-columns: 480px 100px;
	margin-left: 10px;
	padding-bottom: 10px;
}
.rs_content_text_50_50 {	/*--- Text Content halbe / halbe ---*/
	position: relative;
	width: 555px;
	top: 18px;
	display: grid;
	grid-template-columns: 275px 275px;
	margin-left: 10px;
	padding-bottom: 10px;
}
article .rs_column_500 {		/*--- 500px Spalte ---*/
	width: 400px;
	max-width: 500px;
}
article .rs_column_275 {		/*--- 275px Spalte ---*/
	width: 275px;
}

aside .rs_column_100 {			/*--- 100px Spalte ---*/
	width: 100px;
}
#rs_final_content {			/*------ Bottom: Uptdate + Links --*/
	position: relative;
	width: 600px;
	height: 129px;
	padding-bottom: 40px;
	
}
footer {					/*------ Fusszeile roter Text ------*/
	width: 592px;
	height: 10px;
	margin: -7px 14px 0px 14px;
	display: grid;
	grid-template-columns: 296px 296px;
}
.rs_old_small_img_column {	/*------ Bilderleiste OLDSTUFF ------*/
	width: 90px;
	height: 990px;
	display: grid;
	grid-template-rows: 90px 90px 90px 90px 90px 90px 90px 90px 90px 90px 90px;
	margin: 32px 5px 0px 5px;
}
.rs_misc_small_5_img_column {	/*------ Bilderleiste 5 Pix MISC ------*/
	width: 450px;
	height: 90px;
	display: grid;
	grid-template-columns: 90px 90px 90px 90px 90px;
	margin: 10px auto 9px auto;
}
.rs_misc_small_4_img_column {	/*------ Bilderleiste 4 Pix MISC ------*/
	width: 360px;
	height: 90px;
	display: grid;
	grid-template-columns: 90px 90px 90px 90px;
	margin: 10px auto 9px auto;
}
#rs_imprint_scroll_field {		/*-- Kleingedrucktes LEGALS ---*/
	width: 575px;
	height: 205px;
	margin: 5px 12px -11px 0px;
	overflow: auto;
	scrollbar-width: thin;
}
/*-----------------------------------------------  IMAGES --------------------*/
.rs_small_img_right {			/*------ klein - WELCOME ------*/
	width: 100px;
	height: auto;
	margin: 8px 1px 0px 20px;
	float: right;
	transition: all 0.3s
}
#rs_12ta_img_right {					/*------ NEWSTUFF ------*/
	width: 75px;
	height: 250px;
	margin: 30px 8px 10px 17px;
	transition: all 4s;
	transition-timing-function: ease-out;
}
#rs_12ta_img_right:hover {
	scale: 1.6 1.6;
  	translate: -18px 25px;
	opacity: 0.1;
	transition: all 2s;
}
.rs_small_square_img {			/*--- Thumbnails OLDSTUFF, MISC -*/
	width: 90px;
	height: 90px;
	margin: 0px;
	z-index: 0;
	box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.3) ;
	cursor: zoom-in;
	transition: all 0.2s;
}
.rs_small_square_img:hover {
	z-index: 10;
	filter: brightness(1.2);
	box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.9) ;
	transition: all 0.05s;
}
.rs_std_link_banner {		/*--- Standard Banner - LINKS ------*/
	width: 240px;
	height: auto;;
	margin: -3px 0px 0px 0px;
	transition: all 0.2s;
}
.rs_std_link_banner:hover {
	filter: brightness(1.2);
	transition: all 0.1s;
}
#rs_link_mzm_rbanner {	/*--- Musik Zirkus Magazin - LINKS ------*/
	width: 270px;
	height: auto;;
	margin: -3px 0px 0px -7px;
	transition: all 0.2s;
}
#rs_link_mzm_rbanner:hover {
	filter: brightness(1.2);
	transition: all 0.1s;
}
.rs_item_hover:hover {		/*---  Hover FX / div. Seiten ---*/
	filter: brightness(1.2) drop-shadow(0px 0px 3px rgba( 0, 0, 0, 0.3));
	transition: 0.1s;
}

/*--------------------------------------------- TYPOGRAFIE -------------------*/
a:link,								/*--- Links ------*/
a:visited {
	font-weight: bold;
	color: #000;
	text-decoration: none;
	
}
a:hover,
a:active  {
	font-weight: bold;
	color: #000;
	text-decoration: underline;
}
h2,								/*--- Content ------*/
.rs_header_txt {
	font: bold 15px Verdana, Arial, SansSerif;
	color: #000;
	margin-top: 0px;
	margin-bottom: 0px;
}
.rs_subline_txt {
	font: bold 12px Verdana, Arial, SansSerif;
	color: #000;
	margin-top: 0px;
	margin-bottom: 0px;
}
.rs_main_txt {
	font: normal 11px Verdana, Arial, SansSerif;
	color: #000000;
	margin-top: 7px;
	margin-bottom: 12px;
	margin-right: 20px;
}
.rs_main_txt span {
	font: bold 11px Verdana, Arial, SansSerif;
	color: #7E8C93;
	letter-spacing: 0.5px;
	padding-top: 11px;
}
.rs_main_txt ul {
	list-style-type: square;
	margin-top: -3px;
}
.rs_main_txt li {
	font: normal 11px Verdana, Arial, SansSerif;
	color: #000000;
	margin-top: -3px;
	margin-bottom: 3px;
	margin-left: -20px;
}
#rs_footer_update_txt {				/*--- Footer Body ------*/
	font: bold 9px Verdana, Arial, SansSerif;
	letter-spacing: 1px;
	text-align: center;
	color: #7E8C93;
	margin-top:10px;
	margin-bottom:0px;
}
.rs_footer_txt_links {
	font: bold 9px Verdana, Arial, SansSerif; 
	letter-spacing: 1px;
	text-align: center;
	color: #7E8C93;
	margin-top: 5px;
	margin-bottom: 3px;
}
.rs_footer_txt_links span {
	font-size: 12px;
	font-weight: normal;
}
#rs_red_footer_txt_left,				/*--- Footer Rot ------*/
#rs_red_footer_txt_right {
	font:bold 10px Verdana, Arial, SansSerif;
	color: #E7087B;
	position: absolute;
}
#rs_red_footer_txt_left {
	left: 15px;
}
#rs_red_footer_txt_right {
	text-align: right;
	right: 15px;
}
#rs_red_footer_txt_right a:link,
#rs_red_footer_txt_right a:visited {
	font-weight: bold;
	color: #E7087B;
	text-decoration: none;
}
#rs_red_footer_txt_right a:hover,
#rs_red_footer_txt_right a:active  {
	font-weight: bold;
	color: #E7087B;
	text-decoration: underline;
}
.rs_fine_print_txt {			/*----- Text LEGALS ---------*/
	font: normal 11px Verdana, Arial, SansSerif;
	color: #000;
	margin: 5px 50px 10px 0px;
}
/*---------------------------------- AUDIO / VIDEO (Tracks) ------------------*/
#rs_musicplayer {
    width: 300px;
    margin: -4px 0 0 0;
    background: #333;
    opacity: 0.8;
}  
#rs_videoplayer {
    width: 300px;
    opacity: 0.9;
}
#rs_cd_image {
	width: 300px;
	height: 265px;
    opacity: 1.0;
}
.rs_media_box {
	width: 320px;
	height: auto;
	margin: 5px 0px 0px 40px;
	border: 0px solid #000;
}
#rs_musicplayer,
#rs_videoplayer,
#rs_cd_image {
	margin-left: 11px;
}
.rs_nav_arrow {
	width: 12px;
	height: 12px;
}
/*-------------------------------------------------- MENUE -------------------*/
#rs_menu_area {
    position: relative;
	top: 10px;
	width: 600px;
	height: 100px;
	display: grid;
	grid-template-rows: 71px 29px;
	margin: 10px 10px 10px 10px;
}
#rs_menu_items { 
	width: 620px;
	height: 29px;
	display: grid;
	grid-template-columns: 88px 94px 88px 66px 59px 75px 69px 61px;
}
/*------------------------------ MENUE + LANGUAGE - IMAGES -------------------*/
#rs_header_img {
	width: 600px;
	height: 71px;
}
#rs_menu_welcome_img_1,
#rs_menu_welcome_img_2,
#rs_menu_welcome_img_3,
#rs_menu_welcome_img_4 {
	position: absolute;
    top: 71px;
    left: 0px;
	height: 29px;
	width: 88px;
}
#rs_menu_newstuff_img_1,
#rs_menu_newstuff_img_2,
#rs_menu_newstuff_img_3,
#rs_menu_newstuff_img_4 {
	position: absolute;
    top: 71px;
    left: 88px;
	height: 29px;
	width: 94px;
}
#rs_menu_oldstuff_img_1,
#rs_menu_oldstuff_img_2,
#rs_menu_oldstuff_img_3,
#rs_menu_oldstuff_img_4 {
	position: absolute;
    top: 71px;
    left: 182px;
    top: 71px;
	height: 29px;
	width: 88px;
}
#rs_menu_tracks_img_1,
#rs_menu_tracks_img_2,
#rs_menu_tracks_img_3,
#rs_menu_tracks_img_4 {
	position: absolute;
    top: 71px;
    left: 270px;
    height: 29px;
	width: 66px;
}
#rs_menu_misc_img_1,
#rs_menu_misc_img_2,
#rs_menu_misc_img_3,
#rs_menu_misc_img_4 {
	position: absolute;
    top: 71px;
    left: 336px;
	height: 29px;
	width: 59px;
}
#rs_menu_contact_img_1,
#rs_menu_contact_img_2,
#rs_menu_contact_img_3,
#rs_menu_contact_img_4 {
	position: absolute;
    top: 71px;
    left: 395px;
	height: 29px;
	width: 75px;
}
#rs_menu_links_img_1,
#rs_menu_links_img_2,
#rs_menu_links_img_3,
#rs_menu_links_img_4 {
	position: absolute;
    top: 71px;
    left: 470px;
	height: 29px;
	width: 69px;
}
#rs_menu_legals_img_1,
#rs_menu_legals_img_2,
#rs_menu_legals_img_3,
#rs_menu_legals_img_4 {
	position: absolute;
    top: 71px;
    left: 539px;
	height: 29px;
	width: 61px;
}
.rs_menu_img_fx_group {
	opacity: 0.0;
	transition: all 0.12s;
}
.rs_lang_imgs {
	position: absolute;
	top: 0px;
	right: 2px;
	width: 88px;
	height: 23px;
	padding-bottom: 3px;
	z-index: 20;
	opacity: 0.0;
	transition: all 0.16s;
	transition-timing-function: ease-in;
}
/*----------------------------------- Formular - CONTACT ---------------------*/
.betreff, 
.betreff_error, 
.name, 
.name_error, 
.email, 
.email_error {
	width: 240px;
	height: 15px;
}
.message, 
.message_error {
	width: 390px;
	height: 75px;
} 
.captcha_code, 
.captcha_code_error {
	width: 130px;
	height: 15px;
	position: relative;
	text-align: center;
}
.betreff, 
.betreff_error, 
.message, 
.message_error, 
.name, 
.name_error, 
.email, 
.email_error, 
.captcha_code, 
.captcha_code_error {
	font-family: Verdana,Arial, sans-serif;
	font-size: 11px;
	letter-spacing: 0.5px;
	padding: 1px 10px;
	border-radius: 4px;
	margin: 2px 0 4px 0;
}
#captcha_img {
	width: 148px;
	height: 40px;
	border-radius: 4px;
	margin: 2px 0 2px 0;
}
.betreff, 
.message, 
.name, 
.email, 
.captcha_code {
	color: #333333;
	background-color: #f1f1f1;
	border: 0px solid #8B9BA2;
	transition: all 0.2s;
}
.betreff_error, 
.message_error,
.name_error, 
.email_error, 
.captcha_code_error {
	color: #000000;
	background-color: #d6dde1;
	border: 0px solid #fff;
	transition: all 0.5s;
}

.betreff:focus, 
.message:focus, 
.name:focus, 
.email:focus, 
.captcha_code:focus,
.betreff_error:focus, 
.message_error:focus,
.name_error:focus, 
.email_error:focus, 
.captcha_code_error:focus {
	background-color: #fff;
}
.button {
	position: relative;
	top: 0px;
	width: 152px;
	height: 40px;
	margin: 7px 0 0 0;
	font-family: Verdana,Arial,sans-serif;
	font-size: 11px;   
	color: #535353;
	border: 1px solid #868889;
	border-radius: 4px;
	background-color: #a2b4bd;
	background-image: linear-gradient(#cedfe8, #a2b4bd);
}   
.button:hover {
	color: #000000;
	background-color: #eeeeee;
	background-image: linear-gradient(#ffffff, #cccccc);
}
ul.errorliste {
	list-style-type: square;
	font: bold 10px Verdana, Arial, SansSerif;
	letter-spacing: 0px;
	line-height: 18px;
	color: #E7087B;
	list-style-position: outide;
	margin: 7px 0px 10px -5px;
}
/*----------------------------------------------- Foto - Popup ---------------*/
#rs_popup_bg {				/*-- Popup-Background --*/
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(10deg, rgba(25, 28, 33, 0.9), rgba(0, 0, 0, 0.65));
	z-index: 100;
	display: none;
	opacity: 0;
	transition: all 0.4s;
}
#rs_popup_container {		/*-- Popup-Container ---*/
	position: fixed;
	top: calc(50% - 245px);
	width: 690px;
	height: 490px;
	background-color: #000;
	background-image: linear-gradient(90deg, rgba(9, 8, 9, 1.0), rgba(55, 60, 65, 1.0), rgba(9, 8, 9, 1.0), rgba(55, 60, 65, 1.0), rgba(9, 8, 9, 1.0));
	border-radius: 20px;
	border: 0px solid #333;
	box-shadow: 0px 0px 50px 0px rgba(255, 255, 255, 0.15);
	overflow: hidden;
	margin-left: -47px;
	z-index: 100;
	display: none;
	opacity: 0.0;
	transition: all 0.6s;
}
#rs_popup_title {		/*------ SVG Logo ------*/
	position: absolute;
	top: 18px;
	right: 12px;
	width: 272px;
	filter: drop-shadow(0px 0px 40px rgba(180, 200, 210, 0.4));
	display: block;
}
.rs_popup_txt {			/*--- Typographie ----*/
	position: absolute;
	font: bold 14px Verdana, Arial, SansSerif;
	line-height: 20px;
	color: #B4C8D2;
	text-align: center;
	letter-spacing: 1px;
	border: 0px solid #B4C8D2;
	filter: drop-shadow( -35px 10px 35px rgba( 0, 0, 0, 0.8));
	display: none;
	opacity: 0.0;
	transition: all 0.9s;
}
#rs_popup_txt_1 {
	width: 280px;
	top: 330px;
	right: 10px;
}
#rs_popup_txt_2 {
	width: 380px;
	bottom: 7px;
	left: 10px;
}
.rs_popup_txt a:link,		/*--- Links ------*/
.rs_popup_txt a:visited {
	font-size: 10px;
	font-weight: bold;
	color: #fff;
	text-decoration: none;
	cursor: copy;
}
.rs_popup_txt a:hover,
.rs_popup_txt a:active  {
	color: #B4C8D2;
	text-decoration: underline;
}
.rs_popup_txt a:active  {
	color: #de106b;
	text-decoration: underline;
}
.rs_popup_image {		/*------ Fotos ------*/
	position: absolute;
	box-shadow: 0px 0px 50px 0px rgba(180, 200, 210, 0.4);
	display: none;
	opacity: 0;
	transition: all 0.3s;
}
#rs_popup_image_1 {
	width: 390px;
	height: 490px;
	top: 0px;
	left: 0px;
}
#rs_popup_image_2 {
	width: 690px;
	height: 315px;
	top: 95px;
	left: 0px;
}
#rs_popup_image_3 {	
	width: 645px;
	height: 904px;
	cursor: zoom-in;
	transition: all 0.5s;
}
#rs_popup_image_3_scrollframe {		/*-- Big - Image - Scrollflaeche ---*/
	position: absolute;
	width: 665px;
	height: 315px;
	top: 95px;
	left: 0px;
	background-color: #000;
	border-radius: 0px;
	border: 3px solid #333;
	box-shadow: 0px 0px 50px 0px rgba(180, 200, 210, 0.4);
	overflow: auto;
	scroll-behavior: smooth ;
	display: none;
	opacity: 0.0;
	transition: all 0.6s;
}
#rs_popup_buttons {		/*---- SVG Buttonleiste ----*/
	position: absolute;
	width: 260px;
	height: 38.5px;
	bottom: 20px;
	right: 20px;
	filter: drop-shadow(0px 0px 20px rgba(180, 200, 210, 0.3));
	display: block;
}