/*use this css to define the rules for different devices. Do not modify these rules for correct site display on all devices.*/

@media only screen and (min-width: 960px) and (max-width: 1199px) {
	
	.container{width:960px;}
	
	/*start grid*/
	.grid_1 {width:60px;}
	.grid_2 {width:140px;}
	.grid_3 {width:220px;}
	.grid_4 {width:300px;}
	.grid_5 {width:380px;}
	.grid_6 {width:460px;}
	.grid_7 {width:540px;}
	.grid_8 {width:620px;}
	.grid_9 {width:700px;}
	.grid_10 {width:780px;}
	.grid_11 {width:860px;}
	.grid_12 {width:940px;}
	/*end grid*/
	
	/*start menu*/
	.logo img{
		width:140px;	
	}
	.leftnavigation li{
		margin:0 15px;
		border-top:0px;		
	}
	.rightnavigation li{
		margin:0 15px;
		border-top:0px;		
	}
	nav{
		margin:25px 20px 20px;
	}
	/*end menu*/
	
	/*services*/
	#services .grid_1, #services .grid_2, #services .grid_3, #services .grid_4, #services .grid_5, #services .grid_6, #services .grid_7, #services .grid_8, #services .grid_9, #services .grid_10, #services .grid_11, #services .grid_12{
		text-align:center;	
	}
	#services img{
		float:none !important;	
	}
	#services p{
		margin-bottom:20px;	
	}
	#services h2, #services p{
		text-align:center;	
	}
	/*services*/
	
	/*portolio*/
	.element{
		width:298px !important;	
		height:293px !important;
	}
	/*portfolio*/
	
	/*price*/
	.logoprice, .ribbon{
		width:220px;	
	}
	.ribbon span{
		display:none;	
	}
	.price{
		width:210px;	
	}
	.price ul li p{
		width:150px;	
	}
	.triangle{
		height:39px;
		background-image:url(../img/section-prices/triangle220.png);
	}
	/*price*/
	
	/*team*/
	.avatarteam, .avatarteam img{
		width:275px;
		position:absolute;
		height:auto;	
	}
	.team, .bordertopteam{
		width:500px;	
	}
	.team h2{
		margin:15px 20px 10px;	
	}
	.socialteam img{
		margin-top:7px;
		width:40px;	
	}
	.socialteam{
	width:500px;
	height:81px;
	float:right;
	margin-bottom:20px;
	border-style:solid;
	border-top-style:none;
	border-bottom-style:none;
	border-width: 1px;
	border-color: #E8E8E8;
	background-image:url(../img/section-team/imgbottomteam500.png);
	text-align:center;	
	}
	/*team*/
	
	/*skill*/
	#operator{
		display:none;	
	}
	#allprogresbar{
		width:340px;	
	}
	.progresbar div{
		width:290px;	
	}
	.skilldescription img{
		display:none;	
	}
	/*skill*/
	
	/*social*/
	#oursocial .grid_2 img{
		width:100px;
		height:auto;	
	}
	/*social*/

}



