 /************************************************************************
		 *********       Responsive Website entwickelt von       *********
		 *********       Dominic Forderer, Internetagentur       *********
		 *********       DFIS, D-78224 Singen                    *********
		 *********       www.df-is.de / mail@df-is.de            *********
         ****************************************************************/

 /*
         *****************************************************************
         *****************************************************************
		 ************            BASISDEFINITIONEN            ************
         *****************************************************************
         *****************************************************************
 */

html, body
 {
  color:#FFCC00;
  background-image:url('../images/ricepaper_v33d.png');
  font-size:14px;
  font-family:Arial, Verdana, sans-serif;
  margin:0;
 }
html
 {
  height: 100%;
 }
body
 {
  position:absolute;
  top:0;
  bottom:0;
  right:0;
  left:0;
 }

 /*
         *****************************************************************
         *****************************************************************
		 ************          TEXTELEMENTE, LINKS          ************
         *****************************************************************
         *****************************************************************
 */
 
a
 {
  color:white;
  text-decoration:none;
 }

a:hover
 {
  color:white;
  text-decoration:underline;
 }

h1, h2, h3
 {
  border-bottom: 1px dotted #FFCC00;
  font-size:22px;
  margin-bottom:11px;
  margin-top: 0;
  font-style:italic;
 }

p
 {
  font-size:14px;
  line-height:140%;
 }

 

 /*
         *****************************************************************
         *****************************************************************
		 ********      KONTAKTFORMULAR, aus alter Seite Typo3     ********
         *****************************************************************
         *****************************************************************
 */
 
 input, textarea, select {
	border: 1px solid #FFCC00;
	background-color: #660000;
	color: #FFCC00;
}
 
.csc-mailform {
	border: none;
	width: 500px;
	margin: 0px;
	padding: 0px;
}
.csc-mailform input,  .csc-mailform textarea, .csc-mailform select {
	padding: 3px;
}
.csc-mailform input#mailformEmail_Adress,
.csc-mailform input#mailformName
 {
	width: 150px;
}

.csc-mailform select#mailformHow_did_you_find_RFA_Int {
	width: 160px;
}

.csc-mailform #mailformMessage {
	width: 240px;
	height: 200px;
}


.csc-mailform-submit {
	margin-left: 100px;   /*gleicher wert setzen wie width von .csc-mailform-field label*/
	width: 100px;
	/*background-color: #FFFFFF;*/
}

.csc-mailform-field label { 
width: 100px; 
display:block; 
float: left;
}

.csc-mailform-field { padding-bottom: 12px; 
}




 

 /*
         *****************************************************************
         *****************************************************************
		 ********        Sonstiges aus alter Seite Typo3       ********
         *****************************************************************
         *****************************************************************
 */




    DIV.csc-textpic-left DIV.csc-textpic-imagewrap .csc-textpic-image,
	DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap .csc-textpic-image,
	DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap .csc-textpic-image {
		display: inline; /* IE fix for double-margin bug */
		margin-right: 10px;
	}

	/* DL: This will place the images side by side */
	DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image { float: left; margin-bottom: 10px; }
	DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image DT { float: none; }
	DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image DD { float: none; }
	DIV.csc-textpic DIV.csc-textpic-imagewrap DL.csc-textpic-image DD IMG { border: none; } /* FE-Editing Icons */
	DL.csc-textpic-image { margin: 0; }
	DL.csc-textpic-image DT { margin: 0; display: inline; }
	DL.csc-textpic-image DD { margin: 0; }

	/* Clearer */
	DIV.csc-textpic-clear { clear: both; }


    .csc-header h2
	 {
	  font-size: 14px;
      font-weight: bold;
	  border-bottom:0;
	  font-style:normal;
	 }

	 
	 
	 
 
 /*
         *****************************************************************
         *****************************************************************
		 ************           SEITEN-GRUNDSTRUKTUR          ************
         *****************************************************************
         *****************************************************************
 */
 
 
/* GRUNDLEGEND */

#wrapper_outer
 {
  background-color:#660000;
  margin-left:auto;
  margin-right:auto;
  margin-top:75px;
  margin-bottom:2%;
  width:95%;
  max-width:900px;
  min-width:270px;
 }
 
 
 
/* HEADER */

