/*******************************************************
  aboutme.css 

Projekt: DieMorgenlandfahrer.de
Autor:   Robert Kesseler
Datum:   25.3.2022
Version: 25.3.2022

Styles für "Allerley Teespezereien" -> Über mich

*******************************************************/



/*****************************************************************
* Die Startseite
*/

.maindiv {
	display: flex;
	justify-content: center;
}

.textdiv {
    box-sizing: border-box;
    position: absolute;
    top: 0;
    max-width: 50rem;
    height: 70%;
    border: 0px solid red;
    overflow-y: auto;
}


/************************************************
* der Container für alle Töpfchen
* überschreiben der globals.css
*/
.alletoepfe {
	top: 80%;
	height: 15%;
	overflow: hidden;
}

.topf_container {
    width: 24%;
    height: 100%;
    border: 0px solid red;
   
   } 
 
.topf {
	height: 50%; /* vom topf-container */
   /* border: 1px solid blue;*/
}

.topf:hover {
    height: 50%;
 }

/***************************************************
*  Media Querry für Desktop. Ab einem Seitenverhältniss
*  von 2 / 3 wird auf Desktop umgeschaltet
*/


@media only screen and (min-aspect-ratio: 2/3 ) {
	.debug_1 {
		background-color: red;
	}

	.alletoepfe {
		top: 70%;
		height: 20%;
	}
}
































.maintabelle   {
    /*border: 2px solid #dc3737;*/
    text-align: center;
    margin-left: auto;
    margin-right: auto;
		width:100%;
}

.maintabelle td {
 /*   border: 2px dotted blue; */
   
}

.thumbimg {
    width: 48%;
}

@media only screen and (min-width: 1500px) {
    
.thumbimg {
    width: 32%;
}
    
}

@media only screen and (min-width: 2000px) {
    
.thumbimg {
    width: 24%;
}
    
}



.Topftabelle {
    /*border: 2px solid #dc3737;*/
    text-align: center;
    margin-left: auto;
    margin-right: auto;
		width:100%;
}



.Topftabelle .spalte   {
    width: 15%;
    vertical-align: central;
    text-align: center;
    /* border: 2px solid #3748dc; */
    background:url("pic/pott.png");
    background-size: contain;
    background-repeat: no-repeat;
    /* cursor: pointer; */
        
}
.Topftabelle .spalte:hover   {
    width: 15%;
    vertical-align: central;
    text-align: center;
    background:url("pic/pottoffen.png");
    background-size: contain;
    background-repeat: no-repeat;
    /* cursor: pointer; */
}

.Termintabelle {
    margin-left: auto;
    margin-right: auto;
    border-spacing: 1em;
    /* border: 12px solid #374867; */
 
}

.Termintabelle td {
    font-size: large;
    padding-left: 1em;
    
}

.Termintabelle a {
    
    
}

.bw {
    width: 120px;
    height: 94px;
    background:url("pic/pott3_g.png");
		background-repeat: no-repeat;
    
}
.bw:hover {
    background: url("pic/pott3_o.png");
    background-repeat: no-repeat;
}
.bw a {
    width: 100%;
    height: 100%;
    display: block;
    text-decoration: none;
}

.bw a span {
    display: block;
    width: 100%;
    vertical-align: bottom;
}

.bw2 {
	text-align:Left;
	padding-left:1em;
}


.bigger1 {
   text-decoration: underline;
	 font-size:large;
}



.bildwechsel       {width: 100%; height: 100%; background:url("pic/pott.png");     background-size: contain; background-repeat: no-repeat; }
.bildwechsel:hover {background:url("pic/pottoffen.png"); background-size: contain; background-repeat: no-repeat; }

.bildwechsel2 {width:100%;background:url("pic/pott.png");}
.bildwechsel2:hover {background:url("pic/pottoffen.png");}