@media only screen and (min-width: 768px) and (max-width: 959px) {
	
	.container {width:744px;}
	
	/*start grid*/
	.grid_1 {width:42px;}
	.grid_2 {width:104px;}
	.grid_3 {width:166px;}
	.grid_4 {width:228px;}
	.grid_5 {width:290px;}
	.grid_6 {width:352px;}
	.grid_7 {width:414px;}
	.grid_8 {width:476px;}
	.grid_9 {width:538px;}
	.grid_10 {width:600px;}
	.grid_11 {width:662px;}
	.grid_12 {width:724px;}
	/*end grid*/
	
	/*start menu*/
	.logo img{
		width:104px;
		margin-top:20px;	
	}
	nav{
		margin:25px 20px 20px;
	}
	nav ul li{
		border-top:0px;
	}
	/*end menu*/
	
	/*services*/
	#services .grid_1, #services .grid_2, #services .grid_3, #services .grid_4, #services .grid_5, #services .grid_6, #services .grid_7, #services .grid_8, #services .grid_9, #services .grid_10, #services .grid_11, #services .grid_12{
		text-align:center;	
	}
	#services img{
		float:none !important;	
	}
	#services p{
		margin-bottom:20px;	
	}
	#services h2, #services p{
		text-align:center;	
	}
	/*services*/
	
	/*portfolio*/
	.element{
		width:350px !important;
		height:327px !important;	
	}
	/*portfolio*/
	
	/*prices*/
	#sectionprices .grid_3{
		width:352px;	
	}
	.logoprice, .ribbon{
		width:352px	
	}
	.price{
		width:342px;	
	}
	.price ul li p{
		width:282px;	
	}
	.triangle{
		height:62px;
		background-image:url(../img/section-prices/triangle352.png);
	}
	/*prices*/
	
	/*team*/
	#sectionteam .grid_3, .socialteam{
		width:350px;
	}
	.team{
		width:350px;
		height:auto;
	}
	.bordertopteam{
		width:350px;
	}
	.avatarteam, .avatarteam img{
		width:300px;
		height:auto;
	}
	.socialteam{
		clear:both;
		height:81px;
		float:right;
		margin-bottom:20px;
		border-style:solid;
		border-top-style:none;
		border-bottom-style:none;
		border-width: 1px;
		border-color: #E8E8E8;
		background-image:url(../img/section-team/imgbottomteam352.png);
	}
	/*team*/
	
	/*skill*/
	#operator{
		display:none;	
	}
	#allprogresbar{
		width:312px;	
	}
	.progresbar div{
		width:262px;	
	}
	.skilldescription img{
		display:none;	
	}
	.skilldescription{
		margin:10px 20px;	
	}
	#sectionskills .grid_5{
		width:352px !important;	
	}
	.clip{
		display:none;	
	}
	/*skill*/
	
	/*social*/
	#oursocial .grid_2 img{
		width:64px;
		height:auto;	
	}
	/*social*/
	
}


@media only screen and (min-width: 480px) and (max-width: 767px) {
	
	body{
		-webkit-text-size-adjust:none;
	}		
	
	.container {width:460px;}
	
	/*start grid*/
	.grid_1,
    .grid_2,
    .grid_3,
    .grid_4,
    .grid_5,
    .grid_6,
    .grid_7,
    .grid_8,
    .grid_9,
    .grid_10,
    .grid_11,
    .grid_12{
        width: 440px;
    }
	/*end grid*/
	
	/*start menu*/
	.logo{
		height:auto;
		text-align:center;	
	}
	.logo img{
		position:relative;
	}
	nav{
		margin:25px 20px 20px;
	}
	nav ul li, nav, nav ul, nav a{
		width:100%;
		margin:0px;	
	}
	nav a{
		padding:20px 0px;
		text-align:center;	
	}
	nav ul li{
		border-top:0px;	
	}
	/*end menu*/

	/*testimonials*/
	.lefttestimonials h2, .lefttestimonials p, .righttestimonials h2, .righttestimonials p{
		text-align:center;	
	}
	#darkfilter{
		background:none;	
	}
	.lefttestimonials{
		border-bottom:1px solid #fff;	
	}
	.lefttestimonials p{
		margin-bottom:40px !important;	
	}
	.righttestimonials h2{
		margin-top:40px !important;	
	}
	/*testimonials*/
	
	/*portfolio*/
	.element{
		width:438px !important;
		height:385px !important;	
	}
	/*portfolio*/
	
	/*skill*/
	.skilldescription{
		text-align:center;
	}
	.skilldescription img{
		float:none;
		margin-bottom:10px;	
	}
	#operator{
		display:none;	
	}
	.clip{
		display:none;	
	}
	#allprogresbar{
		width:400px;	
	}
	.progresbar div{
		width:350px;	
	}
	/*skill*/
	
	/*price*/
	.logoprice, .ribbon{
		width:440px;	
	}
	.price{
		width:430px;	
	}
	.price ul li p{
		width:370px;	
	}
	.triangle{
	height:78px;
	background-image:url(../img/section-prices/triangle440.png);
	}
	/*price*/
	
	/*team*/
	.team{
		width:438px;
		height:auto;
	}
	.bordertopteam{
		width:438px;
	}
	.avatarteam, .avatarteam img{
		display:none;
		width:438px;
		height:auto;
	}
	.socialteam{
		clear:both;
		height:81px;
		width:438px;
		float:right;
		margin-bottom:20px;
		background-image:url(../img/section-team/imgbottomteam440.png);
	}
	
	/*team*/

	/*social*/
	#oursocial{
		text-align:center;	
	}
}


