@media(max-width: 1200px) {
	header {
		padding: 20px;
	}
	
	header label {
		display: initial;
	}
	
	header .navbar {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: #fff;
		border-top: 1px solid rgba(0,0,0,1);
		display: none;
	}
	
	header .navbar  ul li{
		width: 100%;
	}
	
	header .navbar  ul li ul{
		position: relative;
		width: 100%;
		background: #ccc;
	}
	
	header .navbar  ul li ul li{
		background: #eee;
	}
	
	header .navbar  ul li ul li ul{
		width: 100%;
	}

	#menu-bar:checked~.navbar {
		display: initial;
	}
	
	header .left-side{
		display: none;
	}
	
	.sicon{
		display: flex;
	}
}

@media(max-width: 1000px) {
	.row {
		display: block;
	}
	
	.main {
		padding: 0px; 
	}
	
	.left-col {
		padding-top: 0;
		padding-left: 10;
		padding-right: 10;
		
	}
	
	.left-col img {
		height: 350px; 
	}
	
	.right-col {
		padding: 15px;

	}
	header h1 {
		font-size: 30px;
	}
	.bottom-line {
		display: block;
	}
}


@media(max-width: 700px) {
	.top_bar div span{
		display: none;
	}
	
	.left-col img {
		height: 250px; 
	}
}

@media(max-width: 550px) {
	header {
		padding: 8px;
	}

	header h1 {
		font-size: 5vw;
	}
	
	header img {
		width: 40px;
		height: 40px;
		border-radius: 50%;
	}
	
	header label {
		font-size: 25px;
	}
	
	.theme {
		font-size: 16px;
	}
	
	.loginpg {
		width: 100%;
		padding: 20px 25;
	}
	
	.main h1{
		font-size: 24px;
	} 
}

@media(max-width: 500px) {	
	header img {
		width: 35px;
		height: 35px;
		border-radius: 50%;
	}
	
	header {
		padding-left: 0;
	}
	
	.contents, .blog-ol li, .contents-center {
		font-size: 100%;
	}
	
	.contents, .blog-ol li {
		text-align: left;
	}
	
	.content-box {
		border: #ddd 0 solid;
		border-bottom: #dddddd 4px solid;
		margin-bottom: 50px;
		padding: 10px;
	}
	
	.main {
		padding: 2px; 
	}
	
	.left-col {
		padding-left: 10px;
		padding-right: 10px;
	}
	
	.loginform{
		width: 100%;
		margin-top: 30px;
	}
}

@media(max-width: 400px) {
	.top_bar {
		padding: 10px;
		font-size: 15px;
	}
	
	.theme {
		font-size: 13px;
	}
	
	.foot-col .endhead {
		font-size: 100%;
	}
	
	.foot-col a, .foot-col p{
		font-size: 18px;
	}

	.left-col {
		padding-top: 0;
		padding-left: 5px;
		padding-right: 5px;		
	}
	
	.left-col img {
		height: 200px; 
	}
	
	.right-col {
		padding: 5px;
	}
	
	#form2 {
		width: 100%;
	}
}