@font-face {
    font-family: "FatFrank";
    src: url(../fonts/FatFrank-Regular.woff);
}

@font-face {
    font-family: "MuseoSlab";
    src: url(../fonts/MuseoSlab900.woff);
}

html {
	scroll-behavior: smooth;
}

body{
    margin: 0 0 0 0;
    min-width: 1160px; 
}

text {
    font-family: Arial, Helvetica, sans-serif;
}

.sectionheader {
    position: relative;
    display: block;
    font-size: 50px;
    text-transform: uppercase;
    text-align: center;
    font-family: FatFrank, sans-serif;
    width: 100%;
    padding-bottom: 24px;
    margin-top: -70px;
    padding-top: 70px;
}

.section{
    padding-top: 48px;
    padding-bottom: 48px;
}

.oddsection {
    color: #FFFFFF;
    background: #D40149 url('../images/pattern.jpg') repeat left top;
}

.evensection {
    color: #D40149;
}

#mainsection{
    width:100%;
}

.gameslist{
    width: 1160px;
    align-content: flex-start;
    justify-content: space-between;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
}

#header{
    z-index: 100;
    position: fixed;
    top: 0;
    width: 100%;
    background-color: #D40149;
    margin: 0 auto;
}

#headercontent{
    display: flex;
    align-items: center; 
    margin: 0 auto;
    max-width: 1200px;
    width: 100%;
    height: 64px;
}

#headerlogo{
    display: inline-block;
    background: #D40149 url('../images/tributegameslogowhite.png') repeat left top;
    width: 186px;
    height: 51px;
}

#sectionlist{
    text-align: right;
    margin-left: auto;
    width: auto;
    margin-top:10px;
}

.sectionlink{
    font-size: 18px;
    text-transform: uppercase;
    padding-left: 8px;
    font-family: FatFrank, sans-serif;
}

#headerlinks{
    margin-left:auto;
}

#presskitlinksection{
	float:right;
}

