/*---------------desktop device--------------*/

@media (min-width: 1601px) and (max-width: 1680px) {

.big-about h1 { font-size: 180px;}
.contact-box .col-md-4{ padding: 0px;}
.contact-box { margin-top: 62px;}
.contact-area iframe { margin-top: 62px;}
}



@media (min-width: 1441px) and (max-width: 1600px) {

.big-about h1 { font-size: 180px;}
.contact-item { padding: 40px 15px;}
.contact-box .col-md-4{ padding: 0px;}
.contact-box { margin-top: 50px; padding: 20px 9px;}
.contact-area iframe { margin-top: 50px;}
}



@media (min-width: 1367px) and (max-width: 1440px) {

.big-about h1{ font-size: 180px;}
.contact-item { padding: 30px 20px; min-height: 241px;}
.contact-box .col-md-4{ padding: 0px;}
.contact-box { margin-top: 28px;}
.contact-area iframe { margin-top: 28px;}
}



@media (min-width: 1300px) and (max-width: 1366px) {

.big-about h1{ font-size: 180px;}
.contact-item { padding: 30px 18px; min-height: 241px;}
.contact-box .col-md-4{ padding: 0px;}
.contact-box { margin-top: 15px;}
.contact-area iframe { margin-top: 15px;}
}


@media (min-width: 1025px) and (max-width: 1299px) {
	
.contact-box { margin-top: 54px; padding: 10px 0px;}
.contact-area iframe { margin-top: 54px; height: 259px;}
.contact-box h4 { margin-bottom: 18px; font-size: 16px;}
.contact-box .col-md-4 { padding: 0px;}
.contact-item img { width: 32px;}
.contact-item h5 { font-size: 15px; margin-top: 15px;}
.contact-item { padding: 20px 8px; min-height: 193px;}		
}



/*--------------- tab device--------------*/

@media (min-width: 600px) and (max-width: 768px) {

.logo img { width: 160px;}
.logo:before { right: -5px;}
.main-menu:before { left: 30px;}
.navbar-default .navbar-nav > li > a { padding: 10px 8px; font-size: 13px;}
.navbar-default { margin: 8px 0px;}
.navbar-default .navbar-right { padding-top: 3px;}
.nivo-directionNav a { font-size: 40px; height: 30px; line-height: 30px; width: 30px; margin-top: -20px;}
.slide-text-left { margin-left: 50px; }	
.slide-text-right { margin-right: 50px; }	
.cap-sub-title { font-size: 18px; margin-bottom: 10px;}
.cap-title { font-size: 26px; letter-spacing: 1px; line-height: 30px; margin-bottom: 12px;}
.big-about h1 { font-size: 100px;}
.about-sbd { padding: 40px 0px 25px;}
.about-text h2 { font-size: 32px; margin-bottom: 30px;}
.about-sbd:before, .about-group:before { width: 550px;}
.about-sbd:after { width: 30%;}
.about-group { padding: 30px 0px 25px;}
.group-text h2 { font-size: 32px; margin-bottom: 30px;}
.group-text { padding-left: 112px;}
.sugal-logo { padding-right: 15px;}
.sugal-logo img { margin-top: 170px;}
.project-area { padding: 35px 0px 50px;}
.heading { margin: 0px 0px 30px;}
.heading h2 { font-size: 32px;}
.project-open ul li { padding: 0px 15px;}
.project-open ul li button img { width: 275px;}
.project-open ul li button { margin: 55% auto 0%;}
.project-open ul li:nth-child(2):before { min-height: 460px;}
.project-select .tab-content { min-height: 500px;}
.associate-area { padding: 40px 0px 30px;}
.associate-box { margin-bottom: 20px;}
.team-area { padding: 40px 0px;}
.team-area .col-md-4 { margin-top: 0px;}
.no-left { display: none;}
.contact-box { margin: 40px 0px 0px;}
.contact-area iframe { margin-top: 30px;}
.contact-item { padding: 10px 20px; min-height: 199px;}
}


@media (min-width: 769px) and (max-width: 1024px) {
	
.logo img { width: 175px;}
.logo:before { right: 10px;}
.main-menu:before { left: 30px;}
.navbar-default { margin: 10px 0px;}
.nivo-directionNav a { font-size: 40px; height: 30px; line-height: 30px; width: 30px; margin-top: -20px;}
.slide-text-left { margin-left: 50px; }	
.slide-text-right { margin-right: 50px; }	
.cap-sub-title { font-size: 22px; margin-bottom: 15px;}
.cap-title { font-size: 36px; letter-spacing: 1px; line-height: 30px; margin-bottom: 12px;}
.big-about h1 { font-size: 100px;}
.about-sbd { padding: 45px 0px 55px;}
.about-text h2 { font-size: 32px; margin-bottom: 30px;}
.about-sbd:before, .about-group:before { width: 770px;}
.about-sbd:after { width: 30%;}
.about-group { padding: 30px 0px 25px;}
.group-text h2 { font-size: 32px; margin-bottom: 30px;}
.group-text { padding-left: 112px;}
.project-area { padding: 35px 0px 50px;}
.heading { margin: 0px 0px 30px;}
.heading h2 { font-size: 32px;}
.project-open ul li { padding: 0px 15px;}
.associate-area { padding: 40px 0px 30px;}
.team-area { padding: 40px 0px;}
.team-area .col-md-4 { margin-top: 0px;}
.contact-box { margin-top: 12px; padding: 10px 0px;}
.contact-area iframe { margin-top: 12px; height: 259px;}
.contact-box h4 { margin-bottom: 18px; font-size: 16px;}
.contact-box .col-md-4 { padding: 0px;}
.contact-item img { width: 32px;}
.contact-item h5 { font-size: 15px; margin-top: 15px;}
.contact-item { padding: 20px 2px; min-height: 193px;}	
}



