/*
Responsive Stylesheet for click5interactive.com

click5 Interactive
http://www.click5interactive.com/
*/
	
@media only screen and (min-width: 1200px) {
	body{ font-size: 18px;  line-height: 24px; font-weight: 300;}
	strong{ font-weight:600;}

	h1{ font-size:50px;}
	h2{ font-size:35px; padding:20px 0;}
	h5{ font-size:20px;}
	
	.col2{ width:50%; }
	.col4, .col4.last{ width: 285px; margin: 0 5px; }
	
	
	
}


@media only screen and (min-width: 1750px) {
	 .wrap,
	.services .row .wrap{
		width: 86%;
		max-width: 1900px;
	}
	
	
	h2{ font-size: 40px; line-height: 58px; } 
	
	#testimonials .wrap{ max-width: 1700px; }
	#testimonials .col-title{ width: 26%; }
	#testimonials .col-txt{ width: 70%; }
	
	#porftolio .wrap{max-width: 2100px; } 
	#porftolio .thumbList .item{ height: 650px; }
	#porftolio .thumbList .item .photo{ height: 470px;}
	
	
	.wrapPhotos{ width: 80%; max-width: 1605px; }
	
	.next-prev .wrap{ width: 75%; }
	
	.color-section .wrap{ max-width: 1450px; }
	
	#process .wrap{ max-width: 1650px; }
	
	.reviews .wrap{ max-width: 1800px;  }
	
	.box-content-reviews .content-photo{ margin-top: -50px; height: 600px; }
	
	.box-single .wrap,
	.box-single-intro .wrap,
	.section-main-post .wrap, 
	.section-single-content .wrap,
	.post-list .wrap{ width: 80%; max-width: 1800px; }
	
	
	.box-single .content-photo{ width: 900px;}
	
	h1.page-title{ max-width: 66%; float: left;}
	.page-template-portfolio h1.page-title{ width: 100%; }
	
	.form .formWrap{ margin: 0 auto; max-width: 1200px; }
	
	
	

}	
@media only screen and (max-width: 2100px){ 
	.post-list .post .photo{ height: 275px; }
	
}
@media only screen and (max-width: 1750px ) {
	
	.box-content.box-content-contact.box-wp-plugins-WP{ padding-top: 80px; }
	
	.box-content.box-content-contact.box-wp-plugins-WP .col-left h1{ font-size: 54px; }
	.box-content.box-content-contact.box-wp-plugins-WP .col-right p{ font-size: 19px; }
	
	#footer-bottom-menu{ width: 79%; }
	.addres{ width: 21%; }
	
	#footer-bottom-menu > li:nth-child(3){ width: 18.5%;}
	#footer-bottom-menu > li:nth-child(4){ width: 24.5%;}
}

@media only screen and (max-width: 1500px) {
	
	#header{ padding-top: 40px; }
	
	.wrap,
	.services .row .wrap,
	.wrapPhotos,
	.box-content-portfolio .wrap{ width: 1200px; }
	
	.box-content{ padding-top: 60px;}
	
	.box-content-portfolio .col-photo img{ width: 700px; }
	.halfSections .content-image img{ width: 780px; }
	.photos .fleft, .photos .fright{ margin: 18px; }
	.ptitle .shadow{ font-size: 50px; }
	
	.what-bring::before{ left: calc( 50% - 580px ); }
	
	#header #logo{ width: 320px; margin-left: 2.5%; margin-top: -10px; background-size: 100% auto !important;  }
	#nav{ margin-top: 5px; margin-right: 2.5%;  }
	.sticky #nav{ margin-top: 15px; }
	#nav ul li{ margin-left: 10px; }
	
	.hero #scroll{ width: 120px; height: 120px; margin-left: -60px; bottom: -60px; }
	.hero .headline h1{ font-size: 65px; line-height: 65px; }
	.hero .headline h2{ font-size: 27px; }
	
	.section-main-post .col-photo .photo{ width: 650px; margin-left: -30px;}
	.section-main-post .col-photo .photo-add{ width: 520px; }
	
	.post-list .wrap{ width: 1250px; }
	.post-list .post .photo{ height: 260px;}
	
	
	#portfolioSlider #slideshow2{  margin-left: calc( 50% - 1050px ); }

	#portfolioSlider #slideshow2 .cycle-carousel-wrap{
		margin-left: 700px !important;
	}
	

	#portfolioSlider .slide{ width: 700px; }
	#portfolioSlider .slide .photo{ width: 630px; height: 440px !important;  }
	#portfolioSlider .slide .photoBox{ width: 500px; left: 100px; height: 450px; }
	#portfolioSlider .slide .bg-foto{ width: 460px; margin-top: 40px;}
	#portfolioSlider .slide .photoBox .mac-apla{ background-size: 100% auto; }
	#portfolioSlider .layer h3{ font-size: 35px; }
	#portfolioSlider .layer p{ height: 70px; line-height: 23px; }
	
	#testimonials .col-txt p{ font-size: 21px; }
	
	
	
	/* logo-color */
	.logo-color img{ max-height: 110px; }
}

