body { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; font-family: 'Open Sans'; font-size: 12pt; color: #888888; background-color: #000000; outline: 0; } h1 { font-size: 24pt; font-family: 'Open Sans Condensed Bold'; color: #FE9800; display: table; position: relative; margin: 16px 0px 16px 0px; } h2 { font-size: 22pt; font-family: 'Open Sans Condensed Bold'; color: #FE9800; display: table; position: relative; margin: 16px 0px 16px 0px; } h3 { font-size: 20pt; font-family: 'Open Sans Condensed Bold'; color: #FE9800; display: table; position: relative; margin: 16px 0px 16px 0px; } h4 { font-size: 18pt; font-family: 'Open Sans Condensed Bold'; color: #FE9800; display: table; position: relative; margin: 16px 0px 16px 0px; } h5 { font-size: 16pt; font-family: 'Open Sans Condensed Bold'; color: #FE9800; display: table; position: relative; margin: 16px 0px 16px 0px; } h6 { font-size: 14pt; font-family: 'Open Sans Condensed Bold'; color: #FE9800; display: table; position: relative; margin: 16px 0px 16px 0px; } p { font-family: 'Open Sans'; font-size: 13pt; color: #888888; display: table; position: relative; margin: 16px 0px 16px 0px; } a:link, a:visited { font-family: 'Open Sans'; color: #FE9800; } a:hover { opacity: 0.75; } a, img, img:hover, input[type="submit"], input[type="submit"]:hover, button, button:hover { transition: all 0.3s ease; -webkit-transition: all 0.3s; outline: 0px; } .verticallyCenterContent { display: table-cell; vertical-align: middle; } .redAsterisk { color: #ff0000; } header { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; z-index: 9000; background-color: #000000; background-image: linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0.15)); border-top: 3px solid #FE9800; border-bottom: 1px solid #575757; } #headerContainer { width: 1140px; height: auto; position: relative; display: table; margin: 0px auto 0px auto; padding: 0px 0px 0px 0px; } #logo { float: left; width: 31%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #logo a:link, #logo a:visited {} #logo a:hover {} #logo img { float: left; width: auto; height: 96px; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 16px 0px 16px 0px; } #logo a:hover { opacity: 1; } #slogan { float: left; width: 39%; height: 128px; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; overflow: hidden; } div#slogan p { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; color: #888888; font-size: 16pt; font-family: 'Open Sans Condensed Bold'; } #headerButtons { float: left; width: 30%; height: 128px; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; overflow: hidden; } #headerButtons ul { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; list-style-type: none; text-align: right; font-size: 0pt; } #headerButtons li { display: inline-block; position: relative; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #headerButtons a:link, #headerButtons a:visited { background-image: linear-gradient(#C47806,#FE9800); color: #292F33; text-decoration: none; margin: 0px 8px 0px 0px; padding: 8px 16px 8px 16px; border-radius: 3px; text-transform: uppercase; font-family: 'Open Sans Condensed'; letter-spacing: 2px; font-weight: bolder; font-size: 16pt; border-top: 1px solid #FFBF00; border-left: 1px solid #C77A07; border-right: 1px solid #C77A07; border-bottom: 1px solid #C77A07; } #headerButtons a:hover {} #headerButtons li:last-of-type a:link, #headerButtons li:last-of-type a:visited { margin: 0px 0px 0px 0px; } main { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; background-color: #000000; z-index: 8000; } #mainContainer { width: 1140px; height: auto; position: relative; display: table; margin: 0px auto 0px auto; padding: 0px 0px 0px 0px; } #mainContainer p:last-of-type { margin: 16px 0px 32px 0px; } #buttons { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 8px 0px 16px 0px; text-align: center; } #buttons ul { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; list-style-type: none; text-align: center; font-size: 0pt; text-align: center; } #buttons p { width: 100%; position: relative; display: table; margin: 0px auto 0px auto !important; padding: 0px 0px 0px 0px; text-align: center; } #buttons p a:link, #buttons p a:visited { width: 94%; position: relative; display: table; background-image: linear-gradient(#C47806,#FE9800); color: #292F33; text-decoration: none; margin: 0px auto 20px auto; padding: 16px 0px 16px 0px; border-radius: 3px; text-transform: uppercase; font-family: 'Open Sans Condensed Bold'; font-size: 22pt; border-top: 2px solid #FFBF00; border-left: 2px solid #C77A07; border-right: 2px solid #C77A07; border-bottom: 2px solid #C77A07; letter-spacing: -2px; } #buttons p a:hover {} #buttons ul li { float: left; width: 33.333%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #buttons ul li span { display: block; font-family: 'Open Sans Condensed'; font-weight: normal; font-size: 14pt; letter-spacing: 0px; margin: -4px 0px 0px 0px; padding: 0px 0px 0px 0px; } footer { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; border-top: 1px solid #575757; z-index: 7000; } #footerStripe-one { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; background-color: #262626; border-bottom: 1px solid #000000; } #footerContainer-one { width: 1140px; height: auto; position: relative; display: table; margin: 0px auto 0px auto; padding: 0px 0px 0px 0px; } #footerLeft { float: left; width: 86%; height: 58px; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; overflow: hidden; } #footerLeft ul { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; list-style-type: none; font-size: 0pt; } #footerLeft li { display: inline-block; position: relative; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #footerLeft ul li p { display: inline-block; position: relative; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #footerLeft ul li p:after { content: '\00a0\00a0/\00a0\00a0'; opacity: 0.25; } #footerLeft ul li:last-of-type p:after { content: ''; } #footerLeft ul li a:link, #footerLeft ul li a:visited { text-decoration: none; font-size: 11pt; } #footerLeft ul li a:hover { text-decoration: underline; } #footerRight { float: left; width: 14%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; text-align: right; } div#footerRight img { float: right; width: auto; height: 42px; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 8px 0px 8px 0px; opacity: 0.5; } #footerStripe-two { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; background-color: #151515; } #footerContainer-two { width: 1140px; height: auto; position: relative; display: table; margin: 0px auto 0px auto; padding: 0px 0px 0px 0px; } #footerBoxes { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 16px 0px 16px 0px; } #footerBoxes h3 { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 8px 0px; padding: 0px 0px 0px 0px; font-size: 16pt; } #footerBoxes p { float: left; width: 98%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; font-size: 11pt; } #footerBox-one { float: left; width: 40%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #footerBox-two { float: left; width: 20%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } div#footerBox-two ul { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; list-style-type: none; font-size: 0pt; } div#footerBox-two li p:before { content: '\00a0\00a0>\00a0\00a0'; font-size: 8pt; opacity: 0.5; } #footerBox-two a:link, #footerBox-two a:visited { text-decoration: none; } #footerBox-two a:hover { text-decoration: underline; } #footerBox-three { float: left; width: 40%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #footerBox-three p { width: 100% !important; } #footerStripe-three { width: 1140px; height: auto; position: relative; display: table; margin: 0px auto 0px auto; padding: 0px 0px 0px 0px; } #footerContainer-three { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #copyright { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; text-align: center; } div#copyright p { position: relative; display: table; margin: 0px auto 0px auto; padding: 32px 0px 32px 0px; font-size: 10pt; text-align: center; } /* Comment Policy */ #commentPolicyP { margin: 16px 0px 16px 0px !important; } #commentPolicy p { margin: 0px 0px 0px 0px !important; } #commentPolicy li:last-of-type p { margin: 0px 0px 32px 0px !important; } /* Terms & Conditions & Privacy Policy */ .termsListFix p { margin: 0px 0px 0px 0px !important; } /* Contact Us */ .contactPFix { margin: 16px 0px 16px 0px !important; } #contactForm { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 32px 0px; padding: 0px 0px 0px 0px; } #contactForm label { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; font-weight: bolder; font-size: 11pt; } #contactForm input[type="text"], #contactForm input[type="email"] { float: left; width: 92%; position: relative; display: table; margin: 0px 0px 16px 0px; padding: 8px 16px 8px 16px; font-family: 'Open Sans'; font-size: 12pt; color: #888888; background-color: #262626; border-radius: 3px; border-top: 1px solid #575757; border-left: 1px solid #151515; border-right: 1px solid #151515; border-bottom: 1px solid #151515; } #contactForm-name { float: left; width: 50%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #contactForm-email { float: left; width: 50%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #contactForm-subject { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #contactForm-subject input { width: 96% !important; } #contactForm-body { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #contactForm-body textarea { float: left; width: 96%; height: 256px; position: relative; display: table; margin: 0px 0px 16px 0px; padding: 8px 16px 8px 16px; font-family: 'Open Sans'; font-size: 12pt; color: #888888; background-color: #262626; border-radius: 3px; border-top: 1px solid #575757; border-left: 1px solid #151515; border-right: 1px solid #151515; border-bottom: 1px solid #151515; } #contactForm-submit { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #contactForm-submit input[type="submit"] { background-image: linear-gradient(#c47806,#fe9800); color: #292f33; margin: 0px 0px 0px 0px; padding: 8px 16px 8px 16px; border-radius: 3px; text-transform: uppercase; font-family: 'Open Sans Condensed'; letter-spacing: 2px; font-weight: bolder; font-size: 16pt; border-top: 1px solid #ffbf00; border-left: 1px solid #c77a07; border-right: 1px solid #c77a07; border-bottom: 1px solid #c77a07; } #contactForm-submit input[type="submit"]:hover { cursor: pointer; opacity: 0.75; } /* Contact Send Form */ .centerSend { text-align: center; display: block; } #sendSpinner { width: 50%; height: auto; display: block; position: relative; margin: 0px auto 0px auto; } /* Insult Pages */ #insultHeader-left { float: left; width: 75%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #insultHeader-right { float: left; width: 25%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } div#insultHeader-right ul { float: left; width: 100%; position: relative; display: table; margin: 24px 0px 0px 0px; padding: 0px 0px 0px 0px; list-style-type: none; } div#insultHeader-right li { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; text-align: right; } div#insultHeader-right p { display: block; position: relative; text-align: right; margin: 0px 0px 0px 0px !important; padding: 0px 0px 0px 0px; } div#insultHeader-right a:link, div#insultHeader-right a:visited { background-image: linear-gradient(#c47806,#fe9800); color: #292f33; text-decoration: none; margin: 0px 8px 0px 8px; padding: 8px 16px 8px 16px; border-radius: 3px; text-transform: uppercase; font-family: 'Open Sans Condensed'; letter-spacing: 2px; font-weight: bolder; font-size: 16pt; border-top: 1px solid #ffbf00; border-left: 1px solid #c77a07; border-right: 1px solid #c77a07; border-bottom: 1px solid #c77a07; } div#insultHeader-right a:hover {} #insultBlurb { float: left; width: 100%; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } #insultBlurb p { margin: 0px 0px 32px 0px !important; } #playInsult { position: absolute; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; left: 8px; top: 8px; z-index: 7900; } div#playInsult button { font-family: 'Open Sans Condensed'; letter-spacing: 2px; font-size: 16pt; text-transform: uppercase; border-radius: 3px; font-weight: bolder; color: #888888; background-image: linear-gradient(#000000,#262626); border-top: 1px solid #575757; border-left: 1px solid #000000; border-right: 1px solid #000000; border-bottom: 1px solid #000000; margin: 0px 0px 0px 0px; padding: 4px 8px 4px 8px; } div#playInsult button:hover { cursor: pointer; opacity: 0.85; } #insult { width: 98%; height: auto; position: relative; display: table; margin: 0px auto 32px auto; padding: 0px 0px 0px 0px; background-image: linear-gradient(#C57806,#FD9800); text-align: center; border-radius: 3px; border-top: 4px solid #ffbf00; border-left: 4px solid #c77a07; border-right: 4px solid #c77a07; border-bottom: 4px solid #c77a07; z-index: 7800; } #insult textarea { float: left; width: 100%; height: 87px; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 32px 0px 32px 0px; border: 0px; background-color: transparent; text-align: center; resize: none; font-family: 'Open Sans Condensed Bold'; font-size: 42pt; letter-spacing: -1px; text-transform: uppercase; color: #282f33; overflow: hidden; } #insult textarea:hover { cursor: default; } #insult textarea:active { outline: 0px; } #downArrow { float: left; width: 100%; position: absolute; display: table; margin: -164px 0px 0px 0px; padding: 0px 0px 0px 0px; z-index: 7700; } #downArrow span { position: relative; display: table; color: #C77A07; font-family: 'Open Sans'; font-size: 128pt; margin: 0px 0px 0px 320px; padding: 0px 0px 0px 0px; -webkit-transform: scaleX(-1); -moz-transform: scaleX(-1); -o-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; } #insultGuy { float: left; width: 100%; height: 800px; position: relative; display: table; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; background-repeat: no-repeat; background-position: center top; background-size: 65% auto; opacity: 0.75; z-index: 7600; } @media (min-width: 551px) and (max-width: 1150px) { h1 { font-size: 18pt; } h2 { font-size: 16pt; } h3 { font-size: 14pt; } p { font-size: 12pt; } #headerContainer { width: 96%; } #logo { width: 100%; } #logo img { float: none; width: 50%; height: auto; margin: 0px auto 0px auto; } #slogan { width: 100%; height: auto; margin: -12px 0px 0px 0px; text-align: center; } div#slogan p { font-size: 13pt; } #headerButtons { width: 100%; height: auto; } #headerButtons ul { text-align: center; margin: 16px 0px 24px 0px; } #headerButtons li a:link, #headerButtons a:visited { font-size: 12pt; } #mainContainer { width: 96%; } #buttons ul li { width: 50%; } #buttons p a:link, #buttons p a:visited { font-size: 18pt; } #buttons ul li span { font-size: 12pt; } #footerContainer-one { width: 96%; } #footerLeft { display: none; } #footerRight { width: 100%; text-align: center; } div#footerRight img { float: none; margin: 0px auto 0px auto; } #footerContainer-two { width: 96%; } #footerBox-one { width: 100%; } #footerBox-two { width: 100%; } #footerBox-two h3 { margin: 8px 0px 8px 0px; } #footerBox-three { width: 100%; } #footerBox-three h3 { margin: 8px 0px 8px 0px; } #footerBox-three p { margin: 0px 0px 8px 0px; } #footerStripe-three { width: 96%; } /* Contact Page */ form#contactForm input[type="text"], form#contactForm input[type="email"] { float: none; width: 80%; margin: 0px auto 16px auto; } #contactForm-name { width: 100%; text-align: center; } #contactForm-email { width: 100%; text-align: center; } #contactForm-subject { width: 100%; text-align: center; } div#contactForm-subject input { width: 80% !important; } #contactForm-body { width: 100%; text-align: center; } #contactForm-body textarea { float: none; width: 80%; margin: 0px auto 16px auto; } #contactForm-submit { text-align: center; } /* Insult Pages */ #insultHeader-left { width: 100%; } #insultHeader-right { width: 100%; } div#insultHeader-right ul { margin: 0px 0px 16px 0px; } div#insultHeader-right li { text-align: left; } div#insultHeader-right p { text-align: left; } #insult textarea { height: auto; margin: 0px 0px -32px 0px; padding: 48px 0px 48px 0px; font-size: 20pt; line-height: 32px; } #insultGuy { height: 480px; background-size: 420px auto; } #downArrow { margin: -190px 0px 0px 0px; } #downArrow span { margin: 0px 0px 0px 64px; } } @media (min-width: 1px) and (max-width: 550px) { h1 { font-size: 16pt; } h2 { font-size: 14pt; } h3 { font-size: 12pt; } p { font-size: 11pt; } #headerContainer { width: 96%; } #logo { width: 100%; } #logo img { float: none; width: 100%; height: auto; margin: 0px auto 0px auto; } #slogan { width: 100%; height: auto; margin: -12px 0px 0px 0px; text-align: center; } div#slogan p { font-size: 13pt; } #headerButtons { width: 100%; height: auto; } #headerButtons ul { text-align: center; margin: 16px 0px 24px 0px; } #headerButtons li a:link, #headerButtons a:visited { font-size: 12pt; } #mainContainer { width: 96%; } #buttons ul li { width: 100%; } #buttons p a:link, #buttons p a:visited { font-size: 18pt; } #buttons ul li span { font-size: 12pt; } #footerContainer-one { width: 96%; } #footerLeft { display: none; } #footerRight { width: 100%; text-align: center; } div#footerRight img { float: none; margin: 0px auto 0px auto; } #footerContainer-two { width: 96%; } #footerBox-one { width: 100%; } #footerBox-two { width: 100%; } #footerBox-two h3 { margin: 8px 0px 8px 0px; } #footerBox-three { width: 100%; } #footerBox-three h3 { margin: 8px 0px 8px 0px; } #footerBox-three p { margin: 0px 0px 8px 0px; } #footerStripe-three { width: 96%; } /* Contact Page */ form#contactForm input[type="text"], form#contactForm input[type="email"] { float: none; width: 80%; margin: 0px auto 16px auto; } #contactForm-name { width: 100%; text-align: center; } #contactForm-email { width: 100%; text-align: center; } #contactForm-subject { width: 100%; text-align: center; } div#contactForm-subject input { width: 80% !important; } #contactForm-body { width: 100%; text-align: center; } #contactForm-body textarea { float: none; width: 80%; margin: 0px auto 16px auto; } #contactForm-submit { text-align: center; } /* Insult Pages */ #insultHeader-left { width: 100%; } #insultHeader-right { width: 100%; } div#insultHeader-right ul { margin: 0px 0px 16px 0px; } div#insultHeader-right li { text-align: left; } div#insultHeader-right p { text-align: left; } #insult textarea { height: auto; margin: 0px 0px -32px 0px; padding: 48px 0px 48px 0px; font-size: 16pt; line-height: 32px; } #insultGuy { height: 360px; background-size: 320px auto; } #downArrow { margin: -190px 0px 0px 0px; } #downArrow span { margin: 0px 0px 0px 0px; } }