/************************************************************************************
smaller than 1400
*************************************************************************************/
@media screen and (max-width: 1400px) {

	/* pagewrap */
	#pagewrap {
		width: 100%;
	}

	
		/* top */

#top {  width: 100%;   }
.top-con {  width: 27%;  padding: 10px 0px 0px 0px; margin: 0% 0% 0% 5%;  }
.top-ph {  width: 33%;  padding: 10px 0px 0px 20px;   margin: 0% 0% 0% 0%; }

.follow {   width: 15%;  margin: 0% 1% 0% 0%;  }
#logo {  width: 18%;   margin: 0% 0% 0% 5%;  }

#mmenu {  width: 50%;   margin: 0% 0% 0% 15%;   }
	
.carousel-caption h2{font-size:52px; margin: 0% 0% 0% -5%;line-height: 20px;  top:-70px;
     }
.carousel-caption p{font-size:70px;  margin: 6% 0% 2% -5%; line-height: 50px;top:-70px; }
	
#help h4{ font-size:42px;   }
#help p{ font-size:30px; }
	
.carousel-indicators {
    top: 240px;
}
    
    #room { padding: 2% 5% 2% 5%;  	}
#room .img1{ width:40%; float: left; margin-right: 2%; }
#room .rtext p{ width:58%; float: left; font-size:20px;  }
#room .rtext h2{  font-weight: bold; font-size: 20px; color: #c70a0a; }
    
    .pro-box a:link{  width: 28%;  float: left;   margin: 0% 0% 3% 3%; text-decoration: none;}
    
    #footer { margin-top: 3%; }
    
    .about{  width:22%;   margin:3% 0% 2% 3%; }

.service{ width:22%;  margin:3% 0% 2% 10%; }

.contact{  width:38%; margin:3% 0% 2% 5%; }


}


/************************************************************************************
smaller than 1200
*************************************************************************************/
@media screen and (max-width: 1200px) {

	/* pagewrap */
	#pagewrap {
		width: 100%;
	}

	
		/* top */

#top {  width: 100%;   }
.top-con {   width: 32%;   padding: 10px 0px 0px 0px; margin: 0% 0% 0% 5%;  }
.top-ph {  width: 40%;  padding: 10px 0px 0px 20px;   margin: 0% 0% 0% 0%; }

.follow {   width: 15%;  margin: 0% 0% 0% 5%;  }
#logo {  width: 20%;   margin: 0% 0% 0% 5%;  }

#mmenu {  width: 55%;   margin: 0% 0% 0% 2%;     }
	
.carousel-caption h2{font-size:52px; margin: 0% 0% 0% -5%;line-height: 20px;  top:-70px;
     }
.carousel-caption p{font-size:70px;  margin: 6% 0% 2% -5%; line-height: 50px;top:-70px; }
	
#help h5{ font-size:25px;   color: #0095e5; }
    
    #room { padding: 2% 1% 2% 5%;  	}
#room .img1{ width:45%; float: left; margin-right: 2%; }
#room .rtext p{ width:52%; float: left; font-size:20px;  }
#room .rtext h2{  font-weight: bold; font-size: 20px; color: #c70a0a; }
    
    .pro-box a:link{ width: 28%;  float: left;   margin: 0% 0% 3% 3%; text-decoration: none;}
    
    #footer { margin-top: 5%; padding: 1% 1% 1% 5%;}
    
    .about{   width:22%;   margin:3% 0% 2% 1%; }

.service{width:27%;  margin:3% 0% 2% 5%; }

.contact{  width:44%; margin:3% 0% 2% 0%; }
    
   
}

