MediaWiki:WorldCup.css

/* ==================  Media queries ================== */

@media only screen and (max-width:1023px) { /*   body { width:90%; margin:0 auto; min-width:1000px; max-width:1023px; }     .team { width:400px }

.fpcontainer { width:700px; margin:0 auto; }

} @media only screen and (min-width:1024px) { /*  body { width:90%; margin:0 auto; min-width:1024px; max-width:1280px; }     .team { width:500px }     .fpcontainer { width:1200px; margin: 0 auto; }

}

/* ===================  Expanding boxes =================== */

.fpboxbounder { margin:0 auto } div.fpbox { color: black } div.interior {color :black} div.fpbox.interior { width: 200px; margin: 0; float: left; background: white; } div.fpbox.interior h2 { color: white; background: url(""); line-height: 125%; padding-left: .6em; font-size: 1.5em; font-weight: 100; border:none!important; } div.fpbox.interior img { display: block; margin-left:-1.2em; } div.fpbox.interior p, div.fpbox.interior ul { margin: 0 1.2em 1em; list-style: none; } div.fpbox.interior li { margin-bottom: .8em; font-size: .9em; } div.fpbox.interior li a { display: block; }

div.fpbox.interior ul { margin-top: 16px; }

div.fpbox.shrink { max-height: 210px; overflow: hidden; position: relative; -webkit-transition: max-height 0.5s ease-in 0s; -moz-transition: max-height 0.5s ease-in 0s; -ms-transition: max-height 0.5s ease-in 0s; -o-transition: max-height 0.5s ease-in 0s; transition: max-height 0.5s ease-in 0s; } div.fpbox.shrink:hover { max-height: 1000px; } div.fpbox.shrink:after { content: " "; background: url("") no-repeat right top; width: 30px; height: 45px; position: absolute; right: 0px; top: 0px; } div.fpbox.shrink:hover:after { background-position: right bottom; }

div.fpbox.team { background: rgba(194,213,24,1); background: -moz-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(194,213,24,1)), color-stop(100%, rgba(0,93,0,1))); background: -webkit-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: -o-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: -ms-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: linear-gradient(to bottom, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c2d518', endColorstr='#005d00', GradientType=0 ); background-image:url('http://img3.wikia.nocookie.net/__cb20140621153753/czechout/images/7/7d/GreenBackgroundTest.jpg'); margin:5px; } div.fpbox.player { background: rgba(194,213,24,1); background: -moz-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(194,213,24,1)), color-stop(100%, rgba(0,93,0,1))); background: -webkit-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: -o-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: -ms-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: linear-gradient(to bottom, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c2d518', endColorstr='#005d00', GradientType=0 ); background-image:url('http://img3.wikia.nocookie.net/__cb20140621153753/czechout/images/7/7d/GreenBackgroundTest.jpg'); margin:5px; } div.fpbox.manager { background: rgba(194,213,24,1); background: -moz-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(194,213,24,1)), color-stop(100%, rgba(0,93,0,1))); background: -webkit-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: -o-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: -ms-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: linear-gradient(to bottom, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c2d518', endColorstr='#005d00', GradientType=0 ); background-image:url('http://img3.wikia.nocookie.net/__cb20140621153753/czechout/images/7/7d/GreenBackgroundTest.jpg'); margin:5px; } div.fpbox.pastmatch, div.fpbox.futurematch { background: rgba(194,213,24,1); background: -moz-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(194,213,24,1)), color-stop(100%, rgba(0,93,0,1))); background: -webkit-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: -o-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: -ms-linear-gradient(top, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); background: linear-gradient(to bottom, rgba(194,213,24,1) 0%, rgba(0,93,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c2d518', endColorstr='#005d00', GradientType=0 ); background-image:url('http://img3.wikia.nocookie.net/__cb20140621153753/czechout/images/7/7d/GreenBackgroundTest.jpg'); margin:5px; } .futurematch ul, .pastmatch ul { list-style: none; margin: 0; } div.fpbox.futurematch li, div.fpbox.pastmatch li { float: left; margin: 10px 0; margin-right: 40px; } .futurematch li a, .pastmatch li a{	display: block; width: 45px; height: 45px; text-indent: -999em; } .futurematch li:last-child, .pastmatch li:last-child { margin-right: 0; }