}
	@media only screen and (max-width: 400px)  {
		main{width: 600px;
              display: grid;		
		      max-width: 95vw; 
			  justify-self: center;  grid-template-rows: auto;
		}

	}




:root {--jmsgruen:   #a3b839;
       --jmsblau:    #0086cb;
       --jmshell:    #e6f5fc;
	   --jmsgrau:    #909090;
 	   --background: #666978;
      }
//----- GENERAL
* -moz-box-sizing: border-box;
*,
*:before,
*:after {
  box-sizing: border-box;
}

*:disabled {
    
    opacity: 0.3 ;
}



html {
  height: 100%;
  width: 100%;
}
.nav {cursor: pointer;
}
.vertikal {
	display: flex; 
	flex-direction: column; 
	justify-content:center;
	padding-left: 20px;
}
.info{height: 1em;
      color: red;
	  font-size: .8em;
	  border: none;
}

::placeholder {

  opacity: 0.6; /* Firefox */
  font-family: "Playball", cursive;
  font-weight: 400;
  font-style: normal;
  font-size: 1em;
}
}

::-ms-input-placeholder { /* Edge 12 -18 */
  color: red;
}

body {
  background-color: #FFFFFF;
  width: 100%;
  margin: 0px;  
  font-family: Inter, sans-serif;
  font-weight:500;
  font-size: 16px;
  height: 100%;
  margin: 0px;
  color: #333333;
  
}
.flatpickr-rContainer{background-color: white !important};
table {table-layout: fixed;
       border-spacing: 10px;
}

input.form-control{cursor: pointer;
                   max-width:100%;
}

input[type=text]{-webkit-appearance: none;}
.fluid{font-size: 1.0em;
       font-weight: 300;
	   color: red;
}

div.container{width: 100%;
              display: grid;
			  background-color: #fff;
			  height: auto;

}

select{-webkit-appearance: none;
       appearance: none;
	   width: 100%;
}
input[type=select]{-webkit-appearance: none;
       appearance: none;
	   width: 100%;
}


div#oneday_container, div#tag_container{justify-self: center;
                   width: 1200px;
				   max-width: 96vw;
                   display: grid;
				   grid-template-columns:  repeat(auto-fit, minmax(250px, 1fr));
				   justify-items: start;
}



.close{display: none;
}
.field{height: 30px;
}
input.field-input{ height:100%;
}
.table { 
   display: table;
   border-spacing: 0em 1.5em;
   width: 100%;
}
.table-row {display: table-row; 
}
.table-cell {display: table-cell;
             width: 20%;
 
}

.middle {vertical-align: middle;
        }


div#content_container{width: 100%;
                      height: auto;
					  padding: 2%;
					  margin: 0px;
					  background-color: transparent;
					  display: grid;
					  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
					  grid-column-gap: 20px;
					  
}
ul.route{font-family: 'Roboto', sans-serif;
         font-weight:400;
		 font-size: 14pt;
		 line-height: 1.5em;
}

div.vier{display: grid;
          grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
          grid-row-gap: 30px;		  
}
div.zwei{display: grid;
          grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
          grid-row-gap: 30px;		  
}
div.grid_3{display: grid;
          grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
}

p.the_tour{font-family: 'Roboto', sans-serif;

         font-weight:500;
		 font-size: 16pt;
}
div#content_links  {grid-column: 2/5;
             
           }
div.zeile {width: 100%;
           height: auto;
           display: grid;
           grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
          }		   
		   
div#karte{grid-column: 1/2;

                 }
p.green{color: var(--jmsgruen);
}

    div#karte img{border: 1px black solid;
	              width: 100%;
	             }
.tour-lang{grid-column: 2/4;
           display: grid;
		   grid-template-columns: 1fr 1fr;
}
div.tour{ display: grid;
           grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
		   justify-items: left;
		   margin-bottom: 20px;
		   
}				 
div.tour2{ display: grid;
           grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
		   justify-items: left;
		   margin-bottom: 10px;
		   
}

div.aktiv{color: #a3b839;
}
   div.aktiv  .line{border-color: #a3b839;
}
   div.aktiv .element{border-color: #a3b839;
   }   

div.passiv{color: #dcdcdc;
}
   div.passiv  .line{border-color: #dcdcdc;
}
   div.passiv .element{border-color: #dcdcdc;
   }   
				 

div.display_block{display:block !important;
}
div.display_none{display:none !important;
}
#datum{cursor: pointer;
}
#first{border-color: #a3b839;
       border-style: solid;
       border-width: 2px;
	   color: #a3b839;
}
.line{color: #333333;
	   border: 3px solid #a3b839;
      } 
.element, #first{border-style: solid;
         border-width: 2px;
		 width: auto;
		 white-space: nowrap;
		 text-align: center;
		 
}

           
.bold {font-size: 16px;
       font-weight:  500;
	   line-height: 2em;
}

div#ablauf{display: grid;
           grid-template-columns: 120px 1fr 1fr 1fr 1fr;
		   height: 20px;
}
.path{display: grid;
      width: 100%;
	  grid-template-columns: 1fr 120px;
	  align-items: center;
}
                         	   
.data_container {display: grid;
                 grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}				 
.grau{background-color: #dcdcde;
      }

.gruen{background-color: #ffffff;
       color: #333333;
	   border: 1px solid #a3b839;
      } 
.gruen_text{color: #a3b839;
            height: 33px;
			width: 31px;
			margin-top: 2px;
      } 
.blue_text{color: #0086cb !important;
            height: 33px;
			width: 31px;
			margin-top: 2px;
      } 
.gruen_background{background-color: #a3b839;
      } 

.pointer{cursor: pointer;
}
			 
div#myheader_container{display: grid;
                       grid-template-columns 1fr;
					   justify-items: center;
					   -ms-grid-columns: 1fr;
					   -ms-justify-content: center;
}
    div#myheader_container img{width: 900px;
	                           max-width: 100vw;
							   
	                          }

div.points_line{width: 100%;
                height: 4px;
				border: 0px;
				border-bottom: 8px #a3b839 dotted;
                background-color: transparent;
               }