@media only screen and (min-width: 320px) and (max-width: 479px){
    
	body{
		-webkit-text-size-adjust:none;
	}
	
	.container{
		width:300px;	
	}
	
	/*start grid*/
	.grid_1,
    .grid_2,
    .grid_3,
    .grid_4,
    .grid_5,
    .grid_6,
    .grid_7,
    .grid_8,
    .grid_9,
    .grid_10,
    .grid_11,
    .grid_12
	{
        width: 280px;
    }
	/*end grid*/
	
	/*start menu*/
	.logo{
		height:auto;
		text-align:center;	
	}
	.logo img{
		position:relative;
	}
	nav{
		margin:25px 20px 20px;
	}
	nav ul li, nav, nav ul, nav a{
		width:100%;
		margin:0px;	
	}
	nav a{
		padding:20px 0px;
		text-align:center;	
	}
	nav ul li{
		border-top:0px;	
	}
	/*end menu*/
	
	/*services*/
	#services .grid_1, #services .grid_2, #services .grid_3, #services .grid_4, #services .grid_5, #services .grid_6, #services .grid_7, #services .grid_8, #services .grid_9, #services .grid_10, #services .grid_11, #services .grid_12{
		text-align:center;	
	}
	#services img{
		float:none !important;	
	}
	#services p{
		margin-bottom:20px;	
	}
	#services h2, #services p{
		text-align:center;	
	}
	/*services*/
	
	/*testimonials*/
	.lefttestimonials h2, .lefttestimonials p, .righttestimonials h2, .righttestimonials p{
		text-align:center;	
	}
	#darkfilter{
		background:none;	
	}
	.lefttestimonials{
		border-bottom:1px solid #fff;	
	}
	.lefttestimonials p{
		margin-bottom:40px !important;	
	}
	.righttestimonials h2{
		margin-top:40px !important;	
	}
	/*testimonials*/
	
	/*portfolio*/
	.element{
		width:280px !important;
		height:281px !important;	
	}
	/*portfolio*/

	/*team*/
	.team{
		width:280px;
		height:auto;
	}
	.bordertopteam{
		width:280px;
	}
	.avatarteam, .avatarteam img{
		display:none;
		width:280px;
		height:auto;
	}
	.socialteam{
		clear:both;
		height:81px;
		width:280px;
		float:right;
		margin-bottom:20px;
		background-image:url(../img/section-team/imgbottomteam440.png);
	}
	
	/*team*/
	
	
	/*skill*/
	#operator{
		display:none;	
	}
	.clip{
		display:none;	
	}
	#allprogresbar{
		width:240px;	
	}
	.progresbar div{
		width:190px;	
	}
	.skilldescription{
		text-align:center;
	}
	.skilldescription img{
		float:none;
		margin:0px 0px 10px 0px;
	}
	/*skill*/
	
	/*social*/
	#oursocial{
		text-align:center;	
	}
	/*social*/
	
	/*contact*/
	#markers{
		width:320px;
		height:557px;
		position:absolute;
		z-index:1;
		left:50%;
		margin-left:-160px;
		margin-top:116px;	
	}
	#bigmarker{
		width:220px;
		background-image:url(../img/section-contact/bigmarkermobile.png);
		padding:50px;
		background-repeat:no-repeat;		
	}
	/*contact*/
		
}