@media (min-width: 820px){ 
	#c699{
		display: none;
	}
	#c1201{
		display: block;
	}
}

@media (max-width: 820px){ 
	#c699{
		display: block;
	}
	#c1201{
		display: none;
	}
}

@media (max-width: 820px){ 

	body, body.rpid15, body.rpid10, body.rpid8{
		background-image: none;
	}

	#page {
		width: auto;
	}

	#logo a{
	    background: url(../img/welten/logo_pad.png) no-repeat 2vw top transparent;
	    background-size: contain;
	    height: 74px;
	}

	#head {
		background-size: 100vw auto;
	}

	#pid48 #head{
		/* background-size: 800px auto; */
	}
	

	#mainnav{
		display: block;
	}

	#mainnav ul.nav li.first{
	    padding-left: 2vw;
	}

	#metanav {
		position: absolute;
		right: 2vw;
		top: 1em;
		z-index: 10;
		width: 6.4em;
		height: 6.4em;
		/* overflow: visible; */
	}

	#metanav ul.nav li{
		display: block;
		margin-top: 0;
		height: 3em;
		width: 3em;
	}

	#metanav ul.nav li.item1{
		position: absolute;
		left: 0;
		top: 0;
	}

	#metanav ul.nav li.item2{
		position: absolute;
		left: 3.2em;
		top: 0;
	}

	#metanav ul.nav li.item3{
		position: absolute;
		left: 0;
		top: 3.2em;
	}

	#metanav ul.nav li.item4{
		position: absolute;
		left: 3.2em;
		top: 3.2em;
	}

	#metanav ul.nav li,
	#metanav ul.nav li.pid31{
	    background-size: 3em 3em;
    }

	#metanav  ul.nav li.pid31{
	    background-image: url('../img/welten/facebook.png');
	}


	.col {
		padding-bottom: 1.5em;
	}
	
	#cont{
		width: 73vw;
		min-width: 40em;
		margin: 0 auto;
	}

	#cont .t3ce.layout2 {
	    width: 100%;
	}

	#cont .t3ce.layout2 .csc-textpic-imagewrap img {
		width: 100% !important;
		height: auto !important;
	}

	#cont .t3ce.layout2 .csc-textpic-image {
		width: 100% !important;
	}

	#pid10 #maincol,
	#maincol{
		margin-left: 2vw
	}

	#leftcol{
		margin-right: 2vw;
		width: 18vw;
		margin-left: 2vw;
	}


	#pid177 #bottom,
	#bottom {
		/* background-image: url('/fileadmin/Resources/Public/img/Planet_Auswahl_600px.png'); */
		height: 22vw;
	}

	body.rpid173 #bottom,
	body.rpid47 #bottom{
		height: 71vw;
	}

	#bottom{
		background-size: 100vw auto;
	}


	/* TYPOGRAFIE */

	.nav a,
	.csc-default p,
	.csc-textpic-caption {
		font-size: 1.6em;
	}

	.fancybox-title-float-wrap{
		margin-bottom: -60px;
	}
	.fancybox-title-float-wrap .child{
		white-space: normal;
	}
}

@media (max-width: 600px){ 

	#logo a{
	    background: url(../img/welten/logo_mob.png) no-repeat 6em top transparent;
	    background-size: contain;
	    height: 75px;
	    width: 71vw;
	}

	#mainnav .nav a{
		font-size: 2.6em;
	}

	#leftcol{
		float: none;
		margin-right: 0;
		margin-left: 0;
		width: 100vw;
	}


	body.rpid15 #cont,
	body.rpid10 #cont,
	body.rpid8 #cont{
		margin: 0 auto;
	}

	/* http://www.teatimeforauniverse.com/categories/ */

	#pid137 #cont{
	     width: 40em;
	}

	#cont{
		width: 98vw;
		margin: 0 2vw;
	}

	#pid10 #maincol,
	#pid15 #maincol,
	#maincol{
		margin-left: 0;
	}

	body.rpid15 #maincol,
	body.rpid10 #maincol,
	body.rpid8 #maincol,
	#pid137 #maincol{
		    width: 100vw;
	}


	#catmenu, #parentcont{
		margin: 0 auto;
		width: 40.5em;
	}



	body.rpid15 #subnav,
	body.rpid10 #subnav,
	body.rpid8 #subnav{
		margin: 0 auto;
		width: 40.5em;
	}

	#subnav{
		width: auto;
		margin-left: 2vw;
	}

	#catmenu{
		margin-top: -2.6em;
		text-align: right;
	}

	#catmenu input{
		width: 130px;
	}

	#catmenu ul{
    	margin-left: 278px;
	  }

	#navtoggle {
    	display: block;
	}

	#navtoggle img.cross{
		display: none;
	}

	#navtoggle img{
		width: 3.5em;
		height: 3.5em;
	}

	#head {
		padding-bottom: 8em;
		background-position-y: 5em;
		padding-bottom: 4vw;
		background-size: 100vw auto;
	}

	#metanav ul.nav li.item3{
		display: none;
	}

	#metanav ul.nav li.item4{
		display: none;
	}

	#mainnav{
		display: none;
		position: absolute;
		z-index: 1;
		top: 5em;
		background-color: #1b1b1b;
		padding-bottom: 1em;
		width: 100%;
		left: 0;
		border-bottom: 1px solid white;
	}

	#mainnav.act{
		display: block;
	}
	#mainnav ul.nav li,
	#mainnav ul.nav li.first{
		padding: 0 2vw;
	}
	
	#mainnav li{
		display: block;
	}

	#subnav {
		/* width: 96vw; */
		/* margin-left: calc(2em - 1vw); */
		/* margin-left: 1vw; */
	}

	#subnav li{
		display: inline-block;
		margin-right: 1.5em;
		text-decoration: underline;
	}

	#subnav li.act{
		text-decoration: underline;
	}

	#pid10 #maincol,
	#maincol{
		width: 100vw;
	}

}

