/* Responsive Style Sheet */
/* click5 Interactive */
@media only screen and (max-width: 1500px) {
	
	.page-template-page-features .hero.hero-sub{ height: 500px; }
	
	.features-page .col-photo img{ width: 730px; }
	
	.video .col-photos .photo.photo-back{ margin-left: 30px; } 
	.video .col-photos .photo.photo-back img{ width: 100%; }
	
	.support .boxes-features a h3{ font-size: 17px; line-height: 22px; }
	
}

@media only screen and (max-width: 1450px) {
	.wrap,
	.hero .wrap,
	.contact .wrap,
	#header .wrap,
	.features-page .wrap,
	.download .wrap,
	.video .wrap,
	.contact-content .wrap,
	.content-form .wrap
	{ width: 92%;}
	
	.features .wrap{
		width: 96%;
	}
	.testimonials .wrap{
		width: 94%;
	}
	.testimonials #slider-testimonials{
		width: 100%;
	}
	
	.hero{ height: 710px; }
	.hero .apple{ left: 26%; bottom: 70px; }
	.hero .apple img{ width: 1100px;  }
	.hero .headline{ margin-top: 175px;  }
	.hero .headline h1{ font-size: 38px; line-height: 42px; }
	.hero .headline h2{ font-size: 19px; line-height: 29px; letter-spacing: -0.5px;}
	
	.download .signApp .apple{ margin-left: 33%; }
	
	.hero.hero-sub .headline{ margin-top: 170px; }
	
	.page-template-page-contact .hero.hero-sub{ height: 535px; }
	
	.page-template-page-pricing .hero.hero-sub{ height: 720px; }
	.page-template-page-integrations .hero.hero-sub{ height: 550px; }
	.blog .hero.hero-sub{ height: 600px; }
	.page-template-page-support .hero.hero-sub{ height: 650px; }
	
	.bloglist{ margin-top: -240px; }
	
	.video .col-photos .photo.photo-back{ margin-left: 30px; width: calc( 100% - 30px ); } 
	.video .col-photos .photo.photo-front{ margin-top: -70px;}
	
	
}
@media only screen and (max-width: 1350px) {
	.contact .col-center ul li{ padding: 0 14px 0 13px; }
	
}
@media only screen and (max-width: 1220px) {
	#nav{ margin-top: 30px; }
	
	#logo{ width: 200px; }
	#nav ul li a{ padding: 20px 10px; }
	#buttons a{ width: 110px; }
	
	.home p{ font-size: 16px; }
	h2{ font-size: 28px; line-height: 34px; padding: 10px 0; }
	h4{ font-size: 17px; line-height: 25px; }
	
	.hero{ height: 650px; }
	.hero .headline{ width: 400px; margin-top: 140px;  }
	.hero .headline h1{ font-size: 32px; line-height: 37px; }
	.hero .headline h2{ margin: 5px 0 20px; font-size: 17px; line-height: 22px; }
	
	.trial{ clear: both; margin: 14px 0; }
	
	.hero .apple{ left: 23%; }
	.hero .apple img{ width: 1030px; }
	
	.features{ margin-top: 10px; }
	
	.title h4{ font-size: 13px; }
	.title h2{ font-size: 35px; padding: 5px 0; letter-spacing: -0.5px; }
	.title h2::after{ margin-top: 20px; margin-bottom: 20px; }
	
	
	.boxes-features a{ padding: 3%; width: 25.333%; height: 305px;  }
	.boxes a .icon{ height: 68px; margin-bottom: 10px;  }
	.boxes a .txt h3{ font-size: 20px; }
	.boxes-contact a .txt h3{ font-size: 34px; }
	.support .boxes-features a h3{ font-size: 17px; }
	.boxes a .txt h3::after{ margin-top: 10px; width: 40px; margin-bottom: 0; }
	.boxes a .txt p{ font-size: 15px; line-height: 23px; }
	.support .boxes-features a p{ padding-top: 3px; }
	
	
	
	.buttonMore a{ font-size: 15px; }
	
	.testimonials{ margin: 20px 0; }
	.testimonials #slider-testimonials{ margin: 0; }
	.testimonials .item .txt h3{ font-size: 25px; }
	.testimonials .item .txt p{ font-size: 17px; line-height: 30px; }
	.testimonials .item .txt{ width: 48%; padding: 30px 30px; }
	.testimonials .item .sign{ width: calc( 100% - 60px ); }
	
	.download{ min-height: 630px;  background-size: auto 100%; margin-bottom: 40px;  }
	.download .title{ margin-top: 35px; }
	.download .title h2{ margin-bottom: 15px; }
	.download .signApp .apple img{ width: 110%;  }
	.download .signApp .txt h3{ font-size: 27px; line-height: 37px; }
	.download .signApp .txt .button{ font-size: 16px; }
	
	
	.contact{ padding: 80px 0 55px; }
	.contact .col-center ul li{ padding: 0 10px; border: none; }
	.contact .col-center ul li a{ font-size: 15px; }
	.contact .col-first { font-size: 15px; }
	.social a{ height: 51px; width: 51px; }
	.contact .col-center ul{ margin-top: -6px; }
	
	#footer .wrap{ padding: 30px 0; }
	#footer small{ margin-bottom: 30px; }
	
	
	.features-page .col-txt{ margin-top: 55px; }
	.features-page .col-photo img{ width: 128%; }
	.features-page .buttonMore a{ margin: 10px auto;}
	
	.page-template-page-pricing .hero.hero-sub{ height: 560px; }
	.pricing-main{ margin-top: -250px; }
	
	.integrations .boxes a h3{ font-size: 16px; }
	
	.support-questions .wrap{ width: 94%; }
	.related .support-questions .wrap{ width: 800px; }
	
	.page-template-page-support-categories .hero.hero-sub, .page-template-page-support .hero.hero-sub{  height: 610px;  }
	.support.support-sub .boxes a .icon{ height: 30px; }
	.support .boxes-features a h3 { font-size: 15px; line-height: 18px; }
	
	.single .hero.hero-sub, .archive .hero.hero-sub, .blog .hero.hero-sub, .page-template-page-support-details .hero.hero-sub{ height: 710px; }
	
	.single .headline h1{margin: 0; }
	.single .hero.hero-sub .headline{ margin-top: 250px; }
}
	
	
@media only screen and (max-width: 1100px) {
	
	.hero{ height: 620px; }
	.hero .apple{ bottom: 50px; }
	.hero .apple img{ width: 900px; }
	.hero .headline { width: 340px; }
	.hero .headline h1{ font-size: 31px; line-height: 36px; letter-spacing: -1px; }
	.hero .headline h2{ font-size: 17px; line-height: 25px; }
	.hero .headline a{ font-size: 15px; padding: 13px 30px; }
	.single .hero .headline a{ padding: 0; font-size: 14px;}
	
	.title h2{ font-size: 30px; }
	
	.testimonials .item .txt{ margin-top: -500px; height: 400px; }
	.testimonials .item .sign .slogo{ width: 100%; margin-bottom: 15px;  }
	.testimonials .item .sign .person{ width: 100%; }
	
	.contact .col{ width: 28%; }
	.contact .col-center{ width: 44%; }
	
	.download{ min-height: 580px; }
	
	.single .headline h1{ width: 100%; }
	
	.contact .col-center{ display: none; }
	
}	
	