a.sectionlink:link { color:#FFFFFF; text-decoration:none; font-weight:normal; }
a.sectionlink:visited { color: #FFFFFF; text-decoration:none; font-weight:normal; }
a.sectionlink:hover { color: #FFFFFF; opacity: 0.4; text-decoration:none; font-weight:normal; }
a.sectionlink:active { color: #FFFFFF; text-decoration:none; font-weight:normal; }
 
 .joblink{
    
}
a.joblink:link { color:#D40149; text-decoration:none; font-weight:normal; }
a.joblink:visited { color: #D40149; text-decoration:none; font-weight:normal; }
a.joblink:hover { color: #D40149; opacity: 0.4; text-decoration:none; font-weight:normal; }
a.joblink:active { color: #D40149; text-decoration:none; font-weight:normal; }

.presskitlink{
    line-height: 10px;
    font-size: 12px;
    text-transform: lowercase;
    padding-left: 8px;
    font-family: FatFrank, sans-serif;
}
a.presskitlink:link { color:#FFFFFF; text-decoration:none; font-weight:normal; }
a.presskitlink:visited { color: #FFFFFF; text-decoration:none; font-weight:normal; }
a.presskitlink:hover { color: #FFFFFF; opacity: 0.4; text-decoration:none; font-weight:normal; }
a.presskitlink:active { color: #FFFFFF; text-decoration:none; font-weight:normal; }


#welcome{
    padding-top: 100px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#languages{
    width: 965px;
    text-align: right;
    text-transform: uppercase;
    color: #FFFFFF;
}

a.languagelink:link{
    color: #FFFFFF;
}

a.languagelink:visited{
    color: #FFFFFF;
}

#welcomesection{
    display: flex;
    align-items: center;
    justify-content: center;
}

#cyrus{
    width: 350px;
    height: 350px;
    background: transparent  url('../images/cyrus.png');
}

#bubble{
    background-color: #FFFFFF;
    width: 611px;
    left: 30px;
}

#bubblesquare{
    background-color: #FFFFFF;
    width: 40px;
    height: 40px;
    transform: matrix(0.7071,-0.7071,0.7071,0.7071,-8,20);
    -webkit-transform: matrix(0.7071,-0.7071,0.7071,0.7071,-8,20);
    -ms-transform: matrix(0.7071,-0.7071,0.7071,0.7071,-8,20);
    position: relative;
    margin-right: -10000px;
    margin-top: 130px;
    left: 340px;
}

#bubbletext{
    margin-top: 16px;
    padding-left: 32px;
    padding-right: 32px;
    color: #D40149;
    font-family: MuseoSlab, serif;
    font-size: 14px;
    line-height: 17px;
    word-wrap: break-word;
    text-align: justify;
}


.game {
    display: flex;
    width: 560px;
    height: 315px;
    margin-bottom: 32px;
}

.gamewide {
    display: flex;
    width: 1160px;
    height: 315px;
    margin-bottom: 32px;
}

.gameheadlinewide{
    display: flex;
    padding:8px;
    align-self: flex-end;
    height: 100px;
    width: 100%;
    line-height: 18px;
    background:rgba(212,1,73,0.4);
}


.gameheadline{
    display: flex;
    padding:8px;
    align-self: flex-end;
    flex-direction: column;
    height: 100px;
    width: 100%;
    line-height: 18px;
    background:rgba(212,1,73,0.4);
}

.gametitlewide {
    width: 500px;
    font-size: 38px;
    text-transform: uppercase;
    font-family: FatFrank, sans-serif;
    margin-bottom: 6px;
    line-height: 42px;
}

.gametitle {
    width: 500px;
    font-size: 25px;
    text-transform: uppercase;
    font-family: FatFrank, sans-serif;
    margin-bottom: 6px;
    line-height: 32px;
}

.gamedescription {
    font-size: 16px;
    font-family: MuseoSlab, serif;
}

a.gamelink:link { color:#FFFFFF; text-decoration:none; font-weight:normal; }
a.gamelink:visited { color: #FFFFFF; text-decoration:none; font-weight:normal; }
a.gamelink:hover { color: #FFFFFF; text-decoration:none; font-weight:normal; }
a.gamelink:active { color: #FFFFFF; text-decoration:none; font-weight:normal; }

#followus{
    display:flex;
    justify-content: center;
    flex-wrap: wrap;
}

#subscribetext{
    font-family: FatFrank, serif;
    text-transform: lowercase;
    font-size: 30px;
    padding-bottom: 16px;
}

#followusbuttonsection{
    padding-top: 30px;
}

#followsection{
    display:flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    width: 100%;
}

#sendgrid-subscription-widget{
    width: 365px;
}

#sg_email{
    width: 100%;
    height: 45px;
    border-width: 0px;
    font-size: 20px;
    margin-bottom: 16px;
}

#sg-submit-btn{
    font-size: 20px;
    font-family: MuseoSlab, serif;
    line-height: 24px;
    background-color: #FFFFFF;
    color: #D40149;
    border-color: transparent;
    border-width: 0px;
    vertical-align: middle;
    height: 45px;
    width: 100%;
    text-transform: uppercase;
}

#publishsection{
    display: flex;
    align-items: center;
    justify-content: center;
}

#runbros{
    width: 350px;
    height: 400px;
    background: transparent  url('../images/publish.png') no-repeat;
}

#publishdetailssection{
    display: flex;
    align-items: center;
    justify-content: center;
}

#publishdetails{
    text-align: left;
}

#publishcopyleft{
    padding-right: 32px;
    width: 40%;
    text-align: justify;
}

#publishcopyright{
    padding-left: 32px;
    width: 40%;
    font-size: 20px;
    text-align: justify;
}

.publishlink{
    font-size: 24px;
}

