@media (max-width:1580px) {
    .popup-slide .title { padding-bottom: 25px; }
    .popup-line {  }
	.mCSB_container { height: auto !important; }
	figure.ipad-scroll { overflow-y:scroll;}
}

@media (max-width:1557px) {
    .popup-navigation span.nav-close { right: 20px; }
}
	
@media (max-width:1199px) {
    .popup-slide .title { font-size: 42px; line-height: 44px; }
    .popup-navigation span.nav-prev, 
    .popup-navigation span.nav-next { font-size: 29px; }
	.portfolio-figure figcaption span { font-size: 14px; }
	.portfolio-figure figcaption .title { font-size: 22px; line-height: 28px;}
	.portfolio-figure figcaption i { font-size: 26px; }
	.phone { padding-left: 50px; padding-right: 50px;}
	.nav-tabs li a { padding-right: 10px; padding-left: 10px; }
	.process-head {font-size: 19px; letter-spacing: 1px }
	h3 { font-size: 22px;  }
	.popup-slide .category { font-size: 21px; line-height: 21px; padding-bottom: 25px;}
	.popup-slide .description { font-size: .9em; line-height: 19px;}
	.right-part p { line-height: 19px; font-size: .8em; }
	.popup-slide .slide-number { font-size: .9em; padding-top: 10px;}
	.popup-line { margin-top: 3px; margin-bottom: 3px; }
	.motionwork h4 {font-size: 22px; line-height: 28px; padding-top: 23px}
	.motionwork i { font-size: 26px; padding-left: 60px; margin-top: -5px; }
	.motionwork p { padding-top: 15px; }
	.serviceBox {height: 440px;}
	.designService-title { margin-top: -20px;}
	.hero-box,  .hero-box-80 { padding-top: 50px;}
	.video-home {padding-top: 20%;}
	.header-yellow { background-repeat: no-repeat; background-position: center top; background-image: url(../images/kms-creative-designs-desk-hero.png); -webkit-background-size: cover; background-size: cover; height: 80%; -webkit-transition: ease-in-out; -moz-transition: ease-in-out; -o-transition: ease-in-out; transition: ease-in-out; background-color: #FFCF43; }


}
	
@media screen and (max-width:991px) {
    .form-control { max-width:100% !important; }
	.highlight { font-size: 50px; line-height: 55px;}
	.treatments { margin-top: 13px; margin-bottom:23px; 	letter-spacing: 1px; }
  	header .intro-section { padding: 40px 0 40px 0; }
 	header .intro-section .intro { margin: 0 0 15px; }
	.contact-left { padding-top: 10%; }
   .phone { padding-top: 115px; padding-left: 45px; padding-right: 45px; margin-top: 35px; }
	.small-button { margin-bottom: 100px;}
    .carousel-caption p { font-size: 15px; }
	
    .popup-slider { float: none; position: inherit; width: 100%; }
    .popup-slide .right-part { width: 100%; }

	.controls .carousel-control.left { left: 15px;  }
	.controls .carousel-control.right { right: 15px;  }

	.portfolio-item { max-width: 33.3%; width: 33%; }
   	.portfolio-figure figcaption .title { font-size: 20px; line-height: 24px;}
	.portfolio-figure figcaption span { font-size: 13px; }
	.portfolio-figure figcaption i { top: 5px; }
    .cs-style-3 figcaption { height: 65px; padding-top: 8px; padding-left: 15px; }
  	.tab-hide { display: none; }
   	.carousel-caption { width: 90%; }
	.service-title { padding-top: 15px; font-size: 24px}
	.serviceBox {height: 450px; padding-bottom: 25px;}

	.serviceImg { padding-left: 0px; width: 65%;}
	.designService-title { margin-top: 20px;}

	.popup-slide .title { font-size: 46px; padding-bottom: 20px; line-height: 44px; }
	.popup-slide .category { font-size: 19px; line-height: 19px; padding-bottom: 22px;}
	.popup-slide .description { font-size: 1em; line-height: 20px;}
	.right-part p {font-size: .9em; }
	.popup-slide .slide-number { font-size: 1em; }

    .nav > li > a { margin: 10px 8px; font-size: 12px;}
    .nav > li.last > a { margin: 10px 0 10px 10px; }
	#slide1 {background-image: url(../images/client-slide-sm-1.png); height: 350px; }
	#slide2 {background-image: url(../images/client-slide-sm-2.png); height: 350px; }
	#slide3 {background-image: url(../images/client-slide-sm-3.png); height: 350px; }

	.client-type {padding-left: 10%; padding-right: 10%;}
	.sectionHead h2, .sectionHead h3 { padding-left: 10%; padding-right: 10%;}
	.contact-copy-box {	padding-top: 30px; padding-right: 0px;}
	.video-home {padding-top: 0px;}
	.hero-box, .hero-box-80 { padding-top: 10px; padding-bottom: 50px;}
	.about-img {width: 45%; padding-top: 0px;}
	.client-list { padding-left: 15px;}
	.history-box { padding-bottom: 60px; }

}

@media screen and (max-width:768px) {
	header .intro-section { padding: 30px 0 30px 30px; }
	header .intro-section .intro { margin-bottom: 10px; }
	.highlight { font-size: 42px; line-height: 42px; }
	.treatments { font-size: 14px; margin-top: 11px; margin-bottom: 21px;}
    .portfolio-item { max-width: 50%; width: 49.94%; }
    .portfolio-figure figcaption { padding: 10px; height: 70px; }
    .portfolio-figure figcaption i { font-size: 30px; top: 3px; left: 0; }
  	.portfolio-figure figcaption .title { font-size: 23px; line-height: 27px;}
	.portfolio-figure figcaption span { font-size: 16px; }
    .left-part { padding: 0 10px 0 0; }
    .form-group { margin-bottom: 0; }
    .form-group button { margin-bottom: 0; }
	 .contact .row:last-child { padding: 0 15px; }
	 .contact { padding-top: 0; }
    .carousel-inner .margin-top { margin-top: 0 !important; }
	.phone { padding-top: 110px; padding-bottom: 115px; padding-left: 55px; padding-right: 55px; float: right; margin-left: auto; margin-right: auto; width: 50%; }
	#success { height: 300px; padding-top: 70px; font-size: 18px; line-height: 26px }
	.small-button { margin-bottom: 120px; }
	.contact-logo { margin-bottom: 15px; width: 35%; }
	.contact-left { padding-top: 30px; float: left; width: 100%; display: block; }
	h3 { font-size: 20px;  }
}
	
@media screen and (max-width:767px) {
	.service-title { padding-top: 5px; }
   .phone { padding-top: 115px; padding-bottom: 115px; padding-left: 60px; padding-right: 60px; float: none; width: 60%; clear: left; }
    .carousel-caption p { font-size: 14px; line-height: 18px; }
    span.title { font-size: 25px; margin: 0 auto; }
	ul.icon-list .text-left { text-align: center; }
   .icon-list li { text-align: center; width: 100%; }
    .carousel-caption { width: 100%; }
    .left-part { text-align: center; }

    .navbar-collapse { margin-top: 20px; }
    .collapse-navation { float: left; width: 100%; }
    nav { padding-top: 20px }
    .nav > li { border-bottom: 1px solid #e5e5e5; }
    .nav > li > a { margin: 2px 0; }
    .nav > li.last { border-bottom: none }
    .nav > li.last > a { margin: 2px 0 }
    .navbar-inverse .navbar-nav > li.current > a, 
    .navbar-inverse .navbar-nav > li > a:hover { transition: none; padding: 10px 0 8px; margin: 2px auto 2px; }
    .navbar-inverse .navbar-nav > li.current > a { border-bottom: 2px solid #FFF }
    .navbar-inverse .navbar-nav > li > a { transition: none; padding: 10px 0 10px; }
    .sticky-nav .navbar-toggle {background-color: #FFF; margin: 3px 0 0; margin-right: 30px; }
    .sticky-nav .navbar-toggle .icon-bar { background-color: #000;  }
    .sticky-nav .navbar-toggle:hover .icon-bar { background-color: #fff }
    .shrink-nav .navbar-toggle { background-color: #000; margin-top: 8px; margin-right: 30px; }
    .shrink-nav .navbar-toggle .icon-bar { background-color: #fff }
    .sticky-nav .container { padding-left: 0; }
    .sticky-nav { background: rgba(255, 255, 255, 1); }
    .nav-transparent .logo-dark { display: block }
    .sticky-nav .logo-light { display: none }
    .shrink-nav.nav-dark, 
    .shrink-nav.nav-transparent { min-height: 80px }
    .sticky-nav .navbar-nav > li > a { color: #000 }
    .sticky-nav .navbar-nav > li > a:hover { color: #000; border-bottom: 2px solid #FFF }
    .navbar-default .navbar-nav > li > a { text-align: left }
    .sticky-nav .col-md-3 { padding: 0 }
    .shrink-nav .navbar-nav > li > a { margin-top: 2px; }
	.dropdown-menu { min-width: 100%; background-color: #E5E8ED; border: none;  }
    .portfolio-buttons > li { border-bottom: none; }

    section { padding-bottom: 30px; }
    .container { margin: 0 15px; }
    .left-part { padding: 0; }
    .buttons .small-button { margin: 4% 0 0; }
    .form-group { margin-bottom: 0; }
    .form-group button { float: none; margin: 0 auto; text-align: center; }
    .divider { width: 100%; }
    .grid li { width: 100%; }
  
    ul.slides { margin-bottom: 0; }
    .popup-slide .title { font-size: 40px; line-height: 40px; padding-bottom: 10px; }
    .popup-slide .category { font-size: 22px; }
    .icon-list { margin-bottom: 15px; }
    .contact .row:last-child { padding: 11px 0 0 0; }
	 #process .nav > li { border-style: none;}
	 #processTabs .nav nav-tabs { margin-right: -15px; margin-left: -15px; }
    .isotope { height: auto !important; }
    .isotope-item { transform: none !important; position: relative !important; }
	.serviceBox { text-align: center; margin-bottom: 70px; padding-left: 15%; padding-right: 15%;}

	.serviceImg { margin: auto; width: 60%;}
	.service-button {position: relative;}
	.video-home {padding-top: 0px; padding-bottom: 0px; float: none;}
	#slide1, #slide2, #slide3 {height: 450px; margin-bottom: 20px;}
	.designServiceImg { padding-left: 30px; padding-right: 30px; text-align:center; width: 33%; }
	.designService-title { margin-top: 5px;}
	.about-img {width: 45%;}
	.contact-left {padding-top: 50px; padding-bottom: 50px; padding-right: 0px;}
	.padBot30 img {margin: auto; width: 80%}
}
  
	
@media screen and (max-width:600px) {
    section {padding: 0;}
	.phone { width: 70%; }
  .contact-copy { line-height: 25px; padding-bottom: 0; padding-right: 0; }
   header .intro-section { padding: 20px 0 20px 0; }
   .highlight { font-size: 34px; line-height: 30px; }
   header .intro-section .intro { margin-bottom: 9px; }
  .highlight-button, 
   .highlight-button:focus { display: table; font-size: 14px; padding: 6px 16px; margin: auto;}
	.hero img {display: none;}
	.hero-600 img {display: block; }
	.treatments {margin-top: 12px; margin-bottom: 13px; line-height: 15px; letter-spacing: 0px; }
    .popup-slide .category { font-size: 20px; }
	.portfolio-item { max-width: 100%; }
	.portfolio-figure figcaption { padding: 20px; height: 100px; }
   	.portfolio-figure figcaption .title { font-size: 32px; line-height: 38px;}
	.portfolio-figure figcaption span { font-size: 18px; }
	.portfolio-figure figcaption a { top: 35px; padding-right: 15px; }
  	.portfolio-figure figcaption i { font-size: 40px;}
  	.popup-navigation span.nav-next { left: 93%; padding: 0 10px 2px 11px; }
    .popup-navigation span.nav-prev { right: 93%; padding: 0 11px 2px 10px; }
	.popup-navigation span.nav-close { float: left; margin: auto; left: 15px; width: 50px;}
	.sticky-nav .navbar-toggle {margin-right: 15px; }
	.shrink-nav .navbar-toggle {margin-right: 15px; }

	.popup-navigation span.nav-next span.copy {padding-top: 5px; padding-bottom: 5px; font-size: 14px;  margin-left: -120px; margin-top: -5px; width: 125px;}
	
	.popup-slide .controls span { font-size: 30px; }
	.controls .carousel-control {padding-bottom: 0px; }
	.controls .carousel-control.right { padding: 2px 10px 0 10px; margin-right: -5px; }
	.controls .carousel-control.left { padding: 2px 10px 0 10px; margin-left: -5px; }

	.grid li { margin-bottom: 25px; }
	.grid .cs-style-3 { margin-left: -5px; }
  	.tab-content.container.sectionMain { margin-top: 20px; margin-right: -15px; margin-left: -15px; margin-bottom: 20px; }
	#processTabs .nav nav-tabs { margin-right: -15px; margin-left: -15px; }
	.process-copy {padding-left: 25px; padding-right: 25px;}
	.tab-content .carousel-caption p { padding-left: 0px; padding-right: 0px; }
	#success { font-size: 16px; line-height: 22px }
	.serviceBox { margin-bottom: 80px;}
	#slide1, #slide2, #slide3 {margin-bottom: -50px;}
	.serviceBox {padding-left: 6%; padding-right: 6%;}

	.designServiceImg { padding-left: 0px; padding-right: 15px; padding-top: 5px;  padding-bottom: 30px; float: left; width: 30%; }
	#success { font-size: 16px; line-height: 22px }
	.service-title-link { padding-top: 0px; width: 65%; float: right; }
	.sectionHead h2, .sectionHead h3 { padding-left: 10px; padding-right: 10px;}
	.about-img {margin: auto; float:none; width:55%; padding-left: 0px;}


}

@media (max-width:523px) {
    .icon-container { margin: 0 auto; float: none; }
    .popup-navigation span.nav-prev { right: 90%; padding: 2px 12px 3px 9px; }
    .popup-navigation span.nav-next { left: 90%; padding: 2px 9px 3px 12px; }
	span.nav-close:before { font-size: 26px; }
	 .phone { width: 80%; padding-left: 40px; padding-right: 40px;}
	.highlight-divider { margin-top: 15px;}
	.motionwork i {  float: right; padding-top: 0px;}
	.motionwork h4 { padding-top: 35px; }
	#slide1, #slide2, #slide3 {margin-bottom: -100px;}
	.designServiceImg {padding-right: 0px; padding-bottom: 10px; margin: auto; float: none; width: 60%; }
	.designServiceBox {padding-left: 6%; padding-right: 6%; text-align: center;}


}

  @media screen and (max-width:480px) {
	h1{font-size: 50px; line-height: 48px; margin-bottom: 0px;}
	h1.title { font-size: 32px; line-height: 28px; margin: 3px 0 0; }
    h2.title { font-size: 42px; vertical-align: top; display: inline-block; line-height: 42px; margin-top: 20px; }
    h4.title { font-size: 20px; }
    h5.title { font-size: 16px; margin-bottom: 2px; }
    .carousel-caption p { font-size: 14px; line-height: 18px; }
	header .intro-section .buttons { margin-top: 0; }
	header .intro-section { top: 40%; }
	.highlight { font-size: 30px; line-height: 26px; }
   .treatments { margin-left: 30px; margin-right: 30px; font-size: 15px;  line-height: 18px; }
	.phone { width: 90%;}
   	.slideshow nav span { padding: 2px; }

	.carousel-caption { padding-top: 0; }
    .carousel-caption span { margin-bottom: 10%; }
	.icon-list { text-align: center; }
	.icon-list li.divider-transparent { width: 100%; }
	.form-group { margin-top: 12px;}
	h2.title { margin: 30px 0 13px; }

	.container .sectionMain { margin-top: 20px; margin-right: -15px; margin-left: -15px; margin-bottom: 20px; }
	.tab-content .carousel-indicators li { width: 12px; height: 12px;}
	.tab-content .carousel-indicators { bottom: 15px; }
	.scrollToTop { right: 15px; top: 92%;  }
	.scrollToTop i { font-size: 20px; }
	.controls .carousel-control { top: 48%; }
	.controls .carousel-control span { font-size: 28px; }
	#slide1, #slide2, #slide3 {margin-bottom: -150px;}
	.serviceBox { margin-bottom: 60px;}
	.hero-box, .hero-box-80 {padding-left: 5px; padding-right: 5px;}
	.hero-img-box {padding-left: 0px; padding-right: 0px;}
	h1{font-size: 32px;}
	.hero-img {padding-bottom: 10px;}

}

@media screen and (max-width:414px) {
	header .intro-section { top: 40%; }
	.serviceImg { width: 80%;}
	.about-img {width:70%; padding-bottom: 20px;}
	.popup-navigation span.nav-next span.copy {border: none; padding-top: 1px; padding-bottom: 1px; font-size: 12px;  margin-left: -100px; margin-top: -5px; width: 100px;}
}

@media screen and (max-width:320px) {
    header .intro-section .buttons { margin-top: 0; }
    .scrollDownWrap { bottom: 10px; }
	.phone { padding-top: 115px; padding-bottom: 115px; padding-left: 35px; padding-right: 35px; width: 100%; }
	.contact-left { padding-top: 15px; margin-left: -15px; margin-right: -15px; }
	.process-copy {padding-left: 10px; padding-right: 10px;}
	.about-img {width:90%; padding-bottom: 30px;}

	.designService-title, .designService-copy { width: 100%; display: block; clear: left; }
	header .intro-section { top: 26%; }
	.highlight { font-size: 25px; line-height: 15px; }
   .treatments { font-size: 12px; line-height: 14px; }
   .contact .row:last-child { padding: 0 0 0;}
    .buttons .small-button { margin: 9% 0 0 !important; }
	 .icon-list i { font-size: 16px; }
	 #contact { padding: 0 0 30px; }
    .form-group { margin-top: 15px; }
    textarea.form-control { min-height: 135px; }
	.tab-content .carousel-indicators { bottom: 0px; }
	p .lg-number { line-height: 120px;	}
	.caption-line { display: none;}
	.tab-content .carousel-caption p { padding-top: 15px; }
	.scrollToTop { right: 10px; top: 94%;  }
	.scrollToTop i { font-size: 17px; }
	
	.popup-navigation span.nav-prev { font-size: 22px; right: 88%; top: 20px; }
    .popup-navigation span.nav-next { font-size: 22px; left: 88%; top: 20px; }
	.popup-navigation span.nav-close { top: 0;}
	span.nav-close:before { font-size: 22px; }
	.popup-slide .controls {display: none; }
	.popup-slider .carousel-indicators { top: 95%; }
	.header-yellow { background-image: url(../images/kms_home_320.png); }
	#slide1, #slide2, #slide3 {margin-bottom: -200px;}
	}


@media only screen and (device-width: 768px) {
   #contact, .phone { background-attachment:inherit !important }
}
	
/* ==========================================================================
Scroll
========================================================================== */
@-webkit-keyframes iconFloat {
    0% { top: 0; }
    50% { top: 20px; }
    100% { top: 0; }
}
@-moz-keyframes iconFloat {
    0% { top: 0; }
    50% { top: 20px; }
    100% { top: 0; }
}
@-o-keyframes iconFloat {
    0% { top: 0; }
    50% { top: 20px; }
    100% { top: 0; }
}
@keyframes iconFloat {
    0% { top: 0; }
    50% { top: 20px; }
    100% { top: 0; }
}