/* Desktop (1480) */
@media screen and (max-width: 1480px)
{
    .icon-scroll img
    {
        width: 45px;
        height: auto; 
    }
    .menu-header h1 
    {
        font-size: 16px;
    }
    .sub-menu 
    {
        top: 107px;
    }
    .menu-header 
    {
        padding-bottom: 15px;
    }
    .sub-menu li 
    {
        font-size: 11px;
    }
    .menu-num 
    {
        font-size: 18px;
    }
    
    .client-header 
    {
        font-size: 42px;
    }
    .film-btn, .stills-btn, .tv-btn 
    {
        width: 100px;
        height: 100px;
        border: solid 3px #fff;
        margin: 0px 3.8% 0px 3.8%;
    }
    .pn-wrapper 
    {
        padding-top: 15px;
    }
    .sfs4 h1
    {

        font-size: 52px;
        margin-left:40px;
        letter-spacing:35px;
    }
    .sfs5 h1
    {

        font-size: 52px;
        margin-left:40px;
        letter-spacing:35px;

    }
    .project-nav li 
    {
        font-size: 14px;
    }
    .section-content-box .i1 h1 
    {
        font-size: 52px;
    }
    .section-content-box .i2a h1 
    {
        font-size: 52px;
        margin-bottom: 15px;
    }
    .sfs1
    {
        letter-spacing:28px;
    }
    .sfs2
    {
        letter-spacing: 19.5px;
        margin-left: -7px;
    }
    .sfs3
    {
        letter-spacing:2px;
        font-weight: 500;
        font-size: 10px;
    }
    
    .section-content-box .i2 
    {
        width: 45%;
    }  
    .section-content-box .i2 h1 
    {
        font-size: 50px;
        letter-spacing: 8px;
        margin-bottom: 15px;
    }
    .section-content-box .i3 p 
    {
        width: 65%;
        font-size: 18px;
        margin-bottom: 20px;
    }
    
    
    .ibtn-wrapper, .ibtn-wrapper2, .ibtn-wrapper3 
    {
        margin-top: 0px;
    }
}
/* Desktop (1280) */
@media screen and (max-width: 1280px)
{
    .client-header 
    {
        font-size: 38px;
    }
    .film-btn, .stills-btn, .tv-btn 
    {
        width: 100px;
        height: 100px;
        border: solid 3px #fff;
        margin: 0px 5% 0px 5%;
    }
    .section-content-box .i2 
    {
        width: 100%;
    }  
    .section-content-box .i2 h1 
    {
        font-size: 40px;
        letter-spacing: 5px;
        margin-bottom: 10px;
    }
    .section-content-box .i3 p 
    {
        width: 70%;
        font-size: 16px;
        margin-bottom: 15px;
    }
    .section-content-box .i1 h1 
    {
        font-size: 52px;
    }
    .section-content-box .i2a h1 
    {
        font-size: 52px;
        margin-bottom: 15px;
    }
    .sfs1
    {
        letter-spacing:28px;
    }
    .sfs2
    {
        letter-spacing: 19.5px;
        margin-left: -7px;
    }
    .sfs3
    {
        letter-spacing:2px;
        font-weight: 500;
        font-size: 10px;
    }  
}
/* Desktop (1024) */
@media screen and (max-width: 1024px)
{
    .client-header 
    {
        font-size: 32px;
    }
    
    .section-content-box .i2 h1 
    {
        font-size: 35px;
        letter-spacing: 3px;
    }
    
}
/* Desktop (800) */
@media screen and (max-width: 800px)
{   
    .kaap-logo span{
        font-size: 2em;
    }
    .ch-small {
        font-size: 10px;
        letter-spacing: 2px;
    }
    .client-box span {
        font-size: 3.5em;
    }
    .film-btn, .stills-btn, .tv-btn 
    {
        width: 100px;
        height: 100px;
        border: solid 3px #fff;
        margin: 0px 6% 0px 6%;
    }
    .film-btn, .stills-btn, .tv-btn 
    {
        width: 90px;
        height: 90px;
        border: solid 3px #fff;
        margin: 0px 10px 0px 10px;
    }
    .pn-wrapper 
    {
        padding-top: 15px;
    }
    .menu-link 
    {
        width: 50%;
        height: 33.5%;
        background-size: auto 116% !important;
        vertical-align: top;
    }
    .menu-info p 
    {
        font-size: 10px;
        letter-spacing: 1px;
    }
    .section-content-box .i2 h1 
    {
        font-size: 40px;
    }
    .section-content-box .i2 
    {
        width: 50%;
    }  
   
    .kaap-logo img
    {
        width: 120px;
    }
    .social-icons p 
    {
        letter-spacing: 1px;
    }
    .btn-hr, .btn-hr2, .btn-hr3, .btn-hl, .btn-hl2, .btn-hl3 
    {
        width: 30px;
        height: 30px;
    }
    .btn-hr img, .btn-hr2 img, .btn-hr3 img, .btn-hl img, .btn-hl2 img, .btn-hl3 img 
    {
        width: 30px;
        height: 30px;
    }
    .btn-h-wrapper, .btn-h-wrapper2, .btn-h-wrapper3 
    {
        height: 30px;
    }
    .btn-scroll 
    {
        margin-left: -15px;
        width: 30px;
        height: 30px;
    }
    .btn-scroll2 
    {
        margin-left: -15px;
        width: 30px;
        height: 30px;
    }
    .i2-wrapper .i2 h2 
    {
        letter-spacing: 1px;
        font-weight: 700;
        font-size: 8px;
    }
    .screen-header
    {
        bottom: 20px;
        left: 20px;
    }
    
    
    .sfs4 h1
    {

        font-size: 42px;
        margin-left:40px;
        letter-spacing:35px;
    }
    .sfs5 h1
    {

        font-size: 42px;
        margin-left:40px;
        letter-spacing:35px;

    }
    .project-nav li 
    {
        font-size: 14px;
    }
    .section-content-box .i1 h1 
    {
        font-size: 42px;
    }
    .section-content-box .i2a h1 
    {
        font-size: 42px;
        margin-bottom: 15px;
    }
    .sfs1
    {
        letter-spacing:20px;
    }
    .sfs2
    {
        letter-spacing: 13.5px;
        margin-left: -7px;
    }
    .sfs3
    {
        letter-spacing:2px;
        font-weight: 500;
        font-size: 10px;
    }  
    
    .bg-container
    {
        display: block;
    }
    #bgvid
    {
        display: none;
    }
    /* Introduction */
    .cwbg1
    {
        background-color: rgba(0,0,0,0.4);
    }
    /* About */
    .cwbg2
    {
        
    }
    .cwbg3
    {
        
    }
    .cwbg4
    {
        
    }
    .cwbg5
    {
        
    }
    /* Locations */
    .cwbg6
    {
        
    }
    .cwbg7
    {
        background-image: url('../images/banners/locations-2.jpg');
    }
    .cwbg8
    {
        background-image: url('../images/banners/locations-2.jpg');
    }
    .cwbg9
    {
        background-image: url('../images/banners/locations-1.jpg');
    }
    /* Work */
    .cwbg10
    {
        background-color: transparent;
    }
    /* Clients */
    .cwbg11
    {
        background-color: rgba(0,0,0,0.4);
    }
    /* Contact */
    .cwbg12
    {
        background-color: rgba(0,0,0,0.45);
    }
    .cwbg13
    {
        background-color: rgba(0,0,0,0.4);
    }
    .menu-link 
    {
        width: 50%;
        height: 33.5%;
        background-size: auto 150% !important;
        vertical-align: top;
    }
    .work-box 
    {
        background-size: auto 100% !important;
        vertical-align: top;
    }
    .stills-pic 
    {
        background-size: auto 100% !important;
        vertical-align: top;
    }
    .team-box 
    {
        background-size: auto 100% !important;
        vertical-align: top;
    }
    .team-info h1 
    {
        font-size: 12px;
    }
    .team-info h2
    {
        font-size: 8px;
    }
    .team-info p 
    {
        display: inline-block;
        width: 95%;
        font-size: 10px;
    }
    
}
/* Desktop (700) */
@media screen and (max-width: 700px)
{   
      
}
/* Desktop (650) */
@media screen and (max-width: 650px)
{
    .map-type 
    {
        margin-left: -110px;
        width: 200px;
        padding: 10px 10px;
    }
    .mt-copy 
    {
        letter-spacing: 1px;
        font-size: 10px;
        height: 15px;
        padding-top: 2px;
    }
    .contact-info 
    {
        font-style: normal;
        font-weight: 200;
        letter-spacing: 2px;
        line-height: 1.5;
        font-size: 10px;
        margin-bottom: 8px;
    }
    .btn-scroll 
    {
        bottom: 5px;
    }
    .btn-scroll2 
    {
        top: 5px;
    }
    .scroll-copy
    {
        display: none;
    }
    .icon-scroll
    {
        height: 40px;
    }
    .icon-scroll span
    {
        font-size: 2.2em;
    }
    .kaap-tagline {
        margin-top: -30px;
        font-size: 8px;
        padding: 0 40px;
        box-sizing: border-box;
    }
    .kaap-logo
    {
        right: 10px;
    }
    .btn-menu
    {
        left: 10px;
    }
    .screen-header 
    {
        bottom: 10px;
        left: 10px;
    }
    .menu-header h1 
    {
        font-size: 10px;
    }
    .menu-header 
    {
        top: 20px;
        left: 20px;
        border-bottom: none;
        padding-bottom: 0;
    }
    .sub-menu 
    {
        display: none;
    }
    .menu-num 
    {
        font-size: 12px;
        border: none;
    }
    .menu-pagination-box 
    {
        right: 20px;
        bottom: 20px;
        border-left: none;
        border-right: none;
    }
    .mi1
    {
        width: 50%;
        height: 33.3%;
        background-color: #728780;
        left: -50%;
        top: 0;
        z-index: 3;
    }
    .mi2
    {
        width: 50%;
        height: 33.3%;
        background-color: #3a3c37;
        left: -50%;
        top: 0;
        z-index: 2;
    }
    .mi3
    {
        width: 50%;
        height: 33.3%;
        background-color: #898174;
        left: -50%;
        top: 33.3%;
        z-index: 3;
    }
    .mi4
    {
        width: 50%;
        height: 33.3%;
        background-color: #3d2c37;
        left: -50%;
        top: 33.3%;
        z-index: 2;
    }
    .mi5
    {
        width: 50%;
        height: 33.3%;
        background-color: #695d66;
        left: -50%;
        top: 66.6%;
        z-index: 3;
    }
    .mi6
    {
        width: 50%;
        height: 33.3%;
        background-color: #332b23;
        left: -50%;
        top: 66.6%;
        z-index: 2;
    }

    .contact-header 
    {
        font-size: 12px;
    }
    .client-header 
    {
        font-size: 28px;
    }
    .client-box 
    {
        background-size: 50% auto;
    }
    .small-type 
    {
        width: 210px;
        padding: 10px 10px;
    }
    .project-nav {
        margin-top: 20px;
    }
    .film-btn, .stills-btn, .tv-btn 
    {
        width: 90px;
        height: auto;
        border: none;
        margin: 0px 10px 0px 10px;
        background-color: transparent;
    }
    .pn-wrapper 
    {
        padding-top: 10px;
    }
    .section-content-box .i2 h1 
    {
        font-size: 40px;
    }
    .section-content-box .i2 
    {
        width: 65%;
        padding: 0px 0px 10px 0px;
    }  
    .section-content-box .i3 p 
    {
        width: 75%;
        font-size: 12px;
        margin-bottom: 15px;
        padding: 0;
    }
    .sfs4 h1
    {

        font-size: 32px;
        margin-left:40px;
        letter-spacing:25px;
    }
    .sfs5 h1
    {

        font-size: 32px;
        margin-left:40px;
        letter-spacing:25px;

    }
    .project-nav li 
    {
        font-size: 14px;
        width: 56px;
    }
    .section-content-box .i1 h1 
    {
        font-size: 32px;
    }
    .section-content-box .i2a h1 
    {
        font-size: 32px;
        margin-bottom: 20px;
    }
    .sfs1
    {
        letter-spacing:15px;
    }
    .sfs2
    {
        letter-spacing:10px;
        margin-left:-6px;
    }
    .sfs3
    {
        letter-spacing:2px;
        font-weight: 500;
        font-size: 10px !important;
    }
    
    .small-type h3 
    {
        font-size: 11px;
    }
    
}
/* Desktop (450) */
@media screen and (max-width: 450px)
{
    
    .close-menu 
    {
        width: 55px;
        height: 55px;
    }
    .btn-hl, .btn-hl2, .btn-hl3
    {
        width: 30px;
        height: 30px;
        left: 5px;
        margin-left: 0px;
    }
    .btn-hr, .btn-hr2, .btn-hr3
    {
        width: 30px;
        height: 30px;
        right: 5px;
        margin-right: 0px;
    }
    
    .film-btn, .stills-btn, .tv-btn 
    {
        width: auto;
        height: auto;
        border: none;
        margin: 0px 15px 0px 15px;
        background-color: transparent;
    }
    .pn-wrapper 
    {
        padding-top: 10px;
    }
    .section-content-box .i2 
    {
        width: 100%;
    }  
    
    .section-content-box .i2 h1 
    {
        display: inline-block;
        width: 100%;
        font-size: 28px;
        letter-spacing: 1px;
        line-height: 1.2em;
    }
    
    .kaap-logo img
    {
        width: 90px;
    }
    .social-icons
    {
        display: none;
    }
    .section-content-box .i1 h1 
    {
        font-size: 30px;
        letter-spacing: 5.5px;
    }
    .section-content-box .i2a h1 
    {
        font-size: 30px;
        letter-spacing: 2.4px;
        margin-bottom: 10px;
    }
    .section-content-box .i1 
    {
        padding: 0px 0px 0px 0px;
    }
    .sfs1
    {
        letter-spacing:10px;
    }
    .sfs2
    {
        letter-spacing:7px;
        margin-left:-2px;
    }
    .sfs3
    {
        letter-spacing:2px;
        font-weight: 500;
        font-size: 10px;
    }
    .sfs4 h1
    {
        margin-left: 0;
        font-size: 32px;
        letter-spacing:5px;
    }
    .sfs5 h1
    {

        font-size: 32px;
        letter-spacing:5px;
        margin-left: 0;
    }
    .project-nav li 
    {
        font-size: 10px;
        width: auto;
    }
}
/* Desktop (320) */
@media screen and (max-width: 320px)
{
    .section-content-box .i2 h1 
    {
        font-size: 22px;
        line-height: 1.1em;
    }
    .section-content-box .i3 p 
    {
        font-size: 12px;
        margin-bottom: 10px;
    }
}