@font-face {
    font-family: 'cantarellregular';
    src: url('/assets/fonts/Cantarell-Regular-webfont.eot');
    src: url('/assets/fonts/Cantarell-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/assets/fonts/Cantarell-Regular-webfont.woff') format('woff'),
         url('/assets/fonts/Cantarell-Regular-webfont.ttf') format('truetype'),
         url('/assets/fonts/Cantarell-Regular-webfont.svg#cantarellregular') format('svg');
    font-weight: normal;
    font-style: normal;

}



BODY { font-family:"cantarellregular","Arial","Trebuchet MS",Lucida Sans,Tahoma,Helvetica,sans-serif; font-size: 13px; letter-spacing: -0.2px; color: #292929; margin: 10px 0px 10px 0px; line-height:18px; -webkit-font-smoothing: antialiased;}

HR {height:1px;width:70%;border: 1px solid #FF7777;margin-top:5px;margin-bottom:5px;}

IFRAME { border:none; overflow:hidden; background-color: transparent; }

A
{
	color: #CCCCCC; font-weight: normal; text-decoration: none; outline: 0;
}
A:hover {color: #E0E0E0; text-decoration: underline;}

INPUT
{
	background-color: #666666;
	border : 1px outset #cc4444;
	color: #ffffff;
	font-size: 9px;
}
.check {
	margin: 0;
	padding: 0px;
	height: auto;
	width: auto;
	border: medium none #cc4444;
	background-color: #777777;

}




.Qsonics {
	font-weight: normal; color: #B02222; text-shadow: 0.6px 0px 0 #D04444; letter-spacing: 0.2px;
}
.RedHighlight {
	font-weight: normal; color: #B02222; text-shadow: 0.6px 0px 0px #AA3333;
}
.highlight {
	color: #000000; text-shadow: 0.6px 0px 0px #888888; letter-spacing: 0.2px;
}

.FBLikeOuter {
        margin:0 5px 0 0;padding:0px;text-align:right;
}

.FBLikeInner {
        overflow:hidden; margin-left:-60px;
}




.QPlayBG {position:absolute;top:40px;left:0px;width:100%;height:40px; box-shadow:4px 8px 10px #888888; -webkit-box-shadow:4px 8px 10px #888888; -moz-box-shadow:4px 8px 10px #888888;}
.QPlayProgress {top:0px;width:0px;height:40px;border-right:2px solid #0000FF;}
.QPlayProgressVal {position:absolute;top:37px;left:0px;color:#000000;font-size:9px;font-family:Arial,sans;text-align:center;}
.QPlayFlags {position:absolute;left:0px;width:100%;top:4px;height:76px;overflow-y:hidden;}
.QPlayFlagStem {border-left:2px dotted #AA2200;width:1px;height:64px;z-index:100;}
.QPlayFlagStemHighlight {border-left:3px solid #AA2200;width:3px;height:60px;z-index:101;}
.QPlayFlag {background-color:#AA2200;font-size:9px;font-family:Arial,sans;font-weight:normal;color:#FFFFFF;padding:0px 5px 2px 5px;text-align:center;vertical-align:middle;cursor:pointer;border-radius: 4px 4px 4px 0px;z-index:102;-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; -ms-user-select: none; user-select: none;}
.QPlayFlag:hover {border:2px solid #FFFF00;z-index:103;}
.QPlayFlag:focus {outline: none; }
.QPlayBtn {position:absolute;left:16px;width:40px;top:62px;height:40px;text-align:center;cursor:pointer;-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; -ms-user-select: none; user-select: none;}
.QPlayBtn:focus {outline: none; }
.QPlayStatus {font-family:Arial,sans; font-size: 11px; color:#AA2200;}
.QPlayCopyrightMsg {font-size:10px; color:#555555;}
.QPlayAudio {width:1px;height:1px;visibility:hidden;}


.lightborder {padding-left:10px;padding-right:10px;padding-bottom:2px;background:rgb(255,255,255);background:rgba(255,255,255,0.9);border-radius:6px;}

.CatPanel {
position:absolute;top:230px;left:18px;width:460px;
}

.CatTitle {
cursor:pointer;
margin-bottom: 8px;
font-size:24px;
-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; -ms-user-select: none; user-select: none;
text-shadow:0 1px 0 #FFFFFF; 
}

.CatTitle:hover { box-shadow:4px 4px 4px #FFFFFF; }

.CatDesc {
text-align:center;
vertical-align:middle;
font-size:16px;
-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; -ms-user-select: none; user-select: none;
cursor:pointer;
}

.CatDescHoverMakesTitleGlow {
background-color:black;
box-shadow:2px 2px 4px #FFFFFF;
}

.CatContent {
position:absolute;top:30px;left:250px;width:430px;height:360px;border-radius:6px;padding-top:3px;padding-left:2px;padding-bottom:2px;padding-right:4px;
}

.CatItemHolder {
z-index:10;position:relative;margin:2px;margin-bottom:8px;padding:2px 4px 4px 0px;width:406px;min-height:40px;background-color:#EEEEEE;color:#000000;border-radius:6px;
}

.CatItemTitle {
padding:0px 0px 2px 40px;width:300px;border-radius:6px;font-size:15px;font-weight:normal;
}

.CatItemDesc {
padding:0px 0px 0px 40px;width:295px;font-size:12px;
}

.CatItemBtn {
cursor:pointer;-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; -ms-user-select: none; user-select: none;
}

.CatItemBtn:hover {}

.CatItemBtnStop {
position:absolute;top:0px;left:-2px;width:40px;height:24px;background-image:url('/assets/QStopBtn.png');background-size:40px 40px;
}

.CatItemBtnPlay {
position:absolute;top:0px;left:-2px;width:40px;height:24px;background-image:url('/assets/QPlayBtn.png');background-size:40px 40px;
}

.CatItemBuffer {
position:absolute;top:0px;left:-2px;width:40px;height:24px;background-image:url('/assets/QPlayBtn.png');background-size:40px 40px;
}

.CatItemAvailability {
    position:absolute;top:2px;left:338px;
    padding:1px 1px 2px 1px;line-height:13px;width:64px;background-color:#AA2200;border:2px #AA2200 outset;border-radius:5px;box-shadow:2px 2px 4px rgba(255,255,255,1);color:#FFFFFF;font-size:10px;font-weight:normal;text-align:center;cursor:pointer;border:2px #FFFFFF outset;
    -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; -ms-user-select: none; user-select: none;
}

.CatItemAvailability:hover {border:2px #000000 outset;}


.BottomLeftPlayer {
    position: fixed;
    bottom: 0px;
    left: -2px;
    width: 280px;
    padding: 4px 3px 2px 12px;
    border-radius: 0px 10px 0px 0px;
    box-shadow: 2px -2px 2px rgba(170,34,0,0.7);
    background: rgb(240,240,240); background: rgba(240,240,240,0.9);
    color: #AA2200; font-size: 12px; font-weight:normal;
    line-height:10px;
    text-align: left;
    z-index:9990;
    cursor:pointer;
}

.BottomLeftPlayer.active {
    background: #ffffff; background: rgba(255,255,255,1);
    box-shadow: 6px -6px 8px rgba(170,34,0,0.7);
    }


#BottomLeftPlayer_Aud {
    width:1px;height:1px;visibility:hidden;
}

#BottomLeftPlayer_BtnHolder {text-align:center;float:left;top:0px;left:2px;width:40px;height:40px;cursor:pointer;-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; -ms-user-select: none; user-select: none;}

#BottomLeftPlayer_Random { display:none; }

#BottomLeftPlayer_Title { margin-top:4px; }


#ContactShort {
    position: fixed;
    right: 0;
    bottom: 0;
    padding-top: 4px;
    padding-left: 8px;
    padding-right: 10px;
    padding-bottom: 10px;
    border-radius: 10px 0px 0px 0px;
    line-height:16px;
    background-color: #AA2200; color: #ffffff; font-size: 14px;
    z-index:9999;
    text-shadow:0 1px 0 #FFFFFF; 
}

#FloatyMenu {
    position: fixed;
    left: 0px;
    top: 400px;
    height: 30px;
    padding-top: 14px;
    padding-left: 8px;
    padding-right: 8px;
    padding-bottom: 20px;
    margin: 0px;
    border-radius: 0px 10px 0px 0px;
    box-shadow:2px -1px 2px rgba(170,34,0,0.7);
    background: rgb(240,240,240); background: rgba(240,240,240,0.7); color: #AA2200; font-size: 16px; font-weight:600;
    z-index:8000;
    text-shadow:0 1px 0 #FFFFFF; 
}

.FloatyMenuLink {
    display: inline;
    cursor: pointer;
    background: rgb(240,240,240); background: rgba(240,240,240,0.7);
    border: 2px outset #F4F4F4;
    border-radius: 4px 4px 4px 4px;
    margin-bottom: 10px;
    padding-right: 4px;
    text-shadow:0 1px 0 #FFFFFF; 
}

.FloatyMenuLink:hover {
    background: rgb(208,160,160);
}

#LogoTopLeft {
    display:none;z-index:9999;position:fixed;top:0px;left:0px;width:290px;height:230px;background:url('assets/QLogo_Red_TEST.png') no-repeat;background-position:0px 0px;
    cursor: pointer;
}

@media only screen and (min-width: 0px) and (max-width: 299px) {
#LogoTopLeft {
background-size:42% 42%;
}
}

@media only screen and (min-width: 300px) and (max-width: 699px) {
#LogoTopLeft {
background-size:60% 60%;
}
}

@media only screen and (min-width: 700px) {
#LogoTopLeft {
background-size:90% 90%;
}
}



#LogoText {
    display:none;z-index:9998;position:fixed;top:160px;left:18px;padding-top:2px;color:#000000;text-align:center;text-shadow:1px 0px 0px #000000;font-size:12px;
    text-shadow:0 1px 0 #FFFFFF; 
    cursor: pointer;
}

#LogoBG {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width:240px;
    height:68px;
    border-radius: 0px 0px 10px 0px;
    box-shadow:2px 2px 2px rgba(170,34,0,0.7);
    background: rgb(255,255,255); background: rgba(255,255,255,0.95);
    z-index:9990;
    cursor: pointer;
}

.PromiseCover {
    position:absolute;left:310px;top:14px;width:0px;opacity:0.1;overflow:hidden;
}

@media only screen and (min-width: 0px) and (max-width: 700px) {
.PromiseCover {
    position:absolute;left:310px;top:14px;width:0px;opacity:0.1;overflow:hidden;
}
}

.Promise {
    width:420px;
    line-height:19px;color:#000000;font-size:15px;
    text-shadow:0 1px 0 #FFFFFF; 
    margin:0px;
    padding:0px 0px 0px 0px;
    -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; -ms-user-select: none; user-select: none;
}

.PromiseLink {
    text-decoration: underline;
    cursor: pointer;
}

.PromiseLink:hover {
    color:#aa2200;
}

.PromiseMore {
    padding:0px 10px 0px 0px;
    text-decoration: none;
    text-align:right;font-size:12px;padding-right:10px;
}

#PanelOuter {
    position: absolute;
    left: 0px;
    top: 10000px;
    background-color: #e0e0e0;
    margin:0px;
    padding: 0px 0px 0px 0px;
}

#PanelInner {
    position: relative;
    margin: 0px;
    padding: 0px 20px 40px 20px;
    background-image: url(/assets/QGreyQ5.png);
}

#PanelBottom {
    width: 100%;
    background-color: #e0e0e0;
    box-shadow:0px -1px 2px rgba(170,34,0,0.7);
    margin-top: 0px;
}

#PanelIntro {
color: #FFFFFF; 
margin: 0px;
padding: 66px 10px 0px 10px; 
border-top:2px #FF2222 solid; border-bottom:3px #BB0000 solid;
box-shadow:0px 6px 16px rgba(96,0,0,0.4);
background-color:#BB3311;text-align:center;padding-bottom:20px;
font-size:12px;
line-height:18px;
-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; -ms-user-select: none; user-select: none;
}

.PanelIntroBreak {height:6px;min-height:6px;font-size:6px;}

.roundedbox
{
background-color: #FFFFFF; 
margin-top: 30px;
text-align:left;
padding: 10px 20px 20px 20px; border-top:2px #FF2222 solid; border-bottom:3px #BB0000 solid;
border-radius:30px 0px 30px 0px;
box-shadow:6px 4px 16px rgba(96,0,0,0.4);
}

.roundedbox:hover {background-color:#FFFFFF; border-top:2px #FF7777 solid; border-bottom:3px #EE5555 solid; box-shadow:6px 4px 12px rgba(96,0,0,1)}

.SectionTitle
{
color:#AA2200;
font-size:22px; font-weight:normal;
left: 0; text-align:left; vertical-align:middle;
cursor:pointer;
padding: 3px 0px 5px 10px;
letter-spacing: 0.2px;
margin:10px 0px 20px 0px;
}

.SectionHead {
    padding-top: 22px;
    padding-bottom:50px;
}

.ProjectBlock
{
background-color:#FFEEEE;background:rgba(255,240,240,0.9);text-align:left;color:#000000;font-size:13px;margin-bottom:10px;padding:3px 30px 10px 4px;border:1px ridge #CC4422;border-radius: 10px;
}

.ProjectMedia
{
float:right;padding:0px;margin-left:20px;z-index:20;
}

.ProjectTitle
{
background-color:#AA2200;background:rgba(160,24,0,0.8);color:#ffffff;padding:1px 8px 3px 4px;font-size:15px;border-radius:6px;text-shadow:0px -0.5px 0px #444444; letter-spacing: 0.2px;
z-index:10;
}

.ProjectText
{
margin-left:8px;margin-top:20px;
}

.ProjectVideoHolder
{
width:320px;height:180px;cursor:pointer;margin-bottom:20px;
}

.ProjectVideoInnerHolder
{
width:320px;height:180px;margin:0px;padding:0px;border:2px outset #AA0000;box-shadow:2px 2px 4px #FFFFFF;cursor:pointer;
}

.ProjectVideoStatus
{
font-size:12px;overflow:hidden;text-align:right;
}

.ProjectVideoObject
{
margin:0; padding:0; border:0;
}

.ProjectAudioHolder
{
height:70px;margin-bottom:20px;position:relative;
}









.parabrk {height:7px;min-height:7px;font-size:7px;}
.parabrk:after {content: '.'; visibility: hidden;}

.parabrkdbl {height:15px;min-height:15px;font-size:15px;}
.parabrkdbl:after {content: '.'; visibility: hidden;}

.seealso
{
display:inline-block; cursor:pointer;
font-size:14px; font-weight:normal;
left: 0; text-align:right; vertical-align:middle;
height:20px;padding-top:4px; padding-bottom:4px; padding-left:16px; padding-right:16px;
color:#ffffff;background-color:#B03030;
border-radius: 6px 46px 6px 46px;
-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; -ms-user-select: none; user-select: none;
text-shadow: 1px 1px 0 #202020;
box-shadow:0 4px 12px rgba(50,50,50,0.7);
}
.seealso:hover {background-color:#cc0000;}

