/*
* Used for tablet and mobile devices
*/

/* Tablet Portrait size to standard 980 (devices and browsers) */
@media only screen and (min-width: 940px) and (max-width: 1024px) {

	.hero-image { background-position:center center; }
	.featured-image { background-position:center center; background-attachment:scroll; }
	.our-process-list img { opacity:1; filter:alpha(opacity=100); }
	.our-process-list img.unread { opacity:1; filter:alpha(opacity=100); }
	
	.work-detail .work-thumb .flex-direction-nav { display:none; }
	.work-list .work:hover .description { opacity:0; filter:alpha(opacity=0); }
	.work-list .work:hover img { opacity:1; filter:alpha(opacity=100);}

}
/* Tablet Portrait size to standard 980 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 939px) {
	
	.container { width:100%; }
	#header { padding-left:2%; width:98%; }
	#fixed-header { padding-left:2%; width:98%; display:none; }
	.fixed-header .contact-info { position:absolute; }
	.fixed-header .contact-info.active { height:71px; }
	#header .contact-button { margin-right:-1px; }
	.contact-info { width:96%; padding:0 2%; }
	.contact-info li a { font-size:20px; }
	.fixed-header .contact-info li .phone-number {  margin-top:11px; font-size:20px; }
	.fixed-header .contact-info li a { margin-top:11px; }
	.hero-image { background-position:center center; }
	.hero-image .hero-text { opacity:1 !important; filter:alpha(opacity=100) !important; }
	.hero-image .explore { opacity:1 !important; filter:alpha(opacity=100) !important; }
	
	.featured-image { background-position:center center; background-attachment:scroll; }
	
	.work-list .work { width:32%; margin:0 2.2% 2% 0; height:auto; }
	.work-list .work img { height:auto; }
	.work-list .work .description { width:100%; height:100%; padding:0; }
	.work-list .work .description h3 { margin:30% 0 0 0; font-size:22px; }
	.work-list .last { width:32%; margin:0 0 2% 0; float:right; }
	.work-list .work:hover .description { opacity:0; filter:alpha(opacity=0); }
	.work-list .work:hover img { opacity:1; filter:alpha(opacity=100);}

	
	.services .services-list { background:none; height:auto; margin-bottom:30px; }
	.services .services-list .service-1 { width:33.33%; margin-right:0; }
	.services .services-list .service-2 { width:33.33%; margin-right:0; }
	.services .services-list .service-3 { width:33.33%; }
	.services .services-list .service-4 { width:33.33%; margin-right:0; }
	.services .services-list .service-5 { width:33.33%; margin-right:0; }
	.services .services-list .service-6 { width:33.33%; }
	
	.our-process-list { background:none; overflow:hidden; }
	.our-process-list h3 { font-size:18px; }
	.our-process-list img { opacity:1; filter:alpha(opacity=100); }
	.our-process-list img.unread { opacity:1; filter:alpha(opacity=100); }
	.our-process-list .process-1 { margin:0 auto; position:relative; left:auto; }
	.our-process-list .process-2 { margin:0 auto; position:relative; left:auto; top:-150px; }
	.our-process-list .process-3 { margin:0 auto; position:relative; left:auto; top:-350px; }
	.our-process-list .process-4 { margin:0 auto; position:relative; left:auto; top:-600px; }
	.our-process-list #our-process-design { position:absolute; top:60px; left:40px; margin:0; }
	.our-process-list #our-process-backend { position:absolute; top:60px; right:50px; float:left; clear:both; margin:0; }
	.our-process-list #our-process-compliance { position:absolute; bottom:120px; left:10px; float:right; margin:0; }
	.our-process-list #our-process-planning { position:absolute; bottom:120px; right:20px; float:right; margin:0; }
	
	
	.plan-your-project-container { width:96%; margin:0 auto; }
	.plan-your-project-container br { display:none; }
	.plan-your-project-container input[type=text] { width:96%; padding:0 2%; }
	.plan-your-project-container textarea { width:96%; padding:0 2%; }
	.plan-your-project-container .one-second input[type=text] { width:96%; padding:0 2%; }
	.plan-your-project-container .one-third input[type=text] { width:96%; padding:0 2%; }
	.one-second { width:47.5%; margin-right:3%; }
	.one-second.column-last { margin-right:0; }
	.one-third { width:32.66%; margin-right:1%; }
	.one-third.column-last { margin-right:0; }
	
	.case-study-content .case-study-slider img { margin:0; max-width:100%; height:auto; }
	.case-study-content .case-study-slider-container { background-size:100%; width:75%; height:auto; padding:33px 35px 100px 35px; }
	.case-study-content .case-study-slider { width:100%; height:auto; }
	.case-study-content .case-study-slider .flex-direction-nav .prev { top:33%; }
	.case-study-content .case-study-slider .flex-direction-nav .next { top:33%; }
	
	.case-study-content img { max-width:96%; margin:0 auto; }
	.case-study-content br { display:none; }
	.case-study-content .green-box .column { width:30%; padding:0 1%; margin-right:2%; }
	.case-study-content .green-box .column-last { margin-right:0; }
	.case-study-content .front-end-box ul { margin:0 auto 40px auto; width:96%; }
	.case-study-content .front-end-box ul li { width:26.33%; padding-left:7%; }
	.case-study-content .front-end-box .column { width:46.5%; padding-left:2%; }
	.case-study-content .front-end-box .column-last { width:46.5%; padding-right:2%; }
	.case-study-content .black-box { width:97%; padding:0 1.5%; }
	.case-study-content .black-box .container { width:39%; padding:1px 0 20px 61%; }
	.case-study-content .black-box img { max-width:58%; }
	
	.service-box .service-thumb { width:47.5%; }
	.service-box .service-content { width:47.5%; }
	.service-box-alt .service-content { margin-right:5%; }
	.service-box h2 { font-size:22px; }
	.service-box p { font-size:18px; }
	.services-list .service-box-design .service-thumb { margin-top:30px; }
	.services-list .service-box-ios-androidapp-development .service-thumb { margin-top:20px; }
	
	.about-features .finished-project { width:47.5%; }
	.about-features .finished-project .icon-box { margin:0 193px 29px 0; float:right; }
	.about-features .team-something { width:47.5%; }
	.about-features h2 { clear:both; }
	
	.how-create-project { background:none; }
	.how-create-project p { margin:0 0 50px 0; }
	.how-create-project .top-step-list { width:96%; margin:0 auto 50px auto; }
	.how-create-project .bottom-step-list { width:96%; padding-bottom:50px; }
	.how-create-project .step { width:20%; }
	.how-create-project .step h3 { width:auto; font-size:12px; margin-top:2px; }
	.how-create-project .step-text { margin:0 0 50px 0; }
	.how-create-project .step-text h2 { width:100%; }
	.how-create-project .step-text p { display:none; }
	.how-create-project .step .icon-box { margin:0 10px 0 0; width:50px; height:48px; }

	.work-detail { width:100%; }
	.work-detail-content { padding:30px 2% 0 2%; width:96%; }
	.work-detail.active { min-height:350px; height:auto; }
	.work-detail .work-thumb { width:53%; background-size:100%; height:auto; padding:3% 2% 9% 2%; }
	.work-detail .work-thumb .work-slider { width:100%; height:auto }
	.work-detail .work-thumb .work-slider img { height:auto; }
	.work-detail .work-description { width:39%; padding-top:6px; }
	.work-detail .work-thumb .flex-direction-nav { display:none; }
	.work-detail-left .up-arrow { margin-left:14%; }
	.work-detail-middle .up-arrow { margin-left:48%;  }
	.work-detail-right .up-arrow { margin-left:82%;  }
		
	#footer { padding-left:2%; padding-right:2%; width:96%; margin:0 auto; height:auto; }
	#footer .footer-first-column { width:31%; margin:0 2% 0 0; }
	#footer .footer-first-column a { font-size:18px; }
	#footer .footer-first-column h2 { font-size:34px; }
	#footer .footer-second-column { width:31%; margin:0 2% 0 0; height:auto; }
	#footer .footer-third-column { width:33%; }
	#footer .footer-third-column .social-links { float:right; }
	
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
	
	body {  }
	.container { width:100%; }
	#header { width:100%; }
	#header .logo { margin-left:4%; display:none; }
	#header .mobile-logo { margin-left:4%; display:block; }
	#header .mobile-logo img { width:191px; height:auto; }
	#fixed-header { padding-left:2%; width:98%; display:none; }
	#header .contact-button { margin-right:-1px; display:none; }
	#header #nav { display:none; }
	#mobile-nav-container { display:block; margin-right:4%; }
	#mobile-nav-container select { margin:0; }
	.contact-info { display:none; }
	.fixed-header .contact-info li .phone-number {  margin-top:11px; font-size:20px; }
	.fixed-header .contact-info li a { margin-top:11px; }
	.hero-image-container { height:300px; }
	.hero-image { background-position:center center; padding-top:65px; height:235px; }
	.hero-image .hero-text { opacity:1 !important; filter:alpha(opacity=100) !important; width:96%; margin-left:auto; margin-right:auto; }
	.hero-image .explore { opacity:1 !important; filter:alpha(opacity=100) !important; }
	.hero-image .hero-text h3 { font-size:24px; }
	.hero-image .hero-text h2 { font-size:40px; }
	
	.work-list { padding-left:2%; padding-right:2%; width:96%; }
	.work-list .work { width:49%; margin:0 0 2% 0; height:auto; }
	.work-list .work:nth-child(even) { float:right; }
	.work-list .work img { height:auto; }
	.work-list .work .description { width:100%; height:100%; padding:0; }
	.work-list .work .description h3 { margin:30% 0 0 0; font-size:22px; }
	
	.work-list .work:hover .description { opacity:0; filter:alpha(opacity=0); }
	.work-list .work:hover img { opacity:1; filter:alpha(opacity=100); }

	.our-latest-work h2 { margin:30px 0; } 
	
	.services { padding-left:2%; padding-right:2%; width:96%; }
	.services .services-list { background:url(../images/mobile/mobile-services-bg.png) no-repeat center 65px; height:auto; margin-bottom:30px; }
	.services .services-list .service-1 { width:50%; margin-right:0; }
	.services .services-list .service-2 { width:50%; margin-right:0; }
	.services .services-list .service-3 { width:50%; }
	.services .services-list .service-4 { width:50%; margin-right:0; }
	.services .services-list .service-5 { width:50%; margin-right:0; }
	.services .services-list .service-6 { width:50%; }
	.service-box p { text-align:center; }
	.services .services-list .service h3 { padding-top:23px; margin:0 0 20px 0; }
	
	.our-process { padding-left:2%; padding-right:2%; width:96%; }
	.our-process-list { display:none; }
	.mobile-our-process { display:block; }
	
	.your-project-with-us-inner { width:100%; }
	.your-project-with-us .your-project-with-us-box { left:0; }
	.your-project-with-us .plan-box h2 { font-size:20px; }
	
	.featured-image { background-size:auto; height:auto; padding:45px 0 35px 0; }
	.featured-image h1 { font-size:40px; line-height:1.5; }

	.plan-your-project-container { width:96%; margin:0 auto; }
	.plan-your-project-container br { display:none; }
	.plan-your-project-container input[type=text] { width:96%; padding:0 2%; }
	.plan-your-project-container textarea { width:96%; padding:0 2%; }
	.plan-your-project-container .one-second input[type=text] { width:96%; padding:0 2%; }
	.plan-your-project-container .one-third input[type=text] { width:96%; padding:0 2%; }
	.one-second { width:100%; margin-right:0; float:none; }
	.one-second.column-last {  width:100%; margin-right:0; float:none; }
	.one-third {  width:100%; margin-right:0; float:none; }
	.one-third.column-last {  width:100%; margin-right:0; float:none; }
	
	.about-features { background:none; padding-top:50px; }
	.about-features .finished-project { width:96%; padding-left:2%; padding-right:2%; float:none; margin:0 0 20px 0; background:none; }
	.about-features .finished-project .icon-box { margin:0 auto 29px auto;  }
	.about-features .team-something { width:96%; padding-left:2%; padding-right:2%; float:none; margin:0 0 20px 0; background:none; }
	.about-features .team-something .icon-box { margin:0 auto 29px auto; }
	.about-features .team-something img { margin:10px auto 30px auto; padding:0 10%; width:80%; }
	.about-features h2 { clear:both; margin:0 0 30px 0; }
	.about-features .finished-project img { margin:0 0 30px 0; padding:0 10%; width:80%; }
	.about-features p { margin:0 0 30px 0; text-align:center; }
	
	.founded-slider { width:100%; height:auto; }
	.how-create-project { background:none; width:96%; padding-left:2%; padding-right:2%; }
	.how-create-project .step-text { height:auto; padding:0; margin:0 0 50px 0; }
	.how-create-project .step-text h2 { width:100%; padding:20px 0; position:static; margin:0; display:none; }
	.how-create-project .step-text .active { display:block; }
	.how-create-project .step { width:50%; float:left; }
	.how-create-project .step .icon-box { float:none; margin:0 auto 15px auto; }
	.how-create-project .step h3 { float:none; margin:0 auto 15px auto; text-align:center; font-size:10px; width:120px; }
	.how-create-project .step h3 br { display:none; }
	.how-create-project .top-step-list { width:80%; margin:0 auto 30px auto; }
	.how-create-project #step-design { width:100%; }
	.how-create-project .bottom-step-list { width:80%; margin:0 auto 30px auto; padding-bottom:0; }
	.how-create-project #step-launched { width:100%; }
	.how-create-project p { margin:0 0 30px 0; }
	.how-create-project #step-testing h3 { width:100px; }
	.how-create-project #step-design h3 { width:100px; }
	.how-create-project #step-discuss h3 { width:100px; }
	
	.service-box { padding:30px 0 40px 0; }
	.service-box h2 { text-align:center; }
	.service-box .service-content img { margin:0 auto 23px auto; display:block; }
	.service-box .service-thumb img { margin:0 auto; display:block; }
	.service-box .service-thumb { width:96%; padding-left:2%; padding-right:2%; float:none; }
	.service-box .service-content { width:96%; padding-left:2%; padding-right:2%; float:none; }
	.service-box-alt .service-thumb { width:96%; padding-left:2%; padding-right:2%; float:none; }
	.service-box-alt .service-content { width:96%; padding-left:2%; padding-right:2%; float:none; }
	
	.service-box-design .service-thumb { margin-top:0; }
	.service-box-web-development-custom-cms-solutions .service-thumb { margin-top:0; }
	.service-box-social-media-apps-management .service-thumb { margin-top:0; }
	.service-box-ios-androidapp-development .service-thumb { margin-top:0; }
	.service-box-mobile-tabletresponsive-themes .service-thumb { margin-top:0; }
	.service-box-wordpress-themes-support .service-thumb { margin-top:0; }
	
	
	.about-testimonial { width:96%; padding:30px 2% 20px 2%; }
	.case-study-content .about-testimonial { width:96%; padding:30px 2% 20px 2%; }
	
	.case-study .work-list .last { margin:0 auto; float:none; clear:both; }
	.case-study-content .front-end-box { padding:47px 0 10px 0 !important; }
	.case-study-content .front-end-box ul { margin-bottom:0; }
	.case-study-content .white-box .column { margin:0 auto 30px auto; float:none; }
	.case-study-content .green-box .column img { margin:10px auto 26px auto; }
	.case-study-content .green-box .column p { margin:0 0 15px 0; }
	.work-list #work-1, .work-list #work-3, .work-list #work-5, .work-list #work-7, .work-list #work-9, .work-list #work-11 { float:left; }
	.work-list #work-2, .work-list #work-4, .work-list #work-6, .work-list #work-8, .work-list #work-10, .work-list #work-12 { float:right; }
	.work-list .work .description h3 { margin:15% 0 0 0; font-size:16px; }
	.work-list .work .description p { font-size:12px; margin:0 0 8px 0; }
	
	.work-detail { width:100%; }
	.work-detail-content { padding:15px 20px 0 20px; }
	.work-detail .work-description { width:100%; float:none; padding-top:30px; margin:0; text-align:center; }
	.work-detail .work-description h3 { font-size:16px; }
	.work-detail .work-description p { font-size:12px; }
	.work-detail .work-thumb { width:92%; float:none; padding:4% 4% 15% 4%; height:auto; background-size:100% 100%; }
	.work-detail .work-thumb .work-slider { width:100%; height:100%; }
	.work-detail .work-thumb .work-slider .slides li img { width:100%; height:auto; }
	.work-detail .work-services { display:none; }
	.work-detail.active { height:auto; }
	.work-detail .close { top:34px; right:15px; }
	.work-detail-left .up-arrow { margin-left:20%; }
	.work-detail-middle .up-arrow { margin-left:70%; }
	.tooltip-inner { font-size:12px; }
	
	.case-study-featured-image p { font-size:16px; line-height:1.5; }
	.case-study-featured-image p:last-child { padding:0 10px 2px 10px; }
	
	.case-study-featured-image .explore a h2 { font-size:14px; line-height:40px; width:88px; }
	.case-study-featured-image .explore span { width:45px; height:40px; }
	
	.case-study-content .white-box { width:96%; padding-left:2% !important; padding-right:2% !important; }
	.case-study-content .gray-box { width:96%; padding-left:2% !important; padding-right:2% !important; }
	.case-study-content .wireframes-black-box { width:96%; padding-left:2%; padding-right:2%; }
	.case-study-content .black-box { width:96%; padding-left:2%; padding-right:2%; text-align:center; }
	.case-study-content .green-box { width:96%; padding-left:2%; padding-right:2%; }
	.case-study-content .green-box .column { width:100%; margin:0 auto; float:none; padding:0; }
	.case-study-content .case-study-slider .flex-direction-nav { display:none; }
	.case-study-content .case-study-slider-container { width:90%; padding:5% 5% 20% 5%; height:auto; background-size:100%; }
	.case-study-content .case-study-slider { width:100%; height:100%; }
	.case-study-content .front-end-box ul { margin:0 0 20px 20%; }
	.case-study-content .front-end-box li { width:auto; }
	.case-study-content .front-end-box .column { width:100%; margin:0 0 20px 0; float:none; text-align:center; }
	.case-study-content .front-end-box .column-last { width:100%; margin:0 0 30px 0; float:none; }
	
	.case-study-content .black-box img { display:none; }
	.case-study-content .black-box .container { padding:20px 0; width:100%; }
	
	.page404 h1 { width:auto; font-size:70px; float:none; text-align:center; line-height:1.4; }
	.page404 h2 { width:auto; font-size:32px; float:none; text-align:center; line-height:1.4; }
	.page404 h3 { width:auto; font-size:28px; float:none; text-align:center; line-height:1.4; }
	.page404 p { width:auto; float:none; text-align:center; line-height:1.3; }

	
	
	#footer { width:100%; margin:0 auto; height:auto; }
	#footer .footer-first-column { width:auto; margin:0 0 30px 20px; }
	#footer .footer-first-column a { font-size:16px; }
	#footer .footer-first-column h2 { font-size:28px; }
	#footer .footer-second-column p { font-size:14px; }
	#footer .footer-second-column { width:auto; margin:0 20px; height:auto; clear:both; }
	#footer .footer-third-column { width:auto; margin:0 20px 20px 0; height:auto; float:right; }
	#footer .footer-third-column .social-links { float:right; margin:0 0 20px 0; }
	#footer .footer-third-column .social-links li { margin:0 0 0 15px; }
	#footer .footer-third-column .logo { clear:both; margin:0 0 20px 0; }
	#footer .footer-third-column .copyright { font-size:14px;  }
	
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) { }

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
	
	#header { height:45px; }
	#header .logo { margin-left:4%; margin-top:15px; }
	.contact-info { display:none; }
	
	#mobile-nav-container { margin-right:4%; }
	#mobile-nav-container .mobile-nav-icon { background-size:50%; width:45px; height:45px; }
	#mobile-nav-container select { width:45px; height:45px; }
	#header .mobile-logo { margin:16px 0 0 4%; }
	#header .mobile-logo img { width:140px; height:auto; }
	.hero-image .hero-text { width:90%; }
	.hero-image .hero-text h3 { font-size:18px; }
	.hero-image .hero-text h2 { font-size:36px; }
	.your-project-with-us .plan-box h2 { font-size:16px; }
	
	.our-latest-work h2 { font-size:22px; }
	.services h2 { font-size:22px; }
	.services p { font-size:16px; }
	.services .services-list { background:none; }
	.services .services-list .service a span { background-size:50%; width:100px; height:100px; }
	.services .services-list .service h3 { font-size:14px; }
	.services .services-list .service-3 { clear:both; }
	.services .services-list .service-5 { clear:both; }
	
	.our-process h2 { font-size:22px; }
	.our-process p { font-size:16px; }
	
	.featured-image {  height:auto; padding:50px 0 40px 0; }
	.featured-image h1 { font-size:24px; }
	.plan-your-project-container .recaptcha-field #recaptcha_area { max-width:100%; margin-left:-2%; }
	

	.about-founded h2 { font-size:22px; }
	.about-founded p { font-size:16px; }
	.about-features h2 { font-size:22px; }
	.about-features p { font-size:16px; }
	.how-create-project h2 { font-size:22px; }
	.how-create-project p { font-size:16px; }
	.how-create-project .step-text h2 { font-size:22px; }
	.about-testimonial h2 { font-size:22px; }
	.about-testimonial p { font-size:16px; }
	.case-study-content .about-testimonial h2 { font-size:22px; }
	.case-study-content .about-testimonial p { font-size:16px; }	 
	.your-project-with-us .active-plan-box h3 { font-size:16px; }
	.your-project-with-us .active-plan-box h2 { font-size:22px; }
	.your-project-with-us .your-project-with-us-box { width:280px; left:0; height:auto; background-size:100% 100%; }
	.your-project-with-us .plan-box { width:275px; height:28px; padding-top:120px; background:url(../images/mobile/mobile-plan-box.png) no-repeat; }
	.your-project-with-us .active-plan-box { width:275px; height:100px; padding-top:48px; background:url(../images/mobile/mobile-plan-active-box.png) no-repeat; }
	.your-project-with-us-inner { width:100%; background-size:100%; }

	.case-study h2 { font-size:22px; }
	.our-work h2 { font-size:22px; }
	.case-study-content .front-end-box ul { margin:0 0 0 10%; }
	.case-study-content h2 { font-size:22px; }
	.case-study-content p { font-size:16px; }
	.case-study-content p br { display:none; }
	.case-study-content .front-end-box li h2 { font-size:22px; }
	.case-study-content .front-end-box li h3 { font-size:16px; }
	.case-study-content .front-end-box .column p { font-size:16px; }
	.case-study-content .black-box p { font-size:16px; }
	.case-study-content .black-box h3 { font-size:18px; }
	.case-study-content .wireframes-black-box h1 { font-size:24px; }
	.service-box h2 { font-size:22px; }
	.service-box p { font-size:16px; text-align:center; }
	
	.plan-your-project-container h2 { font-size:22px; }
	.plan-your-project-container p { font-size:16px; }
	
	#footer .footer-first-column { margin:0 0 20px 0; padding:0 0 0 4%; width:46%; float:left; }
	#footer .footer-first-column a { font-size:11px; }
	#footer .footer-first-column h2 { font-size:16px; }
	#footer .footer-second-column { margin:0 0 20px 0; padding:0 4%; width:92%; background:none; }
	#footer .footer-second-column p { font-size:12px; }
	#footer .footer-second-column .time { font-size:12px; }
	#footer .footer-third-column { margin:0; padding:0 4% 0 0; width:46%; float:left; float:right; }
	#footer .footer-third-column .social-links li a { width:30px; height:30px; background-size:60% !important; }
	#footer .footer-third-column .social-links li.facebook a { background-size:35% !important; }
	#footer .footer-third-column .logo img { width:120px; height:auto; }
	#footer .footer-third-column .copyright { font-size:11px; }
	#footer .footer-third-column .copyright br { display:none; }
	
}