/* #Tablet (Portrait)
================================================== */

/* Note: Design for a width of 768px */


@media only screen and (max-width: 996px) {
	
	.wrap, .hero .wrap, .contact .wrap, #header .wrap, .features-page .wrap, .download .wrap, .video .wrap{
		width: 94%; 
	}
	
	#nav ul li a{ font-size: 15px; padding: 15px 5px; }
	
	#logo{ width: 160px; }
	
	#buttons{ margin-top: -55px; }
	#buttons a{ width: auto; font-size: 15px; padding-left: 10px; padding-right: 10px;  }
	
	h2{ font-size: 24px; line-height: 30px; letter-spacing: -0.5px;	}
	h3{ font-size: 17px; }
	h4{ font-size: 15px; }
	
	.contact .col{ width: 50%; }
	
	
	.hero{ height: 580px; }
	.hero .apple img{ width: 120%; }
	.hero .headline{ margin-top: 110px; width: 310px; }
	.hero .headline h1{ font-size: 28px; }
	.hero .headline h2{ font-size: 16px; }
	
	.video .txt{ width: 85%; }
	
	.boxes-features a{ height: 330px; }
	.boxes a .icon{ height: 60px; }
	.boxes-blog a .txt h3{ font-size: 18px; }
	
	.download{ min-height: 560px; }
	.download .title{ margin-top: -10px; }
	
	.page-template-page-pricing .hero.hero-sub,
	.page-template-page-features .hero.hero-sub{ height: 380px; }
	.hero.hero-sub .headline{ margin-top: 130px; }
	
	.page-template-page-contact .hero.hero-sub{ height:480px; }
	
	.pricing-main,
	.features-page{ margin-top: -130px; }
	.features-page h2{ margin-bottom: 0;}
	.features-page p{ font-size: 15px; line-height: 21px; margin-bottom: 10px; }
	
	.pricing-main .col{ padding: 25px 35px 30px; width: calc( 50% - 71px ); }
	.pricing-main .row-buttons .col{ padding: 0 35px 25px; }
	
	.price-wrap .wrap{ width: 92%; }
	.price-table table{ margin: 20px 0; }
	.price-table table th, .price-table table td{ font-size: 15px; padding: 10px 3px; }
	
	.blog .hero.hero-sub{ height: 530px; }
	
	.wmle_container .wmle_item_holder.col3{ width: 50% !important; }
	
	.page-template-page-integrations .hero.hero-sub{ height: 480px; }
	
	.support .boxes-features a{ width: 45%; padding: 2%; }
	
	.page-template-page-support .hero.hero-sub{ height: 580px; }
	
	.modal-in{ width: 90%; left: 5%; height: 320px;  }
	.price-choose.info-integrations{ margin-top: 50px;}
	.info-integrations .form{ width: 95%; }
	
	.support{ margin-top: -210px; }
	.page-template-page-support-categories .hero.hero-sub, .page-template-page-support .hero.hero-sub{ height: 540px; }
	
	.single .hero.hero-sub, .archive .hero.hero-sub, .blog .hero.hero-sub, .page-template-page-support-details .hero.hero-sub{ height: 680px; }
	
	.single .hero.hero-sub .headline{ margin-top: 215px; }
	
	
}
@media only screen and (max-width: 920px) {
	.download{ min-height: 510px; }
	
	.boxes-blog a .txt{ height: 300px; }
	
	.related .support-questions .wrap,
	.content-single .wrap{ width: 85%; padding: 30px; }
	
	.content-single .wrap-nobackground{ width: 92% !important; padding: 15px 0 !important; }
	
	.entry h3{ font-size: 18px; line-height: 23px; padding-left: 20px;}
	
	.home .hero .headline h1 br{ display: none; }
	
	.post-hero{ margin-left: -30px; margin-right: -30px; }
	
	
	
}
/* #Mobile 
================================================== */

