﻿/* Responsive Design */

/*Tablet*/
@media screen and (max-width: 1000px) {

    /* main */
	#MarginLeftRight {
        margin-left: 40px!important;
        margin-right: 40px!important;
    }


    /* Header */
    
    	#Titlerow .left {
			float:none !important;
		}


		#HSD{
			clear:both;
		}


    /* MegaMenu */
	#MegaMenu{
		clear: left;
		display:none;
		border-bottom: 0px !important;
	}

	#MegaMenu a {
	    border-bottom:2px solid #000 !important;
	    display:block !important;
	}

	#MegaMenu a {
	margin-right:0px!important;
	}
	
	.MegaLevel1 {
	margin-right:0px!important;
	}

	#MegaLine {
	display: block !important;
	}
	
	#MegaMenu div, #MegaMenu ul, #MegaMenu li {
		display: block !important;
	}
	
	/*#MegaMenu .Right {
		float:none;
	}*/


    /* Footer */
    .XS-Footer {
        float: none !important;
        margin-bottom: 10px;
        width: 95%;
    }


    /* Layouts */
      .M-Content{
        float: none !important;
        width: 100% !important;
    }

	#mbButtonMenu {
        display: block !important;
        clear:both !important;
    }
    
    #Content img {
		max-width: 80vw;
		height:auto !important;
	}
	
	.backtotop {
	    right: 10px !important;
	    left: auto !important;
	    bottom: 10px !important;
	}

}


/* Smartphone */
@media screen and (max-device-width: 740px),screen and (max-width: 740px) {

    /* Header */
		#Titlerow .Left {
				float: none !important;
		}

		#MasterContainer{
			max-width: 700px !important;
		}

		#SearchBoxRight #SearchBox {
			/*float: none;
			margin-bottom: 10px;*/
			display: none;
        	position: absolute;
        	margin-left: -190px;
        	/*margin-top: -20px;*/
		}
		
		#mbSearchButton{
        	display: block !important;
    	}

		.Right{
			/*float:none !important;*/
		}

		#mbButtonMenu .Right{
			float:right !important;
		}

		#HSD{
			text-align: left !important;
			padding-right: 20px !important;
		}



		.PageTitle .Right #MegaMenu a{
			/*Code um Warenkorb weiter nach unten zu setzen*/
		}
		
		.Rtable--collapse  {
		    display: block;
		    }
   		.Rtable-cell { width: 100% !important; }
		}

	/*Layouts*/
   .HalfContent, .S-Content, .L-Content, .XL-Content {
        float: none !important;
        width: 100% !important;
    }

		.imgbox{
			width: 290px !important;
		}

		.bescinhalt{
			width: 400px !important;
		}

		.forminput{
			float:left !important;
			clear: both !important;
		}

		.inwarenkorb{
			margin-left: 10px !important;
		}
		
		table{
			overflow-x:auto;
		}
}

#Content img{
 max-width: 80vw !important;
}

/*SearchBox Fix*/
@media screen and (max-device-width: 612px),screen and (max-width: 612px) {
		#SearchBox div input {
		width: 324px !important;
	}

}


/*Smalt View*/
@media screen and (max-device-width: 480px),screen and (max-width: 480px) {

    #txtSearch, #Fachbereich {
        width: 90px !important;
    }

    .FiltersDiv select, .FiltersDiv input {
        font-size: 14px !important;
    }

	#MarginLeftRight {
        margin-left: 5px!important;
        margin-right: 5px!important;
    }

		.imgbox{
			width:400px !important;
		}

	#HSD{
		padding-right: 10px !important;
	}

	#Faculty img{
		height: 36px !important;
	}

	.table-row{
		width: 90% !important;
	}

	.articleBox {
		width: 100% !important;
	}

    /*Footer*/
    .M {
        width: 100% !important;
        float: none !important;
    }

    #languageDiv {
        margin-right: 3px !Important;
    }

    #Quicklinks {
        margin-right: 0px !Important;
    }

	#mbSearchButton {
        margin-right: 5px !Important;
    }

    #mbLanguageLogo {
        display: block !Important;
    }

    #LanguageLogo {
        display: none !Important;
    }


    /* Title */
    h1 {
        font-size: 36px !important;
        line-height: 38px !important;
    }

		h1::first-letter{
			margin-left: -2px !important;
		}

    .PageTitle {
        padding-top: 7px !important;
        padding-bottom: 0px !important;
        margin-top: -10px;
    }


	/* Quickinks */
	#QuicklinksDiv a {
        font-size: 18px !important;
        line-height: 20px !important;
    }

    #QL, #languageDiv {
        font-size: 16px;
    }


    /* MegaMenu */
    #MegaMenu a, #MegaMenu a:visited {
        font-size: 22px !important;
        line-height: 24px !important;
    }

    .MegaLevel2, .MegaLevel2:visited {
        font-size: 20px !important;
        line-height: 22px !important;
        margin-left: 3px;
    }

    .MGLevelLink, .MGLevelLink:visited {
        font-size: 18px !important;
        line-height: 20px !important;
        margin-left: 6px;
    }

    #mbButtonMenu {
        font-size: 18px;
        line-height: 19px;
    }


 	#Content img{
		max-width: 80vw !important;
		height:auto !important;
	}

	#Content h1 {
        font-size: 30px !important;
        line-height: 30px !important;
    }

	#Content h1::first-letter{
			margin-left: 0px !important;
		}

	/*SearchBar*/
	#SearchBox div input {
		width: 300px !important;
	}

}

/*SearchBox Fix*/
@media screen and (max-device-width: 386px),screen and (max-width: 386px) {
		#SearchBox div input {
		width: 80% !important;
	}

}