@media (max-width: 500px){ 

	#cont .t3ce {
		width: auto;
	}

	#logo a{
		width: 72vw;
		background-position: 6em 0.7em;
	}
}


@media (max-width: 405px){ 

	#logo a{
		width: 84vw;
		background-position: 5em 0.7em;
	}

	#pid10 #maincol,
	#maincol{
		margin: 0; 
	}

	#leftcol{
		float: none;
		margin-right: 2vw;
		margin-left: 2vw;
		width: 96vw;
	}

	#subnav,
	#catmenu,
	#parentcont {
		width: 100%;
	}

	#subnav{
		margin-left: 0;
	}

	#catmenu input{
		width: 30vw;
	}

	#catmenu ul{
    	margin-left: 67vw;
  }
  body.rpid15 #cont,
	body.rpid10 #cont,
	body.rpid8 #cont,
	#cont{
		width: 96vw;
		margin: 0 2vw;
	}

	.news-single-img, 
	.news-latest-img{
		width: 96vw;
	}

	.news-single-img img, 
	.news-latest-img img{
		width: 102vw;
		height: auto;
	}


	/* BILDER */

	.csc-textpic-imagewrap img {
		width: 100% !important;
		height: auto !important;
	}
	.csc-textpic-image {
		width: 100% !important;
	}

	.csc-textpic-intext-left .csc-textpic-imagewrap, 
	.csc-textpic-intext-right .csc-textpic-imagewrap,
	.csc-textpic-intext-left-nowrap .csc-textpic-imagewrap,
	.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap{
		width: 47% !important;
	}
	div.csc-textpic-center .csc-textpic-center-outer,
	div.csc-textpic-center .csc-textpic-center-inner {
		position: static;
		right: auto;
		float: none;
	}
	.csc-textpic-imagewrap[data-csc-images='2'] .csc-textpic-imagecolumn {
		width: 48.5% !important;
	}
	.csc-textpic-imagewrap[data-csc-images='3'] .csc-textpic-imagecolumn {
		width: 31.3% !important;
	}
	.csc-textpic-imagewrap[data-csc-images='4'] .csc-textpic-imagecolumn{
		width: 22.75% !important;
	}

	div.csc-textpic-imagecolumn, 
	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 {
		margin-right: 3%;
	}
	DIV.csc-textpic-right DIV.csc-textpic-imagewrap .csc-textpic-image, 
	DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap .csc-textpic-image, 
	DIV.csc-textpic-intext-right DIV.csc-textpic-imagewrap .csc-textpic-image {
		margin-left: 3%;
	}

	DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap,
	DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap {
		margin-right: 3% !important;
	}
	DIV.csc-textpic-intext-right DIV.csc-textpic-imagewrap,
	DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap {
		margin-left: 3% !important;
	}
	DIV.csc-textpic-left DIV.csc-textpic-imagewrap,
	DIV.csc-textpic-right DIV.csc-textpic-imagewrap {
		float: none;
	}

	.csc-textpic-intext-right-nowrap .csc-textpic-text {
		margin-right: 50%;
	}
	.csc-textpic-intext-left-nowrap .csc-textpic-text {
		margin-left: 50%;
	}

	.col-2 div.csc-textpic div.csc-textpic-imagecolumn{
		width: 48.5%;
	}

	.col-3 div.csc-textpic div.csc-textpic-imagecolumn{
		width: 31.33%;	
	}
	.col-4 div.csc-textpic div.csc-textpic-imagecolumn{
		width: 22.7%;	
	}
}

@media (max-width: 420px){ 
	#cont{
		min-width: auto;
	}


}


@media (max-width: 359px){ 

	.allcartoons {
		font-size: 12px !important;
		white-space: break-spaces;
		width: 50px;
		display: inline-block;
		text-align: left;
		line-height: 12px;
		margin-top: -2px;
		text-decoration: none !important;
	}

	#logo a{
		width: 77vw;
		background-position: 4.5em 1em;
	}
}

@media (max-width: 3px){ 


	DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap,
	DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap {
		float: none;
	}

	.csc-textpic-intext-left .csc-textpic-imagewrap, 
	.csc-textpic-intext-right .csc-textpic-imagewrap,
	.csc-textpic-intext-left-nowrap .csc-textpic-imagewrap,
	.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap{
		width: 100% !important;
	}

	DIV.csc-textpic-intext-left DIV.csc-textpic-imagewrap,
	DIV.csc-textpic-intext-left-nowrap DIV.csc-textpic-imagewrap {
		margin-right: 0% !important;
	}
	DIV.csc-textpic-intext-right DIV.csc-textpic-imagewrap,
	DIV.csc-textpic-intext-right-nowrap DIV.csc-textpic-imagewrap {
		margin-left: 0% !important;
	}


	#all .csc-textpic-imagewrap .csc-textpic-imagecolumn {
		width: 100% !important;
		float : none;
		margin-bottom: 1em;
	}


	#all .csc-textpic-imagewrap[data-csc-images='4'] .csc-textpic-imagecolumn{
		width: 48.5% !important;
		float : left;
	}
	#all .csc-textpic-imagewrap[data-csc-images='4'] .csc-textpic-firstcol + .csc-textpic-imagecolumn {
		margin-right: 0 
	}

}