/* Foundation v2.1.3 http://foundation.zurb.com */ /* Artfully masterminded by ZURB */ /* LESS addition */ /* les transBarbantes 2012 design by dr zoid -> http://taddactivity.net */ /* -------------------------------------------------- Table of Contents ----------------------------------------------------- :: Fonts :: Shared Styles :: Intro */ /* ----------------------------------------- Fonts ----------------------------------------- */ @font-face { font-family: 'BlackoutMidnight'; src: url('../fonts/Blackout-Midnight-webfont.eot'); src: url('../fonts/Blackout-Midnight-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/Blackout-Midnight-webfont.woff') format('woff'), url('../fonts/Blackout-Midnight-webfont.ttf') format('truetype'), url('../fonts/Blackout-Midnight-webfont.svg#../fonts/BlackoutMidnight') format('svg'); font-weight: normal; font-style: normal; } /* ----------------------------------------- Shared Styles ----------------------------------------- */ /* COLORS & BCKGRND*/ @defaultBackgroundColor: white; /* @defaultMenuColor: #0ee3ff; */ @defaultMenuColor: #B8DA40; @defaultTitleBackground: black; @defaultTitleColor: white; @defaultTextColor: black; @defaultMenuTextColor: black; @announceBgColor: rgba(255,0,0, 0.2); /* @defaultBackgroundImgUrl: */ @defaultShadow: 2px 2px 5px grey; @defaultBorderRadius: 5px; /* FONTS */ @defaultTitleFontFamily: 'BlackoutMidnight'; @defaultTitleFontSize : 1.1em; @defaultTextFontFamily: 'Verdana'; @defaultTextFontSize: 1.7em; @defaultMenuFontSize: 1em; /* BCKG */ @color1: #AAA; @color2: #FFFFFF; /* STYLES */ .Title(@size: @defaultTitleFontSize){ font-size: @size; font-family: 'BlackoutMidnight'; text-align: center; margin-left: auto; margin-right: auto; } .Shadow(){ box-shadow: @defaultShadow; border-radius: @defaultBorderRadius; -moz-border-radius: @defaultBorderRadius; -webkit-border-radius: @defaultBorderRadius; /* border: 0px solid black; */ } /* DEFINITIONS */ body { background-color : @defaultBackgroundColor; background-image : url('../images/bck2.png'); text-align: justify; font-size: @defaultTextFontSize; color: @defaultTextColor; } h1 { .Title(3em); color: @defaultTitleColor; background-color: @defaultTitleBackground; } h2 { .Title(5); text-shadow: 0 0 5px #DDD; padding: 5px; } h3 { .Title(8); text-shadow: 0 0 5px #DDD; } a { color: inherit; } ul.menu{ li{ background-color: @defaultMenuColor; font-size: @defaultMenuFontSize; padding: 10px; text-align: right; font-weight: bold; color: @defaultMenuTextColor; .Shadow(); a{ color: inherit; } } } ul.menu { li.tooLate{ background-color: desaturate(@defaultMenuColor, 55%); } } ul { text-align: center; li{ background-color: inherit; margin-left: 10px; margin-right: 10px; font-weight: bold; text-align: center; margin-left: auto; margin-right: auto; span { float: left; } } } ul.lineup{ li{ width: 70%; text-align: right; } } .footer{ background-color: black; color: white; margin-top: 20px; border-top: 2px solid grey; .Shadow(); } div#featured { width: 70%; margin-left: auto; margin-right: auto; } /* NOT A PHONE */ @media only screen and (min-width: 480px) { h1 { .Title(3.5em); text-shadow: 2px 2px 0px red, -2px -2px 0px #7777FF, 2px -2px 0px #B8DA40; } h2 { margin-top: 10px; } .menu { ul{ li{ .Shadow(); } } } h1 { .Shadow(); } .info{ .Shadow(); p { padding-left: 15px; padding-right: 15px; } hr{ width: 70%; margin-left: auto; margin-right: auto; } background-color: @defaultBackgroundColor + #111; } .announce{ background-color: @announceBgColor; margin-bottom: 10px; .Shadow(); p { padding-left: 15px; padding-right: 15px; } H4 { padding: 15px; padding-bottom: 0px; } } } @media only screen and (min-width: 800px) { h1 { .Title(5em); } } /* ----------------------------------------- Intro ----------------------------------------- */