/*---------------------------------------- 
			Bootstrap
---------------------------------------- */
@media all and (max-width: 1200px) {

nav ul li {padding: 0px 25px 5px 0;}

.review {  padding-left: 0;}

#steps img { margin-left: 0px;}

}

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

.container { width: 100%;}

h1 {
    font-size: 42px;
    line-height: 1.2;}

}

@media all and (max-width: 900px) {

.box { padding: 15px 15px 15px 50px;}

#affordable,
#our-system,
#main-banner { padding: 40px 0px;}


}

@media all and (max-width: 767px) {	


.login-box {
    margin-top: 0;
    margin-bottom: 20px;}

.box p {
    font-size: 16px;
    line-height: 22px;}

.box { padding: 10% 4% 5% 20%;}	

.mt-70 { margin-top: 50px;}

.what-is {margin-bottom: 40px;} 

#our-system {  height: auto;}

.avatar {margin: 0!important;}

.review {margin: 0 0 20px 0!important;}	

.modal-dialog {
    width: 90%;
    margin: 30px auto;}

}


@media all and (max-width: 599px) {	


.logo {
    display: block;
    margin: 8px auto 0;}


header .col-xs-9,
header .col-xs-3 { width: 100%;}

.login-box,
.header-menu  {text-align: center;}

h1 { font-size: 34px;}

#main-banner .col-xs-4 { width: 100%;}

.box {  padding: 3% 0 3% 14%;}

.copyright a {display: block;}

#main-banner {  
	background: url("../images/banner-full.jpg") no-repeat 0 0; 
	background-size: cover;}

.modal-dialog {  margin: 20px auto;}

.modal-body { padding: 15px;}


.panel-heading a {
	min-height:50px; 
    padding: 0 15px 16px 70px;}


}




@media all and (max-width: 479px) {	

	h1 { font-size: 30px;}

	h2{ 
		margin-bottom: 0;
		font-size: 26px;
		line-height: 40px;}

	nav ul li {  padding: 0px 10px 5px 0px;}

	nav ul li a { font-size: 14px;}

	.header-menu.mt-35 { margin-top: 15px;}

	#our-system { background: rgba(47, 62, 60,20, 0.8);}
	#our-system ul.left-list li, 
	#our-system ul.right-list li {
	    background: none;
	    padding-left: 0;
	    min-height: 0;
	    font-size: 14px;
	    padding: 0 !important;
	    margin-bottom: 15px !important;}

	.mt-70 {   margin-top: 30px;}

	#affordable .col-xs-4 {display: none;}

	#affordable .col-xs-8 {width: 100%;}

	#affordable h3 {text-align: center;}
	#main-banner {  background: url("../images/banner-full.jpg") no-repeat 0 0;}


	.panel-heading a {
	    background: none!important;
	    padding: 0px ;}

	.panel-body { padding-left: 0px;}

}