/*
note :  this stylesheet is for some of responsive elemets .
main resposive there is in   bootstrap grid system .
*/
@media (min-width: 1367px){
	#Container .mix{ width: 24%;}
}
@media (min-width: 769px){
	
	#main-content > .row > .left-side-bar{
		position: fixed;
	}
	#main-content > .row > .col-sm-10{
		float: right;
		padding: 0;
		position: relative;
	}
}
@media (max-width: 1100px){
		#Container .mix{ width: 49%;}
}
@media (max-width: 768px){

	#main-content > .row > .left-side-bar{
		position: fixed;	
	
		width: 100%;
		z-index: 99999999;
	
		top: 0;
}
	#main-bg-slider > ul > li > div.title{
			/* display: none; */
		
			width: 100%;
			right: 0;
	}
		/* left side bar -----------------------------*/
	#main-content > .row > .left-side-bar > .logo-content {
		background-color: #B63315;
		text-align: right;
		padding: 10px;
	}
	#main-content > .row > .left-side-bar > .logo-content img{
		width: 135px;	
		padding-right: 20px;
	}
	#navbar > a.toggle-menu{
		display: block;
	}
	#navbar > ul.main-menu{
		display: none;
		/* height: 0; */
	}
	#navbar > ul{
		padding: 0;
	}
	#main-content .left-side-bar > .bg-slider-control{
		/* margin-top: 125px; */	
		display: none;
	
		left: 0;
		position: relative;
		bottom: 0;
		margin: 0;
	}
	#navbar > ul > li {
		display: block;	
	}
	#navbar > ul > li > a{
		text-align: center;
	}
	footer{
		display: none;
	
		position: relative;
		margin-top: 0;
	}

	/* left side bar -----------------------------END*/
	#main-content > .row > .col-sm-10{
		padding: 0;
	}
	#main-content .pages-content{
		margin: 0;
		margin-top: 65px;
	
	}
	#main-content .pages-content > .pages{
			width: 100%;		
			height: 90%;
	}
	#main-content .pages-content > .pages > .content{
		padding-left: 15px;
	}
	#main-content .pages-content .pages header{
		padding-left: 15px;
	}
	#show-thumb-image{
		padding:15px;
		padding-top: 50px;
	}
	 .post img{
		width: 100%;
	}
	#single-blog .search{
		margin-top: 50px;
	}

}
@media (max-width: 480px){
		#Container .mix{ width: 99%;}
	.post  h3{
		float: none;
	}
	.post .info{
		float: none;
	}
}