@media only screen and (max-width: 767px) {
	
	#header.sticky{ height: 75px; }
	
	.bottom-buttons{ display: block; }
	
	#nav{ display: none; }
	#logo{ width: 180px; margin-top: 30px; }
	#header.sticky #logo{ margin-top: 20px; }
	#buttons{ display: none; }
	
	p{ font-size: 15px; line-height: 26px; }
	
	.slicknav_menu{ display: block; }
	
	.hero{ height: calc( 410px + 40vw ); background-position: 47% top; }
	.hero .wrap{ width: 450px; }
	
	.hero .headline{ width: 100%; text-align: center; margin-top: 98px; }
	.hero .headline h1{ text-align: center; }
	.hero .headline h2{ text-align: center; font-size: 17px; line-height: 27px; margin: 20px 0; }
	
	
	.hero.hero-sub .headline h1{ font-size: 22px; letter-spacing: -0.5px; line-height: 26px; margin-bottom: 0; padding: 0;  }
	.hero.hero-sub .headline h2{ margin: 5px 0 ; }
	
	.hero .headline a.button{ float: none; }
	.hero .headline .trial{ float: none; }
	
	.hero .apple{ width: 100%; left: 0; bottom: -10px; }
	.hero .apple img{ width: 100%; }
	
	
	.title-left{  text-align: center; }
	.title h4{ font-size: 12px; }
	.title h2{ font-size: 26px; }
	
	.features .wrap{ width: 90%; }
	.boxes a{ width: 100%;  }
	.boxes-features a{ width: 84%; padding: 5% 8%; height: auto; padding-bottom: 70px;  }
	.boxes-blog a .txt{ height: auto; padding-bottom: 50px; }
	
	
	.boxes-blog a{ display: none; }
	.boxes-blog a:first-child{ display: block; }
	
	
	.testimonials .wrap{ width: 90%;}
	.testimonials .item .photo{ width: 100%; height: 250px; }
	.testimonials .item .txt{ width: calc( 100% - 60px ); margin-top: 0;  box-shadow: 0 0 60px rgba(17,37,81,0.1); }
	.testimonials #testi-naw span{ height: 7px; width: 7px; }
	
	.download{ background-size: auto 610px; margin-bottom: 35px; background-position: 40% bottom; padding: 40px 0;}
	.download .col{ width: 100%; }
	.download .col p{ text-align: center; }
	.download .signApp{ position: inherit;}
	.download .signApp .apple{ margin-left: 0; margin-top: 20px;}
	.download .signApp .apple img{ width: 100%; }
	.download .signApp .txt h3{ font-size: 22px; line-height: 30px; }
	.download .col .appstore{ width: 100%; text-align: center; }
	
	.video .col{ width: 100%; }
	.video .title h2::after{ margin: 15px auto; }
	.video .txt{ width: 100%; }
	.video .txt p{ text-align:  center;}
	.video .buttonMore{ text-align: center; }
	.video .col-photos .photo.photo-back{ margin-left: 15%; width: 85%; }
	.video .col-photos .photo.photo-front{ margin-left: 0; width: 65%; }
	.video .col-photos .photo a.play{ background-size: contain; width: 60px; height: 60px; top:calc( 50% - 30px ); left:calc( 50% - 30px ); }
	
	#footer{ padding-bottom: 58px; }
	.contact .col, 
	#footer .col{ width: 100%; text-align: center; }
	#footer .col-last { margin-bottom: 15px; }
	
	.contact{ padding: 60px 0 35px; }
	.contact .col-first{ margin-bottom: 30px; }
	.social{ text-align: center; margin-top: 0px; }
	.social a{ width: 55px; height: 55px; }
	
	
	.features-page .col-txt{ width: 100%; }
	.features-page .col-photo{ width: 100%; }
	.features-page .col-photo img{ width: 110%; margin-left: -5%; }
	.features-page .col-left.col-photo img{ margin-right: 0; width: 110%; margin-left: -5% }
	
	.hero .headline h2 br{ display: none; }
	
	.hero.hero-sub{ background-position: 54% top; }
	
	
	.blog .hero.hero-sub{ height: 480px !important; }
	
	.features-page{ margin-top: -30px; }
	.pricing-main{ margin-top: -120px; }
	.features-page .col-txt{ margin-top: 20px; }
	
	.page-template-page-features .hero.hero-sub{ height: 320px; }
	
	.price-choose{ margin-top: 40px; }
	
	.pricing-main .col{ padding: 20px 20px; width: calc( 50% - 41px ); }
	.pricing-main h2{ font-size: 22px; }
	.pricing-main .row-head p{ height: 100px; }
	.pricing-main .row-content ul{ padding: 0 0 0 5px; }
	.pricing-main .row-content ul li{ padding-left: 12px; ;  }
	.pricing-main li::before{ font-size: 8px;  }
	.pricing-main .row-buttons .col{ padding: 0 20px 10px;}
	.pricing-main .buttons a{ font-size: 14px; }
	.pricing-main .buttons span{ font-size: 11px; }
	
	.price-choose h2{ font-size: 26px; line-height: 34px; }
	.price-choose p br{ display: none; }
	
	.price-table table th, .price-table table td{ font-size: 14px; padding: 9px 3px; }
	
	.price-faq .price-faq-in{ grid-template-columns: 1fr; grid-template-areas: "."; grid-gap: 20px 0px; }
	.price-faq .price-faq-in .item{ background-size: auto 16px; }
	
	
	.download .col .appstore{ width: 420px; margin: 10px calc(( 100% - 420px )/ 2); }
	.download .col .appstore a{ width: 49%; }
	
	
	.integrations .wrap{ width: 450px; }
	.integrations .boxes-features a{ padding-bottom: 20px; }
	
	
	.tooltips{ display: none; }
	
	.page-template-page-support .hero.hero-sub{ height: 540px; }
	
	.page-template-page-support .hero .wrap{ width: 90%; }
	.search-input{ width: calc( 100% - 14px ); margin: 20px 0%; }
	
	.support{ margin-bottom: 30px; }
	.support .boxes-features a p{ display: none; }
	.support .boxes-features a{ height: 145px; }
	
	.single .hero.hero-sub .headline{ margin-top: 190px; }
	
	.hero .headline .postpublish,
	.hero .headline .postpublish a{
		padding: 0; font-size: 12px;
	}
	
	.single .hero.hero-sub .headline h1{
		margin-bottom: 20px;
	}
	.bnext{ padding: 35px 20px; width: calc( 49% - 40px ); height: 170px; }
	.bnext .more{ display: none; }
	.datePost{ width: calc( 100% - 40px ); padding: 20px 0; }
}


