@import url(https://fonts.googleapis.com/css?family=Lato:300,400,700,900);

html,body{ height:100% }
body { font-family:Lato;background-color:#F8F8F8;margin:0px;font-size:18px;line-height:1.5em; }

a:link { text-decoration: none; font-size: inherit; color: #de4443; }
a:visited { text-decoration: none; font-size: inherit; color: #de4443; }
a:active { text-decoration: none; font-size: inherit; color: #de4443; }
a:hover { text-decoration: none; font-size: inherit; color: #de4443; }

a.topmenu:link { font-family:Varela Round;text-decoration: none; font-size: 15px; color: #66667f; }
a.topmenu:visited { font-family:Varela Round;text-decoration: none; font-size: 15px; color: #66667f; }
a.topmenu:active { font-family:Varela Round;text-decoration: none; font-size: 15px; color: #66667f; }
a.topmenu:hover { font-family:Varela Round;text-decoration: none; font-size: 15px; color: #66667f; }

a.footermenu:link { text-decoration: none; font-size: 13px; color: #FFFFFF;margin-left:20px;margin-right:20px;margin-bottom:15px; }
a.footermenu:visited { text-decoration: none; font-size: 13px; color: #FFFFFF;margin-left:20px;margin-right:20px;margin-bottom:15px; }
a.footermenu:active { text-decoration: none; font-size: 13px; color: #FFFFFF;margin-left:20px;margin-right:20px;margin-bottom:15px; }
a.footermenu:hover { text-decoration: none; font-size: 13px; color: #DDDDDD;margin-left:20px;margin-right:20px;margin-bottom:15px; }

a.menu:link { text-decoration: none; font-size: 14px; color: #FFFFFF; }
a.menu:visited { text-decoration: none; font-size: 14px; color: #FFFFFF; }
a.menu:active { text-decoration: none; font-size: 14px; color: #FFFFFF; }
a.menu:hover { text-decoration: none; font-size: 14px; color: #DDDDDD; }

a.pagelink:link { text-decoration: none; font-size: 18px; color: #000000; }
a.pagelink:visited { text-decoration: none; font-size: 18px; color: #000000; }
a.pagelink:active { text-decoration: none; font-size: 18px; color: #000000; }
a.pagelink:hover { text-decoration: none; font-size: 18px; color: #663399; }

a.smalllink:link { text-decoration: none; font-size: 14px; color: #CCCCCC; }
a.smalllink:visited { text-decoration: none; font-size: 14px; color: #CCCCCC; }
a.smalllink:active { text-decoration: none; font-size: 14px; color: #CCCCCC; }
a.smalllink:hover { text-decoration: none; font-size: 14px; color: #FFFFFF; }

.splash { cursor:pointer;background-color:#000000;background-image:url("images/splash.jpg");background-position:center;background-repeat:no-repeat;background-size:contain; }
.login { padding-top:60px;background-color:#000000;background-image:url("images/loginback.jpg");background-position:center;background-repeat:no-repeat;background-size:contain;overflow:hidden; }
div#loginpage { position:relative;width:90%;max-width:600px;margin:auto;top:0px;bottom:0px;text-align:center;overflow:hidden; }
.list_button { position:absolute;bottom:0px;right:0px;width:80px;height:80px;z-index:1000;cursor:pointer;background-image:url("images/list_button.png");background-position:bottom right;background-repeat:no-repeat;background-size:contain; }
.slider { position:absolute;top:100%;background-color:#FFFFFF;overflow:hidden;width:100%;height:75%; }
.sliderhead { cursor:pointer;height:60px;line-height:60px;width:100%;padding-left:15px;text-align:left;font-size:20px;color:#FFFFFF;background-color:#663399;background-image:url('images/refresh_white.png');background-position:right center;background-repeat:no-repeat; }
.overlay { position:absolute;bottom:0px;right:0px;top:0px;left:0px;width:100%;height:100%;background-color:#000000;opacity:0; }
.teamrow { cursor:pointer;height:50px;line-height:50px;width:calc(100% - 50px);padding-left:15px;text-align:left;font-size:18px;border-bottom:1px solid #F4F4F4; }
.headteam { cursor:pointer;height:45px;line-height:45px;width:calc(100% - 50px);padding-left:15px;text-align:left;font-size:20px;color:#FFFFFF; }
.headloc { height:30px;width:100%;line-height:1.2em;padding-left:15px;padding-top:15px;text-align:left;font-size:14px;color:#DDDDDD; }
.headswap { position:absolute;top:10px; right:15px;height:60px;width:50px;text-align:right;background-image:url('images/swap3.png');background-size:30px auto;background-position:right center;background-repeat:no-repeat;cursor:pointer; }
.headmenu { position:absolute;top:10px; right:15px;height:60px;width:50px;text-align:right;background-image:url('images/bars.png');background-size:30px auto;background-position:right center;background-repeat:no-repeat;cursor:pointer; }

.headteamon { cursor:pointer;height:45px;line-height:45px;width:calc(100% - 50px);padding-left:15px;text-align:left;font-size:20px;color:#FFFFFF; opacity: 1; font-weight:600; }
.headteamoff { cursor:pointer;height:45px;line-height:45px;width:calc(100% - 50px);padding-left:15px;text-align:left;font-size:20px;color:#FFFFFF; opacity: 0.5; font-weight:400; }


div#page { position:relative;height:100%;width:100%;max-width:600px;margin:auto;top:0px;bottom:0px;background-color:#FFFFFF;text-align:center;overflow:hidden; }
div#adminpage { position:relative;width:100%;max-width:600px;margin:auto;top:0px;background-color:#FFFFFF;text-align:center;overflow-x:hidden; }
div#headerlogo { position:absolute;left:0px;right:0px;top:0px;height:40px;background-color:#000000;border-bottom:2px solid #663399;text-align:center; }
div#headercont { position:absolute;left:0px;right:0px;top:42px; }
div#headerback { left:0px;right:0px;top:0px;height:150px;background-color:#663399;background-image:url('images/topback.png');background-position:right bottom;background-repeat:no-repeat;background-size:cover; }
div#teamhead { cursor:pointer;position:absolute;left:0px;right:0px;bottom:0px;top:150px;width:100%;height:60px;line-height:60px;padding-left:15px;text-align:left;font-size:16px;color:#663399;background-color:#DDDDDD;background-image:url('images/swap2.png');background-position:right center;background-repeat:no-repeat; }
.teamlist {position:absolute;left:0px;right:0px;bottom:0px;top:192px;width:100%; }
.teamdiv {height:100%;display:flex;flex-direction:column; }
.subrow { padding-left:15px;padding-top:10px;border-bottom:1px solid #F4F4F4;font-size:16px;color:#999999; }
div#squadhead { left:0px;right:0px;height:60px;line-height:60px;padding-top: 152px;padding-left:15px;padding-right:15px;text-align:left;font-size:16px;font-weight:700;color:#663399;background-color:#DDDDDD; }
.squadstart { cursor:pointer;border-bottom:1px solid #F4F4F4;border-left:1px solid #FFFFFF;color:#FFFFFF;background-color:#33CC33;font-size:12px; }
.squadsub { cursor:pointer;border-bottom:1px solid #F4F4F4;border-left:1px solid #FFFFFF;color:#FFFFFF;background-color:#CC3333;font-size:12px; }
.squadoff { cursor:pointer;border-bottom:1px solid #F4F4F4;border-left:1px solid #FFFFFF;color:#999999;background-color:#F8F8F8;font-size:12px; }
.adminteam { width:100%;padding:15px;text-align:left;font-size:24px;color:#FFFFFF; }
.squadlist {left:0px;right:0px;width:100%; }
div#squadadd { left:0px;right:0px;width:100%;height:80px;background-color:#DDDDDD; }
div#adminheaderlogo { position:fixed;left:0px;right:0px;top:0px;height:40px;background-color:#000000;border-bottom:2px solid #663399;text-align:center; }
div#adminheadercont { position:fixed;left:0px;right:0px;top:42px;height:100px;background-image:url('images/back.jpg');background-position:left center;background-repeat:repeat-x;background-size:contain; }
div#adminheaderback { left:0px;right:0px;top:0px;height:100px;background-color:#663399;background-image:url('images/topback.png');background-position:right bottom;background-repeat:no-repeat;background-size:cover; }
div#admin_left { position:absolute;width:600px;left:0px;top:100px;background-color:#FFFFFF;text-align:center; }
div#admin_match { height:150px;left:0px;right:0px;background-color:#663399;color:#FFFFFF; }
div#admin_match_save { height:130px;left:0px;right:0px;background-color:#663399;color:#FFFFFF; }
div#admin_ads { left:0px;right:0px;background-color:#000000;color:#FFFFFF;padding-bottom:15px; }

.mainheader { position:relative;width:100%;background-color:#000000;background-repeat:no-repeat;background-position:bottom;background-size:cover;border-bottom:0px solid #663399; }
.mainhead {position:relative;margin:auto;top:0px;width:100%;max-width:1100px; }
.mainleft { float:right;width:40%;text-align:right;height: 560px;overflow: hidden; }
.mainright { float:right;width:60%;text-align:center;padding-top: 100px; }
.mainmockup { width:85%;margin-bottom:-150px;padding-top: 100px; }
.mainshadow { position:absolute;left:0px;right:0px;bottom:0px;height:120px;background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);}

.darkcontainer {position:relative;left:0px;right:0px;background-color:#EEEEEE;}
.maindark {margin:auto;top:0px;text-align:left;max-width:1100px;padding:40px 20px; }
.clearcontainer {position:relative;left:0px;right:0px;}
.mainclear {margin:auto;top:0px;text-align:left;max-width:1100px;padding:20px; }
.whitecontainer {position:relative;left:0px;right:0px;background-color:#FFFFFF;}
.mainwhite {margin:auto;top:0px;text-align:left;max-width:1100px;background-color:#FFFFFF;padding:20px; }

.policydiv { float:left;width:100%;margin-top:-100px;margin-bottom:40px;background-color:#FFFFFF;text-align:center; }
.fandiv { float:left;width:48%;margin-right:4%;margin-left:0%;margin-top:-100px;background-color:#FFFFFF;text-align:center; }
.clubdiv { float:left;width:48%;margin-right:0%;margin-left:0%;margin-top:-100px;background-color:#FFFFFF;text-align:center; }
.boxhead { width:100%;height:50px;background-color:#663399;text-align:center;color:#FFFFFF;text-transform:uppercase;line-height:50px;font-weight:700;font-size: 22px; }
.boxmain { width:100%;text-align:center;padding:40px 20px;box-sizing:border-box; }

.faqq { width:100%;padding-bottom:10px;font-weight:700;cursor:pointer; }
.faqa { width:100%;padding:0px 0px 30px 0px;font-weight:400;display:block; }
.faqcol { float:left;width:50%;padding:30px;box-sizing:border-box; }

.darkbutton {display:inline-block;padding:0px 15px;white-space: nowrap;font-weight:700;font-size:16px;color:#FFFFFF;height:50px;line-height:50px;text-align:center;background-color:#663399;cursor:hand;cursor:pointer;border-radius:0px; }
.lightbutton {display:inline-block;padding:0px 15px;white-space: nowrap;font-weight:700;font-size:16px;color:#000000;height:50px;line-height:50px;text-align:center;background-color:#CCCCCC;cursor:hand;cursor:pointer;border-radius:0px; }

.screenshot { display:inline-block;width:33%;text-align:center; }
.screenshot2 { display:inline-block;width:66%;text-align:center; }
.screenshot img { width:80%; }
.screenshot2 img { width:100%; }

@media screen and (max-width: 1100px) {

}

@media screen and (max-width: 960px) {

}

@media screen and (max-width: 840px) {

}

@media screen and (max-width: 720px) {
	.splash { background-image:url("images/splash2.jpg");background-size:640px 640px; }
	.login { background-image:url("images/loginback2.jpg");background-size:640px 640px; }

	.fandiv { width:80%;margin-right:0%;margin-left:10%; }
	.clubdiv { width:80%;margin-left:10%;margin-top:30px; }
	.faqcol { width:100%; }
	.screenshot { width:100%;text-align:center; }
	.screenshot2 { width:100%;text-align:center; }
	.screenshot img { width:50%; }
	.screenshot2 img { width:100%; }
	
	.mainleft { width:100%;text-align:center;height: 560px; }
	.mainright { width:100%;padding-top: 40px; }
	.mainmockup { width:70%;padding-top: 50px; }


}

@media screen and (max-width: 560px) {

}

@media screen and (max-width: 480px) {

}
