@charset"utf-8";
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) { 
/* CSS Document */

	*{margin:0px; padding:0px;}
body {margin:0px; padding:0px; color: white; font-family: Helvetica, Arial, sans-serif; background-color: silver; background-image: url(../images/background arrogant.jpg); background-color:#9f0102; background-attachment: ; background-position: center; width: auto; height: auto;   
-webkit-background-size: auto;
        -moz-background-size: auto;
        -o-background-size: auto;
        background-size: auto;}
#logo {
    width: 100%;
    height: auto;
    padding: 0px 0px 0px 0px;
}
#logo img {
    width: 90% !important;
    margin: 0px 0px 0px 10px;
}

#navigation {width: 100%;}

#navigation {
    color: silver;
    line-height: 13px;
    list-style-type: none;
    list-style-position: outside;
    float: right;
    margin: 0;
    padding: 0;
    height: auto;
}

#navigation a { color: silver; text-decoration: none; padding: 15px 7px; outline: none 0 ; display:block;}
#navigation a:hover { color: white; text-decoration: none; }
#navigation li {
    font-size: 12pt;
    text-align: center;
    float: left;
    height: auto;
}

#body {
    width: 100%;
    overflow: hidden;
}

.articale{max-width:960px; width:100%; margin:0px auto; height:auto;}

 .section-videos {
    width: 100% !important;
    margin: 30px 0px;
}
 .left-side  {
    width: 100%;
     height: 255px;
    margin-right:0px;
	overflow:hidden;
}
 .right-side {
    width:100%;
    height: 255px;
	overflow:hidden;
    
}


header, section, footer, aside, nav, main, article, figure {
    display: block; 
}


#articles {
    color: white;
    font-weight: bold;
    position: relative;
    left: 0mm;
    margin: 7em auto;
    width: 93%;
    max-width: 960px;
}

.worked{color:#fff !important;}


}

@media only screen and (min-device-width: 480px) and (max-device-width: 640px) {
	
	body {margin:0px; padding:0px; color: white; font-family: Helvetica, Arial, sans-serif; background-color: silver; background-image: url(../images/music_background.jpg); background-color:#9f0102; background-attachment: ; background-position: center; width: auto; height: 100%;   
-webkit-background-size: auto;-moz-background-size: auto;-o-background-size: auto;background-size: auto;}

#logo {
    width: 100%;
    height: auto;
    padding: 0px 0px 0px 0px;
}
#logo img {
    width: 100% !important;
    margin: 0px 0px 0px 0px; 
}

#navigation {width: 100%;}

#navigation {
    color: silver;
    line-height: 5px;
    list-style-type: none;
    list-style-position: outside;
    float: right;
    margin: 0;
    padding: 0;
    height: auto;
	border-bottom: 2px solid #fff;
}

#navigation a { color: silver; text-decoration: none; padding: 15px 23px; outline: none 0 ; display:block;}
#navigation a:hover { color: white; text-decoration: none; }
#navigation li {
    font-size: 12pt;
    text-align: center;
    float: left;
    height: auto;
}

.worked{color:#fff;}
#main {
    border-top: none;
}

.left-side {

    width: 90%;
    height: auto;
    margin: 0px 30px;

}

.right-side{

    width: 90%;
    height: auto;
    margin: 0px 30px;

}


#articles {

    color: white;
    font-weight: bold;
    position: relative;
    left: 0mm;
    margin: 7em auto;
    width: 98%;
    max-width: 960px;

}
   
}