/* CSS generated by SiteManager at 04:23pm 12/09/2011 - do not edit this file directly */ /*--------------------------------------------------------------------------------------------------------------------------- CSS for Student Cooking.TV - Main Stylesheet Author: Alison Springall (alisonspringall@silktide.com) / Silktide Studios - All Rights Reserved Created: 23/07/2009 Updated: 04/08/2010 ----------------------------------------------------------------------------------------------------------------------------- */ @font-face { font-family: 'TenbyFiveRegular'; src: url('/tenby-five-webfont.eot'); src: local('?'), url('/tenby-five-webfont.woff') format('woff'), url('/tenby-five-webfont.ttf') format('truetype'), url('/tenby-five-webfont.svg#webfont') format('svg'); font-weight: normal; font-style: normal; } /* Global Styles ----------------------------------------------------------------------------------------------------------------------------- */ body { background: #252525 url(/templatefiles/body_bg_09.jpg) no-repeat center 5px; background-attachment: fixed; font: 80% arial, verdana, helvetica, sans-serif; text-align: center; color: #fff; padding: 0; border-top: 5px solid #fff; margin: 0; } /*body#home { background-image: url(/templatefiles/body_bg_09_home.jpg); }*/ hr { height: 1px; background-color: #e8e8e8; color: #e8e8e8; border: 0; margin: 15px 0; } img { border: 0; } form, table { background: transparent; font-size: 1.0em; } fieldset { border: 1px solid #ccc; } legend { font-size: 1.2em; color: #ef1874; } .tablestyle { border-collapse: collapse; } .tablestyle td, .tablestyle th { vertical-align: top; padding: 5px 5px 5px 0; } .tableborder td, .tableborder th { vertical-align: top; padding: 5px; border: 1px solid #e8e8e8; } .widthwrapper { width: 100%; } .padding { padding: 14px; } .paddingthin { padding: 10px; } .right { float: right; } .left { float: left; } .clear { height: 7px; clear: both; } .last { margin-right: 0 !important; } #accessibility { display: none; } .hideinpage { display: none; } /* Text Styles ----------------------------------------------------------------------------------------------------------------------------- */ h1 { font-weight: bold; font-size: 2.6em; font-family: TenbyFiveRegular, arial, verdana, helvetica, sans-serif; text-transform: uppercase; color: #fff; margin: 15px 0; } h2 { font: bold 2.0em TenbyFiveRegular, arial, verdana, helvetica, sans-serif; text-transform: uppercase; color: #00B8F8; margin: 15px 0 10px; } h3 { font: bold 1.3em TenbyFiveRegular, arial, verdana, helvetica, sans-serif; text-transform: uppercase; color: #00B8F8; margin: 10px 0 5px; } h2 a, h2 a:visited, h3 a, h3 a:visited { display: block; color: #fff; text-decoration: none; } h2 a:hover, h2 a:active, h3 a:hover, h3 a:active { color: #000; text-decoration: none; } h1.leftwrapmain { width: auto; height: 58px; float: left; position: relative; left: -10px; background: transparent url(/templatefiles/leftwrapmain_blue.png) no-repeat 0 0; color: #fff; margin: 20px 0 0; } h1.leftwrapmain span.textwrapper { display: block; background-color: #00B8F8; line-height: 27px; padding: 1px 14px; margin-left: 18px; } h1.leftwrapmain span.textwrapper img { margin: 1px 0; } h1.leftwrapmain a, h1.leftwrapmain a:visited { color: #fff; } h1.leftwrapmain a:hover, h1.leftwrapmain a:active { color: #000; } h2.leftwrap { width: auto; height: 44px; position: absolute; left: -10px; top: 5px; background: transparent url(/templatefiles/leftwrap_blue.png) no-repeat 0 0; color: #fff; margin: 0; } h2.leftwrap span.textwrapper { display: block; background-color: #00B8F8; line-height: 32px; padding: 1px 14px 1px 0; margin-left: 10px; } h2.leftwrap span.textwrapper img { margin: 5px 0; } h2.leftwrap.yellow { background-image: url(/templatefiles/leftwrap_yellow.png); color: #000; } h2.leftwrap.olive { background-image: url(/templatefiles/leftwrap_olive.png); } .topwrap { position: absolute; left: 0; top: -10px; background: transparent url(/templatefiles/topwrap-blue.png) no-repeat 0 0; color: #fff; padding-left: 10px; margin: 0; } .topwrap .textwrapper { display: block; background-color: #00B8F8; padding: 3px 10px; } .topwrap.crimson { background-image: url(/templatefiles/topwrap-crimson.png); } .topwrap.olive { background-image: url(/templatefiles/topwrap-olive.png); } .topwrap.red { background-image: url(/templatefiles/topwrap-red.png); } .topwrap.brown { background-image: url(/templatefiles/topwrap-brown.png); } .topwrap.pink { background-image: url(/templatefiles/topwrap-pink.png); } .topwrap.yellow { background-image: url(/templatefiles/topwrap-yellow.png); color: #000; } h2.topwrap { width: 296px; } .doublecol h2.topwrap { width: auto; } h2.topwrap.crimson { background-image: url(/templatefiles/topwrap-crimson.png); } h2.topwrap.olive { background-image: url(/templatefiles/topwrap-olive.png); } h2.topwrap.red { background-image: url(/templatefiles/topwrap-red.png); } h2.topwrap.brown { background-image: url(/templatefiles/topwrap-brown.png); } h2.topwrap.yellow { background-image: url(/templatefiles/topwrap-yellow.png); color: #000; } h3.topwrap { width: 190px; /*font-size: 10px;*/ } h3.plaintext { text-transform: uppercase; color: #fff; margin: 10px 0; } .crimson .textwrapper { background-color: #ad1757 !important; } .olive .textwrapper { background-color: #5b751e !important; } .red .textwrapper { background-color: #d70101 !important; } .brown .textwrapper { background-color: #6b3010 !important; } .yellow .textwrapper { background-color: #F7E200 !important; } .pink .textwrapper { background-color: #EF1874 !important; } .triplecol .categoryblock .crimson span.textwrapper:hover { background-color: #DB347D !important; } .triplecol .categoryblock .olive span.textwrapper:hover { background-color: #75932D !important; } .triplecol .categoryblock .red span.textwrapper:hover { background-color: #D73535 !important; } .triplecol .categoryblock .brown span.textwrapper:hover { background-color: #97512B !important; } .triplecol .categoryblock .yellow span.textwrapper:hover { background-color: #F9EC54 !important; } .triplecol .categoryblock .blue span.textwrapper:hover { background-color: #2BA2C9 !important; } .triplecol .withborder .topwrap { width: auto; } .yellow a, .yellow a:visited { color: #000; } .yellow a:hover, .yellow a:active { color: #fff; } p { font-size: 1.0em; line-height: 1.5em; color: #fff; margin: 10px 0; } p.highlighttext { float: left; font-weight: bold; color: #00B8F8; margin: 10px 5px 0 0; } li { font-size: 1.0em; line-height: 1.5em; color: #fff; margin: 0 0 5px; } b.taosSearchMatch { background: none; color: #00B8F8; } a, a:visited { color: #ef1874; text-decoration: none; } a:hover, a:active { color: #fff; } /* Layout Styles ----------------------------------------------------------------------------------------------------------------------------- */ #container { width: 974px; text-align: left; margin: 0 auto 0; } .wrapper { position: relative; background-color: transparent!important; background-image: url(/templatefiles/wrapper_bg.png); background-repeat: repeat; margin: 0 auto 20px; } .col-wide { width: 226px; } .col-full { clear: both; color: #fff; padding: 0 14px 14px; } /* Header Styles ----------------------------------------------------------------------------------------------------------------------------- */ #toplinks { height: 31px; float: right; background: transparent url(/templatefiles/toplinks_left.png) no-repeat 0 5px; margin: -5px 0 10px; } #toplinks #toplinkswrapper { height: 31px; background: transparent url(/templatefiles/toplinks_right.png) no-repeat right 5px; } #toplinks #toplinksinner { height: 31px; background: #fff; padding: 0 10px 0 5px; margin: 0 11px; } #toplinks form { float: left; display: block; vertical-align: middle; padding: 0; margin: 5px 0 0; } #toplinks p#joinnowlink { width: 142px; height: 39px; float: left; vertical-align: middle; background: transparent url(/templatefiles/toplinks_button.png) no-repeat 0 0; font-weight: bold; font-size: 1.2em; text-align: center; color: #fff; padding: 0; border: 0; margin: 0; cursor: pointer; } #toplinks p#joinnowlink a, #toplinks p#joinnowlink a:visited { line-height: 39px; color: #fff; } #toplinks p#joinnowlink a:hover, #toplinks p#joinnowlink a:active { color: #000; } #toplinks div#loginlink { float: left; font-weight: bold; } #toplinks div#loginlink a, #toplinks div#loginlink a:visited { line-height: 34px; color: #000; } #toplinks div#loginlink a:hover, #toplinks div#loginlink a:active { color: #ef1874; } #login * { color: #000; } #login label { position: relative; } #login input { width: 200px; } #login .button { width: 90px; } #login a, #login a:visited { color: #ef1874; text-decoration: underline; } #login a:hover, #login a:active { color: #777; text-decoration: none; } .loginbox { width: 300px; float: right; background-color: #F4DA01; padding: 10px 0; margin: 0 0 20px 20px; } .loginbox * { color: #000; } .loginbox h2 { color: #00B8F8; padding: 0 15px; margin: 0; } .loginbox label { position: relative; } .loginbox input { width: 200px; } .loginbox .button { width: 90px; } #header { height: 50px; position: relative; clear: both; background: transparent url(/templatefiles/header_bg.png) repeat-x left bottom; margin: 0 14px 14px; } #header #sitelogo { display: block; padding: 10px 14px; } #header #sitelogoprint { display: none; } .mainnav { position: absolute; bottom: -2px; right: 0px; float: right; padding: 0; margin: 0; } .mainnav li { float: left; font-weight: bold; list-style-type: none; color: #fff; margin: 0 14px 0 0; } .mainnav li a, .mainnav li a:visited { float: left; color: #fff; padding-bottom: 6px; } .mainnav li a:hover, .mainnav li a:active, .mainnav li.selectedoption a, .mainnav li.selectedoption a:visited { background: transparent url(/templatefiles/mainnav_li_bg.png) no-repeat center bottom; color: #ef1874; } #search { float: right; margin: -5px 14px 5px 0; } .padding #search { float: none; } #search input { width: 180px !important; background-color: #fff !important; background-image: url(/templatefiles/search_bg.jpg) !important; background-repeat: no-repeat !important; background-position: 3px center !important; padding-left: 20px !important; border: 1px solid #bcbcba; } #search .button { width: 25px !important; background-color: #151515 !important; background-image: url(/templatefiles/go_bg.jpg) !important; background-repeat: repeat-x !important; background-position: 0 0 !important; font-weight: bold; font-size: 0.85em; text-transform: uppercase; color: #fff; padding: 5px !important; border: 0; } .withborder #search .button { width: auto !important; display: inline; background: #00B8F8 none !important; font-weight: bold; font-size: 0.85em; text-transform: uppercase; color: #fff; padding: 5px 10px 4px !important; border: 0; cursor: pointer; } .withborder #search .button:hover { background-color: #289ec7 !important; } .banner { height: 122px; position: relative; clear: right; margin: 0 0 20px 14px; } .banner .leftwrapmain { float: none; position: absolute; left: -9px; top: 0; } /* Three Grid : Single Column Styles ----------------------------------------------------------------------------------------------------------------------------- */ .threecol .singlecol { width: 306px; float: left; position: relative; } .threecol .singlecol .singlecolimg { position: relative; margin-bottom: 25px; } .threecol .singlecol .social { position: relative; background: #777 url(/templatefiles/box_bg.png) repeat 0 0; padding: 25px 10px 14px; margin-bottom: 25px; } /* Three Grid : Double Column Styles ----------------------------------------------------------------------------------------------------------------------------- */ .threecol .doublecol { width: 626px; float: left; position: relative; padding-left: 14px; margin-right: 14px; } .threecol .doublecol .row { min-height: 94px; border-bottom: 1px dotted #fff; margin-bottom: 14px; } .threecol .doublecol .row .imgleft { position: relative; float: left; margin: 0 14px 0 0; } .threecol .doublecol .row .imgleft .playsmall { position: absolute; top: 20px; left: 53px; } .threecol .doublecol .row a, .threecol .doublecol .row a:visited { font-weight: bold; color: #00b8f8; } .threecol .doublecol .row a:hover, .threecol .doublecol .row a:active { font-weight: bold; color: #ef1874; } /* Three Grid : Triple Column Styles ----------------------------------------------------------------------------------------------------------------------------- */ .threecol .triplecol { width: 946px; clear: both; position: relative; padding-top: 20px; margin: 0 0 0 14px; } .threecol .clickheading { float: left; padding-left: 20px; } .threecol .recipesearchheading { float: right; padding-right: 140px; } .triplecol .categoryblock { width: 306px; float: left; position: relative; background: transparent url(/templatefiles/box_bg.png) repeat 0 0; margin-right: 14px; } .triplecol .categoryblock .inner { width: 286px; height: 315px; overflow: auto; padding: 30px 10px 10px; } .triplecol .categoryblock .morelink { font-weight: bold; text-align: center; } .triplecol .withborder { border: 1px dotted #c1c1c1; } .triplecol .padding.withborder { min-height: 385px; position: relative; padding-top: 40px; } .triplecol .categoryblock.withborder { width: 304px; } .triplecol .videoblock { min-height: 71px; padding-top: 10px; border-bottom: 1px dotted #929292; } .triplecol .videoblock .imgleft { display: block; float: left; padding: 2px; border: 1px solid #484848; margin: 0 10px 0 0; } .triplecol .videoblock p { color: #fff; margin: 0; } .triplecol .videoblock p a, .triplecol .videoblock p a:visited { font-weight: bold; color: #00B8F8; } .triplecol .videoblock p a:hover, .triplecol .videoblock p a:active { color: #EF1874; } /* Four Grid : Single Column Styles ----------------------------------------------------------------------------------------------------------------------------- */ .fourcol .singlecol { width: 240px; float: left; position: relative; } .fourcol .wide { width: 306px; } .promoblock { position: relative; background: transparent url(/templatefiles/menublock_bg.png) repeat-x 0 0; padding-bottom: 19px; margin: 0 0 14px 29px; } .promoblockinner { min-height: 60px; background: #fff url(/templatefiles/promoblock_bg.jpg) no-repeat right top; padding: 15px; margin: 0 20px 0 -19px; } .promoblocktr { width: 19px; height: 19px; position: absolute; right: 1px; top: 0; background: transparent url(/templatefiles/menublock_tr.png) no-repeat left bottom; } .promoblockbl { width: 19px; height: 19px; position: absolute; left: -19px; bottom: 0; background: transparent url(/templatefiles/menublock_bl.png) no-repeat right top; } .promoblock .promoimg { float: right; margin-left: 5px; } .promoblock .promoheader { display: block; font-weight: bold; font-size: 2.5em; color: #777; } .promoblock #altcolor { color: #000; margin-bottom: 15px; } .promoblock #promotext { font-size: 1.2em; line-height: 1.2em; color: #777; } .promoblock a:hover, .promoblock a:active { color: #777; } .transblock { width: 226px; height: 220px; position: relative; background: transparent url(/templatefiles/menublocktrans_bg.png) no-repeat right bottom; padding: 0; margin: 0 0 14px 14px; } .transblockinner { width: 184px; height: 140px; overflow: hidden; padding: 50px 0 0 10px; margin: 0; } .transblock .title { display: none; } .transblock .name { font-weight: bold; } .transblock .name a, .transblock .name a:visited { color: #00B8F8; } .transblock .name a:hover, .transblock .name a:active { color: #EF1874; } /* .transblock blockquote { background: transparent url(/templatefiles/quote_end.png) no-repeat right bottom; line-height: 1.5em; color: #00B8F8; padding: 0; margin: 0; } .transblock blockquote span { display: block; background: transparent url(/templatefiles/quote_start.png) no-repeat left top; padding: 14px 0 9px; } */ .stepblock h3.topwrap { width: 70px; } .stepblock .blockimg { position: absolute; top: 1px; left: 1px; } .scribblebox { background: none!important; position: relative; } #scribble1 { position: absolute; top: 1px; left: 5px; } #scribble2 { position: absolute; top: 80px; right: 5px; } #scribble3 { position: absolute; top: 1px; right: 0; } #scribble4 { position: absolute; top: -40px; right: 0; } #getyourfd { width: 180px; float: right; background: #ef1874 url(/templatefiles/pink_arrow.jpg) no-repeat 160px center; font: bold 26px TenbyFiveRegular, arial, verdana, helvetica, sans-serif; text-transform: uppercase; color: #fff; padding: 5px; margin: 20px 14px; } #getyourfd a, #getyourfd a:visited { color: #fff; } #getyourfd a:hover, #getyourfd a:active { color: #000; } .twitter { width: 226px; min-height: 55px; position: relative; background: transparent url(/templatefiles/twitter_bg.png) no-repeat left bottom; padding-bottom: 45px; margin: 0 0 0 14px; } .twitter ul { padding: 10px; margin: 0; } .twitter ul li { list-style-type: none; font-size: 0.8em; color: #fff; margin: 0; } .twitter ul li a, .twitter ul li a:visited { color: #fff; text-decoration: underline; } .twitter ul li a:hover, .twitter ul li a:active { color: #fff; text-decoration: none; } .twitter img { position: absolute; right: 14px; bottom: 20px; } .feature { width: 206px; position: relative; padding: 50px 10px 5px; border: 1px dotted #fff; margin: 0 0 14px 14px; } .feature .imgleft { float: left; margin: 0 10px 0 0; } .feature .imgright { float: right; margin: 0; } .feature p { color: #fff; } .feature p .strike { text-decoration: line-through; } .feature p .price { color: red; } .feature p a, .feature p a:visited { color: #fff; text-decoration: none; } .feature p a:hover, .feature p a:active { color: #F7E200; } .memberblock { height: 175px; float: left; overflow: hidden; background: transparent url(/templatefiles/box_bg.png) repeat 0 0; margin-left: 14px; } .memberblock img { display: block; margin-bottom: 10px; } .memberblock .membername { font-weight: bold; text-transform: uppercase; padding: 0 10px; margin: 0; } .memberblock a, .memberblock a:visited { color: #fff; } .memberblock a:hover, .memberblock a:active { color: #ef1874; } .memberblock2 .memberblock { width: 466px; } .memberblock3 .memberblock { width: 306px; } .memberblock4 .memberblock { width: 226px; } #inpagelogin .registerlink { height: 25px; vertical-align: middle; background: transparent url(/templatefiles/arrow_register.png) no-repeat left center; float: right; font-weight: bold; font-size: 0.85em; text-transform: uppercase; color: #f9de00; padding-left: 35px; margin: -40px 0 0; } #inpagelogin .registerlink a, #inpagelogin .registerlink a:visited { display: block; color: #f9de00; padding-top: 3px; } #inpagelogin .registerlink a:hover, #inpagelogin .registerlink a:active { color: #fff; } #inpagelogin label { display: block; font-weight: bold; font-size: 0.85em; text-transform: uppercase; padding-bottom: 5px; } #inpagelogin .taosTextField { width: 200px !important; display: block; margin-bottom: 5px; } #inpagelogin .button { width: auto !important; display: block; background: #EF1874 none; font-weight: bold; font-size: 0.85em; text-transform: uppercase; color: #fff; padding: 5px 10px; border: 0; } #inpagelogin .button:hover { background-color: #d63379; } #quiz { background-color: #121212; padding: 10px; } #quiz .question { margin: 0 0 20px 20px; } #quiz .question strong { font-size: 1.2em; margin-left: -20px; } .fullscreen-flash { clear:both; text-align: center; padding-bottom: 10px; } /* Four Grid : Double Column Styles ----------------------------------------------------------------------------------------------------------------------------- */ .fourcol .doublecol { width: 452px; float: left; position: relative; padding-left: 14px; margin-right: 14px; } .fourcol #videocol { width: 480px; } .fourcol #relatedinfo { width: 424px; min-height: 140px; background: transparent url(/templatefiles/box_bg.png) repeat 0 0; padding: 65px 14px 125px; margin-right: 0; } .fourcol ul.arrowlist { padding: 0; margin: 10px 0; } .fourcol ul.arrowlist li { background: transparent url(/templatefiles/arrowlist.png) no-repeat 0 0; font-size: 1.0em; line-height: 1.2em; list-style-type: none; padding-left: 20px; margin: 5px 0; } .fourcol #relatedinfo ul.arrowlist { position: absolute; left: 14px; bottom: 14px; margin: 0; } .fourcol #relatedinfo ul.arrowlist li { font-size: 1.2em; } .fourcol #relatedinfo ul.arrowlist li a, .fourcol #relatedinfo ul.arrowlist li a:visited { color: #fff; } .fourcol #relatedinfo ul.arrowlist li a:hover, .fourcol #relatedinfo ul.arrowlist li a:active { color: #00b8f8; } .fourcol #relatedinfo .row { clear: both; } .fourcol #relatedinfo .row .imgleft { float: left; margin: 0 14px 10px 0; } .fourcol #relatedinfo .row a, .fourcol #relatedinfo .row a:visited { font-weight: bold; color: #00b8f8; } .fourcol #relatedinfo .row a:hover, .fourcol #relatedinfo .row a:active { font-weight: bold; color: #ef1874; } .fourcol #relatedinfo #facebook { position: absolute; right: 100px; bottom: 10px; } .fourcol #relatedinfo #twitter { position: absolute; right: 55px; bottom: 10px; } .fourcol #relatedinfo #youtube { position: absolute; right: 10px; bottom: 10px; } .fourcol .recipetext { position: relative; padding: 14px 14px 14px; } .fourcol .recipetext h2.topwrap { width: auto; } .fourcol .recipetext .imgleft { float: left; margin: 14px 14px 14px 0; } .fourcol .recipecol { width: 306px; /*226px*/ min-height: 10px; float: left; font-weight: bold; font-size: 1.0em; margin-right: 14px; } .fourcol .recipecol.last { padding-bottom: 60px; } .fourcol .recipecol ul { padding: 0; margin: 0; } .fourcol .recipecol ul li { list-style-type: none; } .fourcol .recipecol #nutritional { background-color: #2f2f2f; padding: 10px; } .fourcol .recipecol #nutritional table { border-collapse: collapse; } .fourcol .recipecol #nutritional th { text-align: right; font-size: 1.2em; color: #fff; padding: 5px; } .fourcol .recipecol #nutritional td { font-size: 1.2em; } .fourcol .recipecol #nutritional td.level { width: 53px; height: 57px; background-color: transparent; background-repeat: no-repeat; background-position: right center; text-align: center; vertical-align: middle; color: #fff; } .fourcol .recipecol #nutritional td.low { background-image: url(/templatefiles/green_low.png); } .fourcol .recipecol #nutritional td.med { background-image: url(/templatefiles/orange_med.png); } .fourcol .recipecol #nutritional td.high { background-image: url(/templatefiles/red_high.png); } .fourcol .recipecol #nutritional td.type { width: 150px; background: transparent url(/templatefiles/ni_box.png) repeat-x left center; text-align: left; color: #000; padding-left: 10px; } .fourcol .recipecol #nutritional td.cal { background-image: url(/templatefiles/ni_box_start.png); } .fourcol .recipecol #nutritional td.value { width: 50px; background: transparent url(/templatefiles/ni_box_end.png) no-repeat left center; text-align: right; color: #000; padding-right: 10px; } .fourcol .addtofd { position: absolute; bottom: 10px; right: 20px; } .fourcol .recipestep { font-weight: bold; font-size: 1.0em; padding: 14px 14px 0; } .fourcol .recipestep h3.topwrap { width: 90px; left: 420px; } .fourcol .recipestep h3.topwrap img { float: none; margin: 0; } .fourcol .recipestep img { float: left; margin: 0 14px 0 0; } .fourcol .recipestep .clear { height: 5px; } .fourcol #registration { width: 636px; } .fourcol #registration .padding { background: transparent url(/templatefiles/register_bg.png) no-repeat 0 0; padding: 225px 0 0; margin-top: -14px; } .fourcol #registrationwrapper { width: 610px; height: 250px; position: relative; border: 1px solid #4d4d46; border-top: 0; } .fourcol #registrationwrapper label { font-weight: bold; font-size: 0.85em; text-transform: uppercase; color: #fff; } .fourcol #registrationwrapper .taosTextField { width: 215px !important; font-size: 0.85em; /*text-transform: uppercase;*/ color: #333; } .fourcol #registrationwrapper select { width: 220px !important; font-size: 0.85em; text-transform: uppercase; color: #333; } .fourcol #registrationwrapper span { position: static !important; } /* Full Name*/ .fourcol #registrationwrapper #register-name-label { position: absolute !important; top: 30px; left: 20px; } .fourcol #registrationwrapper #s_f2_fullName { position: absolute !important; top: 50px; left: 20px; } /*Email */ .fourcol #registrationwrapper #register-email-label { position: absolute !important; top: 80px; left: 20px; } .fourcol #registrationwrapper #s_f2_userName { position: absolute !important; top: 100px; left: 20px; } /* Password */ .fourcol #registrationwrapper #register-password-label { position: absolute !important; top: 130px; left: 20px; } .fourcol #registrationwrapper #s_f2_password1 { position: absolute !important; top: 150px; left: 20px; } /* Confirm Password */ .fourcol #registrationwrapper #register-confirm-password-label { position: absolute !important; top: 180px; left: 20px; } .fourcol #registrationwrapper #s_f2_password2 { position: absolute !important; top: 200px; left: 20px; } /* Choose University */ .fourcol #registrationwrapper #uni_option label { position: absolute !important; top: 30px; left: 300px; } .fourcol #registrationwrapper #uni_option #s_f3_university { position: absolute !important; top: 50px; left: 300px; } /* Appear in Film */ .fourcol #registrationwrapper #film_option { position: absolute !important; top: 90px; left: 300px; } .fourcol #registrationwrapper #film_option #s_f3_in_film { display: block; position: absolute !important; top: 0; left: 0; } .fourcol #registrationwrapper #film_option label { width: 250px; position: absolute !important; top: 0; left: 20px; text-transform: none; } /* Subscribe to Newsletter */ .fourcol #registrationwrapper #newsletter_option { position: absolute !important; top: 125px; left: 300px; } .fourcol #registrationwrapper #newsletter_option #s_f3_subscribe_to_newsletter { display: block; position: absolute !important; top: 0; left: 0; } .fourcol #registrationwrapper #newsletter_option label { width: 250px; position: absolute !important; top: 0; left: 20px; text-transform: none; } /* Terms and Conditions */ .fourcol #registrationwrapper #tandc_option { position: absolute !important; top: 160px; left: 300px; } .fourcol #registrationwrapper #tandc_option #s_f3_terms_and_conditions { display: block; position: absolute !important; top: 0; left: 0; } .fourcol #registrationwrapper #tandc_option label { width: 180px; position: absolute !important; top: 0; left: 20px; text-transform: none; } .fourcol #registrationwrapper #tandc_option .taosrequiredfieldicon { display: none; } /* Button */ .fourcol #registrationwrapper .button { width: 100px !important; display: block; position: absolute !important; top: 200px; left: 300px; background: #EF1874 none; font-weight: bold; font-size: 0.85em; text-transform: uppercase; color: #fff; padding: 5px 10px; border: 0; } .fourcol #registrationwrapper .button:hover { background-color: #d63379; } /* Error */ .fourcol #registrationwrapper .taosError { font-size: 0.85em; color: #fff; } /* Activation */ .fourcol #registrationwrapper fieldset { border: 0; } .fourcol #registrationwrapper legend { font: bold 2.0em TenbyFiveRegular, arial, verdana, helvetica, sans-serif; text-transform: uppercase; padding: 25px 0 0; margin: 0; } /* Not Listed */ .fourcol #registrationwrapper #notlisted { position: absolute !important; top: 20px; left: 425px; font-size: 0.85em; } .fourcol #notlistedform { display: none; position: relative; padding: 14px; border: 1px solid #4d4d46; margin-left: 10px; } .fourcol #notlistedform p { font-size: 0.85em; margin: 0 0 5px; } .fourcol #notlistedform label { font-weight: bold; font-size: 0.85em; text-transform: uppercase; color: #fff; } .fourcol #notlistedform .textField { width: 260px !important; font-size: 0.85em; text-transform: uppercase; color: #333; margin: 0 0 5px; } .fourcol #notlistedform .button { width: 100px !important; display: block; background: #EF1874 none; font-weight: bold; font-size: 0.85em; text-transform: uppercase; color: #fff; padding: 5px 10px; border: 0; } .fourcol #notlistedform .button:hover { background-color: #d63379; } /* */ .tooltip { width: 219px; height: 92px; background: transparent url(/templatefiles/tooltip_bg_left.png) no-repeat center top; font-size: 0.75em; color: #fff; padding: 15px 15px 15px 30px; } label span.taosError { padding-left: 10px; color: #f66!important; } label.errored { color: red!important; } input.errored, select.errored { border: 1px solid red; } .error-prompt { position:absolute; margin-left: 20px; padding: 3px; background-color: #000; font-weight: bold; color: red; } /* Four Grid : Triple Column Styles ----------------------------------------------------------------------------------------------------------------------------- */ .fourcol .triplecol { width: 706px; float: left; position: relative; padding-left: 14px; } .latestvideo { position: relative; clear: both; margin-top: 14px; margin-bottom: 14px; } .latestvideo img { display: block; } .latestvideo .leftwrapmain img { display: inline; } .latestvideo .videowrapper { width: 686px; height: 270px; overflow: hidden; margin-top: 10px; } .latestvideo .play { position: absolute; top: 104px; left: 287px; } .latestvideo .leftwrapmain { position: absolute; left: -9px; top: 25px; margin: 0; } .latestvideo .strapline { display: block; position: absolute; left: 10px; bottom: 10px; z-index: 100; background-color: #000; font-weight: bold; font-size: 2.0em; font-family: TenbyFiveRegular, arial, verdana, helvetica, sans-serif; color: #F7E200; padding: 5px; margin: 0; } .latestvideo ul#videolinks { position: absolute; top: 0; right: 0; padding: 0; margin: 0; } .latestvideo ul#videolinks li { list-style-type: none; padding: 0; border: 3px solid #bbb; margin: -8px 20px 32px; } .latestvideo ul#videolinks li.active { border: 3px solid #fff; } .univideo { /*height: 352px;border-bottom: 1px dotted #fff;*/ margin-bottom: 14px; } .univideo .play { top: 130px; left: 250px; } .recipeblock { width: 206px; height: 200px; float: left; position: relative; background: transparent url(/templatefiles/box_bg.png) repeat 0 0; padding: 10px; margin-bottom: 20px; margin-right: 14px; } .recipeblock p { color: #fff; } .recipeblock p a, .recipeblock p a:visited { color: #fff; } .recipeblock p a:hover, .recipeblock p a:active { color: #ef1874; } /* Carousel Styles */ .yui-carousel-content { padding: 0; border: 0; margin: 0; } .yui-carousel-nav { display: none; } .yui-carousel-element { z-index: 0; padding: 0 !important; margin:0 !important; } .yui-carousel-element li { list-style-type: none !important; vertical-align: top !important; padding: 0 !important; border: none !important; margin: 0 !important; } .yui-carousel-item-selected { border: none !important; margin: 0 !important; } #carousel { height: 150px !important; padding: 0; margin: 0; } #carousel li { z-index: 99; list-style-type: none !important; padding: 0; margin: 0; } .videocarousel { width: 706px; height: 190px; overflow: hidden; position: relative; } .videocarousel span.thumbblock { width: 226px; min-height: 175px; position: relative; display: block; background: transparent url(/templatefiles/box_bg.png) repeat 0 0; text-align: left; margin: 0 14px 14px 0; } .videocarousel span.thumbblock img { display: block; } .videocarousel span.thumbblock span.videoname { display: block; text-transform: uppercase; font-weight: bold; font-size: 0.9em; padding: 3px 20px; } .videocarousel span.thumbblock .play { position: absolute; top: 40px; left: 80px; } .videocarousel span.thumbblock .playsmall { position: absolute; top: 15px; left: 49px; } .videocarousel span.thumbblock a, .videocarousel span.thumbblock a:visited { color: #fff; } .videocarousel span.thumbblock a:hover, .videocarousel span.thumbblock a:active { color: #ef1874; } .videocarousel .carouselprev { position: absolute; left: 5px; top: 40px; } .videocarousel .carouselnext { position: absolute; right: 5px; top: 40px; } /* Carousel Styles - Video Pages */ .doublecol .videocarousel { width: 480px; height: 160px; overflow: hidden; position: relative; } .doublecol .videocarousel span.thumbblock { width: 150px; min-height: 150px; } .doublecol .videocarousel span.thumbblock span.videoname { text-transform: none; font-weight: bold; font-size: 0.85em; padding: 3px 10px; } .doublecol .videocarousel span.thumbblock a, .doublecol .videocarousel span.thumbblock a:visited { color: #00b8f8; } .doublecol .videocarousel span.thumbblock a:hover, .doublecol .videocarousel span.thumbblock a:active { color: #ef1874; } .doublecol .videocarousel .carouselprev { position: absolute; left: 5px; top: 20px; } .doublecol .videocarousel .carouselnext { position: absolute; right: 5px; top: 20px; } /* Four Grid : Four Column Styles ----------------------------------------------------------------------------------------------------------------------------- */ .fourcolvids { width: 960px; clear: left; height: auto; overflow: visible; position: relative; } .fourcolvids span.thumbblock { width: 226px; min-height: 180px; float: left; background: transparent url(/templatefiles/box_bg.png) repeat 0 0; text-align: left; margin: 0 0 14px 14px; } .fourcolvids span.thumbblock img { display: block; } .fourcolvids span.thumbblock span.videoname { display: block; text-transform: uppercase; font-weight: bold; font-size: 0.9em; padding: 10px 10px; } .fourcolvids span.thumbblock a, .fourcolvids span.thumbblock a:visited { color: #fff; } .fourcolvids span.thumbblock a:hover, .fourcolvids span.thumbblock a:active { color: #ef1874; } .recipewrapper { position: relative; } .recipewrapper h2 { width: auto; margin-left: 10px; } /* Six Grid : Six Column Styles ----------------------------------------------------------------------------------------------------------------------------- */ .sixcolimgs { width: 960px; height: auto; overflow: visible; position: relative; } .sixcolimgs span.thumbblock { width: 146px; min-height: 180px; float: left; background: transparent url(/templatefiles/box_bg.png) repeat 0 0; text-align: left; margin: 0 0 14px 14px; } .sixcolimgs span.thumbblock img { display: block; } /* Logo and Footer Styles ----------------------------------------------------------------------------------------------------------------------------- */ #logos { min-height: 80px; clear: both; position: relative; background: #e9e9e9 /*url(/templatefiles/logos_bg.png) repeat 0 0*/; padding: 0; border: 1px solid #ccc; margin: 14px 0; } #logos span.logoblock { width: auto; height: 60px; position: relative; overflow: hidden; display: block; float: left; text-align: center; vertical-align: middle; margin: 10px 15px 10px; } #logos span.logoblock img { display: block; vertical-align: middle; margin: 0 auto; } #logos span.logoblock img:hover { margin-top: -60px; } #footer { clear: both; background-color: #4C4C4C; font-size: 0.85em; color: #fff; border: 1px solid #424242; margin: 0 0 14px; } #footer a, #footer a:visited { color: #fff; padding: 0 10px; } #footer a:hover, #footer a:active { color: #ef1874; } #footer p { margin: 10px 0; } #footer p.right a, #footer p.right a:visited { padding-left: 0; } #footer #social { float: right; padding: 5px 40px 5px 0; } #footer #social a, #footer #social a:visited { padding: 0 3px; }