/*
Name : responsive.css
Type : Default Style
*/

@media (min-width: 991px) {
	.desktop-hide {
		display: none !important;
	}
}
@media (min-width: 768px) and (max-width: 990px) {
	.tablet-hide {
		display: none !important;
	}
}
@media (max-width: 767px) {
	.mobile-hide {
		display: none !important;
	}
}


/*@media screen and (orientation:landscape) {
	body:before {
		content: 'Please rotate your device first!';
		color: #404040;
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		background: rgba(255, 255, 255, 0.5);
		padding: 30px;
		border-radius: 20px;
	}
	.main-wrapper {
		display: none;
	}
}*/
/*@media screen and (min-width: 320px) and (max-width: 767px) and (orientation: landscape) {*/
@media screen and (max-width: 767px) and (min-aspect-ratio: 13/9) {
  body:before {
		content: 'Please rotate your device first!';
		color: #404040;
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		background: rgba(255, 255, 255, 0.5);
		padding: 30px;
		border-radius: 20px;
	}
	.main-wrapper {
		display: none;
	}
}


@media only screen and (max-width : 992px) {

	body {
		overflow-x: hidden;
	}

	/*container*/
	.container {
		width: inherit;
	}

	/*slide1*/
	.slide1 h1 {
		font-size: 72px;
		top: inherit;
		bottom: -30%;
		left: 5%;
	}
	.slide1 img {
		margin-top: 10%;
	}

	/*slide2*/
	.slide2 .content {
	    position: relative;
	    left: inherit;
	    top: inherit;
	    transform: inherit;
	    width: 90%;
	    margin: 0 auto;
	}
	.slide2 .content .wrap {
		top: inherit;
	}
	.slide2 .content .wrap form .input-group-addon {
		left: 30px;
	}
	.slide2 .content .wrap form .form-control {
		margin-bottom: 10px;
	}

	/*slide3*/
	.slide3 .content .time {
		font-size: 42px;
		line-height: 42px
	}
	.slide3 .content .subtitle {
    	font-size: 14px;
	}
	.slide3 .content img.img-calendar {
		width: 60%;
	}
	.slide3 .content .border {
		height: 50vh;
	}

}

@media only screen and (max-width : 640px) {

	/*slide1*/
	.slide1 h1 {
		font-size: 42px;
		bottom: -40%;
	}
	.slide1.bgdot-inside:after,
	.slide1 .bgdot-outside:after {
		display: none;
	}

	/*slide2*/
	.slide2 .content .wrap {
		padding: 40px 40px 20px 20px;
	}
	.slide2 .content .wrap.move {
    	top: 20px;
	}
	.slide2 .content .wrap p {
		font-size: 12px;
		margin-bottom: 10px;
	}
	.slide2 .content .wrap form .input-group-addon {
		left: 10px;
	}
	.slide2 .content .wrap hr {
		margin: 10px 0;
	}


	/*slide3*/
	.slide3.bgdot-inside:before,
	.slide3 .bgdot-outside:before {
		display: none;
	}
	.slide3 .content {
		margin-top: 30px;
	}
	.slide3 .content img {
		width: 50%;
		margin: 0 auto 5px auto;
	}
	.slide3 .content img.img-clock {
		width: 30%;
	}
	.slide3 .content img.img-calendar {
		width: 30%;
	}
	.slide3 .content .border {
		display: none;
	}
	.slide3 .content .left, .slide3 .content .right {
		padding: 0 20px;
	}
	.slide3 .content .totalSalary {
		margin-bottom: 20px;
	}
	.slide3 .content .time {
		font-size: 28px;
		line-height: 32px;
		margin-bottom: 5px;
	}
	.slide3 .content .time br {
		display: none;
	}
	.slide3 .content .subtitle {
		margin-bottom: 25px;
	}


	/*slide4, slide5, slide6*/
	.slide4.bgdot-inside:before,
	.slide4 .bgdot-outside:before,
	.slide5.bgdot-inside:before,
	.slide5 .bgdot-outside:before,
	.slide6.bgdot-inside:before,
	.slide6 .bgdot-outside:before {
		display: none;
	}
	.slide4 .content, .slide5 .content, .slide6 .content {
		padding: 0 25px;
	}
	.slide4 .content .title, .slide5 .content .title, .slide6 .content .title {
		font-size: 42px;
		line-height: 46px;
		position: relative;
		z-index: 1000;
	}

	.slide5 .content .scane1,
	.slide5 .content .scane2 {
		left: 0;
	}

	.slide6 .content .or {
		display: none;
	}

	.slide7 .content ul > li {
		margin-bottom: 10px;
	}

	.fade-right-inverse {
	  transform: translateX(375px);
	  animation: fade-right-inverse 1.3s ease forwards;
	}
	@keyframes fade-right-inverse {
	  to { transform: translateX(-30px); }
	}

	#back-to-top {
		left: 65%;
	}

}