* { margin: 0; padding: 0; outline: 0; }
html{
background:#6eb6eb;
}
body {
font-family: Arial, Helvetica, sans-serif;
color: #0c236d;
width:100%;
}
h1{
margin-bottom:0.5em;
}
.thumbi {
width:150px;
height:auto;
}
.thumbi img{
width:150px;
height:auto;
}
# {
width:700px;
margin-bottom:230px;
}
.image {
text-align:center;
float:left;
}
.image p{
}
.galerie img{
width:100%;
-moz-border-radius:5px; /* Firefox */
-webkit-border-radius:5px; /* Chrome, Safari */
-khtml-border-radius:5px; /* Konqueror */
border-radius:5px; /* CSS3 */
behavior:url(border-radius.htc); /* Internet Explorer */
}
.galerie a {
}
.galerie a:hover {
float:left;
}
.galerie{
width:100%;
}
.slider img
{
width:100px;
}
.blur img:hover
{
width:100%;
-moz-transform: scale(0.9); /* Firefox 3.6 Firefox 4 */
-webkit-transform: scale(0.9); /* Safari */
-o-transform: scale(0.9); /* Opera */
-ms-transform:scale(0.9); /* IE9 */
transform:scale(0.9); /* W3C */
}
/*
REDAXO-Modul: doForm! 3
Beschreibung: CSS-DEMO
Bereich: CSS
Für: do form! 2.x und 3.x
Stand: 20.04.2009
Version: 1.0
--------------------------------------------------------------------------
HINWEISE:
--------------------------------------------------------------------------
!! Das CSS berücksichtigt nicht alle möglichen Felder
!! Farben nicht 1 zu 1 übernehmen
!! ist ja nicht wirklich hübsch
Weitere Infos zu den CSS hier:
http://wiki.redaxo.de/index.php?n=R4.DoForm
-------------------------------------------------------
*/
/* Formular Definition */
/*//////////////////////////////////////////////////////////////////////////////*
/* Div das das Formular umschließt */
.formgen {
font-weight:normal;
padding-right: 10px;
padding-left: 10px;
}
/* Was passiert wenn auf das Label geklickt wird? */
label,
select,
input[type=checkbox],
input[type=radio],
input[type=button],
input[type=submit]
{
cursor : pointer;
}
.formgen form
{
line-height : 100%;
}
/*
Wie sehen die einzelnen Blöcke aus?
Jedes Feld wird von einem DIV umschlossen, das hier definiert werden kann
*/
.formgen .formblock
{
margin-bottom: 15px;
margin-top: 10px;
padding-top: 3px;
padding-bottom: 3px;
padding-right: 2px;
padding-left: 5px;
}
.forminfo
{
width: 500px;
margin-bottom: 15px;
padding-top: 3px;
padding-bottom: 3px;
padding-right: 2px;
padding-left: 5px;
font-weight: bold;
font-size:2em;
}
/*
Verhalten von br-Tags
*/
.formgen br
{
clear:both;
}
/*
--------- FORMULAR-OBJEKTE ------------
*/
/* Mehrzeiliges Eingabefeld */
.formgen .formtextfield
{
width: 250px;
height: 100px;
margin-left: 4px;
background-color: #ffffff;
color:#000000;
font-family:"Trebuchet MS", verdana, arial, helvetica, sans-serif;
font-size: 1.2em;
border: #000000 1px solid;
}
/* Textfeld */
.formgen .formtext
{
width: 250px;
height: 20px;
margin-left: 4px;
margin-bottom: 6px;
font-size: 1.2em;
background-color: #ffffff;
font-family:"Trebuchet MS", verdana, arial, helvetica, sans-serif;
color:#000000;
border: #000000 1px solid;
}
.formgen input:focus, .formgen input:hover,
.formgen select:focus, .formgen select:hover,
.formgen textarea:focus, .formgen textarea:hover {
background-color: #ffffff;
color:#000000;
border: #000000 1px solid;
}
.formgen .textarea
{
}
/* Label */
.formgen label {
width: 160px;
clear: both;
float: left;
height: 20px;
color: #000000;
}
/* Aussehen der Select-Ausgabe */
.formgen .formselect
{
width: 200px;
background-color: #ffffff;
margin-left: 4px;
color: #000000;
}
/* Sende-Button */
.formgen .formsubmit
{
width: 240px;
height:auto;
text-align: center;
border: 1px thin solid #ececed;
float: left;
color: #000000;
margin-bottom: 20px;
}
/* Fieldsetbeschriftung */
.formgen legend {
color: #000000;
background-color: #ececed;
width: 150px;
}
.formgen .fieldset {
margin-bottom: 20px;
margin-top: 20px;
}
/* -------------- AUSGABEN / Fehlermeldungen --------*/
/* Markierung der Labels bei Fehler */
.formgen .formerror {
border-bottom-width: 1px;
color: #b25297;
}
.formgen .formcaptcha
{
vertical-align: bottom;
float: left;
margin-top: 20px;
width: 100px;
}
.formgen .formreq {
color: #006633;
}
.formgen .formheadline {
color: #004A94;
padding-top: 4px;
padding-bottom: 4px;
margin-top: 5px;
margin-bottom: 5px;
font-style: bold;
font-size: 1.3em;
}
.formgen .formradio {
margin-left:20px;
}
.formgen .formcheck {
margin-left:130px;
}
.formgen .formtrenn {
padding-bottom:10px;
color:#ffffff;
}
/*//////////////////////////////////////////////////////////////////////////////*
/* Ende der Formulardefinition */
#banner {
overflow: hidden;
display:block;
margin: 0 auto;
height:300px;
width:100%;
color: #ffffff;
}
.banner img{
min-width:100%;
max-width: 990px;
}
#nav > ul {
margin: 0;
}
#nav > ul > li {
border-radius: 10px 10px 0 0;
display: inline-block;
margin-left: 0.5em;
padding: 0.5em 1.5em;
}
#nav > ul > li a {
color: #FFF;
text-decoration: none;
font-size: 1.8em;
}
#nav > ul > li:first-child {
margin-left: 0;
}
#nav > ul > li:hover a {
color: #fff;
}
#nav > ul > li.active {
background: #3ac984;
}
#nav > ul > li.active a {
color: white;
}
#nav > ul > li > ul {
display: none;
}
#navi > ul {
margin: 0;
}
/*font-family: 'Ubuntu', sans-serif;*/
a { color: #000000; text-decoration: none; cursor: pointer; }
a:hover { text-decoration: underline; }
a img { border: 0; }
a.more { color: #2b9208; text-decoration: underline; padding-left: 11px; background: #ffffff; }
a.more:hover { text-decoration: none; }
input, textarea, select { font-size: 12px; font-family: arial, sans-serif; }
textarea { overflow: auto; }
.cl { display: block; min-height: 30px; font-size: 0; line-height: 0; text-indent: -4000px; clear: both; }
.notext { font-size: 0; line-height: 0; text-indent: -4000px; }
.left, .alignleft { float: left; display: inline; }
.right, .alignright { float: right; display: inline; }
article, aside, details, footer, header, menu, nav, section { display: block; }
#pdf { padding-bottom:5px;}
.shell { width:100%; margin: 0 auto; }
.container { background:#ffffff; width:990px; margin-bottom:15px;}
#header { margin:0 auto; width:100%;background: #0c236d; height:100px; position:fixed;}
#logo { width: 600px; float: left; font-size: 0; line-height: 0; height:90px; margin-top:10px; position:fixed;}
#logo a {height:100px; display: block; background: url(/files/logo_garageseftigen.png) no-repeat; text-indent: -4000px; }
#top { float:right; margin-top: 0px; padding-left: 50px; margin-right:30px; width: 40%; font-size:0.9em; line-height:1.3em; z-index:1;}
#edit {padding-bottom:20px;}
.search { float: right; }
.search input.field { border: 1px solid #d6d6d6; background: #ededed; width: 166px; height: 24px; line-height: 22px; padding: 0px 10px; float: left; font-size: 11px; font-family: verdana, arial, helvetica, serif; color: #bebebe; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px;}
.search input.search-btn { width: 22px; height: 26px; margin-left: 3px; border: 0; cursor: pointer; background: url(images/search-btn.png) no-repeat 0 0; float: left; font-size: 0; line-height: 0; text-indent: -4000px; }
#navigation { clear:both; float:right; height: 50px; padding-top:30px; padding-right:20px; font-family: Arial, Helvetica, sans-serif; font-weight: 500; background:none;z-index:9999;}
#navigation ul { list-style: none; list-style-position: outside; }
#navigation ul li { float: left; padding-right: 2px; padding-left: 2px; padding-top:2px; line-height: 28px; font-size: 13px; width:130px; text-align:center;}
#navigation ul li a { display: block; padding: 0px 12px; color: #0c236d; background: #ffed00; }
#navigation ul li a:hover { text-decoration: none; background:#0c236d; color:#ffed00; }
#navigation ul li.first a { padding-left: 38px; background:#6eb6eb;}
#navigation a.nav-btn { display: block; }
.slider-holder { position: relative; z-index: 5; }
.slider-holder span.slider-b { background: none; width: 100%; height: 30px; position: absolute; bottom: 0px; left: 0px; z-index: 100;}
.slider-holder span.slider-shadow { background: none; width: 990px; height: 13px; position: absolute; top: 0px; left: 0px; z-index: 100; display: block; }
.slider { width: 990px; height: 378px; position: relative; background: url(images/slide-img.png) no-repeat 0 0;}
.slider ul.slides { list-style: none; list-style-position: outside; }
.slider ul.slides li { width: 990px; height: 378px; float: left; position: relative; overflow: hidden; }
.slider ul.slides li .img-holder { width: 741px; height: 347px; position: absolute; bottom: 0px; right: 0px; }
.slider ul.slides li .img-holder img { width: 741px; height: 347px; }
.slider ul.slides li .slide-cnt { width: 320px; padding: 33px 0 0 34px; position: absolute; left: 0; top: 20px; }
.slider ul.slides li .slide-cnt h2 { font-size: 44px; line-height: 44px; padding-bottom: 16px; color: #fff; text-shadow: rgba(0,0,0,0.4) 0px 1px 2px; font-family: Arial, Helvetica, sans-serif; font-weight: 700; }
.slider ul.slides li .slide-cnt p { color: #fff; font-size: 14px; padding-bottom: 22px; }
.slider ul.slides li .slide-cnt a.grey-btn { background: url(images/grey-btn.png) no-repeat 0 0; width: 186px; height: 45px; text-align: center; line-height: 40px; display: block; font-weight: bold; font-size: 18px; color: #636363; text-shadow: rgba(255,255,255,0.4) 0px 1px 0px; }
.slider ul.slides li .slide-cnt a.grey-btn:hover { background-position: 0 -47px; text-decoration: none; }
.flex-control-nav { left: 480px; }
.main a.m-btn-grey { display: none; }
.main table {
width: 100%;
border-collapse: collapse;
font-family: Arial, Helvetica, sans-serif;
}
/* Zebra striping */
.main tr:nth-of-type(odd) {
background: #eee;
border:0px solid #FFFFFF;
}
.main th {
background: #333;
color: white;
}
.main td, th {
padding:9px;
vertical-align:text-top;
text-align: left;
}
.main { padding: 0px 5px 15px; background:inherit; font-size:0.8em;}
.main ul{ line-height:1.9em; margin-bottom:20px; }
.main h1 { font-size: 24px; color: #000000; line-height: 26px; padding-bottom: 8px; font-family: Arial, Helvetica, sans-serif; font-weight: 700; text-transform:uppercase; margin-bottom:20px;}
.main h2 { font-size: 18px; color: #000000; line-height: 22px; padding-bottom: 8px; font-family: Arial, Helvetica, sans-serif; font-weight: 600; margin-bottom:20px; }
.main h3 { font-size: 16px; color: #000000; line-height: 18px; padding-bottom: 8px; font-family: Arial, Helvetica, sans-serif; font-weight: 600; margin-top:10px; }
.main section { clear: both; }
.main ul { list-style: none; list-style-position: outside;}
.main ul li { padding-bottom: 8px; list-style-type: disc; line-height:1.6em; margin-left:20px; padding-left:5px; }
.main ul li a { color: #6eb6eb; text-decoration: underline; }
.main ul li a:hover { text-decoration: none; color: #000000;}
.main .cols { padding-top: 30px; padding-bottom: 30px; padding-left:30px; }
.main .cols a{ background: color:#333333; }
.main .cols a:hover{ color:#6eb6eb; text-decoration:none;}
.main .cols .col { width: 430px; float: left; padding-top:20px;}
.main .cols .col:after { content:''; width: 100%; clear: both; }
.main .cols .col + .col { margin-right:0px; padding-left:50px; }
.main .cols .col img { max-width:100%; height:auto; }
.main .cols .col-cnt { width: 300px; float: right; }
.main .cols .col2 { width: 300px; float: left; }
.main .cols .col2 img { max-width:150px; height:auto; }
.main .post { background:#ffffff; color:#000000; padding:30px; }
.main .post img { max-width:100%; height: auto; margin-left:10px;}
.main .post .video-holder { width: 635px; height: 245px; float: left; margin-right: 20px; }
.main .post h2 { padding-bottom: 15px; }
.main .post p { padding-bottom: 8px; }
.main .post p strong { display: block; }
.main .post-cnt { float: left; width: 100%; padding-right:0px; padding-top:20px;}
.main .post-cnt1 { float: none; width: 100%; padding-bottom:30px;}
.main .post-cnt1 img { max-width:100%;}
.main .post-cnt1 h1{ background:#6eb6eb; padding:20px 10px; font-weight:800; font-size:18px;}
.main .testimonial { padding:20px; background: transparent; }
.main .testimonial strong.quote { font-size: 28px; font-family: georgia ,arial, helvetica, serif; position: relative; top: 10px; left: -6px; }
.testimonial h2 { padding-bottom: 12px; }
.testimonial p { padding-bottom: 6px; }
.testimonial p.author { text-align: right; }
.socials { background: #inherit; height: 100%; text-align:center; padding-top:5%;}
.socials-inner { background: url(images/socials-inner.png) repeat-x 0 0; padding-left: 158px;}
.socials h3 { float: left; font-size: 18px; line-height: 49px; padding-right: 19px; padding-bottom: 0; font-family: Arial, Helvetica, sans-serif; font-weight: 500; }
.socials ul { list-style: none; list-style-position: outside; line-height: 49px; }
.socials ul li { font-size: 11px; padding-right: 18px; color: #7c7c7c; background: transparent; text-transform: uppercase; float: left; }
.socials ul li a { color: #7c7c7c; text-decoration: none; display: block; padding-left: 28px; position: relative; }
.socials ul li a span { background: url(images/socials.png) no-repeat 0 0; position: absolute; width: 20px; height: 20px; top: 13px; left: 0; }
.socials ul li a:hover { color: #333; }
.socials ul li a.facebook-ico span { background-position: 0 0; }
.socials ul li a.twitter-ico span { background-position: -22px 0; }
.socials ul li a.rss-feed-ico span { background-position: -44px 0; }
.socials ul li a.myspace-ico span { background-position: -67px 0; }
.socials ul li a.john-doe-123-ico span { background-position: -89px 0; }
#footer {color:#ffffff; margin: 0 auto; height:100%; padding-bottom:20%; padding-top: 20px; background:#0c236d; text-align:center; }
#footer img {margin-right:40px; height:auto; }
#footer a {color:#FFFF00; }
.footer-cols { padding: 16px 14px; font-size:10px; }
.footer-cols .col { float: left; width: 195px; }
.footer-cols .col + .col { padding-left: 0; }
.footer-cols .col ul { list-style: none; list-style-position: outside; }
.footer-cols .col ul li { color: #3399CC; font-size: 16px; padding-bottom: 4px; background: url(images/arr-footer-col.png) no-repeat 0 8px; padding-left: 9px; }
.footer-cols .col ul li a { color: #3399CC; }
.footer-bottom { height: 38px; padding-top: 24px; padding: 24px 20px 0; border-top: 1px solid #262c2c; }
.footer-bottom .footer-nav { float: left; line-height: 1.4em; }
.footer-bottom .footer-nav ul { list-style: none; list-style-position: outside; }
.footer-bottom .footer-nav ul li { display: inline; font-size: 22px; color: #9e9e9e; border-left: 1px solid #1a1f20; padding: 0 11px; }
.footer-bottom .footer-nav ul li.first { padding-left: 0; border: 0; }
.footer-bottom .footer-nav ul li a { color: #5f6261; }
.footer-bottom .footer-nav ul li a:hover,
.footer-bottom .footer-nav ul li.active a { color: #9e9e9e; text-decoration: underline; }
.footer-bottom p.copy { float: right; line-height: 11px; font-size: 11px; color: #5f6261; }
.footer-bottom p.copy span { padding: 0 11px; }
.footer-bottom p.copy a { color: #2b9208; text-decoration: underline; }
.footer-bottom p.copy a:hover { text-decoration: none; }
.footer-bottom p.copy strong { font-weight: normal; }
/* #Media Queries
================================================== */
/* #Media Queries
================================================== */
/* ipad portrait */
@media only screen and ( min-width: 768px) and ( max-width: 990px ) {
body { width: 668px; }
.shell { width: 648px; }
#navigation ul li a { padding: 0 12px; }
#navigation ul li.first a { padding-left: 5px; }
.slider-holder { position: relative; }
.slider-holder span.slider-b { background: url(images/t-slider-bottom.png) no-repeat 0 0; width: 748px; height: 30px; position: absolute; bottom: -13px; left: 0px; z-index: 100;}
.slider-holder span.slider-shadow { background: transparent; display: none; }
.flex-control-nav { left: 346px; }
.slider { width: 748px; height: 292px; position: relative; background: url(images/t-slide-img.png) no-repeat 0 0;}
.slider ul.slides { list-style: none; list-style-position: outside; }
.slider ul.slides li { width: 748px !important; height: 292px; float: left; position: relative; }
.slider ul.slides li .img-holder { width: 537px; height: 266px; position: absolute; bottom: 0px; right: 0px; }
.slider ul.slides li .img-holder img { width: 537px !important; height: 266px !important; }
.slider ul.slides li .slide-cnt { width: 320px; padding: 0px 0 0 34px; }
.slider ul.slides li .box-cnt { width: 285px; }
.slider ul.slides li .slide-cnt h2 { font-size: 40px; line-height: 40px; padding-bottom: 16px; color: #fff; text-shadow: rgba(0,0,0,0.4) 0px 1px 2px; font-family: Arial, Helvetica, sans-serif; font-weight: 700; }
.main { padding: 47px 0 0 0; }
.main section { no-repeat center bottom; padding-left: 20px; padding-right: 20px; }
.main .cols { padding:20px 30px; }
.main .cols .col { width: 300px; float: left; padding-right:10px; }
.main .testimonial { background: transparent; }
.main .post { background:#ffffff; padding-left: 20px ; }
.main .post .video-holder { width: 435px; height: 245px; float: none; display: block; margin-right: 0px; margin-bottom: 20px; }
.main .post-cnt { float: none; display: block; width: 100%; }
.socials-inner { padding-left: 70px; }
.footer-bottom { height: 0px; font-size:23px; }
.footer-cols { padding-left: 40px; }
.footer-cols .col { width: 350px; }
.footer-cols .col + .col { padding-left: 28px; }
.footer-cols .col ul li { font-size: 12px; }
.footer-bottom .footer-nav { float: none; display: block; padding-bottom: 18px; }
.footer-bottom p.copy { float: none; display: block; text-align: center; }
#footer img {margin-right:30px; height:auto; }
}
@media only screen and ( max-width: 767px) {
body { width: 100%; }
.shell { width: 550px; margin: 0px auto; }
#header { position: relative; z-index: 1000; padding-top: 0; padding-right: 0; }
#logo { float: none; display: none; margin: 0 auto; padding: 0 20px 20px 0; }
#top { display:inline; width: 100%; margin-top: 0px; float:right; font-size:14px; line-height:1.2em;}
#top p { padding-top:80px; padding-right:20px; }
#banner { margin-top:30px; }
.search { display: none; }
#navigation { display:none;}
#navigation li { width:610px; text-align:center;}
#mobile { position:relative; padding-top:30px; }
#navigation ul li a { padding: 0 15px; font-size:18px; height:30px; }
#navigation ul li.first a { padding-top: 16px; }
.m-slider { background: #000000; position: relative; margin: 0 auto; width: 310px;}
.slider-holder { position: relative; margin: 0 auto; width: 310px; }
.slider-holder span.slider-b { background: url(images/m-slider-bottom.png) no-repeat 0 0; width: 310px; height: 12px; position: absolute; bottom: -3px; left: 0px; z-index: 100;}
.slider-holder span.slider-shadow { background: transparent; display: none; }
.flex-control-nav { left: 130px; }
.slider { width: 510px; height: 181px; overflow: hidden; position: relative; background: url(images/m-slide-img.png) no-repeat 0 0;}
.slider ul.slides li { width: 310px !important; height: 181px !important; float: none; }
.slider ul.slides li .img-holder { width: 250px !important; height: 134px !important; bottom: -10px !important; left: 50%; margin-left: -145px; }
.slider ul.slides li .img-holder img { width: 250px !important; height: 134px !important; }
.slider ul.slides li .slide-cnt { width: 300px; margin: 0 auto; padding: 0px 0 0 0px; }
.slider ul.slides li .box-cnt { display: none; }
.slider ul.slides li .slide-cnt h2 { font-size: 22px; text-align: center; line-height: 25px; padding-bottom: 16px; color: #fff; text-shadow: rgba(0,0,0,0.4) 0px 1px 2px; font-family: Arial, Helvetica, sans-serif; font-weight: 700; }
.slider ul.slides li .slide-cnt a.grey-btn { display: none; }
.main { padding: 10px 0 0 0; font-size:18px;}
.main section { padding: 0 20px 20px 20px; }
.main .cols { margin: 0 0 0 0; }
.main .cols .col { width:100%; float: none; display: block; margin: 0 auto; }
.main .cols .col img { float: none; display: block; margin-left:0px; }
.main .cols .col + .col { padding-left: 0px; }
.main .cols .col-cnt { text-align: center; float: none; display: block; }
.main .post { background:#ffffff; padding-top: 28px; padding-left: 0px; border-bottom:none; }
.main .post .video-holder { width: 280px; height: 102px; float: none; display: block; margin: 0 auto 20px; }
.main .post .video-holder img { width: 280px; height: 102px; }
.main .post-cnt { float: none; display: block; width: 100%; }
.main .post-cnt p strong { display: block; padding-bottom: 12px; }
.testimonial h2 { font-size: 21px; }
.testimonial p.author { text-align: center; }
.socials {width:100%; height: 100%; }
.socials-inner { padding-left: 10px; }
.socials h3 { float: none; display: block; }
.socials ul li { display: block; float: none; line-height: 30px; }
.socials ul li a { display: block; float: none; }
.socials ul li a span { top: 4px; }
#footer { background:#FFFFFF; margin-left:0px; padding-bottom:120px; border-top: #666666 1px solid; padding-left:10px;}
#footer img {margin-top:0px; }
.footer-cols { padding-left: 10px; padding-right: 0; padding-top:-100px; height:0px;}
.footer-cols .col { width: 320px; float: none; display: block; padding-top: 0px; }
.footer-cols .col + .col { padding-left: 0px; }
.footer-cols .col ul li { font-size: 22px; }
.footer-bottom { height: 8px; }
.footer-bottom { padding: 10px 9px 20px; height: 100%; }
.footer-bottom .footer-nav { float: none; display: block; padding: 0 0px 18px; }
.footer-bottom .footer-nav ul li { padding: 0 4px; border: 0; font-size: 10px !important; }
.footer-bottom p.copy { float: none; display: block; text-align: center; }
.footer-bottom p.copy strong { display: block; padding-top: 10px; }
.footer-bottom p.copy span { display: none; }
#m-nav {background:none;
display: block; padding-top:50px;
}
ul#m-nav li {
list-style: none;
text-align: left;
padding: 8px 0px 20px 0px;
}
#open {
position:relative;
color: #fff;
width:100%;
padding: 10px 0;
background: #0000CC;
border-bottom: gray solid 1px;
text-align: center;
}
}
@media only screen and ( max-width: 767px) and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-resolution: 240dpi) {
#navigation a.nav-btn span.arr { background: #00000; -webkit-background-size: 13px 18px; -moz-background-size: 13px 18px; background-size: 13px 18px; }
#navigation a.nav-btn span.arr.active { background: url(images/nav-arr@2x.png) no-repeat 0 bottom; -webkit-background-size: 13px 18px; -moz-background-size: 13px 18px; background-size: 13px 18px; }
#logo a { background: #FFFFFF url(/files/bluesign_logo.png) no-repeat 0 20px; -webkit-background-size: 280px 85px; -moz-background-size: 280px 85px; background-size: 280px 85px; margin-left:40px; padding-top:40px; }
#top { display:block; float:none; width:100%; font-size:0.9em; line-height:1.3em; z-index:1;}
.cl {display:none;}
}
@media only screen and ( max-width: 467px) {
body { width: 100%; line-height:1.9em;}
.shell { width: 320px; margin: 0px auto; }
#header { position: relative; z-index: 1000; padding-top: 0; padding-right: 0; display:none; }
#logo { float: none; display: none; margin: 0 auto; padding: 0 0 0 0; }
.search { display: none; }
#navigation { display:none;}
#navigation li { width:310px; text-align:center;}
#mobile { display:none; }
#navigation ul li a { padding: 0 15px; font-size:18px; height:30px; }
#navigation ul li.first a { padding-top: 16px; }
.m-slider { background: #000000; position: relative; margin: 0 auto; width: 310px;}
#top { display:inline; float:none; width:100%; font-size:0.9em; line-height:1.3em; z-index:1;}
#top p{ padding-top:60px; padding-right:10px;}
#banner {height:200px; margin-bottom:-70px;}
.slider-holder { position: relative; margin: 0 auto; width: 310px; }
.slider-holder span.slider-b { background: url(images/m-slider-bottom.png) no-repeat 0 0; width: 310px; height: 12px; position: absolute; bottom: -3px; left: 0px; z-index: 100;}
.slider-holder span.slider-shadow { background: transparent; display: none; }
.flex-control-nav { left: 130px; }
.slider { width: 510px; height: 181px; overflow: hidden; position: relative; background: url(images/m-slide-img.png) no-repeat 0 0;}
.slider ul.slides li { width: 310px !important; height: 181px !important; float: none; }
.slider ul.slides li .img-holder { width: 250px !important; height: 134px !important; bottom: -10px !important; left: 50%; margin-left: -145px; }
.slider ul.slides li .img-holder img { width: 250px !important; height: 134px !important; }
.slider ul.slides li .slide-cnt { width: 300px; margin: 0 auto; padding: 0px 0 0 0px; }
.slider ul.slides li .box-cnt { display: none; }
.slider ul.slides li .slide-cnt h2 { font-size: 22px; text-align: center; line-height: 25px; padding-bottom: 16px; color: #fff; text-shadow: rgba(0,0,0,0.4) 0px 1px 2px; font-family: Arial, Helvetica, sans-serif; font-weight: 700; }
.slider ul.slides li .slide-cnt a.grey-btn { display: none; }
.main { padding: 10px 0 0 0; font-size:20px; }
.main section { margin:10px; }
.main .cols { margin: 0 0 0 0; }
.cl {display:none;}
.main .cols .col { width:100%; float: none; display: block; margin: 0 auto; }
.main .cols .col img { float: none; display: block; margin-left:0px; margin-bottom:10px; }
.main .cols .col + .col { padding-top: 30px; margin-left:0px;}
.main .cols .col-cnt { text-align: left; float: none; display: block; }
.main .post { padding-top: 5px; padding-left: 0px; border-bottom:none; min-height: 2px; }
.main .post .video-holder { width: 280px; height: 162px; float: none; display: block; margin: 0 auto 20px; }
.main .post .video-holder img { width: 280px; height: 162px; }
.main .post-cnt1 { float: none; display: block; width: 100%; }
.main .post-cnt p strong { display: block; padding-bottom: 12px; }
.main .post-cnt1 img{ max-width:300px; height:auto; }
.testimonial h2 { font-size: 21px; }
.testimonial p.author { text-align: center; }
.socials { padding-bottom: 40px; margin-top:20px; height: 100%; font-size:12px; background:#FFFFFF;}
.socials-inner { padding-left: 10px; }
.socials h3 { float: none; display: block; }
.socials ul li { display: block; float: none; line-height: 30px; }
.socials ul li a { display: block; float: none; }
.socials ul li a span { top: 4px; }
#footer h2 { padding-bottom: 12px; }
.footer-cols { padding-left: 10px; padding-right: 0; padding-bottom: 0; font-size:12px; color: #0066CC;}
.footer-cols .col { width: 320px; float: none; display: block; padding-bottom: 2px; }
.footer-cols .col + .col { padding-left: 0px; }
.footer-cols .col ul li { font-size: 22px; }
#footer { background:#0c236d; padding-bottom:430px; padding-top:25px; border-top:#666666 1px solid; padding-left:0px;}
#footer img {margin-left:25px; width:150px; height:auto;}
.footer-bottom { height: 8px; }
.footer-bottom { padding: 10px 9px 20px; }
.footer-bottom .footer-nav { float: none; display: block; padding: 0 0px 18px; }
.footer-bottom .footer-nav ul li { padding: 0 4px; border: 0; font-size: 10px !important; }
.footer-bottom p.copy { float: none; display: block; text-align: center; }
.footer-bottom p.copy strong { display: block; padding-top: 10px; }
.footer-bottom p.copy span { display: none;
}
/* Force table to not be like tables anymore */
.main table, thead, tbody, th, td, tr {
display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}
tr { border:none;
}
td {
/* Behave like a "row" */
border: none;
border-bottom:none;
position: relative;
padding-left: 50%;
}
td:before {
/* Now like a table header */
position: absolute;
/* Top/left values mimic padding */
top: 6px;
left: 6px;
width: 45%;
padding-right: 10px;
white-space: nowrap;
}
}
/*
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.
*/
@media
only screen and (max-width: 460px),
(min-device-width: 368px) and (max-device-width: 470px) {
/* Force table to not be like tables anymore */
.main table, thead, tbody, th, td, tr {
display: block; font-size:1.2rem; min-width:180px;
}
.main p, td {
margin-top:0px;
}
/* Hide table headers (but not display: none;, for accessibility) */
thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}
tr { border:none;
}
td {
/* Behave like a "row" */
border: none;
border-bottom:none;
position: relative;
padding-left: 50%;
}
td:before {
/* Now like a table header */
position: absolute;
/* Top/left values mimic padding */
top: 6px;
left: 6px;
width: 45%;
padding-right: 10px;
white-space: nowrap;
}
#bluesign{
font-size:1em;
text-align:center;
margin:0px;
}
}