/*
Theme Name: 3D-Artifex Responsive
Theme URI: http://www.3d-artifex.de
Description: Wordpress Template Responsive 3D-Artifex
Author: YTPI Internetagentur
Author URI: http://www.ytpi.de
*/

/* ------ 1024px bis 1315px ----- */
@media screen and (min-width: 1025px) and (max-width: 1315px) {
	#divStayTopLeft {display: none;}
	#templatemo_container, #templatemo_footer {width: 900px;}
		#templatemo_menu, #templatemo_header_banner, #templatemo_content, #templatemo_footer {padding: 0px;}
			#templatemo_menu ul li a {width: 16%;}
	#templatemo_menu_english {margin-left: 0;}
}

/* ------ 769px bis 1024px ----- */
@media screen and (min-width: 769px) and (max-width: 1024px) {
	#divStayTopLeft {display: none;}
	#templatemo_container, #templatemo_menu, #templatemo_header_banner, #templatemo_header_banner img, #templatemo_content, #templatemo_footer, #templatemo_menu_english {width: 720px; padding: 0px;}
	#templatemo_menu_english {margin-left: 0; margin-top: 20px;}
	#templatemo_header_banner {height: auto;}
		#templatemo_menu ul li a {width: 16.5%;}
		#templatemo_content div#templatemo_leftcolumn {width: 29%;}
			#templatemo_content div#templatemo_leftcolumn .sidebar_navi, #templatemo_content div#templatemo_leftcolumn .social {width: 100%;}
			#templatemo_content div#templatemo_leftcolumn .social, #templatemo_content div#templatemo_sidebar-reponsive .social {padding: 20px 0px;}
				.sidebar_navi ul li {display: block; float: left; width: 100%; overflow: hidden;}
				#templatemo_rightcolumn {width: 58%;}
	div.referenzen-bilder {float: left; width: 45%; margin-right: 2%;}
	form input {width: 190px;}
	form #message textarea {width: 407px;}
	table.content-video .wpvl_auto_thumb_box, table.content-video .video_lightbox_auto_anchor_image {width: 250px; height: 175px;}
	table.content-video .wpvl_auto_thumb_play {left: 107px; top: 67px;}
	.seminare-box {width: 60%;}
	div.kontakt-info {font-size: 11px;}
	div.sidebar_navi div.textwidget iframe {width: 210px;}
}


/* ------ 650px bis 768px ----- */
@media screen and (min-width: 650px) and (max-width: 768px) {
	#divStayTopLeft, #templatemo_content div#templatemo_leftcolumn, #templatemo_menu .menu-hauptnavigation-container {display: none;}
	#templatemo_content div#templatemo_sidebar-reponsive {display: block}
	#templatemo_container, #templatemo_menu, #templatemo_header_banner, #templatemo_header_banner img, #templatemo_content, #templatemo_footer, #templatemo_menu_english {width: 600px; padding: 0px;}
	#templatemo_menu_english {margin-left: 0; margin-top: 20px;}
		#templatemo_header_banner {height: auto;}
		#templatemo_menu ul li a {width: 16.5%; font-size: 0.85em;}
			#templatemo_content div#templatemo_leftcolumn .sidebar_navi, #templatemo_content div#templatemo_leftcolumn .social, #templatemo_sidebar-reponsive {width: 100%;}
			#templatemo_content div#templatemo_leftcolumn .social, #templatemo_content div#templatemo_sidebar-reponsive .social {padding: 20px 0px;}
				.sidebar_navi ul li {display: block; float: left; width: 100%; overflow: hidden;}
				#templatemo_rightcolumn {width: 93%; padding: 50px 20px 0 20px;}
	#responsive-menu-bg {height: 47px; background: url(gfx/menuhoverBG_SH.gif) repeat-x; width: 100%; display: block;}
		#click-menu {right: 50%!important; top: 59px!important; margin-right: -295px; width: 590px!important; text-align: right!important;}
	div.referenzen-bilder {float: left; width: 45%; margin-right: 2%;}
	form #message textarea {width: 554px;}
	.seminare-box {width: 90%; margin-bottom: 20px;}
	
	#templatemo_rightcolumn .su-column {width: 48% !important; margin: 0 0 0 4% !important; float: left !important;}
	#templatemo_rightcolumn .su-column:first-child {margin-left: 0 !important;}
}

