/* =================================================
Author Name: Codeglim
Author URI: http://codeglim.com
Template Name: Jalil
Description: Jalil is a modern responsive business and personal tempalte, you can use this template for your business,corporate,agency personal purpouse.
*/

/* Tablet Layout */
@media (min-width: 768px) and (max-width: 991px) {

	.logo {
		padding-top: 3px;
		width: 48%;
	}
	
	.ipad-Air-resp {
		height: 100%;
		width: 20%;
		margin: 0px 0px 0px;
		/* margin-left: 200px; */
	}
	
	body{
		font-size:14px;
	}
	.section-title h2{
		margin-bottom:10px;
	}
	.logo {
		text-align: center;
	}
	.logo-sett{
		text-align: inherit;
	}
	.logo img{
		display:inline-table;
	}
	.img-logo{
		width: 100%;
	}
	#header .search-form{
		top:50px;
	}
	#header.personal .search-form{
		top:56px;
	}
	#header .nav {
		float: right;
	}
	#header .nav li{
		margin-right:3px;
	}
	#header .nav li a{
		padding:15px 12px;
		font-size:13px;
	}
	#j-slider .single-slider,
	#j-slider .slide-text{
		height:450px;
	}
	#j-slider .slide-text.left {
		padding: 0 60px 0 0;
	}
	#j-slider .slide-text.right{
		padding:0 0 0 60px;
	}
	#j-slider .slide-text.center{
		padding: 0 60px;
	}
	#j-slider .slide-text h1{
		font-size:35px;
	}
	#j-slider.static .slide-text h1{
		font-size:25px;
	}
	#j-slider .owl-dots{
		bottom:30px;
	}
	#j-slider .owl-theme .owl-nav{
		display:none;
	}
	#statics {
		margin-top: 0;
		padding: 0;
	}
	#statics .statics{
		border-radius:0px;
	}
	#about-us{
		padding:70px 0;
	}
	#about-us .single-about p{
		font-size:13px;
	}
	#project .project-hover{
		padding:10px;
	}
	#call-to-action h2,
	#call-to-action a{
		display:block;
	}
	#call-to-action a{
		margin-top:10px;
	}
	#testimonial .owl-dots{
		left:-22px;
	}
	#clients:hover .owl-nav .owl-prev{
		left:0px;
	}
	#clients:hover .owl-nav .owl-next{
		right:0px;
	}
	#personal-banner .table-cell .banner-main{
		margin:0 auto;
	}
	#about-me .about-contact, #about-me .about-text{
		margin-top:15px;
	}
	#about-me h3{
		margin-bottom:15px;
		font-size:20px;
	}
	#about-me .about-text p{
		font-size:13px;
	}
	#about-me .about-button .button {
		display: block;
		width: 172px;
		margin-bottom: 8px;
		text-align:center;
	}
	#about-me .my-image img{
		height:352px;
		width:100%;
	}
	#contact .map{
		height:478px;
	}
	}
	/* Mobile Layout */
	@media (max-width: 767px) {
	
	
		.abouts-img-set-mbl{
			margin-top: 21px;
		}
	
		.services-mbl{
			padding: 20px 0px;
		}
	
		#header .logo {
		padding-top: 3px;
		width: 48%;
	}
	
	body{
		font-size:14px;
	}

	/* section#call-to-action {
		margin-bottom: 20px;
	} */

	#header .top-left {
		float: none;
		text-align: center;
	}
	#header .search{
		display:none;
	}
	#header.personal{
		background:#252525;
	}
	#header .top-right {
		float: none;
		text-align: center;
		margin-top:10px;
	}
	#header .social {
		float: none;
	}
	#header .nav {
		float: none;
	}
	.navbar-nav{
		margin:0;
	}
	#header .mainmenu{
		padding-right:0px;
	}
	#header .nav li{
		margin-bottom:5px;
	}
	#header .nav li a{
		border-radius:5px;
		padding:10px;
		font-size:13px;
	}
	#header .nav li .sub-menu{
		position:relative;
		top: 100%;
		opacity:1;
		visibility: visible;
		margin-top: 5px;
		width: 100%;
		border-top:0px solid;
	}
	#header .nav li .sub-menu li a {
		text-align: left;
		padding: 10px 24px;
	}
	#header .mobile-nav {
		display: block;
	}
	#header .slicknav_nav{
		padding-top:10px;
	}
	#header.slicknav_nav a{
		border-radius:5px;
		font-size:14px;
	}
	#header .slicknav_nav a:hover {
		color: #fff;
	}
	#header .slicknav_nav .slicknav_row:hover {
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
		border-radius: 6px;
		color: #fff;
	}
	#header .mobile-nav .slicknav_menu {
		background:transparent;
	}
	#header .slicknav_nav .slicknav_row, .slicknav_nav a{
		margin:0;
	}
	#header .slicknav_menu {
		padding:0;
	}
	#header .slicknav_btn {
		position: relative;
		background: transparent;
		padding: 10px 10px;
		margin: 0;
		margin-top: -40px;
	}
	#header .slicknav_menutxt{
		text-shadow:none;
		font-weight:500;
		font-size:15px;
	}
	#header .search-form{
		top:50px;
		width:300px;
	}
	#header.personal .search-form{
		top:62px;
	}
	#personal-banner .table-cell .banner-main {
		width: 100%;
	}
	#j-slider .single-slider,
	#j-slider .slide-text{
		height:440px;
	}
	#j-slider .slide-text.left{
		padding-right:10px;
	}
	#j-slider .slide-text.center{
		padding:0 10px;
	}
	#j-slider .slide-text.right {
		padding: 0 0 0 10px;
	}
	#j-slider .slide-text h1 {
		font-size: 16px;
		margin-bottom:5px;
	}
	#j-slider .slide-text h1 span{
		font-size:14px;
	}
	#j-slider .slide-text p{
		font-size:14px;
	}
	#j-slider .slide-button .button{
		padding:10px 20px;
		font-size:13px;
	}
	#j-slider .owl-dots{
		bottom:10px;
	}
	#j-slider .owl-theme .owl-nav{
		display:none;
	}
	#j-slider.static .slide-text p{
		padding:0px;
	}
	#personal-banner .banner-text h1{
		font-size:34px;
	}
	#statics {
		margin-top: 0px;
		padding: 20px 0;
		background: #f5f5f5;
	}
	#statics .statics{
		border-radius:0px;
	}
	#about-us {
		padding:50px 0;
	}
	#about-me {
		padding: 70px 0;
	}
	#about-me .about-contact, 
	#about-me .my-image, 
	#about-me .about-text{
		text-align:center;
		margin-top:30px;
	}
	#about-me .my-image{
		text-align:center;
	}
	
	#about-me .my-image img{
		display:inline-block;
	}
	#my-timeline .timeline-inner:before{
		display:none;
	}
	#my-timeline .single-main{
		margin-bottom:30px;
	}
	#my-timeline .single-main:last-child{
		margin-bottom:0px;
	}
	
	#my-timeline .single-timeline .single-content{
		width:100%;
		margin-bottom:10px;
	}
	#my-timeline .single-main:nth-child(2n) .single-timeline{
		padding-left:0px;
		padding-right:120px;
	}
	#my-timeline .single-main:nth-child(2n) .single-timeline .single-content{
		margin-left:0px;
	}
	#my-timeline .single-main:nth-child(2n) .single-timeline .single-content::before {
		left: auto;
		right: -31px;
		border-right-color: transparent;
		border-left-color: #ccc;
	}
	#my-timeline .single-main:nth-child(2n) .single-timeline .single-content::after {
		left: auto;
		right: -30px;
		top: 26px;
		border-right-color: transparent;
		border-left-color: #fff;
	}
	#my-timeline .single-main:nth-child(2n)  .single-timeline .date{
		left: auto;
		right:-95px;
	}
	#call-to-action h2{
		font-size:25px;
	}
	#call-to-action a{
		margin-top:10px;
	}
	#clients .single-client img {
		display:inline-block;
	}
	#clients:hover .owl-nav .owl-prev{
		left:0px;
	}
	#clients:hover .owl-nav .owl-next{
		right:0px;
	}
	#testimonial .single-testimonial{
		transform:translateY(0px);
	}
	#testimonial .owl-dots {
		position: absolute;
		transform: rotate(0);
		bottom: 0;
		top: 100%;
		right: 0;
	}
	#testimonial .owl-dots .owl-dot {
		display: inline-block;
	}
	#clients .owl-nav{
		top:35%;
	}
	#project .project-hover{
		top:20px;
		right:20px;
		bottom:20px;
		left:20px;
	}
	#project .project-hover{
		padding:10px;
	}
	#project .project-hover h4{
		font-size:15px;
		margin-bottom:5px;
	}
	#project .project-hover a{
		padding-top:5px;
	}
	#blog .blog-sidebar{
		padding-left:10px;
	}
	#blog .single-comments .head{
		width:100%;
	}
	#success .mail h2 {
		margin-bottom: 20px;
		font-size: 20px;
	}
	#footer .copyright{
		float:none;
		text-align:center;
	}
	#footer .social{
		float:none;
		text-align:center;
	}
	}
	
	/* Mobile Layout */
	@media (max-width: 320px) {
	
		#header .logo {
		padding-top: 3px;
		width: 48%;
	}
	
	body{
		font-size:14px;
	}	
	.section{
		padding:50px 0;
	}
	.button{
		padding:8px 15px;
	}
	.section-title h2{
		font-size:22px;
	}
	
	#header .nav li a{
		font-size:13px;
	}
	#header .search-form{
		top:50px;
	}
	#j-slider .slide-text h1 {
		font-size: 17px;
	}
	#j-slider .slide-text.center {
		padding: 0px;
	}
	#j-slider .slide-text.right {
		padding: 0 0 0 0px;
	}
	#j-slider .slide-text.left{
		padding:0px;
	}
	#j-slider .owl-dots{
		bottom:0;
	}
	#j-slider .owl-dots .owl-dot.active span{
		height:20px;
	}
	#about-me {
		padding: 20px 0 50px;
	}
	#about-me .about-contact, 
	#about-me .my-image, 
	#about-me .about-text{
		text-align:center;
		margin-top:30px;
	}
	#project .project-hover {
		position: absolute;
		top: 15px;
		bottom: 15px;
		left: 15px;
		padding: 10px;
		right: 15px;
	}
	#testimonial .owl-dots .owl-dot.active span{
		height:20px;
	}
	#personal-banner .banner-text h1 {
		font-size: 25px;
	}
	#personal-banner .banner-text h3 {
		font-size: 20px;
	}
	#my-timeline .single-timeline {
		padding-right: 35%;
	}
	#my-timeline .single-main:nth-child(2n) .single-timeline {
		padding-left: 0px;
		padding-right: 35%;
	}
	#blog .single-comments .head {
		width: 100%;
	}
	#blog .comment-list{
		padding-left:0px;
	}
	#blog .tags ul li {
		margin-bottom: 10px;
	}
	#blog .blog-share ul li.share{
		display:block;
	}
	#footer-top{
		padding:20px 0 50px;
	}
	}
	
	
	/* ====================== */
	
	@media only screen and (min-width:1480px) and (max-width:1920px) {
	
	}
	
	@media only screen and (min-width:1280px) and (max-width:1366px) {
	
	}
	
	@media only screen and (max-width:1200px) {
	
		.ftr-cmpny-no {
			margin: 3px -11px 0px;
		}
	
	}
	
	@media only screen and (min-width:820px) and (max-width:1180px) {
	
		.ipad-Air-resp {
			/* height: 100%; */
			/* width: 50%; */
			width: 200px;
			margin: 0px 0px 0px;
			float: inherit;
			/* margin-left: 200px; */
		}
	}
	
	@media only screen and (min-width:768px) and (max-width:1024px) {
		iframe {
			width: 220px;
			height: 250px;
		}
	
		.ftr-cmpny-no {
			margin: -26px 76px 0;
		}
	
	}
	
	@media only screen and (min-width:540px) and (max-width:720px) {
		iframe {
			width: 509px;
			height: 250px;
		}
	
	}
	
	@media only screen and (max-width:896px) {
		.ftr-cmpny-no {
			margin: 0 102px 0;
		}
		iframe {
			width: 350px ;
			height: 250px;
		}
	
		.services-we-top {
			margin-top: 25px;
		}
	}
	
	@media only screen and (min-width:375px) and (max-width:667px) {
	
		.home-title{
			font-size: 20px;
		}
	
		.section-title h2 {
			font-size: 24px;
		}
	
		.services-we-top {
			margin-top: 25px;
		}
	
		.ftr-cmpny-no {
			margin: 0px 83px 0;
		}
	
		.services-space{
			margin-top: 5px !important;
		}
	}
	
	@media only screen and (min-width:360px) and (max-width:740px) {
		.ftr-cmpny-no {
			margin: 0 74px 0 ;
		}
	
		iframe {
			width: 330px ;
			height: 250px;
		}
	}
	
	@media only screen and (min-width:360px) and (max-width:479px) {
		.ftr-cmpny-no {
			margin: 0 69px 0;
		}
	}
	
	@media only screen and (max-width:280px) and (max-width:653px) {
		.ftr-cmpny-no {
			margin: 0 32px 0;
		}
		iframe {
			width: 250px;
			height: 250px;
		}
	
		iframe {
			width: 250px;
			height: 250px;
		}
	}
	
	@media only screen and (max-width:575px) {
		.ftr-cmpny-no {
			margin: 0 32px 0;
		}
	}