@font-face
{
font-family: "GangsterGrotesk Bold";
src: url("../rogueagent-fonts/GangsterGrotesk-Bold.otf") format("opentype");
src: url("../rogueagent-fonts/gangstergrotesk-bold-webfont.woff") format("woff");
src: url("../rogueagent-fonts/gangstergrotesk-bold-webfont.woff2") format("woff2");
}

@font-face
{
font-family: "GangsterGrotesk Light";
src: url("../rogueagent-fonts/GangsterGrotesk-Light.otf") format("opentype");
src: url("../rogueagent-fonts/gangstergrotesk-light-webfont.woff") format("woff");
src: url("../rogueagent-fonts/gangstergrotesk-light-webfont.woff2") format("woff2");
}

@font-face
{
font-family: "GangsterGrotesk Regular";
src: url("../rogueagent-fonts/GangsterGrotesk-Regular.otf") format("opentype");
src: url("../rogueagent-fonts/gangstergrotesk-regular-webfont.woff") format("woff");
src: url("../rogueagent-fonts/gangstergrotesk-regular-webfont.woff2") format("woff2");
}

body
{
background: url("../imagery/rogue-guitar-background.jpg");
/*-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-position: 0% 0%;
background-attachment: fixed;
background-repeat: no-repeat;*/
background-color: #2f2927;
}

#container
{
background: url("../imagery/stars.png");
background-position: 50% 0%;
background-attachment: fixed;
background-repeat: no-repeat;
clear: both;
margin: auto;
margin-top: 1em;
width: 90%;
}

img
{
max-width: 99%;
}

img.logo
{
float: right;
margin: 6em 0 1em 0;
}

img.logo-home
{
display: block;
margin-right: auto;
margin-left: auto;
padding-bottom: 4em;
}

img.logo-skunk
{
display: block;
margin-right: auto;
margin-left: auto;
padding-top: 4em;
padding-bottom: 1em;
}

img.logotype
{
clear: both;
margin: 1em 0 1em 0;
}


img.inside-logo
{
margin-top: 2em;
}

img.img-right
{
float: right;
margin: .5em;
}

img.img-left
{
float: left;
margin: .5em;
}

img.banner
{
min-width: 110%;
position: relative;
left: -1em;
top: -1em;
}

video
{
max-width: 100%;
}

.bodycopy
{
background: rgba(55,66,68,.4);
padding: .125em 1.5em 1.5em 1.5em;
}

h1
{
font-family: 'GangsterGrotesk Bold', 'Helvetica Neue', Verdana, sans-serif;
font-weight: 900;
font-size: 2.5em;
line-height: 1.1em;
color: rgba(254,254,254,.6);
letter-spacing: .03em;
}

.top-cat
{
padding-top:1em;
}

h2
{
font-family: 'GangsterGrotesk Bold', 'Helvetica Neue', Verdana, sans-serif;
font-size: 2em;
font-weight: 100;
line-height: 1.1em;
color: rgba(254,254,254,.8);
letter-spacing: .03em;
}

h3
{
font-family: 'GangsterGrotesk Regular', 'Helvetica Neue', Verdana, sans-serif;
font-size: 1.75em;
line-height: 1.2em;
margin-top: .75em;
color: rgba(254,254,254,.8);
}

p
{
color: rgba(254,254,254,1);
font-family: 'GangsterGrotesk Light', 'Helvetica Neue', Verdana, sans-serif;
font-weight: 100;
text-shadow: -2px 2px 3px black;
font-size: 1.2em;
line-height: 1.4em;
}

p.caption
{
color: white;
font-family: 'GangsterGrotesk Light', 'Helvetica Neue', Verdana, sans-serif;
font-weight: 100;
font-size: .9em;
font-style: italic;
text-shadow: none;
line-height: 1.4em;
margin: .5em 0 0 1em;
}

ul.portfolio
{
color: rgba(254,254,254,1);
font-family: 'GangsterGrotesk Light', 'Helvetica Neue', Verdana, sans-serif;
font-weight: 100;
text-shadow: -2px 2px 3px black;
font-size: 1.2em;
line-height: 1.4em;
}

a
{
color: #8ce0ff;
text-decoration: none;
}

