#rgb_macro {
    background: url("../images/rgb_macro_1920.jpg") center no-repeat;
    height: 1268px;
}

#rgb_macro .frame {    
    position: absolute;
    left: 0px;
    top: 220px;
    width: 540px;
}                  
#rgb_macro .frame2 {   
    position: absolute;
    left: 0px;
    top: 716px;
    width: 530px;
}   
@media screen and (max-width: 1366px) {
    #rgb_macro {
        background: url("../images/rgb_macro_1366.jpg") center no-repeat;
        height: 960px;
    }
        #rgb_macro .frame {
            left: 30px;
            top: 142px;
            width: 394px;
        }

        #rgb_macro .frame2 {
            left: 30px;
            top: 570px;
            width: 360px;
        }   
    #rgb_macro h3 {
        line-height: 1.2;
    }
}

@media screen and (max-width: 960px) {
    #rgb_macro {
        background: url("../images/rgb_macro_960.jpg") center no-repeat;
        height: 1250px;
    }
    #rgb_macro .frame, #rgb_macro .frame2{                      
        position: static;
        text-align: center; 
        width: auto;        
        margin: 0 20px;  
    }

    #rgb_macro .frame {
        padding-top: 80px;  
    }   
    #rgb_macro .frame2 {
        padding-top: 780px;
    }
}

@media screen and (max-width: 640px) {
    #rgb_macro {
        background: url("../images/rgb_macro_640.jpg") center no-repeat;
        height: 979px;
    }    
    #rgb_macro .frame, #rgb_macro .frame2{ 
        margin: 0 16px;  
    }
	#rgb_macro .frame {
        padding-top: 60px;  
    }   
    #rgb_macro .frame2 {
        padding-top: 520px;
    }
}