@media only screen and (max-width: 1340px) {
	.post-box{
		flex-wrap: wrap;
		margin-top: 0;
	}
	.post-photo {
		  flex: 0 0 100%;
		  order: 2;
		  margin-top: 0;
		  margin-right: 0;
		  margin-left: 0;
	}
	.post-txt {
		flex: 0 0 100%;
	}	
}

@media only screen and (max-width: 1279px) {
	
	body{ margin-bottom: 550px; }
	
	.wrap,
	.services .row .wrap,
	.wrapPhotos,
	.box-content-portfolio .wrap{ width: 940px; }
	
	
	#headline h1{ font-size: 55px; line-height: 60px; padding-bottom: 5px;  }
	#headline h2{ font-size: 27px; line-height: 35px; padding: 0px 0 20px;  }
	#headline a{ font-size: 18px; padding: 13px 40px 17px; }
	
	#nav ul li{ margin-left: 0; }
	#nav ul li a { font-size: 16px; }
	#nav ul li.button{ padding: 0 10px; }
	
	.video,
	#hero{ min-height: 600px; }
	
	#headline{ bottom: 5%; }
	
	
	.services{ padding-top: 50px; }
	.services .row{ margin: 0; }
	.services .row.row-3{ padding-bottom: 10px; }
	
	.home .ptitle .shadow{ font-size: 65px; }
	
	h2{ font-size: 33px; line-height: 40px; }
	p, .entry li{ font-size: 17px; line-height: 27px; }
	.more a{ font-size: 16px; }
	
	
	.services .row-last{ padding: 30px 0 70px; }
	.services .row-last h2{ font-size: 40px; line-height: 50px; }
	.services .row-last .more a{ font-size: 18px; padding: 17px 70px 18px; }
	
	.services::before{ background-size: auto 84%;}
	
	#portfolioSlider{ height: 1090px; }
	#portfolioSlider .slide{ height: 760px; }
	#portfolioSlider .sliderHeader{ margin-bottom: 0; }
	#portfolioSlider .arrows{ margin: 0 2%; width: 96%; }
	
	
	#testimonials .col-title{ width: 33%; }
	#testimonials h2{ font-size: 38px; line-height: 46px; }
	#testimonials .col-txt{ width: 66%; }
	#testimonials .col-txt p{ font-size: 19px; line-height: 30px; }
	#testimonials .col-txt p.small{ font-size: 18px; line-height: 28px; }
	#testimonials .col-txt .sign{ width: calc( 100% - 320px ); }
	#testimonials .logo-client{ margin-top: 5px; }
	#testimonials .logo-client img{  max-height: 24px; }
	#testimonials .col-txt .photo{ width: 90px; height: 90px; }
	#testimonials .col-txt .button{ margin-top: 45px; }
	
	
	#lets{ height: 400px; }
	#lets .txt{ margin-top: 100px; }
	#lets .txt h2{ font-size: 55px; line-height: 60px; }
	
	
	.footer-link{ padding: 50px 0 30px; }
	
	#footer{ padding: 10px 0; }
	ul#footer-bottom-menu ul{ padding-top: 10px;}
	#footer-bottom-menu li a{ font-size: 16px; }
	#footer-bottom-menu li li a{ font-size: 14px; margin: 1px 0; }
	
	.addres img{ height: 50px;}
	.addres p{ font-size: 14px; line-height: 30px; }
	
	#footer a{ font-size: 14px; }
	#footer p.copy{ font-size: 12px; }
	
	
	h1.page-title{ font-size: 50px; line-height: 45px; }
	.page-title::after{ margin-top: 30px; }
	
	.box-single .col-left h1 { font-size: 35px; line-height: 30px; }
	.box-single .col-left h5{ font-size: font-size:14px; padding-bottom: 0; }
	
	.box-content{ padding: 45px 0; }
	.box-content .shadow{ bottom: -46px; font-size: 90px; }
	.box-content-center { left:0; }
	.box-content p{ font-size: 22px; }
	
	
	#porftolio .thumbList{ width: 100%; margin: 0; }
	#porftolio .thumbList .item{ height: 440px; width: 46%; margin: 0 2.4667% 0 1.5333%; }
	#porftolio .thumbList .item .photo{ height: 280px; }
	#porftolio .thumbList .info h3{ font-size: 22px; padding-top: 6px; }
	#porftolio .thumbList .info p{ margin: 3px 0; }
	#porftolio .thumbList .info p::after{ margin-top: 10px; width: 40px; }
	
	
	#porftolio .list h2{ font-size: 50px; }
	#porftolio .list .item{ font-size: 17px; }
	
	.portfolio-description{ width: 90%;}
	
	.ba .canvas{ width: 85%; margin: 0 auto;	}
	.ba img{ width: 100%;}
	
	#portfolio-col-right  .shadow{ display: none; }
	
	.ptitle h3{ font-size: 25px; }
	.box-content-portfolio .col-text ul{ padding: 0; }
	.entry li{ margin-bottom: 5px; }
	
	.box-content-portfolio .col-photo{ margin-top: 45px; }
	
	.box-content-portfolio .col-text{ margin-top: 30px; }
	.box-content-portfolio .col-photo img{ width: 600px; }
	
	
	.single .box-single .content-photo{ top:200px; width: 500px;}
	
	
	.photos .row img{ height: 388px; }
	
	.next-prev .npost::after{ width: 50px; }
	.next-prev .npost.prev-post::after{ left: -55px; background-position: left center; }
	.next-prev .npost.prev-post:hover::after{ left: -70px; }
	
	.next-prev .npost.next-post::after{ right: -55px; background-position: right center; }
	.next-prev .npost.next-post:hover::after{ right: -70px; }
	
	.section-padding{ padding: 40px 0; }
	.single .section-padding{ padding: 30px 0; }
	
	.culture .col-right h4,
	.box-content.box-content-contact .col-right p,
	.content-text h2,
	.box-content .content-left h2{ font-size: 23px; line-height: 34px; }
	
	.portfolio-description p,
	.culture .col-right p,
	.section-main-post .col-txt p,
	.career-details p, .career-details p.small,
	.leadership .col-text p, 
	.box-content p,
	.box-content .content-right p{ font-size: 19px; line-height: 32px; }
	
	.halfSections .content-txt { margin-top: 30px; }
	.halfSections .content-txt .shadow{ font-size: 66px; }
	
	.halfSections .content-image img{ width: 630px; }
	
	.collaborate{ padding: 40px 0 65px; }
	.collaborate h3{ font-size: 40px; line-height: 50px; }
	
	
	.what-bring::before{ width: 550px; background-size: auto 89%; top: 125px; background-repeat: no-repeat;  }
	.what-bring .section-title{ margin: 40px 0; }
	.what-bring h2{ font-size: 40px; }
	
	.what-bring .iconTitle h3{ background-size: auto 70px;  padding-left: 100px; font-size: 25px; line-height: 30px; }
	.what-bring h4{ font-size: 19px; line-height: 29px; }
	.what-bring p{ font-size: 17px; line-height: 26px; }
	
	.color-section.color-2 .iconTitle h3{ left: 60px; }
	.what-bring .color-4 .iconTitle h3{ left: 60px; padding-left: 90px; }
	
	.content-photo{ right: -8%; height: 600px; top:-100px; }
	
	#process{ padding: 50px 0 50px; }
	.process-title .shadow{ font-size: 75px; }
	.process-title h3{ font-size: 45px; }
	
	#process .box_out h3{ font-size: 27px; line-height: 34px; }
	#process .box_out p{ font-size: 17px; line-height: 27px; }
	
	.leadership{ padding: 70px 0; }
	.leadership .col-photo{ width: 32%; }
	.leadership .col-photo img{ width: 200px;}
	.leadership .col-text h2{ font-size: 42px; }
	.leadership .col-text h2::after{ margin-top: 20px; }
	.leadership .col-text h5{ font-size: 20px; line-height: 30px; }
	.leadership .col-text p{ margin: 10px 0; }
	
	.team h2{ font-size: 45px; margin-bottom: 30px; }
	.team .col-people{ width: 64%;}
	.team .col{ height: 125px; }
	.team .col .col-photo img{ width: 80px; }
	.team .col-txt h3{ font-size: 19px; line-height: 34px; }
	.team .col-txt{ width: calc( 100% - 130px ); }
	.team .col-txt h5{ font-size: 13px; }
	
	.box-content-reviews .content-photo{ height: 360px; width: 58%; }
	
	.ct-title .shadow{ font-size: 90px; bottom: -32px; }
	.ct-title h2{ font-size: 58px; }
	
	
	.reviews .slide .photo .person img{ width: 165px; }
	.reviews .slide .txt p{ font-size: 18px; line-height: 30px; }
	.reviews .sign h4{ font-size: 23px; }
	.reviews .sign h5{ font-size: 16px; }
	
	.box-content-career-details .content-photo{ height: 500px; }
	
	.career-details{ padding: 0 0 30px; }
	.career-details p, .career-details p.small{ margin: 10px 0; }
	
	.requirements h2{ font-size: 40px; }
	.requirements h3{ font-size: 22px; }
	
	.entry li::before{ top:1px; }
	
	.section.culture-think{ padding: 70px 0 90px; }
	.culture-think h3{ font-size: 40px; }
	.culture-think p{ font-size: 20px; line-height: 30px; }
	
	
	.section-main-post .col-txt h5{ padding: 0; font-size: 14px; }
	.section-main-post .col-txt h3{ font-size: 35px; line-height: 42px; }
	
	
	.section-main-post .col-photo{ margin-top: 30px; }
	.section-main-post .col-txt{ margin-top: 60px; }
	.section-main-post .col-photo .photo{ width: 510px; }
	.section-main-post .col-photo .photo-add{ width: 400px;}
	
	.blog p.more a{ font-size: 17px; }
	.section-main-post .col-txt p{ margin: 0 0 20px; }
	
	.post-list{ padding: 40px 0;}
	.post-list .wrap{ width: 100%; margin-left: 15px; ;}
	
	.post-list .post .txt-in{ margin: 30px; }
	.post-list .post h3{ font-size: 22px; line-height: 28px; }
	.post-list .post p small{ font-size: 14px; }
	.post-list .txt-in p{ padding-bottom: 6px;  }
	
	.blog .post-list p.more a{ font-size: 16px; }
	
	
	.h2Hire{ font-size: 27px !important; }
	
	.careers h2{ font-size: 40px; }
	.careers .box h3{ font-size: 21px; }
	.careers .box{ padding: 40px 0; }
	
	.section.culture{ padding: 70px 0; }
	.section.culture h2{ font-size: 55px; line-height: 55px; }
	
	.more-about{ padding: 80px 0; }
	.more-about h3{ font-size: 40px; }
	.more-about p{ font-size: 23px; }
	
	#lets.letContact{ padding: 70px 0; }
	#lets .col-first h2{ font-size: 29px; }
	#lets .col-second .phone{ font-size: 34px; }
	#lets .col-second .email,
	#lets .col-thrid p{ font-size: 18px; }
	
	.ct-title2{ padding: 75px 0 40px; 	}
	
	
	.page-template-page-contact-php .box-content.box-content-contact .col-right p{ font-size: 21px;  }
	
	.modalForm .modal-in{ margin: calc( ( 100vh - 590px ) / 2 ) auto; }
	.modalForm .modal-box{ height: 590px; }
	
	.modalForm.modalTime .modal-box{ height: 680px; }
	.modalForm.modalTime .modal-in{ margin: calc( ( 100vh - 680px ) / 2 ) auto; }
	
	.modalForm .modal-in{ width: 100%; }
	.modalForm .modal-box{ width:96%; margin: 0 2%; padding: 50px 0;  }
	.modalForm .icons h2{ font-size: 30px; }
	.modalForm .icons{ width: 80%; margin: 0 10%;  }
	
	.hero .headline{ width: 94%; left: 3%;}
	.hero .headline h2{ line-height: 25px; margin-top: 10px;}
	
	.box-content.box-content-contact.box-wp-plugins .col-left,
	.box-content.box-content-contact.box-wp-plugins .col-right{ width: 100%; }
	
	.box-content.box-content-contact.box-wp-plugins .col-right p{ line-height: 1.4; }
	.box-content.box-content-contact.box-wp-plugins .col-right p{ text-align: right; }
	
	
	.section-stat .col-photo,
	.section-stat .col-txt{ width: 100% !important; }
	
	.section-stat .col-photo{ margin-left: 0; height: 400px; }
	
	.post-list .post .photo{ background-position: top left; }
	
	
	.box-content.box-content-contact.box-wp-plugins-WP .wrap{ display: block; }
	.box-content.box-content-contact.box-wp-plugins-WP .col-left,
	.box-content.box-content-contact.box-wp-plugins-WP .col-right{ 
		width: 100% !important; 
		justify-content: left;
	}
	.box-content.box-content-contact.box-wp-plugins-WP .col-right p{
		text-align: left !important; 
		margin-top: 15px;
	}
	
	.showreel img{ width: 100%; }
	
	#footer-bottom-menu{ width: 75%; }
	.addres{ width: 25%; }
	
	
	.section-recent-new  .news:nth-child(2){ display: none; }
	
	.post-list .post{ min-height: auto; 	}
}