#wrapper_header
 {
  width:100%;
  height:36px;
  background-color:green;
 }
    
	#logo
	 {
	  position:relative;
	    left:35px;
	    top:-88px;
	 }
	
	#header_leftcorner
	 {
	  width:36px;
	  height:36px;
	  float:left;
	  background-image:url('../images/ecke_lo.png');
	  background-position:top left;
	  background-repeat:no-repeat;
	 }

    #header_middle
	 {
	  width:100%;
	  background-color:#660000;
	  background-image:url('../images/header_bg.png');
	  background-repeat:repeat-x;
	 }

    #header_rightcorner
	 {
	  width:36px;
	  height:36px;
	  float:right;
	  background-image:url('../images/ecke_ro.png');
	  background-position:top right;
	  background-repeat:no-repeat;
	 }
 
 
 
/* SLIDER */

#wrapper_slider
 {
  border-left: 5px solid #996633;
  border-right: 5px solid #996633;
  padding-top:50px;
 }
#slider > img
 {
  width:100%;
 }
 
 
 
/* MENÜ */

#wrapper_menu
 {
  border-left: 5px solid #996633;
  border-right: 5px solid #996633;
  background-color:#660000;
 }
  
  #responsivemenubutton
     {
    display:none;
	padding-left:30px;
	padding-top:30px;
	padding-bottom:20px;
   }
  
  #menu ul
     {
     padding:15px 0 0 12px;
	 margin:0;
   }
   
   #menu li
      {
     font-family: 'Lobster', cursive;
     font-size:24px;
	 list-style:none;
	 float:left;
	 margin-right:26px;
	 margin-bottom:20px;
	 text-align:left;
    }
   #menu li > a
      {
     color:white;
	 text-decoration:none;
    }
   #menu li > a:hover, #menu li.current > a
      {
     color:#FFCC00;
	 background:none!important;
    }
	
	
	
/* CONTENT  */

#wrapper_content
 {
  border-left: 5px solid #996633;
  border-right: 5px solid #996633;
  background-color:#660000;
  padding-bottom:10px;
 }
   #wrapper_content_content
      {
     float:left;
     width:70%;
    }

      #content
           {
        padding: 10px 30px;
        min-height:1300px;
        border-right: 1px solid #FFCC00;
       }
	  
      #content img
           {
        width:100%;
       }

   #wrapper_content_toolbar
      {
     float:right;
     width:30%;
    }

      #toolbar
           {
        padding: 10px 30px;
        min-height:200px;
       }

	   
	   
/* FOOTER  */

#wrapper_footer
 {
  border-bottom: 5px solid #996633;
  background-color:#660000;
  height:31px;
  margin-bottom:50px;
 }
   #wrapper_footer_likecontent
      {
     float:left;
     width:70%;
    }
    
	#footer_leftcorner
	 {
	  width:36px;
	  height:36px;
	  float:left;
	  background-image:url('../images/ecke_lu.png');
	  background-position:bottom left;
	  background-repeat:no-repeat;
	 }

   #wrapper_footer_liketoolbar
      {
     float:right;
     width:30%;
    }
	
	#blume
	 {
	  height:0px;
	  width:0px;
	  overflow:visible;
	  position:relative;
	  left:-15%;
	  top:5px;
	 }
	
	#footerlinks
	 {
	  height:0px;
	  width:0px;
	  overflow:visible;
	  position:relative;
	  left:50%;
	  top:50px;
	 }
	
	#footerlinks > a
	 {
	  color:#660000!important;
	  text-decoration:none!important;
	 }
	
	
	#footer_rightcorner
	 {
	  width:36px;
	  height:36px;
	  float:right;
	  background-image:url('../images/ecke_ru.png');
	  background-position:bottom right;
	  background-repeat:no-repeat;
	 }
 
 
 
/* WEITERES, allgemeines  */
  
.clearer
 {
  clear:both!important;
 }


 
 
 
 /*
         *****************************************************************
         *****************************************************************
		 ****************            SONSTIGES            ****************
         *****************************************************************
         *****************************************************************
 */
 
 
 
 
	 
	 #weihnachtsbanner_wrap
	   {
	   padding:0;
	   width:0px;
	   height:0px;
	   overflow:visible;
	  }
	 
	 #weihnachtsbanner
	   {
	   position: relative;
       left: -230px;
       top: -60px;
	   padding:0;
	   margin:0;
	   width:0px;
	   height:0px;
	   overflow:visible;
       z-index: 10;
	  }
	 
	 @media (max-width: 1200px)
       {
	    #weihnachtsbanner
	         {
		  top:-45px;
		  left:-245px;
		 }
		#weihnachtsbanner  img
		 {
		  width:300px!important;
		  height:auto!important;
		 }
	   }
	 
	 @media (max-width: 800px)
       {
	    #weihnachtsbanner
	         {
		  top:-45px;
		  left:-240px;
		 }
		#weihnachtsbanner  img
		 {
		  width:300px!important;
		  height:auto!important;
		 }
	   }
	 
	 @media (max-width: 600px)
       {
	    #weihnachtsbanner
	         {
		  top:-25px;
		  left:-130px;
		 }
		#weihnachtsbanner  img
		 {
		  width:180px!important;
		  height:auto!important;
		 }
	   }
	 
	 
 
 
 
 
 
 
 
