/* only ipad 1024 and bigger screen landscape screen */
@media only screen and (min-width: 768px) {
	.header .mainmenu ul { display:block !important; }
}

@media only screen and (max-width: 1279px) {
	.header .header-banner { padding-bottom: 70px; }
	.three-col-teaser { padding-top: 110px; }
	.three-col-teaser .section-title { margin-bottom: 30px; }
	.three-col-teaser .advantages-box h5 { font-size: 18px; }
	.three-col-teaser .advantages-box { padding: 65px 20px 25px; margin-bottom: 80px; min-height: 178px; }
	.three-col-teaser .advantages-box img { width: 80px; height: auto; }
	.three-col-teaser .advantages-box figure { width: 80px; height: 80px; top: -40px; }
	.text-left-img-right .text-title h2 { font-size: 30px; line-height: 1.3; }
	.text-left-img-right .text-info { font-size: 18px; line-height: 24px; }
	.text-left-img-right .text-info .button { margin-top: 40px; }
	.text-left-img-right .img-right figure img { max-width: 95%; }
	.text-left-img-right { padding-top: 90px; }
	.teaser { padding: 100px 0; }
	.teaser .text-right-title h2 { font-size: 36px; line-height: 1.2; }
	.teaser .text-right-info p { font-size: 21px; }
	.teaser .download-app figure { margin: 0 10px 10px 0; }
	.teaser .download-app { margin-top: 45px; }
	.footer .footer-top { padding-top: 40px; }
	.footer .footer-bottom { margin: 50px 0 0; }
	.header .banner-text { margin-top: 10px; }
	.teaser .text-right-box { padding-left: 15px; }
	.header .banner-img { margin: 0; }
	.left-text { width:33%; margin-top:90px; }
	.right-form { margin:18.6% 0 0 0; }
	.right-form-box { padding:30px 40px 20px; }
	.text-title h2 { font-size:30px; margin-bottom:20px; }
	.left-text .text-info { font-size:18px; }

}

/*==========================================================================================================*/
@media only screen and (max-width: 1023px) {
	body { min-width:320px; }
	img{ max-width: 100%; width:auto; height:auto; }
	.wrap { width:auto; padding:0 20px; }

	.header .banner-text h1, .header .banner-text h2 { font-size: 26px; }
	.header .banner-text { font-size: 20px; }
	.header .header-banner { padding-bottom: 50px; }
	.three-col-teaser { padding-top: 90px; }
	.three-col-teaser .section-title h1, .three-col-teaser .section-title h2 { font-size: 28px; }
	.three-col-teaser .section-title { margin-bottom: 15px; }
	.three-col-teaser .three-col-teaser-list .cols { margin-right: -15px; margin-left: -15px; }
	.three-col-teaser .three-col-teaser-list .col { padding-left: 15px; padding-right: 15px; }
	.three-col-teaser .advantages-box h5 { font-size: 16px; }
	.text-left-img-right { padding-top: 30px; }
	.text-left-img-right .text-left { padding: 0; }
	.text-left-img-right .text-title h2 { font-size: 24px; }
	.text-left-img-right .text-title { float: none; width: auto; margin-bottom: 20px; padding-right: 0; }
	.text-left-img-right .text-info { padding: 0; }
	.text-left-img-right .img-right figure { margin-right: -40px; }
	.text-left-img-right .text-info .button { margin-top: 25px; }
	.teaser { padding: 70px 0 60px; }
	.teaser .text-right-box { margin-top: 20px; }
	.teaser .text-right-title figure { max-width: 60px; margin-right: 15px; margin-top: 0; }
	.teaser .text-right-title h2 { font-size: 28px; line-height: 1.1; }
	.teaser .text-right-info p { font-size: 18px; line-height: 1.5; }
	.teaser .teaser-bucket { width: 250px; right: -96px; }
	.teaser .download-app figure { width: 46%; }
	.teaser .text-right-title { margin-bottom: 15px; }
	.teaser:after { height: 57%; }
	.footer .footer-top .cols2 .col { width: auto; float: none; margin-bottom: 40px; }
	.footer .footer-top { padding-top: 0; }
	.footer .footer-bottom { margin: 15px 0 0; }
	.footer { padding: 60px 0 30px; }
	.header .mainmenu { font-size: 14px; }
	.header .mainmenu ul > li { margin-left: 25px; }
	.teaser .text-right-box::before, .teaser .text-right-box::after { width: 200px; height: 200px; border-width: 12px; }
	.teaser .text-right-box::after { left: 250px; }
	.three-col-teaser .advantages-box { min-height: 170px; }

	.left-text { width:auto; margin-top:30px; float:none; text-align:center; padding:0; }
	.right-form { margin:35.6% -20px 0; float:none; width:auto; padding:0 6% 0; }
	.right-form-box { padding:20px 30px 10px; }
	.left-text-right-form { overflow:hidden; }
	.left-text-right-form:after { display:none; }
	.form-success-box { font-size:18px; }
}

