@charset "UTF-8";
/* CSS Document */

@media only screen and (min-width: 1200px) {
.container {width:100%}
.navbar .navbar-toggle {margin-top:25px;}
.carousel, .item, .carousel-inner {height: 850px;}
.col-light-blue {height:200px; padding-top:10px}
.col-light-red {height:180px; padding-top:20px}
.col-light-yellow {height:180px; padding-top:10px}
td.programTD1 {width:150px!important}
.maybank-apply {width:500px}
	
div#sunwayTES1, div#sunwayTES2 {min-height: 780px}
div#sunwayTES3, div#sunwayTES4 {min-height: 620px}
    
.hero-section {
    background: url("../pics/yp-bg-main-banner.jpg");
    background-position: center center;
    background-size:cover!important;
    height:600px;
    padding: 80px 0;
}
    
.worldclass-description {padding:0 30px}

/**#about-us { 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  }**/
}

@media only screen and (min-width: 980px) and (max-width: 1199px) {
.container {width:100%}
.navbar .navbar-toggle {margin-top:20px;}
.carousel, .item, .carousel-inner {height: 800px;}
.col-light-blue {height:220px; padding-top:10px}
.col-light-red {height:220px; padding-top:10px}
.col-light-yellow {height:180px; padding-top:10px}
/*.navbar-nav {margin-top: 50px;}*/
.maybank-apply {width:500px}
	
.hero-section {
    background: url("../pics/yp-bg-main-banner.jpg");
    background-position: center center;
    background-size:cover!important;
    height:600px;
    padding: 80px 0;
}
    
.worldclass-description {padding:0 30px}


}

@media only screen and (min-width: 769px) and (max-width: 979px) {
#wrapper {width:100%;}
.carousel, .item, .carousel-inner {height: 680px;}
.col-light-blue {background-size:cover; height:280px;}
.col-light-red {height:250px; padding-top:10px}
.col-light-yellow {height:230px; padding-top:10px}
.navbar .navbar-toggle {margin-top:20px;}
.navbar-nav {margin-top: 10px;}
.img-sm {width:60%!important; margin:0 auto!important}
.rightLeft {text-align:left}
.rightCenter {text-align:center}
.leftCenter {text-align:center}
.logo-mfa {width:450px;}
.logo-mf {width:400px;}
.maybank-apply {width:500px}
    
.hero-section {
    background: url("../pics/yp-bg-main-banner.jpg");
    background-position: center center;
    background-size:cover!important;
    height:600px;
    padding: 80px 0;
}
    
.worldclass-description {padding:0 30px}
}
	


@media only screen and (min-width: 480px) and (max-width: 768px) {
#wrapper {width:100%;}
.carousel, .item, .carousel-inner {height: 700px;}
.logo {width:200px; height:auto;}
.col-light-blue {background-size:cover; height:250px;}
.txt-screen {font-size:.9em}
.btn-screen {height:40px; font-size:.9em; margin:4px 0 0 0 ; padding:8px 10px}
#footer {height: 220px;}
.col-light-red {height:250px; padding-top:10px}
.col-light-yellow {height:230px; padding-top:10px}
div#footer .msc-logo {margin-bottom:80px;}
.img-sm {width:80%!important; margin:0 auto!important}
.img-sm2 {width:70%!important; margin:0 auto!important}
.rightLeft {text-align:left}
.rightCenter {text-align:center}
.leftCenter {text-align:center}
.logo-mfa {width:450px;}
.logo-mf {width:400px;}
    
    
.logo-mobile {padding:0 80px!important}

    
}


@media only screen and (max-width: 480px) {
#wrapper {width:100%;}
.carousel, .item, .carousel-inner {height: 700px;}
.logo {width:200px; height:auto;}
.navbar .nav-main {	height:70px;}
.col-light-blue {background-size:cover; height:240px; margin-left:-150px;}
.txt-screen {font-size:.9em}
.btn-screen {height:40px; font-size:.9em; margin:4px 0 0 0 ; padding:8px 10px}
#footer {height: 250px;}
.footerEmail {font-size: .85em}
.xxs-txt {font-size:.7em}

div#footer .msc-logo {width:60px;height: auto; float:none; display:block; padding-right:10px;}
.img-sm2 {width:80%!important; margin:0 auto!important}
.rightLeft {text-align:left}
.rightCenter {text-align:center}
.leftCenter {text-align:center}
.logo-mfa {width:90%;}
.logo-mf {width:90%;}
    
.logo-mobile {padding:0 20px!important}


}