/* ----- 481px bis 649px ----- */
@media screen and (min-width: 481px) and (max-width: 649px) {
	#divStayTopLeft, #templatemo_content div#templatemo_leftcolumn, #templatemo_menu .menu-hauptnavigation-container {display: none;}
	#templatemo_content div#templatemo_sidebar-reponsive {display: block}
		#templatemo_sidebar-reponsive div.social, #templatemo_sidebar-reponsive div.sidebar_navi {width: 100%; float: left; border-left: 0px;}
	#templatemo_container, #templatemo_menu, #templatemo_header_banner, #templatemo_header_banner img, #templatemo_content, #templatemo_footer, #templatemo_menu_english {width: 420px; padding: 0px;}
	#templatemo_menu_english {margin-left: 0; margin-top: 20px;}
		#templatemo_header_banner {height: auto;}
		#templatemo_menu ul li a {width: 16.5%;}
			#templatemo_content div#templatemo_leftcolumn .sidebar_navi, #templatemo_content div#templatemo_leftcolumn .social, #templatemo_sidebar-reponsive {width: 100%;}
			#templatemo_content div#templatemo_leftcolumn .social, #templatemo_content div#templatemo_sidebar-reponsive .social {padding: 20px 0px;}
				.sidebar_navi ul li {display: block; float: left; width: 100%; overflow: hidden;}
				#templatemo_rightcolumn {width: 90%; padding: 50px 20px 0 20px;}		
	#responsive-menu-bg {height: 47px; background: url(gfx/menuhoverBG_SH.gif) repeat-x; width: 100%; display: block;}
		#click-menu {right: 50%!important; top: 59px!important; margin-right: -206px; width: 400px!important; text-align: right!important;}
	div.referenzen-bilder {float: left; width: 45%; margin-right: 2%;}
	table.content-video tr td {width: 100%; float: left;}
	form input {width: 376px;}
	form #message textarea {width: 375px;}
	.seminare-box {width: 90%; margin-bottom: 20px;}
	#contact_right {float: left;}
	
		#templatemo_rightcolumn .su-column {width: 48% !important; margin: 0 0 0 4% !important; float: left !important;}
	#templatemo_rightcolumn .su-column:first-child {margin-left: 0 !important;}
}


/* ----- 321px bis 480px ----- */
@media screen and (min-width: 10px) and (max-width: 480px) {
	#divStayTopLeft, #templatemo_content div#templatemo_leftcolumn, #templatemo_menu .menu-hauptnavigation-container {display: none;}
	#templatemo_content div#templatemo_sidebar-reponsive {display: block}
		#templatemo_sidebar-reponsive div.social, #templatemo_sidebar-reponsive div.sidebar_navi {width: 100%; float: left; border-left: 0px;}
	#templatemo_container, #templatemo_menu, #templatemo_header_banner, #templatemo_header_banner img, #templatemo_content, #templatemo_footer, #templatemo_menu_english {width: 300px; padding: 0px;}
	#templatemo_menu_english {margin-left: 0; margin-top: 20px;}
		#templatemo_header_banner {height: auto;}
		#templatemo_menu ul li a {width: 16.5%;}
			#templatemo_content div#templatemo_leftcolumn .sidebar_navi, #templatemo_content div#templatemo_leftcolumn .social, #templatemo_sidebar-reponsive {width: 100%;}
			#templatemo_content div#templatemo_leftcolumn .social, #templatemo_content div#templatemo_sidebar-reponsive .social {padding: 20px 0px;}
				.sidebar_navi ul li {display: block; float: left; width: 100%; overflow: hidden;}
				#templatemo_rightcolumn {width: 87%; padding: 50px 20px 0 20px;}
	#responsive-menu-bg {height: 47px; background: url(gfx/menuhoverBG_SH.gif) repeat-x; width: 100%; display: block;}
	#click-menu {right: 50%!important; top: 59px!important; margin-right: -145px; width: 280px!important; text-align: right!important;}
	div.referenzen-bilder {float: left; width: 95%; margin-right: 0%; text-align: center;}
	table.content-video tr td {width: 100%; float: left;}
		table.content-video .wpvl_auto_thumb_box, table.content-video .video_lightbox_auto_anchor_image {width: 250px; height: 150px;}
			table.content-video .wpvl_auto_thumb_play {left: 105px; top: 55px;}
	form input {width: 260px;}
	form #message textarea {width: 257px;}		
	.seminare-box {width: 85%; margin-bottom: 20px;}
	#contact_right {float: left;}
	
	.su-row{margin-bottom: 1.5em !important;}
}