@charset "utf-8";

/* ============================== 
	- Template Name: Jekas - Software,Studio And Corporate Template 
	- Autor: Iwthemes
	- Email: support@iwthemes.com
	- Name File: theme-responsive.css
	- Version 1.5 - Update on 9/09/2014
	- Website: http://www.iwthemes.com 
	- Copyright: (C) 2014
================================= */	

/* ---------------------------------------------------------------------- */
/*	 0.6 Version 1024px
/* ---------------------------------------------------------------------- */

@media screen and (max-width: 1280px) {

.boxhidden p {
    font-size: 15px;
    line-height: 22px;
}

.boxhidden h2 {
    line-height: 30px;
}

.webdev p {
    font-size: 16px;
    line-height: 25px;
}

.carousel-caption {
    bottom: 40%;
}

.carousel-caption h3 {
	font-size: 53px;
}

.carousel p {
    font-size: 36px;
}

.carousel i.fa.fa-angle-left, .carousel i.fa.fa-angle-right {
    font-size: 80px;
}

}

@media handheld, only screen and (max-width: 1024px) {

	.carousel-caption {
    bottom: 30%;
	}

	.carousel-caption h3 {
		font-size: 46px;
	}

	.carousel p {
	    font-size: 28px;
	}


	.input-prepend input{
		width: auto;
	}

	#portfolio-list li {		
		max-width: 290px;		
		margin: 0 5px 20px 5px;
	}
	#portfolio-list li.span3 {	
		margin: 0 5px 20px 5px;
		max-width: 210px;
	}

	/* Comments -------------------------------------------*/

	.name,
	.job{				
		width: 40%;					
	}
	.comments_carousel p{					
		margin: 25px auto 10px auto;
	}
	.comments_carousel h3{
		font-size: 18px;
	}

	.newweb p {
	    font-size: 18px;
	    line-height: 28px;
	}

	.boxes {
    	height: 30vw;
	}

	.boxes i {
    	margin-top: 30%;
	    font-size: 72px;
	}

	.boxhidden p {
	    font-size: 14px;
	    line-height: 18px;
	}

	.boxhidden h2 {
	    line-height: 28px;
	    font-size: 22px;
	}

	.boxes h3 {
	    font-size: 22px;
	    padding-top: 20px;
	}

	section.parallax h2 {
	    font-size: 24px;
	}

	section.parallax p {
	    font-size: 18px;
	}

	footer h3 {
	    font-size: 16px;
	    margin-bottom: 10px;
	}

}

/* ---------------------------------------------------------------------- */
/*	 0.7 Version 900px
/* ---------------------------------------------------------------------- */

@media handheld, only screen and (max-width: 980px) {

	/* Nav responsive */

	#menu{
		display: none;	
	}
	.tinynav {
		display: block;
		width: 28%;				
		position:absolute;
		top: -30px;
		font-size: 14px;
		color: #333;
		right: 20px;
		border-radius: 20px;
		border: 0;
		height: 32px;	
	} 
	.logo img{		
		padding: 0 0 0 20px;
		text-align: left;
	}
	.nav_logo{	
		position: relative;
		text-align: left;			
	}

	/* Sections Titles  ----------------------------*/

	.section_title{			
		padding: 100px 0 40px 0;
		text-align: center;
	}	
	.section_title h1{
		font-size: 30px;
		line-height: 40px;
	}
	.section_title p{
		text-align: center;
	}
	.section_title .logo{
		text-align: left;
	}

	

	.contact_footer li{
		line-height: 30px;
		margin-bottom: 22px;
	}
	.button{
		display: block;
		width: auto;
		text-align: center;
	}
	footer .input-prepend input,
	footer .button{
		width: auto;
	}
	footer{
		text-align: center;
		padding: 40px 20px;
	}
	.post{
		width: 80%;
	}
	.comment .img-circle{
		max-width: 180px;
		margin: 0 auto;
	}
	.text_left{
		text-align: center !important;
	}
	.comment .title_comment span a{
		float: none;
	}
	.item-team,
	.item_table{
		max-width: 400px;
		margin: 0 auto 30px auto;
	}
	.blog-content {
		max-width: 400px;
	}
	.style-caption .button,
	.index_static .button{	
		display: block;
		width: auto;
		text-align: center;
		display: inline;
		width: auto;
		text-align: center;
		margin: 15px 0;		
		margin-right: 30px !important;
		font-weight: 600;	
		padding: 10px !important;				
		font-size: 14px;
	}
	.sticky-wrapper{
		position: relative !important;
	}
}

/* ---------------------------------------------------------------------- */
/*	0.8 Mobile Version 767px
/* ---------------------------------------------------------------------- */