a.publishlink:link { color:#D40149; text-decoration:none; font-weight:normal; }
a.publishlink:visited { color: #D40149; text-decoration:none; font-weight:normal; }
a.publishlink:hover { color: #D40149; opacity: 0.4; text-decoration:none; font-weight:normal; }
a.publishlink:active { color: #D40149; text-decoration:none; font-weight:normal; }


#operator{
    width: 357px;
    height: 385px;
    background: transparent  url('../images/press.png');
}

#jobssection{
    display: flex;
    justify-content: center;
}

#jobstext{
    margin-top: 100px;
    width: 522px;
    line-height: 19px;
    font-family: MuseoSlab, serif;
}

#colonel{
    width: 308px;
    height: 437px;
    background: transparent  url('../images/colonel.png') no-repeat;
}

#contactsection{
    display:flex;
    justify-content: center;
}

#contact-form{
    width: 342px;
}

body, .form-control {
    font-family: MuseoSlab, sans-serif;
}


#address{
    font-family: MuseoSlab, serif;
    text-align: right;
    font-size: 16px;
    line-height: 0px;
    padding: 0px;
    margin: 0px;
    padding-left: 32px;
}

label {
    display: block;
    font-family: MuseoSlab, serif;
    font-size: 14px;
    height: 20px;
}

textarea{
    display: block;
    width: 100%;
    font-size: 14px;
}

input{
    width: 100%;
}

#form_name{
    width: 260px;
}

#form_email{
    width: 260px;
}

.btn-send {
    font-size: 20px;
    font-family: MuseoSlab, serif;
    line-height: 24px;
    background-color: #FFFFFF;
    color: #D40149;
    border-color: transparent;
    border-width: 0px;
    vertical-align: middle;
    height: 32px;
    width: auto;
    padding-left: 16px;
    padding-right: 16px;
    text-transform: uppercase;
    border-color:transparent;
    border-width: 1px;
}

.btn-success.disabled{
    border-color:transparent;
    border-width: 0px;
    background:rgba(90, 90, 90, 0.8);

}

.btn-success:hover {
    color: #fff;
    background-color:#D40149;
    border-color: #ffffff;

}

.help-block.with-errors {
    color: #ff5050;
    margin-top: 5px;
}

#footer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #D40149;
    color: #FFFFFF;
    text-align: center;
    font-size: 12px;
    font-family: MuseoSlab, serif;
    padding: 12px;
    border-top: 1px solid #FFFFFF;
}


.socialbuttonlist{
    display: flex;
    justify-content: center;
}

.socialbutton{
}


.footerbutton{
    width: 25px;
    height: 25px;
    margin-left:4px;
    margin-right:4px;
}

.followbutton{
    width: 53px;
    height: 53px;
    margin-left:4px;
    margin-right:4px;
}

#twitter{
    background: transparent url('../images/twitter.png') no-repeat;
    background-size: 100%;
}

#twitter:hover{
    background: transparent url('../images/twitterhover.png') no-repeat;
    background-size: 100%;
}

#facebook{
    background: transparent url('../images/facebook.png') no-repeat;
    background-size: 100%;
}

#facebook:hover{
    background: transparent url('../images/facebookhover.png') no-repeat;
    background-size: 100%;
}

#youtube{
    background: transparent url('../images/youtube.png') no-repeat;
    background-size: 100%;
}

#youtube:hover{
    background: transparent url('../images/youtubehover.png') no-repeat;
    background-size: 100%;
}

#twitch{
    background: transparent url('../images/twitch.png') no-repeat;
    background-size: 100%;
}

#twitch:hover{
    background: transparent url('../images/twitchhover.png') no-repeat;
    background-size: 100%;
}

#instagram{
    background: transparent url('../images/insta.png') no-repeat;
    background-size: 100%;
}

#instagram:hover{
    background: transparent url('../images/instahover.png') no-repeat;
    background-size: 100%;
}

#discord{
    background: transparent url('../images/discord.png') no-repeat;
    background-size: 100%;
}

#discord:hover{
    background: transparent url('../images/discordhover.png') no-repeat;
    background-size: 100%;
}

#gametitletmntsr{
    font-size: 32px;
    width: 100%;
}