/*------------- small device  ----------------*/

@media(max-width:320px) {

.big-about h1 { font-size: 75px !important;}	
}


@media(max-width:480px) {
	
.nivo-directionNav a { font-size: 34px; height: 30px; line-height: 30px; width: 30px; margin-top: -20px;}
.slide-text-left { margin-left: 0; float: none; text-align: center; margin: 0px auto;}	
.slide-text-right { margin-right: 0; float: none; text-align: center; margin: 0px auto;}	
.cap-sub-title { font-size: 16px; margin-bottom: 8px;}
.cap-title { font-size: 22px; letter-spacing: 1px; line-height: 30px; margin-bottom: 12px;}
.middle-text { vertical-align: bottom;}
.about-sbd:before { display: none;}
.about-group:before { width: 100%;}
.big-about h1 { font-size: 72px; line-height: 0.8;}
.group-text { padding-left: 0px;}
.about-sbd:after { display: none;}
.logo:before, .main-menu:before { display: none;}
.header-area { background: #fff;}
.logo img { width: 150px;}
.sticky .logo img { width: 140px;}
.logo { position: absolute;}
.navbar-toggle { margin: 4px 0px 0px; background-color: transparent;}
.navbar-default { margin: 12px 0px;}
.sticky .main-menu .navbar-default { margin: 8px 0px;}
.slider-wrap { margin-top: 75px;}
.about-text h2 { font-size: 30px; margin-top: 20px; margin-bottom: 12px; text-align: center;}
.about-sbd { padding: 58px 0px 20px;}
.about-img { margin-top: 0px;}
.about-text p { margin-bottom: 10px; font-size: 14px;}
.about-group { padding: 30px 0px 35px;}
.group-text h2 { font-size: 30px; margin-bottom: 12px; text-align: center;}
.group-text p { margin-bottom: 10px; font-size: 14px;}
.navbar-default .navbar-nav > li > a { padding: 8px 15px;}
.navbar-default .navbar-right { padding-top: 0px; margin-bottom: 0px;}
.navbar-collapse { margin-top: 15px;}
.sugal-logo { padding-right: 15px;}
.sugal-logo img { float: none; margin: 40px auto 0px;}
.sugal-logo img:nth-child(1) { display: none;}
.sugal-logo img:nth-child(2) { display: block;}
.project-area { padding: 40px 0px 50px; background: #fff;}
.heading { margin: 0px 0px 25px;}
.heading h2 { font-size: 30px;}
.project-select .nav-tabs li a { font-size: 14px; padding: 8px 15px;}
.project-select .nav-tabs { margin-bottom: 18px;}
.middle-line:before { display: none;}
.project-open button { margin-top: 24px; margin-bottom: 30px; padding: 6px 16px; font-size: 18px;}
.project-select .tab-content { padding: 15px;}
.project-detail { padding: 15px 0px;}
.para-height { padding-right: 10px; margin-bottom: 25px;}
.para-height p { margin-bottom: 10px; font-size: 14px;}
.project-logo { width: 170px;}
.project-carousel .owl-wrapper .owl-item .col-md-12 { padding: 0px;}
.project-carousel.owl-theme .owl-controls .owl-buttons div.owl-prev { left: -12px;}
.project-carousel.owl-theme .owl-controls .owl-buttons div.owl-next { right: -12px;}
.associate-area { padding: 40px 0px;}
.associate-box { margin-bottom: 20px; padding: 28px 30px;}
.associate-box p { font-size: 14px;}
.associate-pop { padding: 0px 5px !important;}
.associate-pop .modal-body { padding: 0px 0px 15px;}
.carousel-control .fa { font-size: 26px; line-height: 35px;}
.carousel-control.left { border-radius: 0px; left: 0px;}
.carousel-control.right { border-radius: 0px; right: 0px;}
.carousel-control { background-color: rgb(0, 84, 157); height: 35px; width: 35px; top: 50%;}
.team-area { padding: 40px 0px 50px;}
.query-area { padding: 40px 0px 40px;}
.query-area h2{ font-size: 30px; margin-bottom: 12px; text-align: center;}
.query-area p{ text-align: center; font-size: 14px;}



.no-left { display: none;}
.contact-area { background: #f8f8f8; padding: 40px 0px 30px;}
.contact-area iframe { margin-top: 0px;}
.contact-box { margin: 0px 0px 30px; padding-bottom: 5px;}
.contact-box h4 { margin-bottom: 15px;}
.contact-item { border: 0px; border-bottom: 1px solid #eee; padding: 30px 20px; min-height: 180px;}
.copyright { padding: 12px 10px;}
#toTop { width: 40px; height: 40px; line-height: 40px;}
}