@font-face {font-family: 'Cuprum'; font-style: normal; font-weight: 400; src: local('Cuprum'), local('Cuprum-Regular'), url(../fonts/cuprum.woff2) format('woff2');}
@font-face {font-family: 'Cuprum'; font-style: normal; font-weight: 700; src: local('Cuprum Bold'), local('Cuprum-Bold'), url(../fonts/cuprum-bold.woff2) format('woff2');}


* {margin: 0; padding: 0; border: 0;}
a:hover, a:focus, a:active {outline: none; -moz-outline-style: none;}
a {text-decoration: none; color: #999;}
img {width: auto; max-width: 100%; height: auto;}
span.italic {font-style: italic;}


body {font-family: Cuprum,'trebuchet MS', verdana, helvetica, sans-serif; background: #04217b url(../elem/gradient-invert.gif);}

div.preload {display: none;}

div.main {position: fixed; top: 15px; right: 14px; bottom: 15px; left: 14px; background: #666 url(../elem/noise.gif); border: 1px solid #ff0; border-radius: 11px;}

div.logo {position: fixed; top: 0; right: 0; bottom: 0; left: 0;}

p.copy {position: fixed; bottom: 22px; left: 24px; font-size: 15px; color: #ff0;}



/*  responsive  */

@media (max-width: 840px)
{
div.main {top: 10px; right: 10px; bottom: 10px; left: 10px;}
p.copy {bottom: 21px; left: 23px;}
}

@media (max-width: 780px)
{
div.main {top: 9px; right: 9px; bottom: 9px; left: 9px;}
p.copy {bottom: 21px; left: 23px;}
}

@media (max-width: 720px)
{
div.main {top: 8px; right: 8px; bottom: 8px; left: 8px;}
p.copy {bottom: 20px; left: 22px;}
}

@media (max-width: 600px)
{
div.main {top: 7px; right: 7px; bottom: 7px; left: 7px;}
p.copy {bottom: 19px; left: 20px; font-size: 14px;}
}

@media (max-width: 480px)
{
div.main {top: 6px; right: 6px; bottom: 6px; left: 6px;}
p.copy {bottom: 18px; left: 19px; font-size: 14px;}
}

@media (max-width: 360px)
{
div.main {top: 5px; right: 5px; bottom: 5px; left: 5px;}
p.copy {bottom: 17px; left: 18px; font-size: 14px;}
}

/*  end responsive  */




/*  [ gromedia.net/cssjs/gromedia_v02.css | 221122 ]  */