@media only screen and  (max-width: 1150px) {
	.item-show{ 
		width: 100%;
	}
	#porftolio.portfolio-sr .wrap{
		width: 700px !important;
	}
}	

@media only screen and  (max-width: 980px) {
	
	.home #header, .single-portfolio #header, .single-portfolio-archive #header, #header.header-lp{ padding-top: 25px !important; }
	#header.sticky{ padding-top:15px !important; }

	 #nav{ display:none !important; }
	.slicknav_menu{ display:block !important;  }
	
	.slicknav_nav .button{ display: none !important; }
	
	.wrap,
	.services .row .wrap,
	.wrapPhotos,
	.box-content-portfolio .wrap{ width: 750px; }
	
	#headline h1{ font-size: 40px; line-height: 45px; padding-bottom: 5px;  }
	#headline h2{ font-size: 21px; line-height: 25px; padding: 0px 0 20px; }
	#headline a{ font-size: 16px; padding: 13px 40px 17px; }
	
	.box-content .shadow{ font-size: 68px; }
	
	.video, #hero, .video video{ max-height: 600px; min-height: 450px; }
	
	.services .row .col{ height: 290px; }
	.services .row{ margin: 20px 0 40px ;}
	.services .row .col-txt{ margin-top: 30px; }
	.home .ptitle .shadow{ display: none; }
	.home .ptitle h2{ padding: 0; }
	.services .col-txt.col-left{ margin-left: 0;}
	
	#testimonials h2{ font-size: 30px; line-height: 40px; }
	#testimonials .col-txt p{ font-size: 17px; }
	#testimonials .col-txt p.small{ font-size: 16px; line-height: 25px; }
	
	#portfolioSlider{ padding-top: 50px; }
	#portfolioSlider .shadow{ font-size: 70px; }
	#portfolioSlider p.welcome{ font-size: 18px; }
	
	
	#menu-item-4662{ display: none; }
	#footer-bottom-menu li{ width: 33.33%; }
	
	
	#portfolioSlider .arrows .arrow{ background-image: url("images/arr-blue-prev.png"); width: 35px; background-position: left center; }
	#portfolioSlider .arrows .arrow:hover{ width: 35px; }
	#portfolioSlider .arrows .arrow.arrow-next{ background-image: url("images/arr-blue-next.png"); background-position: right center; }
	
	#porftolio .thumbList .info p{ font-size: 14px; }
	#portfolioSlider{ height: 790px;}
	
	#portfolioSlider #slideshow2 {   margin-left: calc( 50% - 940px ); margin-top: -40px; }
	#portfolioSlider .layer h3{ font-size: 25px; line-height: 30px; }
	#portfolioSlider .layer p{ font-size: 14px; line-height: 21px; }
	#portfolioSlider .slide{ width: 400px; padding:  0 10px; }
	
	#portfolioSlider .slide .photo{ width: 370px; height: 300px !important;  }
	#portfolioSlider .slide .photoBox{ width: 300px; left: 100px; height: 280px; left: 45px !important; }
	#portfolioSlider .slide .bg-foto{ width: 279px; margin-top: 30px; }
	#portfolioSlider .slide .photoBox .mac-apla{ background-size: 100% auto; }
	#portfolioSlider .slide .layer{ margin-top: 30px;}
	#portfolioSlider .layer h3{ font-size: 25px; }
	#portfolioSlider .layer p{ height: 70px; line-height: 23px; }
	
	
	#lets{ height: 300px; }
	#lets .txt{ margin-top: 90px; }
	#lets .txt h2{ font-size: 42px; line-height: 46px; padding-top: 0px; } 
	
	
	#porftolio .list .item{ padding: 7px; font-size: 15px; }
	#porftolio .box-content.box-content-center{ padding: 30px 0; }
	
	.photos .fleft, .photos .fright{ margin: 8px; }
	
	.section-portfolio-text{ padding: 50px 0; }
	
	.row{ margin: 0; }
	.photos .row img {   height: 310px; }
	
	.next-prev .npost .col h5{ font-size: 15px; }
	.next-prev .npost .col h3{ font-size: 24px; line-height: 27px; padding-bottom: 5px; }
	.next-prev .npost .col p{ font-size: 13px; line-height: 18px; height: 60px; }
	.next-prev .photo{ height: 180px; }
	.next-prev .npost::after{ top:210px; }
	
	.what-bring::before{ left: calc( 50% - 380px ); }
	
	.team .col-box-photo .photo{ display: none; }
	.team .col-people{ width: 100%; }
	.team .col-box-photo{ margin-right: 0; }
	
	
	.section-main-post .col-photo{ width: 40%; }
	.section-main-post .col-txt{ width: 50%; }
	.section-main-post .col-photo .photo{ width: 120%; }
	.section-main-post .col-photo .photo-add{  width: 80%; margin-top: -80px;  }
	.section-main-post .col-txt h3{ font-size: 25px; line-height: 30px; }
	
	.content-text p{ font-size: 18px; line-height: 31px; }
	
	.rpwwt-widget ul li{ width: 46% !important; }
	.rpwwt-widget ul li:last-child{ display: none; }
	.rpwwt-widget ul li:first-child{ display: block; }
	
	.ct-title .shadow{ font-size: 60px; }
	.ct-title h2{ font-size: 34px; }
	
	.page-template-page-contact-php .box-content.box-content-contact .col-right p br{ display: none;  }
	
	
	#lets.letContact{ padding: 50px 0 40px; }
	#lets .col-first,
	#lets .col-second,
	#lets .col-thrid { width: 50%; }
	#lets .col-thrid{ margin-top: -25px; }
	
	.form .pole label{ font-size: 15px; }
	.form .pole input, .form .pole textarea, .form .pole select{ padding: 15px 20px; }
	
	
	.modalForm{ z-index: 100000000;}
	.modalForm .modal-box{ width: 100%; margin: 0; }
	
	.hideme{ opacity: 1 !important; }
	
	.section-stat.section-stat-WP .col-photo{ height: 280px; }
	
		/* logo-color */
	.logo-color img{ max-height: 75px; }
	
	.section-single-post-content{ padding-top: 30px !important; }
	
	.entry li{ margin-left: 30px;}
	
	.back-button{ padding-bottom: 40px; }
	
	.ptitle-description h3::after{ margin-top: 10px; }
	
	.rpwwt-widget ul li{ margin-top: 0 !important; }
	
	#footer-bottom-menu{ width: 93%; }
	
	.section-recent-new .content{ height: auto; }
	
	
}
@media only screen and  (max-height: 600px ) and   (max-width: 980px ) {
	.modalForm{ overflow: scroll; min-height: 100%; }
	.modalForm .modal-in{ margin: 0; }
	.modalForm.modalTime .modal-in{ margin: 0; }
	.modalForm .modal-box .closeButton{ position: fixed; }
	
	.modalForm .icons{ width: 94%; margin: 0 3%; }
	.modalForm .icons h2{ margin-bottom: 10px; margin-top: 0; padding-bottom: 0; }
	.modalForm .icons p{ margin-bottom: 20px; font-size: 15px;  }
	.modalForm .icons .icon{ height: 180px; background-size: auto 70px;  background-position: center 30px; }
	.modalForm .icons .icon strong{ margin-top: 120px; }
}
@media only screen and  (max-width: 768px) {
	
	body{ margin-bottom: 450px; }
	
		
	.wrap,
	.services .row .wrap,
	.wrapPhotos,
	.box-content-portfolio .wrap,
	.box-content-center .wrap{ width: 90%; }
	
	#headline h1{ font-size: 30px; line-height: 32px; padding-bottom: 5px;  }
	#headline h2{ font-size: 18px; line-height: 22px; padding: 0px 0 10px; margin-top: 0; }
	#headline a{ font-size: 15px; padding: 13px 30px 17px; }
	
	.video, #hero, .video video {  max-height: 440px;  min-height: 440px; }
	
	.services{ padding-top: 0; }
	.services .row .col{ width: 100%; margin-top: 20px;}
	.services .row .col{ height: 260px; }
	
	.services .row-last{ padding: 10px 0 50px; }
	.services .row-last h2{ font-size: 30px; line-height: 40px; }
	.services .row-last .more a{ padding: 14px 60px 15px;}
	
		
	#testimonials{ padding: 60px 0 30px; min-height: 710px; }
	#testimonials .col-title{ width: 100%; background: none; height: auto; margin-bottom: 30px;   }
	#testimonials h2 br{ display: none;  }
	
	#testimonials .col-txt{ width: 100%; }
	
	#testimonials .slider-nav{ bottom: 40px; }
	#testimonials .slide-in{ height: 450px; }
	
	#testimonials .col-txt .photo{ width: 75px; height: 75px; }
	#testimonials .col-txt .sign{ margin-left: 20px;  width: calc( 100% - 260px ); }
	#testimonials .sign h4{ font-size: 16px; }
	#testimonials .sign h5{ font-size: 11px; line-height: 13px; margin-top: 5px; margin-bottom: 5px; }
	#testimonials .logo-client img {  max-height: 20px; }
	#testimonials .col-txt .button{ width: auto; }
	#testimonials .col-txt .button a{ font-size: 11px; padding: 10px 10px; }
	
	#testimonials .col-txt p{ font-size: 17px; line-height: 28px; }
	#testimonials .col-txt p.small{ line-height: 23px; }
	
	#portfolioSlider #slideshow2{ margin-left: calc( 50% - 895px ); }
	#portfolioSlider .sliderHeader{ width: 94%; margin: 0 3%; }
	#portfolioSlider .welcome a{ display: block; }
	
	#lets {   height: 250px; }
	#lets .txt {  margin-top: 70px; }
	#lets .txt h2{ font-size: 30px; line-height: 32px; }
	#lets .txt span{ width: 90px; height: 19px; background-size: auto 20px; }
	
	
	.addres{ width: 100%; }
	.menu-footer-menu-container{ display: none; }
	
	.addres img{ display: none; }
	
	.addres ,
	.addres p{ text-align: center; font-size: 16px; line-height: 24px; }
	
	#footer .col{ width: 100%; text-align: center; }
	
	.box-content{ padding: 20px 0; }
	.box-content p{ font-size: 16px; line-height: 24px; }
	
	#porftolio .thumbList .item{ height: 300px;  }
	#porftolio .thumbList .item .photo{ height: 230px; }
	#porftolio .thumbList .info h3{ font-size: 20px; }
	#porftolio .thumbList .info p.desc{ display: none; }
	
	#porftolio .thumbList .item:nth-child(-n+6) { width: 95%; margin: 0 2.4667% 1.5%;  } 
	#porftolio .thumbList .item:nth-child(-n+6) .info p.desc{ display: block; }
	#porftolio .thumbList .item:nth-child(-n+6){ height: 400px; }
	#porftolio .thumbList .item:nth-child(-n+6) .photo{ height: 280px; }
	
	.single-portfolio-archive .hero,
	.single-portfolio .hero{ max-height: 600px !important; 	}
	
	.hero .headline h1{ font-size: 35px; line-height: 30px; letter-spacing: 0;}
	
	.content-right, 
	.content-left{ width: 100%; }
	
	.color-section .wrap{ grid-template-columns: 100%; grid-template-areas: "."; }
	.what-bring::before{ display: none; }
	.what-bring .iconTitle h3{ padding: 45px 0 5px 100px; height: auto; background-position: left bottom; 	}
	
	.what-bring .color-4 .iconTitle h3,
	.color-section.color-2 .iconTitle h3{ left: 0; }
	.collaborate h3 {  font-size: 30px;  line-height: 40px; }
	
	.single-portfolio-archive .hero,
	.single-portfolio .hero{ min-height: 500px !important; max-height: 500px !important; }
	.hero .headline h1{ padding-bottom: 0; margin-bottom: 0; }
	.hero .headline h2{ font-size: 21px; font-weight: 500;  }
	.hero #scroll{ bottom: -40px; width: 80px; height: 80px; background-size: 40px auto; margin-left: -40px; }
	
	.box-content-portfolio .col-text,
	.box-content-portfolio .col-photo{
		width: 100%; 
	}
	.box-content-portfolio .col-photo img{ width: 96%; margin:  0 2%; }
	
	.wrapPhotos{ width: 600px; }
	.photos{ margin: 80px 0; }
	.photos .fleft, .photos .fright{ margin: 0; }
	.photos .row img{ height: auto; width: 100%;  }
	.photos .row .fbig { width: 98%; margin: 1%; }
	.photos .row .fsmall { width: 48%; margin: 1%; }
	.photos .row.row-right{ margin-top: -396px;}
	
	.next-prev{ padding-top: 30px; padding-bottom: 50px;}
	.next-prev .npost::after{ top:150px;}
	.next-prev .npost .col h3{ padding-bottom: 15px; font-size: 21px;  }
	.next-prev .npost .col p{ display: none; }
	
	.culture .col-left,
	.culture .col-right,
	.content-photo,
	.content-text,
	.box-content-reviews .content-text,
	.box-content-reviews .content-photo, 
	.leadership .col-text,
	.leadership .col-photo,
	.reviews .slide .photo,
	.reviews .slide .txt,
	.box-content.box-content-contact .col-left,
	.box-content.box-content-contact .col-right,
	.section-main-post .col-photo,
	.section-main-post .col-txt,
	.careers .box,
	.career-details,
	.box-single .col-left,
	.box-single-intro .content-text,
	.section-single-content .col-left,
	.section-single-content .col-right{ width: 100%; }
	
	.culture .col-right h4 br{ display: none; }
	
	.content-photo{  position: unset; height: 270px; }
	
	.more-about h3{ font-size: 29px; line-height: 34px;}
	.more-about p{ font-size: 18px; line-height: 22px; 	}
	
	#process{ padding: 30px 0; }
	.process-title{ margin-bottom: 0; }
	#process .box_out .icon{ width: 120px; height: 120px; background-size: contain; }
	#process .box_out{ width: 100%; margin: 30px 0; }
	#process .box_out .box { width: calc( 100% - 150px );  margin-right: 0; } 
	#process .box_out.box_out-right .box{ margin-right: 0; }
	
	
	
	.team .col { float: left;  width: calc( 50% - 5px ); margin: 0 5px 5px 0; } 
	.team .col .col-photo{ margin: 15px 5px; }
	.team .col-txt { width: calc( 100% - 90px ); }
	.team .col{ height: 115px; }
	
	.box-content-reviews .content-text br{
		display: none; 
	}
	
	.box-content-career-details .content-photo,
	.box-content-reviews .content-photo{ height: 270px; }
	
	.ct-title{ padding: 10px 0; }
	
	.section-main-post .col-photo .photo{ width: 90%; margin-left: 0; }
	
	.post-list .wrap{ width: 90%; margin: 0 auto; }	
	.post-list .post{ width: 100%; margin: 20px 0;  }
	
	#lets .col-first, #lets .col-second, #lets .col-thrid{ width: 100%; margin: 0; }
	#lets .col-second{ margin-bottom: 20px;}
	
	.requirements .box{ padding-top: 60px; padding-left: 0; background-position: 10px 5px; }
	
	.culture-think h3{ font-size: 25px; }
	.culture-think p{ font-size: 18px; }
	
	.rpwwt-widget ul li{ width: 100% !important; }
	.rpwwt-widget ul li:nth-child(2){ display: none; }
	
	
	.modalForm .modal-in{ margin: 0 auto;}
	.modalForm .modal-box{ height: auto !important; min-height: 100vh; }
	.modalForm.modalTime .modal-box{ height: 100vh; }
	.modalForm.modalTime .modal-in{ margin: 0 auto; }
		
	.post-list .post .photo{ width: 100%; }	
	.post-list .post .txt{ min-height: auto; }	
	.post-list .post .more{ position: unset; margin-top: 20px; }
	
	#porftolio.portfolio-sr .wrap{
		width: 90% !important;
	}	
	
	
	.bar-10	.normal-text{ display: none; }
	
	.box-single .col-left h1{ padding-bottom: 15px; }
	.single .box-single .content-photo{ width: 100%; }
	
}