@media handheld, only screen and (max-width: 767px) {

	.content_info{
		padding: auto 20px;
	}
	.info_resalt{
		padding: 50px 20px;
	}

	/* filtrers -------------------------------------------*/

	 ul.filter li{
		padding:0 10px;		
	}
	#portfolio-list li,
	#portfolio-list li.span3{		
		max-width: 400px;		
		margin: 0 auto 20px auto;
	}

	.service-process{
		display: table;
		margin: 0 auto;
	}

	.item_team{
		margin-bottom: 20px;
	}

	.results h2 span{
		display: none;
	}
	.info_resalt{
		text-align: center;		
	}
	
	.item_table{
		max-width: 300px;
		margin: 0 auto;
		margin-bottom: 30px;
	}

	.info_vertical{		
		width: 90%;		
	}
	.info_vertical h1{
		font-size: 30px;
		line-height: 35px;
		width: 95%;		
	}
	.info_vertical p{
		font-size: 18px;
		line-height: 23px;	
	}
	.info_vertical h2{
		padding:10px 0 10px 0;
	}
	.arrow_resultsb,
	.arrow_results{
		display: none;
	}


	/* Comments -------------------------------------------*/

	.name,
	.job{				
		width: 35%;					
	}
	.comments_carousel p{					
		width: 90%;
	}	
	.button{
		display: inline;
		width: auto;
		text-align: center;
	}

	section.webdev {
	    padding: 0;
	}

	section.parallax h2 {
	    font-size: 20px;
	    color: #fff;
	    padding-top: 70px;
	    padding-bottom: 5px;
	    padding-Left: 25px;
	    padding-right: 25px;
	}

	section.parallax {
	    height: 400px;
	}

	.container.visible-xs.align-center.wow.fadeInUp.animated i.fa {
	    color: #FC4F13;
	    font-size: 60px;
	}

	.container.visible-xs.align-center.wow.fadeInUp.animated p{
	    font-size: 18px;
	    padding: 0 15px;
	}

	.process p {
	    font-size: 18px;
	    line-height: 25px;
	}
}


/* ---------------------------------------------------------------------- */
/*	 10 Version 600px
/* ---------------------------------------------------------------------- */

@media handheld, only screen and (max-width: 600px) {
	
	/* Comments -------------------------------------------*/

	.name,
	.job{				
		width: 30%;					
	}
	.comments_carousel p{					
		width: 90%;
	}
	.comments_carousel h3{
		font-size: 16px;
	}

	.carousel-caption {
    	bottom: 0;
	    text-align: center !important;
	}

	.carousel-caption h3 {
		font-size: 28px;
    	line-height: 30px;
	    color: #fff !important;
	}

	.carousel p {
	    font-size: 16px;
	    line-height: 20px;
	}

	.carousel i.fa.fa-angle-left, .carousel i.fa.fa-angle-right {
	    font-size: 30px;
	    top: 35%;
	}

	section.banner-bg .allbg.web-bg {
	    background-position: 60% 0;
	}

	section.banner-bg .allbg.mob-bg {
	    background-position: 43% 0;
	}

	section.banner-bg {
	    height: 220px;
	    margin-bottom: 25px;
	}

	section.banner-bg h1 {
	    font-size: 38px;
	    top: 25%;
	    line-height: 40px;
	        padding: 0 10px;
	}
}

/* ---------------------------------------------------------------------- */
/*	 11 Version 480px
/* ---------------------------------------------------------------------- */

@media handheld, only screen and (max-width: 480px) {

	.button{
		margin: 15px 0;		
		font-weight: 600;	
		padding: 10px 15px;				
		font-size: 14px;
	}

	/* Comments -------------------------------------------*/
	.name,
	.job{				
		width: 25%;		
		top: 10%;			
	}
	.comments_carousel h3{
		font-size: 14px;
		line-height: 24px;		
	}
}


/* ---------------------------------------------------------------------- */
/*	12 Mobile Version 380px
/* ---------------------------------------------------------------------- */

@media handheld, only screen and (max-width: 380px) {

	/* filtrers -------------------------------------------*/
	ul.filter{
		width: 100%;
	}
	ul.filter li{		
		padding:5px 10px;			
	}

	/* Comments -------------------------------------------*/

	.name,
	.job{				
		width: 20%;		
		top: 10%;			
	}
	.comments_carousel h3{
		font-size: 14px;
		line-height: 24px;		
	}
}

/* ---------------------------------------------------------------------- */
/*	13 Mobile Version 320px
/* ---------------------------------------------------------------------- */

@media handheld, only screen and (max-width: 320px) {

	/* Comments -------------------------------------------*/

	.name,
	.job{				
		width: 17%;		
		top: 10%;			
	}
	.comments_carousel h3{
		font-size: 14px;
		line-height: 24px;		
	}
}