/*---------------------------------------------------- SCREEN.CSS SITE: www.jezrose.co.uk CREATED: Fri 21.05.10 @ 09:17 AUTHOR: Kean Richmond ----------------------------------------------------*/ @import url("reset.css"); @font-face {font-family:'LeagueGothicRegular'; src:url('../fonts/League_Gothic-webfont.eot'); src:local('?'), url('../fonts/League_Gothic-webfont.woff') format('woff'), url('../fonts/League_Gothic-webfont.ttf') format('truetype'), url('../fonts/League_Gothic-webfont.svg') format('svg'); font-weight:normal; font-style:normal;} /*--- 00. Common Elements ---------------------------------------------------------------------------*/ body {background:url(../img/_bkg.jpg) repeat-x; color:#666666; font-family:Arial, Helvetica, sans-serif; font-size:62.5%;} a {color:#F6901D;} a:hover {color:#333333; text-decoration:none;} .nofloat {float:none!important; margin:0!important;} /*--- 01. Heading ---------------------------------------------------------------------------*/ h1 {color:#F6901D; font-family:'LeagueGothicRegular', Arial, Helvetica, sans-serif; font-size:3em; margin:33px 0 10px 0; text-transform:uppercase;} h2 {color:#666666; font-family:'LeagueGothicRegular', Arial, Helvetica, sans-serif; font-size:2.5em; margin:33px 0 0 0; text-transform:uppercase;} h3 {color:#666666; font-size:1.4em; font-weight:bold; margin:33px 0 0 0;} /*--- 02. Main Layout ---------------------------------------------------------------------------*/ #main-container {background:url(../img/_bkg_img_jez.png) 0 330px no-repeat; margin:0 auto; padding:0 10px; position:relative; width:940px;} #content-container {padding:100px 0 0 0;} /*--- 03. Header ---------------------------------------------------------------------------*/ #header {left:0; padding:0 10px; position:absolute; top:0; width:940px;} #logo {display:block; float:left; margin:35px 0 0 0;} #training {float:right; margin:34px 0 0 0;} #training p {background:url(../img/_bkg_training.png) right center no-repeat; color:#BFBFBF; float:left; font-family:'LeagueGothicRegular', Arial, Helvetica, sans-serif; font-size:2.4em; margin:5px 11px 0 0; padding:11px 26px 10px 0; text-transform:uppercase;} #training a {clear:right; display:block; float:right; margin:3px 0 4px 0; text-align:center; width:68px;} /*--- 04. Navigation ---------------------------------------------------------------------------*/ #nav {float:left; font-family:'LeagueGothicRegular', Arial, Helvetica, sans-serif; font-size:1.8em; margin:29px 0; text-transform:uppercase; width:180px;} #nav li {padding:4px 0;} #nav > li > a, #nav li#blog a:hover {background:#F2F2F2; background:rgba(0,0,0,0.04); color:#F6901D; display:block; padding:5px 10px 4px 10px; text-decoration:none; text-shadow:#FFFFFF 1px 1px 1px; width:160px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;} #nav > li > a:hover, #nav li#blog a {background:#F6901D; color:#FFFFFF; text-shadow:none;} #nav li li a {color:#999999; display:block; padding:0px 10px 0px 10px; text-decoration:none; width:160px; } #nav li li a:hover {color:#F6901D;} #nav li#appstore a {background:0; color:#999999; padding:0; text-shadow:none;} #nav li#appstore img {display:block;} /*--- 05. Content ---------------------------------------------------------------------------*/ #content {float:right; position:relative; padding:0 40px 40px 40px; width:500px;} #content p {font-size:1.2em; line-height:1.3em; padding:8px 0;} blockquote {border-top:1px dotted #666666; float:right; font-family:Georgia, "Times New Roman", Times, serif; font-size:1.2em; font-weight:bold; margin:8px 0 10px 20px; padding:10px 0; width:200px;} cite {display:block; font-style:italic; font-weight:normal; padding:10px 0 0 0;} #content ul {list-style:square; padding:10px 0;} #content ul > li {font-size:1.2em; padding:5px 0;} #content img {clear:right; float:right; margin:8px 0 10px 20px;} /*--- 06. Index Page ---------------------------------------------------------------------------*/ #index #content {background:url(../img/_bkg_content_index.png) 0 114px no-repeat; padding:421px 120px 40px 120px; width:340px;} #index h1 {color:#666666; font-family:Arial, Helvetica, sans-serif; font-size:1.2em; margin:0; text-transform:none;} #index #video {margin:0 0 0 -1px; position:absolute; top:33px;} #content ul#promos {margin:0 -94px; list-style:none; padding:0; position:absolute; top:276px;} #content ul#promos li {float:left; font-size:1em; padding:0;} #promos a {background:url(../img/_promos.png) -168px 0 no-repeat; color:#FFFFFF; display:block; font-family:'LeagueGothicRegular', Arial, Helvetica, sans-serif; font-size:2.4em; height:22px; line-height:1em; padding:25px 10px; text-align:center; text-decoration:none; text-transform:uppercase; text-shadow:rgba(0,0,0,0.28) 1px 1px 1px; width:148px;} #promos a:hover {background-position:-168px -72px; color:#F6901D; text-shadow:none;} #promos a.multi-line {height:46px; padding:13px 10px;} #promos li:first-child a {background-position:0 0;} #promos li:last-child a {background-position:-336px 0;} #promos li:first-child a:hover {background-position:0 -72px;} #promos li:last-child a:hover {background-position:-336px -72px;} #index #content ul#accreditations {margin:20px -94px;} #index #content ul#accreditations img {height:53px;} #content ul#accreditations {border-top:1px solid #E5E5E5; list-style:none; margin:20px 0 0 0; padding:20px 0 0 0; text-align:center;} #content ul#accreditations li {display:inline; /*line-height:5em;*/ padding:0 10px;} #content ul#accreditations img {float:none; margin:10px 0;} #mailing-list label, .mailing-list label {display:block; float:none; font-size:1.2em; margin:0 0 3px 0; width:auto;} #mailing-list input[type="text"], .mailing-list input[type="text"] {width:99%;} #mailing-list input[type="submit"], .mailing-list input[type="submit"] {background:#F6901D; height:30px; font-size:18px; margin:10px 0; width:50px; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; -moz-box-shadow:0px 0px 5px rgba(0,0,0,0.4); -webkit-box-shadow:0px 0px 5px rgba(0,0,0,0.4); box-shadow:0px 0px 5px rgba(0,0,0,0.4);} #mailing-list input[type="submit"]:hover, .mailing-list input[type="submit"]:hover {background:#EDEDED;} /*--- 07. Content Pages ---------------------------------------------------------------------------*/ #looking-for-business-speaking #main-container, #free-training-tips #main-container, #clients-and-testimonials #main-container, #agility-training #main-container, #national-campaign #main-container, #links #main-container {background:0;} #clients-and-testimonials blockquote, #film-and-tv blockquote, blockquote.testimonial {float:none; width:auto; margin:20px 0;} #content ul#socials {height:100%; list-style:none; margin:0; overflow:hidden; padding:0;} #socials li {float:left; margin:5px 5px 0 0; padding:0;} #content ul#socials li img {margin:0;} #content #twitter ul {list-style:none;} #content #twitter li {background:#EEEEEE; margin:10px 0; padding:10px; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px;} #twitter li span {display:block; font-size:0.9em; font-style:italic; padding:5px 0 0 0;} #vetpro-seminars h1 {background:url(../img/_logo_vetproseminars.png) no-repeat; height:60px; text-indent:-9999px; width:441px;} #content ul#pdf-list {height:100%; list-style:none; overflow:hidden; padding:0;} #pdf-list li {float:left; margin:10px 10px 10px 0; width:152px;} #pdf-list li img {border:1px solid #CCCCCC; margin-bottom:10px;} .sponsor {background:#F4F4F4; height:100%; overflow:hidden; padding:10px; -moz-border-radius:10px; border-radius:10px;} .sponsor-img {float:left; margin-right:10px;} /*--- 08. Resources Pages ---------------------------------------------------------------------------*/ #free-training-resources #content {padding-right:0; width:540px;} #free-training-resources #content ul {list-style:none; padding:0;} #free-training-resources #content ul > li {padding:0;} .tabbed-content {background:url(../img/_tabbed_bkg.png) repeat-x; padding:5px;} .tabbed-nav {height:100%; overflow:hidden;} .tabbed-nav li {float:left; margin-right:5px;} .tabbed-nav a {background:url(../img/_tabs.png) -145px 0 no-repeat; color:#FFFFFF; display:block; font-family:'LeagueGothicRegular', Arial, Helvetica, sans-serif; font-size:1.66em; padding:8px 0; text-align:center; text-decoration:none; text-shadow:0 1px 0 rgba(0,0,0,0.2); text-transform:uppercase; width:140px; -moz-border-radius:5px 5px 0 0; border-radius:5px 5px 0 0;} .tabbed-nav a:hover, .tabbed-nav a.current {background-position:0 0;} .tabbed-nav-lbl {color:#999999; font-weight:bold; padding:16px 0 6px 0!important;} .posters {height:100%; overflow:hidden;} .posters li {float:left; height:172px; margin:0 0 15px 0; padding:1%!important; width:48%;} .posters a {color:#666666; font-size:0.9em; text-decoration:none;} .poster-img {background:url(../img/_poster_bkg.png) no-repeat; float:left; height:170px; margin-right:4px; padding:1px; width:118px;} .poster-img img {float:none!important; margin:0!important;} .poster-title {color:#F6901D; display:block; font-size:1.1em; font-weight:bold; padding:9px 0 15px 0; text-decoration:underline;} .poster-title:hover {text-decoration:none;} .factsheets {height:100%; margin:0 -5px; overflow:hidden;} .factsheets li {float:left;} .factsheets a {background:url(../img/_paw_sm.png) -4px 0 no-repeat #F6901D; color:#FFFFFF; display:block; font-weight:bold; margin:5px 7px; padding:8px 0 7px 0; text-align:center; text-decoration:none; width:255px; -moz-border-radius:5px; border-radius:5px;} .factsheets a:hover {background-color:#999999;} .dunbar {background:url(../img/_dunbar.png) center top no-repeat; height:45px; margin:0 0 0 0; text-indent:-9999px;} /*--- 50. Footer ---------------------------------------------------------------------------*/ #footer {background:url(../img/_bkg_footer.png) top center no-repeat; clear:both; color:#999999; font-size:1.1em; margin:40px 0 0 0; padding:86px 0 50px 0; text-align:center;} #footer p {padding:5px 0;} #footer a {color:#999999; text-decoration:none;} #footer a:hover {color:#F6901D;} /*--- 51. Form Elements ---------------------------------------------------------------------------*/ form {margin:20px 0;} form p {height:100%; overflow:hidden; padding:5px 0;} label {color:#666666; float:left; font-weight:bold; margin:4px 10px 0 0; width:110px;} input[type="text"], select, textarea {border:1px solid #CCCCCC; border-left:1px solid #ABADB3; border-top:1px solid #ABADB3; color:#666666; float:left; font-family:Arial, Helvetica, sans-serif; font-size:12px; padding:3px; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px;} input[type="text"] {width:150px;} option {padding:1px 10px 1px 2px;} textarea {height:100px; width:300px;} input[type="text"]:focus, textarea:focus {border:1px solid #F6901D; color:#666666; outline:none; -moz-box-shadow:0px 0px 5px #F6901D; -webkit-box-shadow:0px 0px 5px #F6901D; box-shadow:0px 0px 5px #F6901D;} input[type="submit"] {background:url(../img/_promos.png) no-repeat; border:0; color:#FFFFFF; cursor:pointer; font-family:'LeagueGothicRegular', Arial, Helvetica, sans-serif; font-size:2.4em; height:72px; text-align:center; text-decoration:none; text-transform:uppercase; text-shadow:rgba(0,0,0,0.28) 1px 1px 1px; width:168px;} input[type="submit"]:hover {background-position:0 -72px; color:#F6901D; text-shadow:none;} .formalign {margin-left:116px;} .input_50 {width:50px;} .input_100 {width:100px;} .input_200 {width:200px;} .input_250 {width:250px;} .input_300 {width:300px;} form .optional {background:url(http://www.jezrose.co.uk/img/icon_optional.gif) no-repeat; display:block; float:left; height:13px; margin:5px 0 0 6px; text-indent:-9999px; width:53px;} form .required {background:url(../img/icon_required.gif) no-repeat; display:block; float:left; height:13px; margin:5px 0 0 6px; text-indent:-9999px; width:53px;} form .hidden {background:url(http://www.jezrose.co.uk/img/icon_hidden.gif) no-repeat; display:block; float:left; height:13px; margin:5px 0 0 -4px; text-indent:-9999px; width:44px;} form .warning {background:url(../img/icon_warning.png) no-repeat; display:block; float:left; height:16px; margin:4px 0 0 6px; text-indent:-9999px; width:17px;} #p-security {clear:both; display:none; height:0px; visibility:hidden;} #p-security label {float:none; padding:0 0 4px 0; text-align:left; width:auto;} #p-security input[type="text"] {display:block; float:none;} /*--- 52. Response Elements ---------------------------------------------------------------------------*/ #msg-response {background:url(../img/response_bkg.jpg) #FFFFFF repeat-x; border:1px solid #CCCCCC; clear:both; cursor:pointer; font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; line-height:1.3em; margin:20px 0; padding:1px; position:relative; zoom:1; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;} #msg-response a {color:#333333;} #msg-response a:hover {text-decoration:none;} #msg-response span {background:url(../img/response_close.gif) no-repeat; height:11px; position:absolute; right:10px; top:8px; width:10px;} #msg-response ul {list-style:none; padding:0;} #msg-response ul > li {font-size:1em; padding:0;} #msg-response div {padding:6px 46px; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;} .msg-error {background:url(../img/response_error.jpg) left center no-repeat; color:#B7220A;} .msg-success {background:url(../img/response_success.jpg) left center no-repeat; color:#0F8915;} /*--- 53. Skip Link ---------------------------------------------------------------------------*/ #skip-link {float:left; margin:0 0 0 -9999px; text-decoration:none;} #skip-link:focus {background:#333333; border-bottom:1px solid #FFFFFF; border-right:1px solid #FFFFFF; color:#FFFFFF; font-size:11px; margin:0; padding:3px 7px 3px 5px; position:relative; z-index:1000;}