@media only screen and  (max-width: 610px) {
	
	#header #logo{ width: 240px; }
	
	#porftolio .list .box{ width: 100%;}
	
	.ba .ba-head .col-first{ padding-top: 30px;}
	.ba .ba-head .col{ font-size: 15px;}
	.ptitle .shadow{ display: none; }
	
	.wrapPhotos{ width: 360px;}
	.photos .row.row-right{ margin: 0; }
	.photos .row .fsmall{ width: 98%;}
	
	#lets .txt a:hover span{ width: 50px; }
	
	.modalForm .icons .icon{ height: 240px; background-position: center 50px; background-size: auto 80px; }
	.modalForm .icons .icon strong{ margin-top: 170px; font-size:18px; }
	.modalForm .icons .icon strong span{ display: block; }
	
	.form .pole{ width: calc( 100% - 20px ); }
	
	#portfolioSlider .shadow{ font-size: 50px;}
	
	.careers .box h3,
	.careers .box p{ float: none; 	}
	
	.reviews .slide{ margin: 30px 0; }
	.reviews .slide .photo .person img{ width: 130px; }
	.reviews .slide .txt{ padding: 20px 0 0 20px; }
	.reviews .slide .txt p{ font-size: 17px; line-height: 27px; }
	
	.reviews .hideme6 .slide .txt p{ font-size: 15px; line-height: 23px; }	
	
	.showreel a.videoS::after{ width: 100px; height: 100px; margin-top: -50px; margin-left: -50px; background-size: cover; }
	.showreel::before{ height: 200px; }
	
}