@media only screen and (max-width: 660px) { 
	.support.support-sub .boxes-features a{ width: 31%; }
	.page-template-page-support-categories .hero.hero-sub, .page-template-page-support .hero.hero-sub{ height: 490px; }
	
	.sitemap-box{ width: 100%; }

} 


@media only screen and (max-width: 550px) { 
	.pricing-main .price strong{
		display: block;
	}
	.pricing-main .toogle .item{ 
		width: 100%;
	}
	.pricing-main .toogle .item.itemM{
		margin-bottom: 15px;
	}
	.hero .headline h2{
		margin: 10px 0; 
	}
	
	.info-integrations .form input{ width: calc( 100% - 42px );    }
	.info-integrations .form input.text{ font-size: 15px; padding: 15px 15px; }
	.info-integrations .form input.button{ font-size: 15px; padding: 15px 0px; }
	
	.price-choose.info-integrations{ margin-bottom: 40px;}
	
	.support .boxes a .icon{ height: 55px; }
	
	.search-input input.text{ width: calc( 80% - 40px ); }
	.search-input input.button{ width: 20%; }
	
	.single .hero.hero-sub, .archive .hero.hero-sub, .blog .hero.hero-sub, .page-template-page-support-details .hero.hero-sub{ height: 640px; }
	
	.breadcrups{ font-size: 11px; padding-bottom: 10px;}
	
	.post-hero{ height: 180px; }
	.single .hero.hero-sub .headline{ margin-top: 170px; }
}

/* Note: Design for a width of 320px */

@media only screen and (max-width: 479px) { 
	
	#header .wrap{ width: 85%; }
	
	.hero .wrap{ width: 80%; }
	
	.wmle_container .wmle_item_holder.col3{ width: 100% !important; }
	
	.download .col .appstore{ width: 90%; margin: 10px 5%; }
	
	.integrations .wrap{
		width: 300px;
	}
}