/************************************************************************************
smaller than 1000
*************************************************************************************/
@media screen and (max-width: 992px) {


/* top */

	
#top {  width: 100%;  }
.top-con {  width: 35%;  padding: 10px 0px 0px 0px; margin: 0% 0% 0% 2%;  }

.top-ph {   width: 42%;   padding: 10px 0px 0px 20px;   margin: 0% 0% 0% 0%; }
.follow {   width: 18%;  margin: 0% 0% 0% 0%;  }
	.top-con p{  font-size: 17px;}
.top-ph p{  font-size: 17px;}
	
#logo {  width: 40%;   margin: 0% 30% 0% 30%; }

#mmenu {  width: 100%;   margin: 0% 0% 0% 0%;  }
	
.nav-link { font-weight: bold; color:#000; text-transform: uppercase; margin: 0px 10px 0px 10px; font-size: 0.8em; padding: 0px;   }

  .pro-box a:link{  width: 100%;  float: left;   margin: 0% 0% 3% 0%; text-decoration: none;}

	
.carousel-caption h2{font-size:42px; margin: 0% 0% 0% -5%;line-height: 20px;  top:-50px;
     }
.carousel-caption p{font-size:60px;  margin: 6% 0% 2% -5%; line-height: 50px;top:-40px; }
	
#content h1{ font-size:35px;  font-weight:bold; font-family: 'Oswald', sans-serif; color: #7b070a;text-align: center; }
	
.carousel-indicators {     top: 210px;}
	
#client{  width:100%;    padding: 4% 5% 4% 5%; margin-top: 3%; }
	
  #footer { margin-top: 5%; padding: 1% 1% 1% 5%;}
    
    .about{   width:49%;   margin:3% 0% 2% 1%; }

.service{width:40%;  margin:3% 0% 2% 10%; }

.contact{  width:100%; margin:3% 0% 2% 0%; }
	
#breadcrumb{  width:100%;   margin:  0% 0% 0% 0%;   }
ul.breadcrumb li { font-size: 13px;}
	
#inner-content{  width:100%;   float:left; padding: 0% 5% 0% 5%;   }
	
#inner-content h1{  padding: 3% 0% 0% 0%;   }

#other-pro{  width:95%;   float:left; margin: 0% 0% 0% 5%;  }
    
    #room { padding: 2% 5% 2% 5%;  	}
#room .img1{  width:90%; float: left; margin: 0% 5% 4% 5%; }
#room .rtext p{ width:90%; margin: 2% 5% 0% 5%; font-size:24px; }
#room .rtext h2{ width:90%; margin: 3% 5% 0% 5%; font-weight: bold; font-size: 30px; color: #c70a0a; }

}

/************************************************************************************
smaller than 800
*************************************************************************************/
@media screen and (max-width: 768px) {
	
/* top */

#top {  width: 100%; height:60px; font-size: 0.6em;  }
.top-con { background-color: #B9171A; width: 100%; height: 30px; text-align: center;   padding: 4px 0px 0px 0px; margin: 0% 0% 0% 0%; }
.top-ph {  width: 42%;  padding: 4px 0px 0px 20px; height: 30px;  margin: 0% 0% 0% 0%; }
.follow {   width:22%;  margin: 0% 0% 0% 0%; height: 30px; padding: 5px 0px 0px 0px;}
	
.top-con p{  font-size: 14px;}
.top-ph p{  font-size: 14px;}
	
#logo {  width: 40%;   margin: 0% 30% 0% 30%; }

#mmenu {  width: 100%;   margin: 0% 0% 0% 0%;  }
	
  .pro-box a:link{  width: 100%;  float: left;   margin: 0% 0% 3% 0%; text-decoration: none;}

	
.carousel-caption h2{font-size:32px; margin: 0% 0% 0% -5%;line-height: 20px;  top:-30px;
     }
.carousel-caption p{font-size:50px;  margin: 6% 0% 2% -5%; line-height: 50px;top:-20px; }
	
#people h2{ font-size:42px; }
.ptext{ margin: 1% 5% 1% 5%; font-size: 16px; }
.ptext1{ margin: 1% 5% 0% 5%; font-size: 14px;  }
.ptext2{ margin: 0% 5% 1% 5%; font-size: 12px;   }
	
.carousel-indicators {    top: 155px;}
	
.car-bt {
    height: 40px;  top:-70px; position: absolute; left: auto;
    width: 150px; right: 10px; background-color: #000; }

#breadcrumb{  width:100%;   margin:  0% 0% 0% 0%;   }
ul.breadcrumb li { font-size: 12px;}
	
.sub-pro{ width: 40%;  margin: 0% 2% 0% 4%; }
    
    #room { padding: 2% 5% 2% 5%;  	}
#room .img1{  width:90%; float: left; margin: 0% 5% 4% 5%; }
#room .rtext p{ width:90%; margin: 2% 5% 0% 5%; font-size:24px;  }
#room .rtext h2{ width:90%; margin: 3% 5% 0% 5%; font-weight: bold; font-size: 30px; color: #c70a0a; }
    
     #footer { margin-top: 5%; padding: 1% 1% 1% 5%;}
    
    .about{   width:49%;   margin:3% 0% 2% 1%; }

.service{width:40%;  margin:3% 0% 2% 10%; }

.contact{  width:100%; margin:3% 0% 2% 0%; }
	
}

/************************************************************************************
smaller than 650
*************************************************************************************/
@media screen and (max-width: 650px) {



#top {  width: 100%; height:55px; font-size: 0.6em;  }
.top-con { background-color: #B9171A;  width: 100%; height: 25px; text-align: center;  padding: 2px 0px 0px 0px; margin: 0% 0% 0% 0%;   }
.top-ph {  width: 70%; height: 25px; text-align: center; padding: 5px 0px 0px 0px;   margin: 0% 0% 0% 0%; }
.follow {   width: 30%; text-align: center; margin: 0% 0% 0% 0%;padding: 6px 0px 0px 0px;   }
	
#logo {  width: 40%;   margin: 0% 30% 0% 30%; }

#mmenu {  width: 100%;   margin: 0% 0% 0% 0%;  }

.carousel-caption h2{font-size:30px; margin: 0% 0% 0% -5%;line-height: 20px;  top:-14px;    }
.carousel-caption p{font-size:35px;  margin: 6% 0% 2% -5%; line-height: 30px;top:-0px; }
    
      #room { padding: 2% 5% 2% 5%;  	}
#room .img1{  width:90%; float: left; margin: 0% 5% 4% 5%; }
#room .rtext p{ width:90%; margin: 2% 5% 0% 5%; font-size:24px;  }
#room .rtext h2{ width:90%; margin: 3% 5% 0% 5%; font-weight: bold; font-size: 30px; color: #c70a0a; }
    
      .pro-box a:link{  width: 100%;  float: left;   margin: 0% 0% 3% 0%; text-decoration: none;}
	#footer { margin-top: 14%; padding: 1% 1% 1% 5%;}
    
    .about{ width:100%;   margin:3% 0% 2% 0%; }

.service{width:100%;  margin:3% 0% 2% 0%; }

.contact{  width:100%; margin:3% 0% 2% 0%; }

}

/************************************************************************************
smaller than 450
*************************************************************************************/
@media screen and (max-width: 450px) {


#top {  width: 100%; height:55px; font-size: 0.6em;  }
.top-con { background-color: #B9171A;  width: 100%; height: 25px; text-align: center;  padding: 2px 0px 0px 0px; margin: 0% 0% 0% 0%;   }
.top-ph {  width: 45%; height: 25px; text-align: center; padding: 5px 0px 0px 0px;   margin: 0% 0% 0% 1%; }
.follow {   width: 30%; text-align: center; margin: 0% 0% 0% 0%;padding: 6px 0px 0px 0px;   }
	
#logo {  width: 40%;   margin: 0% 30% 0% 30%; }

#mmenu {  width: 100%;   margin: 0% 0% 0% 0%;  }

.carousel-caption h2{font-size:25px; margin: 0% 0% 0% -5%;line-height: 20px;  top:1px;    }
.carousel-caption p{font-size:30px;  margin: 6% 0% 2% -5%; line-height: 30px;top:10px; }
	
#products h2{ font-size:32px;  padding: 5% 0% 2% 0%;}
	
#blogs h2{ font-size:32px; padding: 5% 0% 2% 0%;}
	
#help h4{ font-size:32px;   }
	
#help p{ font-size:37px; line-height: 30px;  }
	
#people h2{ font-size:32px;  padding: 0% 0% 2% 0%;}
	
.carousel-indicators {    top: 170px;}
	
.car-bt {
    height: 40px;  top:-70px; position: absolute; left: auto;
    width: 50px; right: 3px; background-color: #000; }
	
.about{  width:100%; float:left; margin:3% 0% 2% 0%; }
.service{  width:100%; float:left; margin:3% 0% 2% 0%; }
.contact{  width:100%; float:left; margin:3% 0% 2% 0%; }
    
    #room { padding: 2% 5% 2% 5%;  	}
#room .img1{  width:90%; float: left; margin: 0% 5% 4% 5%; }
#room .rtext p{ width:90%; margin: 2% 5% 0% 5%; font-size:24px;  }
#room .rtext h2{ width:90%; margin: 3% 5% 0% 5%; font-weight: bold; font-size: 30px; color: #c70a0a; }
    
      .pro-box a:link{  width: 100%;  float: left;   margin: 0% 0% 3% 0%; text-decoration: none;}
    
    #footer { margin-top: 9%; padding: 1% 1% 1% 5%;}
    
    .about{    width:100%;   margin:3% 0% 2% 0%; }

.service{width:100%;  margin:3% 0% 2% 0%; }

.contact{  width:100%; margin:3% 0% 2% 0%; }

}