@media only screen and  (max-width: 500px) {
	
	h1.page-title{ font-size: 35px; }
	.box-content .shadow{ font-size: 50px;}
	
	.services .row-last h2{ font-size: 25px; line-height: 33px; }
	.services .row .photo{ margin-top: 50px; }
	.services .row-last h2{ font-size: 22px; line-height: 29px; }
	
	
	
	#portfolioSlider{ height: 850px;}
	
	#testimonials{ height: 755px;}
	#testimonials .slide-in{ height: 580px; }
	
	
	
	#testimonials h2 {  font-size: 23px; line-height: 30px; }
	#testimonials .col-txt p{ background-size: auto 45px; text-indent: 70px; padding-top: 20px; }
	#testimonials .col-txt .sign{ width: calc( 100% - 100px ); }
	#testimonials .col-txt .button{ margin-top: 30px; }
	#testimonials .slider-nav{z-index: 999; width: 55%; }
	
	#porftolio .thumbList .item{ width: 95%; margin: 0 2.4667% 1.5%; }
	
	.halfSections .content-image img{ width: 110%; margin-right: -5%; }
	
	.collaborate h3 { font-size: 25px;  line-height: 32px; }
	
	.team .col{ width: 100%;}
	
	.team .col-box-photo{ margin-top: 0; width: 100%; }
	
	.ct-title .shadow{ display: none;}
	.ct-title h2{ padding: 0; font-size: 30px; }
	
	.ct-title2 h2{ margin-top: 30px;}
	
	.post-list .post .photo{ width: 100%; height: 230px; }
	
		
	#portfolioSlider .arrows{ top: 602px; }
	
	#headline h2 br{ display: none; }
	
	.next-prev .npost .col h5{ font-size: 12px; }
	.next-prev .npost .col h3{ font-size: 19px; line-height: 22px; }
	.next-prev .photo{ height: 130px; }
	
	.next-prev .npost::after{ width: 30px; }
	.next-prev .npost.prev-post::after{ left: -30px; }
	.next-prev .npost.next-post::after{ right: -30px;}
	
	.process-title .shadow{ display: none;}
	
	.form{ width: 100%; margin: 0; }
	.intake .form{ width: 80%; margin: 0 10%;}
	
	
	.section-stat .col-txt .item{ width: 100%; }
	.section-stat .col-txt p{ margin-bottom: 0;}
	
	.item-show{ height: 200px; }
	
	
	
	.bar-10{ font-size: 12.5px; }
	.slicknav_btn{ top: 0px; }
}

@media only screen and  (max-width: 400px) {
	#testimonials{ height: 830px; }
	#testimonials .slide-in{ height: 655px; }
}
	
	
@media only screen and  (max-height: 740px ) and   (max-width: 500px ) {
	.modalForm{ overflow: scroll; min-height: 100%; }
	.modalForm .modal-in{ margin: 0; }
	.modalForm.modalTime .modal-in{ margin: 0; }
	.modalForm .modal-box .closeButton{ position: fixed; }
	#lets .txt h2{ font-size: 24px; }
	
	/* .modalForm .modal-in { margin: calc( ( 100vh - 650px ) / 2 ) auto; }
	.modalForm.modalTime .modal-in { margin: calc( ( 100vh - 740px ) / 2 ) auto; } */
	
}