/* md */

@media (min-width: 768px) and (max-width: 991px) {

	header[role="header"]{ padding:0 1%}

	header[role="header"] > hgroup nav ul{text-align:right;margin-right: 35px;}
	header[role="header"] > hgroup nav ul > li{ margin:0 4.5px}


}

/* sm */

@media (max-width: 767px) {

	body{
		background-image:url(../images/bg-co.png),url(../images/bg-image.jpg);
		background-position:47% 0;
		position:static;
		background-size:cover;
		background-repeat:repeat,no-repeat;
	}

	main[role="main-wrapper-iamge"],main[role="main-wrapper-iamge"] > .over-bg-color{ position: static; background-image:none}

	main[role="main-wrapper-iamge"]{ background-image: none}

	main[role="main-wrapper-iamge"] > .over-bg-color{ background-color:inherit}


	header[role="header"] > hgroup > h1 > a{ width:120%; line-height:39px; font-size:20px}


	header[role="header"]{ top:6px; bottom:inherit; padding:0 2%}

	header[role="header"] > hgroup{ overflow:inherit; padding:2%}

	header[role="header"] > hgroup nav{ position: relative;width:100%; text-align:center}

	header[role="header"] > hgroup nav ul > li{ display:block; margin:0; border-bottom:1px solid #CCC}

header[role="header"] > hgroup nav ul > li:last-child{border-bottom: 0;}
	header[role="header"] > hgroup nav ul > li a{ line-height:40px}

	footer.mobile p{ text-align:center; line-height:18px}

	footer.desk{ display:none}


	#menu-button{ display: block; position:absolute; right:1%; top:-41px; font-size:0; background-color:#353535; padding:3px 7px; cursor:pointer}

	#menu-button:hover{background-color:#e84d49;}

	#menu-button i{font-family:'FontAwesome'; font-size:21px; line-height:23px; color:#FFF; font-weight:normal}


	article{top:100px;padding-top:0;padding-bottom:0;transform:none;}

	article.home-pan[role="home"]{top:50vh;transform:translateY(-50%);}

	article.introduction-pan[role="introduction"] p{padding-top:20px;}

	article.service-pan[role="service"] .row{padding-top:0;}
	article.service-pan[role="service"] .row > .col-sm-6{padding-bottom: 20px;}

	article.profile-pan[role="profile"] .row > .col-sm-5{text-align: left;font-weight:bold;}

	article.contact-pan[role="contact"] ul > li{ display:block; margin:0; margin-bottom:20px}

	article.contact-pan[role="contact"] h3{ font-size:24px; line-height:26px}

	article header.page-title h2{ font-size:22px}

	footer.mobile{display:block}

}