#gaestespalte1 
{
    width:auto;
	min-width:140px;
	max-width:280px;
	float:left;
}
 #gaestespalte2
{
    width:auto;
	min-width:140px;
	max-width:280px;
	float:left;
}
.gaestebild_wrap
{  
  
   margin-right:10px;
   margin-bottom:10px;

}

div > small > a
 {
  color:white!important;
  text-decoration:none!important;
 }

div > small > a:hover
 {
  color:white!important;
  text-decoration:underline!important;
 }

#menuwrap
 {
  float:left;
  width:30%;
 }
#menuwrap2
 {
  float:right;
  width:70%;
  text-align:center;
  margin-bottom:40px;
 }
.menubild
 {
  float:left;
  width:100%;
  margin-bottom:10px;
 }

.menubild > img
 {
  width:100%;
 }
 
 
 .spalterechtsgross
   {
   font-size:21px;
   font-weight:bold;
    margin-bottom: 5px;
  }
 
 .spalterechtsklein
   {
   font-size:16px;
   text-decoration: none;
   margin-bottom: 8px;
   margin-top:8px;
   color:white;
  }
  
 .spalterechtsort
   {
   font-size:13px;
  }
 
 .spalterechtsdetails
   {
   margin-top:5px;
  }
 
 .spalterechtsdetailsbox
   {
    padding-left: 8px;
    border: 1px dotted #FFCC00;
    margin: 15px 5px 15px 10px;
	display:none;
  }
 
 .spalterechtsdetailsbox > p, .spalterechtsdetailsbox > a
   {
   font-size: 13px!important;
  }
 
 .sidemap
  {
   position:fixed;
   top:0px;
   left:0px;
   width:100%;
   height:500px;
  }
 
 input#jform_guestbook_title.input-xlarge, input#jform_guestbook_title.input-xlarge.invalid
   {
   margin-left:50px;
  }
 
 .csc-textpic-imagewrap
   {
    padding: 20px;
	min-height:85px;
  }
 
  #dinnerwaehler
    {
	margin-left:auto;
	margin-right:auto;
	margin-bottom:40px;
	width:300px;
	text-align:center;
   }
  
  #dinnerwaehler > a
     {
	text-align:center;
	width:40%;
	margin-left:20px;
	margin-right:auto;
	border-top: 2px dotted #FFCC00;
	border-left: 2px dotted #FFCC00;
	border-right: 2px dotted #FFCC00;
	padding:20px 30px;
	font-size:18px;
	font-weight:bold;
   }
  
  #dinnerwaehler > a:hover
     {
	background-color:#FFCC00;
	text-decoration:none;
   }
 
 /*
         *****************************************************************
         *****************************************************************
		 ************          START RESPONSIVE VIEW          ************
         *****************************************************************
         *****************************************************************
 */
 
 
 
 
  /* GROSSE BILDSCHIRME (klassisch: Tablet, breit)  */
 
@media (max-width: 900px) and (min-width: 750px)
{
  #menu li
      {
     font-size:19px;
	 margin-right:23px;
    }
}



  /* MITTELGROSSE BILDSCHIRME (klassisch: Tablet, hoch)  */

@media (max-width: 749px) and (min-width: 650px)
{
  
  #menu li
      {
     font-size:16px;
	 margin-right:19px;
    }
}



  /* KLEINE BILDSCHIRME (klassisch: Smartphone quer)  */

@media (max-width: 649px) and (min-width: 580px)
{
  #menuwrap, #menuwrap2
    {
    float:none;
    width:100%;
   }
  #menu li
      {
     font-size:15px;
	 margin-right:15px;
    }
}

  /* SMARTPHONES hochkant (klassisch: Smartphone) - ab hier Menü eingeklappt */