/*==========================================================================================================*/
@media only screen and (max-width: 767px) {

	.header { position:relative; }
	.header .mainmenu { margin: 0; }
	.header .mainmenu ul { opacity: 0; visibility: hidden; position:fixed; left:0; width:100%; top:0; height: 100%; right: 0; background:#fff; z-index: 99; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
	.header .mainmenu ul li { float:none; padding:0; margin: 0; text-align: center; width: 100%; }
	.header .mainmenu ul li a { padding:15px 20px; display:block; }
	.menuopen { overflow: hidden; }
	.menuopen .header .mainmenu ul { visibility: visible; opacity: 1; }
	.header .mainmenu li.get-started-btn a { display: table; margin: 10px auto !important; padding: 7px 20px; }

	/* Responsive Menu line icon*/
	.header #menu { display:block; width: 22px; height: 16px; z-index: 100; position: relative; }
	.header .menulines-button { padding:0; cursor: pointer; user-select: none; text-transform:uppercase; font-size:16px; color:#fff; text-decoration:none; }
	.header .menulines-button:hover { text-decoration:none; }
	.header .menulines { display: inline-block; width: 20px; height: 3px; border-radius: 2px; background: #2a526e; position: relative; float: left; margin:9px 0 0 0; -moz-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -ms-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -webkit-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); opacity:1; }
	.header .menulines:before, .header .menulines:after { display: inline-block; width:20px; height: 3px; border-radius: 2px; background: #2a526e; position: absolute; left: 0; content:''; -moz-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -ms-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -webkit-transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); transition:all 550ms cubic-bezier(0.450, 1.000, 0.320, 1.000); -webkit-transform-origin: 0.28571rem center; -moz-transform-origin: 0.28571rem center; -ms-transform-origin: 0.28571rem center; transform-origin: 0.28571rem center; }
	.header .menulines:before { top: 7px; }
	.header .menulines:after { top: -7px; }
	.menuopen .menulines { background:none; }
	.menuopen .menulines:before, .menuopen .menulines:after {  -webkit-transform-origin: 50% 50%;  -moz-transform-origin: 50% 50%;  -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; top: 0; }
	.menuopen .menulines:before { -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); }
	.menuopen .menulines:after {  -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); }


	.header .banner-desktop{ margin-bottom: 15px; }
	.three-col-teaser .three-col-teaser-list .col { width: 50%; }
	.text-left-img-right .img-right { display: none; }
	.text-left-img-right .text-left { float: none; width: auto; }
	.text-left-img-right { padding: 0 0 100px; text-align: center; }
	.teaser .img-left-box { float: none; width: auto; padding: 0; margin-bottom: 40px; }
	.teaser .text-right-box { float: none; width: auto; margin: 0; text-align: center; }
	.teaser .text-right-title figure { float: none; margin: 0 auto 20px; }
	.teaser .img-left-box figure img { display: block; margin: 0 auto; }
	.teaser .text-right-title { max-width: 100%; margin: 0; }
	.teaser .text-right-info p { max-width: none; }
	.teaser { padding: 50px 0 140px; }
	.teaser .teaser-bucket { width:148px; right:-55px; }
	.teaser .download-app { margin-top:28px; }
	.teaser .download-app figure { max-width:46%; width:auto; }
	.teaser:after { height:40%; }
	.teaser .pot-img { width:104px; left:-53px; }
	.three-col-teaser .section-title h1, .three-col-teaser .section-title h2 { font-size:20px; }
	.three-col-teaser .advantages-box { border-width:6px; }
	.teaser .download-app figure:last-child { margin-right:0; }
	.teaser .text-right-box::before, .teaser .text-right-box::after { display: none; }
	.text-left-img-right .text-info .button { margin-left: auto; margin-right: auto; }
	.teaser .img-left-box figure { display: block; }
	.text-title .desktop-title { display:none; }
	.text-title .mobile-title { display:block; }
	.text-title h2 { font-size:22px; text-transform:uppercase; }
	.left-text .text-info { font-size:16px; line-height:1.3; }
	.right-form-box .form-group, .right-form-box .form-group.form-textarea, .right-form-box .form-group.form-btn { max-width:none; }
	.form-block .form-group label { display:block; text-align:center; padding:0 0 10px; }
	.form-group.tell-us { margin-bottom:0; }
	.form-success-box { font-size:16px; line-height:1.3; }
	.form-success-box p { margin-bottom:42px; }
	.form-success-box { min-height:500px; }
	.form-success-box figure { width:78px; }

}
/*==========================================================================================================*/
/* only iphone4 landscape & Potriat 300 by 480*/
@media only screen and (max-width: 567px) {
	.header .banner-text h1, .header .banner-text h2 { font-size: 24px; margin-bottom: 15px; }
	.header .banner-text { font-size: 16px; }
	.header .header-banner { padding-bottom: 40px; }
	.three-col-teaser { padding-top: 80px; }
	.three-col-teaser .section-title h1, .three-col-teaser .section-title h2 { font-size: 16px; }
	.three-col-teaser .section-title { max-width: 200px; margin: 0 auto; }
	.three-col-teaser .three-col-teaser-list .col { width: 100%; }
	.three-col-teaser .advantages-box h5 { font-size: 14px; }
	.three-col-teaser .advantages-box { padding: 60px 20px 15px; margin-bottom: 50px; }
	.three-col-teaser .advantages-box { border-width: 4px; }
	.text-left-img-right { background-image:url(/typo3conf/ext/bgm_theme_therapio/Resources/Public/Images/bgi/chat-bg-mobile.svg); padding-top: 30px; }
	.text-left-img-right .text-title h2 { text-transform: uppercase; font-size: 16px; max-width: 180px; margin: 0 auto; line-height: 1.5; }
	.text-left-img-right .text-info { font-size: 14px; line-height: 20px; }
	.text-left-img-right .text-title { margin-bottom: 15px; }
	.text-left-img-right .text-info .button { margin-top: 35px; }
	.teaser .text-right-title h2 { text-transform: uppercase; font-size: 24px; line-height: 28px; max-width: 230px; margin: 0 auto 15px; }
	.teaser .text-right-info p { font-size: 16px; line-height: 1.625; }
	.footer .idea-box, .footer .impressum-box { float: none; width: auto; }
	.footer .data-protection-box { float: none; width: auto; margin-top: 60px; }
	.footer { padding: 60px 25px 30px; }
	.footer .footer-top .cols2 .col { margin: 0; }
	.footer .impressum-box { margin-top: 35px; }
	.footer .footer-bottom { margin-top: 55px; }
	.footer .footer-bottom .socials { float: none; margin: 0 0 35px; }
	.footer .page-note img { margin: 0 0 10px; }
	.footer .copyright { float: none; width: auto; text-align: center; margin-top: 8px; }
	.footer .impressum-box address + address { margin-top: 20px; }
	.footer .footer-top h6 { margin-bottom: 13px; }
	.header .header-top { padding: 20px 0; }
	.header .banner-desktop { margin-bottom: 5px; }
	.header .banner-desktop video { display: none; }
	.header .banner-desktop video.mobile-img { display: block; }
	.three-col-teaser .advantages-box { min-height: 1px; }
	.text-title h2 { font-size:16px; margin-bottom:10px; }
	.left-text .text-info { font-size:14px; }
	.right-form { margin:39.6% -30px 0; }
	.form-block .form-group label { font-size:12px; }
	.right-form-box { padding:10px 20px; }
	.right-form-box .form-block { margin:0; }
	.right-form-box .form-group { padding:12px 0; }
	.form-success-box { min-height:inherit; padding:50px 0; }

	.footer .page-note ul li {
		margin: 0px 10px 10px 0px;
		font-family: 'kometbold';
		font-weight: normal;
		margin-bottom: 10px;
	}
}