a: hover
{
color: #20c2fe;
text-decoration: underline;
}

.content
{
float: left;
width: 55%;
}

.sidebar
{
float: right;
width: 40%;
}

/* -- 3 column layout -- */

.three-cols
{
clear: both;
width: 100%;
background-color: transparent;
}

.col-one
{
float: left;
width: 30%;
margin: 1%;
}

.col-one img
{
min-width: 100%;
max-width: 100%;
}

.col-two
{
float: left;
width: 30%;
margin: 1%;
}

.col-two img
{
min-width: 100%;
max-width: 100%;
}

.col-three
{
float: left;
width: 30%;
margin: 1%;
}

.col-three img
{
min-width: 100%;
max-width: 100%;
}

/* -- end 3 column layout -- */

/* -- 2 column layout -- */

.two-cols
{
clear: both;
width: 100%;
}

.two-col-one
{
float: left;
width: 45%;
margin: 1%;
}

.two-col-one img
{
min-width: 100%;
max-width: 100%;
}

.two-col-two
{
float: right;
width: 45%;
margin: 1%;
}

.two-col-two img
{
min-width: 100%;
max-width: 100%;
}

/* -- end 2 column layout -- */

.portfolio-img
{
margin: 1em 0 1em 0;
}

#footer
{
clear: both;
}

/* -- start navigation -- */

#navcontainer
{
margin: 0;
padding: 0;
height: auto;
position: fixed;
left: 0em;
top: 0em;
z-index: 1000;
width: 100%;
}

#navcontainer ul
{
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
}

#navcontainer ul li.portfolio-li
{
font-family: 'GangsterGrotesk Bold', 'Helvetica Neue', Verdana, sans-serif;
background: rgba(223,124,213,.7);
float: right;
text-align: center;
margin: 0em;
width: 20%;
}

#navcontainer ul li.production-li
{
font-family: 'GangsterGrotesk Bold', 'Helvetica Neue', Verdana, sans-serif;
background: rgba(223,124,213,.7);
float: right;
text-align: center;
margin: 0em;
width: 20%;
}

#navcontainer ul li.publicity-li
{
font-family: 'GangsterGrotesk Bold', 'Helvetica Neue', Verdana, sans-serif;
background: rgba(223,124,213,.7);
float: right;
text-align: center;
margin: 0em;
width: 20%;
}

#navcontainer ul li.design-li
{
font-family: 'GangsterGrotesk Bold', 'Helvetica Neue', Verdana, sans-serif;
background: rgba(223,124,213,.7);
float: right;
text-align: center;
margin: 0em;
width: 20%;
}

#navcontainer ul li.contact-li
{
font-family: 'GangsterGrotesk Bold', 'Helvetica Neue', Verdana, sans-serif;
background: rgba(223,124,213,.7);
float: right;
text-align: center;
margin: 0em;
width: 20%;
}

#navcontainer ul li a
{
background: transparent;
border: none;
margin: 0 0;
padding: 1em;
color: #000;
text-decoration: none;
display: block;
text-align: center;
font: bold .75em/1em 'GangsterGrotesk Bold', 'Helvetica Neue', Arial, Helvetica, sans-serif;
}

#navcontainer ul li a:hover
{
font-family: 'GangsterGrotesk Bold', 'Helvetica Neue', Verdana, sans-serif;
color: #fff;
padding: 1em;
background: rgba(0,236,22,.5);
}

#navcontainer a:active
{
font-family: 'GangsterGrotesk Bold', 'Helvetica Neue', Verdana, sans-serif;
background: #fff;
padding: 1em;
margin: 0 0;
color: black;
}

#navcontainer li#active a
{
background: #fff;
padding: 1em;
margin: 0 0;
color: black;
}

/* -- end navigation -- */


/* -- video container -- */

.video-container
{
background: rgba(1,1,1,.4);
padding: 1em;
margin-bottom: .75em;
}

.video-container h5
{
margin-top: .25em;
margin-bottom: .5em;
}

.video-container video
{
display: block;
margin: 1em auto 1em auto;
}


/* -- end video container -- */

/* paypal-form */
input
{
max-width: 99%;
}

/* paypal-form */