@media (max-width: 579px)
{
  #menuwrap, #menuwrap2
    {
    float:none;
    width:100%;
   }
  #menu
      {
     display:none;
   }
   
  #menu ul
      {
	 padding-bottom:10px;
	 position:relative;
	 top:-10px;
    }
  
  #menu li
      {
     font-size:21px;
	 margin-left:80px;
	 list-style:inherit;
	 list-style-type:square;
	 float:none;
	 margin-right:0px;
	 margin-bottom:0px;
	 padding-bottom:14px;
	 text-align:left;
    }
  
  #responsivemenubutton
     {
    display:block;
	font-family: 'Lobster', cursive;
   }
   
  #responsivemenubutton > a 
     {
	font-size:30px;
	text-decoration:none;
   }
  #responsivemenubutton > a:hover
     {
	color:#FFCC00;
	 background:none!important;
   }
   
  #wrapper_content_content,#wrapper_content_toolbar
    {
    float:none;
    width:100%;
  }
  
  #content
     {
   border-right: none;
   }
  
  #wrapper_content
     {
	position: relative;
    top: -20px;
   }
  #logo img
     {
    width: 120px;
    position: relative;
    top: 20px;
   }
}

#system-message-container
 {
  margin:20px;
 }

.alert-success {
    color: white;
    background-color: #FFCC00;
    border-color: #FFCC00;
}

.alert-success h4 {
	display:none;
}
 /*
         *****************************************************************
         *****************************************************************
		 ************               PROBLEM-FIXER             ************
         *****************************************************************
         *****************************************************************
 */
 
 a#mb_close_link
   {
   width:108px!important;
  }


@media (min-width: 580px)
 {
   #menu
     {
     display:block!important;
   }
 }

@media (max-width: 700px)
 {
   .csc-textpic-imagewrap
      {
	min-height:145px;
   }
 }
.well
 {
  background-color:#660000;
  border:none;
 }
.well blockquote
 {
  border-left:3px solid #FFCC00;
 }
input.input-xlarge
 {
  margin-left:0!important;
  height:30px;
 }
hr.hr-condensed
 {
  border-top: 1px solid #FFCC00;
  border-bottom: 1px solid #FFCC00;
 }
blockquote small
 {
  color:white;
 }
.pagination ul>li>a, .pagination ul>li>span
 {
  padding: 4px 8px;
  border:1px solid #FFCC00;
  background:none;
 }
.pagination ul>li>a
{
  font-weight:bold;
}
.pagination ul>li>a:hover
 {
  background-color:#FFCC00;
 }
.pagination ul>li>span
 {
  border:1px solid #FFCC00;
  background:none;
 }
.pagecounter
 {
  position:relative;
  top:20px;
 }
.btn-primary
 {
  color:#fff!important;
  text-shadow:0 -1px 0 rgba(0,0,0,0.25)!important;
  background-color:#FFCC00!important;
  background-color:#E6B800!important;
  background-image:-moz-linear-gradient(top,#FFCC00,#E6B800)!important;
  background-image:-webkit-gradient(linear,0 0,0 100%,from(#FFCC00),to(#E6B800))!important;
  background-image:-webkit-linear-gradient(top,#FFCC00,#E6B800)!important;
  background-image:-o-linear-gradient(top,#FFCC00,#E6B800)!important;
  background-image:linear-gradient(to bottom,#FFCC00,#E6B800)!important;
  background-repeat:repeat-x;border-color:#E6B800 #E6B800 #A28200!important;
  border-color:rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25)!important;
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc',endColorstr='#ff0044cc',GradientType=0)!important;
  filter:progid:DXImageTransform.Microsoft.gradient(enabled=false)!important;
 }

 @media (max-width: 950px)
{
  
.pagination ul>li>a, .pagination ul>li>span
 {
  padding: 4px 3px;
 }
 }
.csc-mailform input, .csc-mailform textarea, .csc-mailform select {
    padding: 3px;
    max-width: 50%;
}

.pgb-content-inside  p
 {
  font-size:14px;
 }
.pgb-content-inside  img
 {
  width:auto!important;
 }
#jform_guestbook_captcha
 {
  height:30px;
 }
/* LIS 13.06.2019 */
.fb{
  width: 207px;
  }
 @media (max-width: 384px)
{
  .csc-mailform input, .csc-mailform textarea, .csc-mailform select 
  {
    max-width: 40%;
  }
  .agbbox {
    max-width: 300px;
  }
  .imgInstagramm
  {
    width: 18% !important;
  }
  .fb{
  width: 272px !important;
  }
}
 @media (max-width: 320px)
{
  .csc-mailform input, .csc-mailform textarea, .csc-mailform select 
  {
    max-width: 32%;
  }
  .fb{
    width: 217px !important;
  }
  .imgInstagramm
  {
    width: 18% !important;
  }
  .agbbox {
    max-width: 280px;
  }
}