/*==========MENU==========*/

@media screen and (min-width: 768px) {
	.js .nav-collapse {
		position: relative;
	}
	.js .nav-collapse.closed {
		max-height: none;
	}
	.nav-toggle {
		display: none;
	}
	.mask {
		display: none !important;
		opacity: 0 !important;
	}
	.nav-collapse {
		float: right;
		width: auto;
	}
	.nav-collapse li {
		width: auto;
	}
	.nav-collapse a {
		padding: 0 15px;
		text-align: center;
		border-top: 0;
		float: left;
		margin: 0;
		text-decoration: none;
	}
	.nav-collapse ul ul a {
		display: none;
		text-decoration: none;
	}
}

/*==========TEMPLATE==========*/

@media screen and (max-width: 1024px) {
	h3 {
		font-size: 16px;
		line-height: 16px;
	}
	.slider-max-width {
		width: 900px;
		height: 95%;
		position: relative;
	}
	.content-slider {
		width: 40%;
		font-size: 14px;
		margin-top: 0;
	}
	.btn {
		width: 100%;
		padding: 15px 0;
	}
	.admin-section h2 {
		font-size: 25px;
	}
	.title {
		font-size: 25px;
	}
	.phone {
		width: 418px;
		height: 354px;
		padding: 20px 0 0 0;
		position: relative;
		margin: 0 auto;
		overflow: hidden;
	}
}

@media screen and (max-width: 960px) {
	h1 {
		font-size: 25px;
	}
	h3 {
		font-size: 13px;
		line-height: 13px;
	}
	.colfourth {
		width: 50%;
	}
	.slider-max-width {
		width: 700px;
		height: 95%;
		position: relative;
	}
	.btn-slider {
		padding: 10px 0;
	}
	.admin-section {
		color: #FFFFFF;
		height: 550px;
		position: relative;
	}
	.admin-section .colhalf {
		width: 100%;
		top: 10%;
		transform: translateY(0%);
	}
	.laptop {
		width: 100%;
		text-align: center;
		margin-bottom: 40px;
	}
	.laptop img {
		width: 80%;
		height: auto;
	}
	#section3 .colhalf {
		width: 100%; 
	}
	#section3 .colhalf .text-right {
		text-align: center;
	}
	.phone {
		height: 398px;
	}
	.phone img {
		bottom: 0;
		left: -10px;
	}
	#loginContainer {
		width: 90px;
	}
	.btn {
		width: 100%;
		padding: 10px 0;
	}
}

@media screen and (max-width: 720px) {
	    
	.colfull, .colhalf, .colthird, .colfourth {
		width: 100%;
	}
	.footer-wrapper .colfourth {
		width: 100%;
	}
	.max-width .colhalf {
		top: inherit;
		transform: none;
	}
	.slider-max-width {
		width: 100%;
	}
	
	.btn-slider {
		margin: 20px auto 0 auto;
		padding: 10px 0;
	}
	.content-slider {
		width: 100%;
		margin-top: 0;
		position: relative;
	}
	.content-slider ul li {
		background-color: rgba(0,0,0,0.3);
		padding: 10px 50px;
		list-style-image: none;
		text-align: center;
	}
	.image-slider {
		position: relative;
		display: none;
	}
	.btn-slider {
		padding: 10px 0;
	}
	.admin-section {
		color: #FFFFFF;
		height: 500px;
		position: relative;
	}
	.admin-section h2 {
		text-align: center;
	}
	.laptop {
		width: 100%;
		height: auto;
	}
	.phone {
		background-color: rgba(0,0,0,0.2);
		width: 100%;
		height: 300px;
		margin: 0 auto;
	}
	.phone img {
		width: auto;
		height: 90%;
		bottom: 0;
		left: 0;
		right: 0;
		margin: 0 auto;
	}
	.step {	
		width: 100%;
	    height: 396px;
		display: block;
		-webkit-transition: opacity 1s;
		-moz-transition:    opacity 1s;
		-ms-transition:     opacity 1s;
		-o-transition:      opacity 1s;
		transition:         opacity 1s;
	}
	.step img {
		display: none;
	}
	.jms-content{
		margin: 0 auto;
		width: 100%;
	}
	#section3 h3 {
		text-align: left !important;
	}
	#section3 .icon-circle {
		width: 60px;
		height: 60px;
		margin: 20px 20px 30px 0;
		float: left;
		font-size: 25px;
		line-height: 60px !important;
	}
	.btn {
		width: 100%;
		padding: 10px 0;
	}
	.title {
		text-align: center;
	}
	.max-width-half {
		max-width: 100%;
	}
	.logo {
		display: none;
	}
	.btn-app {
		position: static;
		margin: 20px auto 40px auto;
	}
	.swiper-container {
		height: 376px;
	}
}

@media screen and (max-width: 560px)  {
	body {
		font-size: 13px;
		line-height: 20px;
	}	
	h1 {
		font-size: 20px;
		line-height: 28px;
	}
	h2 {
		font-size: 18px !important;
		line-height: 18px !important;
	}
	h3 {
		font-size: 18px;
		line-height: 18px;
	}
	p {
		line-height: 18px;
	}
	.header h1 {
		padding:0 20px;
	}
	.slider-max-width {
		width: 100%;
	}
	.btn-slider {
		margin: 20px auto 0 auto;
		padding: 10px 0;
	}
	.content-slider {
		width: 100%;
		margin-top: 0;
		position: relative;
	}
	.content-slider ul li {
		background-color: rgba(0,0,0,0.3);
		padding: 10px 50px;
		list-style-image: none;
		text-align: center;
	}
	.image-slider {
		position: relative;
		display: none;
	}
	.title {
		text-align: center;
	}
	.laptop {
		width: 100%;
		text-align: center;
		margin-bottom: 0;
	}
	.laptop img {
		width: 100%;
		height: auto;
	}
	.btn {
		width: 100%;
		padding: 10px 0;
	}
}
@media screen and (max-width:400px) {
    @-ms-viewport{
	    width:320px;
	    zoom:1;
	    min-zoom:1;
	    max-zoom:1;
	    user-zoom:fixed;
	}
    body {
		font-size: 13px;
		line-height: 20px;
	}	
	h1 {
		font-size: 20px;
		line-height: 28px;
	}
	h2 {
		font-size: 18px !important;
		line-height: 18px !important;
	}
	h3 {
		font-size: 18px;
		line-height: 18px;
	}
	p {
		line-height: 18px;
	}
	.header h1 {
		padding:0 20px;
		font-size: 14px;
	}
	.slider-max-width {
		width: 100%;
	}
	.btn-slider {
		margin: 20px auto 0 auto;
		padding: 10px 0;
	}
	.content-slider {
		width: 100%;
		margin-top: 0;
		position: relative;
	}
	.content-slider ul li {
		background-color: rgba(0,0,0,0.3);
		padding: 10px 50px;
		list-style-image: none;
		text-align: center;
	}
	.image-slider {
		position: relative;
		display: none;
	}
	.title {
		text-align: center;
	}
	.laptop {
		width: 100%;
		text-align: center;
		margin-bottom: 0;
	}
	.laptop img {
		width: 100%;
		height: auto;
	}
	.btn {
		width: 100%;
		padding: 10px 0;
	}
}