/*

Theme Name: PowerItalia2

Theme URI: http://poweritalia.com

Author: Prem

Author URI: http://premprakash.com/

Description: PowerItalia theme (version 1.3) for PowerDevelopments based on The 2011 theme for WordPress.

 It supports

 - custom menu, header image, and background

 - light or dark color scheme, custom link colors, ,three layout choices.

 - Showcase page template that transforms your front page into a showcase to show off your

      best content,

      widget support galore (sidebar, three footer areas, and a Showcase page widget area),

      and a custom "Ephemera" widget to display your

      		Aside, Link, Quote, or Status posts.

- Included are styles for print and for the admin editor,

- support for featured images (as custom header images on posts and pages and as large images on featured "sticky" posts), and special styles for six different post formats.



Version: 1.3

License: GNU General Public License

License URI: license.txt



Tags: dark, light, white, black, gray, one-column, two-columns, left-sidebar, right-sidebar, fixed-width, flexible-width, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-image-header, featured-images, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready



*/



/* base */

html, body, p, dl, dd,dt ,blockquote,table,th, td, ul, ol, li,

form, img , fieldset, caption, legend, textarea,

h1,h2,h3,h4,h5,h6,address  { margin:0; padding:0; vertical-align:baseline; line-height:1em; font-size:100%; font:inherit; }

h1,h2,h3,h4,h5,h6,address,pre,p,span,th,td { font-style:normal; font-weight:normal; font-size:100%; }



a, a:link, a:visited, a:hover, a:active, a:focus { text-decoration:none; color:inherit ; outline:0 none; }

a img, img, object { border:0; }

:focus { outline:0; }

ol, ul, li { list-style-type:none; }

li { list-style-position:outside; }

li li, li p, li a, p a{ font-size:100%; }



table { border-collapse: collapse; border-spacing:0;  table-layout:auto; }

blockquote, q{ quotes: none }

blockquote:before, q:before, blockquote:after, q:after { content:''; content:none; }

blockquote p { padding-left:0px; padding-bottom:0em; margin:0 0 0.5em;}



html { font-size:100%; height:100.1% }

body { height:100.1%; font-size:14px; line-height:1.25; font-family: sans-serif; }



table>tr { vertical-align:baseline;}

th{ text-align:left; }

td{ vertical-align:middle;}



input, select { vertical-align: middle; }

select, input, textarea, button { font:99% sans-serif; }



pre, code, kbd, samp { font-family: monospace, sans-serif; }



pre {

  /* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */

  white-space: pre; white-space: pre-wrap; word-wrap: break-word;

  padding: 15px;

}



textarea { overflow: auto; } /* www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/ */

legend{ _margin-left: -7px; }



/* Align checkboxes, radios, text inputs with their label by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css  */

input[type="radio"] { vertical-align: baseline; vertical-align: text-bottom; }

input[type="checkbox"] { vertical-align: bottom; }



/* Hand cursor on clickable input elements */

label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }



/* basic styles */



p,dd,td,th,li { line-height:140%; }

/*a, a:link, a:visited, a:active { color:#006699; outline:0 none;} */

a:hover {text-decoration:none; color:#ccc; }

p{ margin-bottom:18px; line-height:140%;  width:800px; max-width:800px;}



h1, h2,h3,h4, h5, h6 { color:#CC0000; font-weight:bold; margin-bottom:20px; }

h1 { font-size:18px; font-weight:normal; line-height:24px; }

h2 { font-size:16px;  }

h3 { font-size:14px; }



em, strong { font-weight:bold; font-style:normal; }









ul.dotted , ul.dotted li { 

    list-style-type:

        disc

    ;

    list-style-position:

        outside

    ;

    margin-left:

        20px

    ;

}



/* MASTER LAYOUT */



@font-face {

    font-family: 'RhodeMediumCondensed';

    src: url('fonts/rhomdcn_-webfont.eot');

    src: url('fonts/rhomdcn_-webfont.eot?#iefix') format('embedded-opentype'),

         url('fonts/rhomdcn_-webfont.woff') format('woff'),

         url('fonts/rhomdcn_-webfont.ttf') format('truetype'),

         url('fonts/rhomdcn_-webfont.svg#RhodeMediumCondensed') format('svg');

    font-weight: normal;

    font-style: normal;



}



.headline-text,#contact-details { font-family:'RhodeMediumCondensed', impact, arial-narrow, sans-serif; text-transform: uppercase; font-size:24px; font-weight:normal; line-height:37px; max-width: 468px; margin-left: -60px;  }



body { background: #000 url(img/bg-pattern.png) repeat-x scroll top left; position:relative;  color:#fff; font-size:12px; font-family: arial, sans-serif; }

h1 { color:#fff; /*margin:0 0 0 6px;*/}



.tray { width:919px; margin:0 auto;}



#page { width:950px; background: transparent url(img/pg-bg.png) repeat-y scroll top center; padding:0 15px 1px; margin:0 auto; }



#pg-header { position:relative; background-color:#000;}

#pg-header p  { margin:0; display:inline; }

#bar-site-name { height: 65px; background: #000 url(img/bg-pd.png) repeat-x scroll top left; position:relative; }

#pg-header a.sitename { width:190px; height:40px; position:absolute; right:10px; top:19px; }

.tel, a.email {color:#b2b2b2; font-family:tahoma, sans-serif; font-size:11px; position:absolute;}

.tel { top:42px; left:14px; }

.email { top:42px; left:120px; }

.email:hover , a:hover .tel { color:#ccc; }


.fb_edge_widget_with_comment {
    float: right;
    margin-right: -12px;
    margin-top: -51px;
    position: relative;
}


#nav-container {

      height:130px;

      position:absolute;

      top:65px;

      left:0;

      width:919px;

      z-index:999;

      background:

          transparent

          url(img/bg-nav.png)

          repeat-x

          scroll

          top

          left

       ;

}





#main-nav {height: 43px; margin-top:31px; }

#main-nav li { float:left; margin-left:19px; display:inline-block; width:161px; }

#main-nav li a { display:inline-block; width: 161px; text-align:center; vertical-align:middle;  background: transparent url(img/bg-nav-btn.png) no-repeat scroll  -182px 0; height:43px; line-height:43px; font-family: arial, sans-serif; font-weight:bold; font-size:12px; color:#fff;}

#main-nav li a:hover, #main-nav li a.on, #main-nav li.current_page_item a  { background-position: 0 0 ;}









.banner-poweritalia { background: transparent url(img/banner-pi.png) no-repeat scroll top left; width:909px; height:345px; }

.banner-contact-us { background: transparent url(img/banner-contactus.png) no-repeat scroll top left; width:909px; height:345px; }

.banner-monthly-offers { background: transparent url(img/banner-monthly-special-offers.png) no-repeat scroll top left; width:909px; height:345px; }

.banner-about-us { background: transparent url(img/aboutus.png) no-repeat scroll top left; width:909px; height:345px; }

.garage-banner { background: transparent url(http://powerdevelopments.co.uk/wp-content/uploads/2012/01/workshop.jpg) no-repeat scroll top left; width:909px; height:345px;}

.garage-banner2 { background: transparent url(http://powerdevelopments.co.uk/wp-content/uploads/2012/01/mini.png) no-repeat scroll top left; width:909px; height:345px;}

#txt-garage {

        background:

          transparent

          url(img/txt-garage.png)

          no-repeat

          scroll

          top left

        ;

        width:600px;

        height:62px;

        margin:105px 10px 10px 19px;

                

}

#facebookbutton{
margin-left: 204px;
margin-top: -51px;
position: absolute;
}

.pluginConnectTextDark{
color: white;
}

.facebookheader{
 color: #B2B2B2;
    font-family: tahoma,sans-serif;
    font-size: 11px;
    margin-left: 60px;
    margin-top: -49px;
    position: absolute;

}

#facebookheaderpic{
margin-left: 10px;
    margin-top: -57px;
    position: absolute;
    width: 15px;
}



#bigboxgrid {
background: -moz-linear-gradient(center top , #FFFFFF, #EDEDED) repeat scroll 0 0 transparent; /* all browsers, of course */  
    border: 1px solid #EDEDED;
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0 8px 6px -6px #CCCCCC;
    color: black;
    margin-left: -1px;
    margin-top: 24px;
    padding: 10px;
    position: static;
    width: 889px;
    background: white\9;10;8; /* IE only */  
}

#gplus{
float: right;
    margin-right: 16px;
    margin-top: -56px;
    position: relative;
}



#cstable {
-moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-collapse: separate;
    border-color: #DDDDDD;
    border-image: none;
    border-spacing: 0;
    border-style: solid;
    border-width: 1px 1px 2px;
    font-family: arial;
    font-size: 12px;
    margin: 0.2em 0 0.4em -10px;
    table-layout: fixed;
    width: 910px;
}

.t2col2 {
width: 100px;
}

.t2col3 {
text-align: center;
}

.t2col4 {
width:66px;
}

#cstable .odd{
background: none repeat scroll 0 0 #ABC0E5
}

#cstable thead th {
background-color: #3E3C3C;
    text-align: center;
	color:white;
	font-size:12px;
	padding: 10px 20px;
	border-right: 1px solid #DDDDDD;
	font-weight: bold;
}

#cstable td {
 border-right: 1px solid #DDDDDD;  
 padding: 10px 20px; 
}

.tabletitle {
    color: #ABC0E5;
    font: bold 20px arial,verdana,sans-serif;
    margin-top: 107px;
}

.tabletext {
margin-top: 11px;
}



#merc-five-table {
  -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-collapse: separate;
    border-color: #DDDDDD;
    border-image: none;
    border-spacing: 0;
    border-style: solid;
    border-width: 1px 1px 2px;
    table-layout: fixed;
    width: 875px;
    margin: 0 0 0.4em 6px;
	font-family: arial;
	font-size: 12px;
}

.merc2col2 {
text-align: center;
}

.merc2col3 {
text-align: center;
}

.merc2col4 {
}

#merc-five-table .odd{
background: none repeat scroll 0 0 #ABC0E5
}

#merc-five-table thead th {
background-color: #3E3C3C;
    text-align: center;
	color:white;
	font-size:12px;
	font-weight: bold;
	padding: 10px 20px;
	border-right: 1px solid #DDDDDD;
}

#merc-five-table td {
 border-right: 1px solid #DDDDDD;  
 padding: 10px 20px; 
 color: black;
}

#merc-four-table {
  -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-collapse: separate;
    border-color: #DDDDDD;
    border-image: none;
    border-spacing: 0;
    border-style: solid;
    border-width: 1px 1px 2px;
    table-layout: fixed;
    width: 875px;
    margin: 0.2em 0 0.4em 6px;
	font-family: arial;
	font-size: 12px;
}

.merc4col2 {
width: 100px;
}

.merc4col3 {
text-align: center;
}

.merc4col4 {
width:66px;
}



#merc-four-table .odd{
background: none repeat scroll 0 0 #ABC0E5
}

#merc-four-table thead th {
background-color: #3E3C3C;
    text-align: center;
	color:white;
	font-size:12px;
	font-weight: bold;
	padding: 10px 20px;
	border-right: 1px solid #DDDDDD;
}


#merc-four-table td {
 border-right: 1px solid #DDDDDD;  
 padding: 10px 20px; 
}

#bmwone {
 margin-left: 0px;
    margin-top: 25px;
    position: static;
}

#tabletextlow{

}

#logica {
    color: #00AAFF;
    font-size: 26px;
    margin-left: 287px;
    margin-top: -198px;
    position: absolute;
}

#logicatwo{
 font-size: 17px;
    line-height: 20px;
    margin-left: 285px;
    margin-top: -143px;
    position: absolute;
    text-align: justify;
    width: 585px;
}

#boxforgrid {
background: -moz-linear-gradient(center top , #FFFFFF, #EDEDED) repeat scroll 0 0 transparent;/* all browsers, of course */ 
    border: 1px solid #EDEDED;
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0 8px 6px -6px #CCCCCC;
    color: black;
    margin-left: -1px;
    margin-top: 24px;
    padding: 10px;
    position: static;
    width: 889px;
    background: white\9;10;8; /* IE only */
}

/*Chrome CSS here*/
#boxforgrid{
background:white;
width:890px;
}
#oilservicetable{
width:888px;

}

#bigboxgrid{
background:white;
width:890px;
}
#cstable{
width:910px;
}
}

#oilservicetable {
-moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-collapse: separate;
    border-color: #DDDDDD;
    border-image: none;
    border-spacing: 0;
    border-style: solid;
    border-width: 1px 1px 2px;
    font-family: arial;
    font-size: 12px;
    margin: 0.2em 0 0.4em -10px;
    table-layout: fixed;
    width: 910px;
}

.col2 {
width: 200px;
}

.col3 {
text-align: center;
}

#oilservicetable .odd{
background: none repeat scroll 0 0 #ABC0E5
}

#oilservicetable thead th {
background-color: #3E3C3C;
    text-align: center;
	color:white;
	font-size:12px;
	padding: 10px 20px;
	border-right: 1px solid #DDDDDD;
	font-weight: bold;
}

#oilservicetable td {
 border-right: 1px solid #DDDDDD;  
 padding: 10px 20px; 
}

#serviceselector{

}

#carcar{
 color: #E3E3E3;
    font: bold 24px/40px tahoma,arial,verdana,sans-serif;
    margin-left: 230px;
    margin-right: 20px;
    margin-top: -70px;
    position: absolute;
    text-transform: uppercase;
    }

#txt-garage-fiat {

        background:

          transparent

          url(img/txt-garage-fiat.png)

          no-repeat

          scroll

          top left

        ;

        width:600px;

        height:62px;

        margin:105px 10px 0px 19px;

}



#txt-garage-alfa-romeo {

        background:

          transparent

          url(img/txt-garage-alpha-romeo.png)

          no-repeat

          scroll

          top left

        ;

        width:600px;

        height:62px;

        margin:105px 10px 0px 19px;

}


#txt-garage-bmw {

        background:

          transparent

          url(img/txt-garage-bmw.png)

          no-repeat

          scroll

          top left

        ;

        width:600px;

        height:62px;

        margin:105px 10px 0px 19px;

}



#txt-garage-mini {

        background:

          transparent

          url(img/txt-garage-mini.png)

          no-repeat

          scroll

          top left

        ;

        width:600px;

        height:62px;

        margin:105px 10px 0px 19px;

}






#txt-services {

        background:

          transparent

          url(img/txt-services.png)

          no-repeat

          scroll

          top left

        ;

        width:300px;

        height:34px;

        margin:0px 10px 10px 19px;

}



#txt-about-us {

        background:

          transparent

          url(img/txt-aboutus.png)

          no-repeat

          scroll

          top left

        ;

        width:600px;

        height:62px;

        margin:105px 10px 40px 19px;

}







.type2 #nav-container { background-image:none; }

#page-content { margin:0 19px 0 19px; padding-bottom:15px;}

#page-content a:hover { color:#ccc; }


.type2 #page-content h3{ margin:30px 0 15px; font-size:16px; color:#666; }
.type2 #page-content h4{ margin:30px 0 15px; font-size:13px; color:#666; }

#rate-card { margin:50px 0 5px; }

#rate-card th { display:none; }

#rate-card th, #rate-card td  { vertical-align:top; padding-right:10px; padding-bottom:30px; }

#rate-card .highlight { color:#f1fe00; }

#col-items { width:170px; }

#col-details { width:400px; }

#col-rates { width:80px; }


.table-type2 { margin:10px 0 30px; border:1px solid #111; WIDTH:80%; }
.table-type2 th { font-weight:bold }
.table-type2 th, .table-type2  td  { vertical-align:top; padding: 10px 10px 20px 10px; text-align:center; border:1px solid #111;}
.table-type2 .col-left { text-align:left;}
.table-type2 .highlight { color:#f1fe00; }





#services-offered { background-color:#222; border:1px solid #333; padding:5px; margin:25px 0 30px;}

#services-offered li { float:left;  }

#services-offered li a{ display:block; width:100%; height:100% ;}

#services-offered li a:hover { opacity:0.90; }

#services-offered li.fiat-services { width:439px; height:267px; }

#services-offered li.fiat-services a{ background-image: url(img/mini-service.png);}

#services-offered li.fiat-services a:hover { background-image: url(img/mini-service-onhover.png);   }

#services-offered li.alfaromeo-services {width:421px; height:267px;  }

#services-offered li.alfaromeo-services a:hover {background-image: url(img/bmw-service-onhover.png); }

#services-offered li.alfaromeo-services a{ background-image: url(img/bmw-service.png);}





#pg-body, #pg-footer { background-color:#000; width:910px;}

#pg-footer  { margin-bottom:50px; }

#schemes { border-top:9px solid #fff; }

#schemes li {  margin:18px 17px 18px 0; float:left; display:inline-block; }

#schemes li a{ display:block; border:5px solid #fff; display:inline-block; height:75px; }

#schemes li a:hover, #schemes li a.on { border-color:#80051a;}

#schemes li.no-right-margin { margin-right:0;}





#contact-details { padding:25px 20px 30px;}

#contact-details .col { float:left; width:235px; padding-right:35px;}

#contact-details p { width:auto; margin-bottom:1px; line-height:37px; }

#contact-details a { color:#b00d28;}

.maplink { margin-top:0px;}

#page-content .maplink a:hover { color:#b00d28;opacity:0.8 }

#contact-details .last { width:275px; padding-right:10px; }



.home-text { padding: 20px 60px; }





.footer { border:1px solid #282828; color:#878787;  margin:10px 0 ; font-size:11px; 

          font-family:

            tahoma,

            sans-serif

          ;

          font-weight:normal;

          line-height:38px;

          vertical-align:middle;

          height:38px;

          background:

            transparent

            url( img/)

            no-repeat

            scroll

            6px 0px

          ;

}





.footer a.sitename {  padding-left:16px}

.copyright { float: right; padding-right:16px;}

.facebook { float: right; padding-right:0px; margin:7px 0px;}

.plusone { float: right; padding-right:0px; margin:7px 0px;}





.footer-nav { width: 350px; margin:20px 55px; }

.footer-nav li { float:left; width:105px; margin:0 10px 2px 0; display:inline-block; }

.footer-nav li a { display:inline-block; color:#878787; font-size:11px; font-family: tahoma, sans-serif; font-weight:normal;}



.footer-nav li a:hover { color:#ccc;}





/* blog posts */









.post p { width:auto;}

.blog-post-page h1 { margin:120px 0 50px 19px; font-size:60px; font-family: 'RhodeMediumCondensed', impact, 'Arial narrow', sans-serif; font-weight:normal; text-transform: uppercase; }

.blog-post-page #nav-container { background:none;}

.blog-post-page h2.title { margin:0px 0 1px 0px;  font-size:40px; color:#fff; font-family: 'RhodeMediumCondensed', impact, 'Arial narrow', sans-serif; font-weight:normal; text-transform: uppercase;}

.blog-post-page .post { width:615px; margin-bottom:40px; }

.blog-post-page #blog-posts { width:615px; margin-bottom:40px; float:left;}

.entry a { border-bottom: 1px dotted #666; }

.blog-post-page .next-prev-posts-link a, a.more-link { color:#a3021d; border-bottom:1px dashed #666; }







/*= COMMENTS */

.article-replies { padding-top:30px; }

.article-replies h3, #comment-form-container h3 {color:#ccc; font-size: 14px; font-weight:bold; padding:0 0 10px; width:250px; border-bottom:1px solid #666; }

#content li.article-comment { list-style:none; margin-left:0; margin-top:30px; border-bottom:1px solid #222;}

#content .article-comment ul { padding-left:20px; }

.comment-meta p { margin-bottom:2px; }

#content .comment-meta .date{ font-size:9px;}

.comment-meta, .comment-text { display:block; color:#666; font-size:13px;}

.comment-meta {  }

.comment-text{ }

.comment-meta{ }

.comment-meta .name{ font-weight:bold;}

.author-reply .comment-meta, .author-reply .comment-text { color:#999;}



/*= COMMENT FORM */

#comments { border-top:1px solid #A3021D; }

#comments h3 { border-top:1px solid #fff;}

#comment-form-container{ margin-top:60px; }

#comment-form-container h3{ margin-bottom:30px; }

#comment-form input, #comment-form textarea { border:1px solid #666; padding:10px;  width:520px; color:#fff; margin-bottom:10px; background-color:transparent; }

#comment-form input { width:285px;}

#comment-form #c-notify { width:20px; border:none; float:left; margin-top:5px; }

#comment-form #cbx { height:30px; }

#cbx label { line-height:22px; vertical-align:middle; }

#comment-form label { font-size: 10px; color:#fff}

#comment-form #submitcomment { border:none; background-color:#a3021d; padding:0 10px ; line-height:30px; height:30px; color:#fff; width:60px; font-weight:bold; cursor:pointer;display:block; }

.commentlist li { width:500px;}

.commentlist .commentmetadata { margin-bottom:10px; }

#comments p { color:#999; }

#comments .reply a { padding:5px 10px; background-color:#A3021D;}
#comments .comment-body { margin-bottom:30px; }
#comments .comment-body .commentmetadata{ font-size:10px;}
#comments .comment-body .comment-author { font-size:13px; }

/*= SIDEBAR */

#pg-aside { width: 220px; float:right; margin:0 0 52px 0; }

#pg-aside h3{ font-size:16px; color:#fff; padding:0 0 10px ; border-bottom:1px solid #a3021d; margin:30px 0 0; font-weight:bold;}

#pg-aside a { font-size:12px; }

#pg-aside li { padding:10px 10px 10px 0; border-bottom:1px solid #a3021d; font-size:12px; }



/*= SEARCH */

#s{ border:3px solid #a3021d; background-color:transparent; padding:5px 4px;  width:175px; color:#fff;  }

#submitbutton { background: transparent url(img/btn-search.png) no-repeat scroll top left; height:31px; width:31px; text-indent:-9999px; margin-left:-4px; border:0; cursor: pointer  }

#search-results { margin-top:30px;}

#search-results li { border-bottom:1px solid #222; list-style:none; margin-left:0 }

.search-term{ font-size:22px; font-style:italic; }









/*= SLIDES */



#slides{position:relative;overflow:visible}

.slides_container{width:909px;display:none;z-index:0}

.slides_container div{width:909px;height:345px;display:block}

.pagination{list-style:none;text-align:center;width:909px;margin:0px auto;padding:0; position:absolute; z-index:10; bottom:20px}

.pagination .current a{color:red}

.pagination li{display:inline-block}

.pagination li a{background:url(img/slide-pagination.png) no-repeat scroll left top transparent;display:block;height:18px;text-indent:-9999px;width:18px}

.pagination li.current a{background-image:url(img/slide-pagination-active.png)}

#slides a.prev{background:url(img/arrow-left.png) no-repeat scroll 0 0 transparent;height:31px;left:10px;opacity:0.8;position:absolute;text-indent:-9999em;top:48%;width:19px;z-index:999}

#slides a.next{background:url(img/arrow-right.png) no-repeat scroll 0 0 transparent;height:31px;opacity:0.8;position:absolute;right:10px;text-indent:-9999em;top:48%;width:19px;z-index:999}







/*= UTILITY STYLES */

/* For image replacement */

.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }



/* Hide for both screenreaders and browsers: css-discuss.incutio.com/wiki/Screenreader_Visibility */

.hidden { display: none; visibility: hidden; }



/* Hide only visually, but have it available for screenreaders: by Jon Neal. www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden */

.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638 */

.visuallyhidden.focusable:active,

.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }



/* Hide visually and from screenreaders, but maintain layout */

.invisible { visibility: hidden; }



.cfx:after { 	visibility: hidden;	display: block;	font-size: 0;	content: " ";	clear: both;	height: 0;	}

* html .cfx             { zoom: 1; } /* IE6 */

*:first-child+html .cfx { zoom: 1; } /* IE7 */


#bc--order-tyres {
	position: absolute;
	padding: 0 21px 0 24px;
	width: 385px;
	height: 286px;
	color: #fff;
	background: url(https://www.blackcircles.com/images/affinity-external-widgets/order-tyres-bg.jpg) left 12px no-repeat;
	margin-left:480px;
	margin-top:-324px;
	
}

#bc--order-tyres h1 {
	margin: 0 0 14px -5px;
	height: 23px;
	text-indent: -9999em;
	background: url(https://www.blackcircles.com/images/affinity-external-widgets/tyres-tab.png) left top no-repeat;
}
#bc--order-tyres div.step h2 {
	margin: 0;
	padding-bottom: 7px;
	font-family: verdana;
	font-size: 85%;
	border-bottom: solid 1px #004a7e;
}
#bc--order-tyres div.step h2 span.step {
	display: block;
	margin-bottom: 2px;
	height: 12px;
	text-indent: -9999em;
	background: url(https://www.blackcircles.com/images/affinity-external-widgets/steps-headings.png) no-repeat;
}
#bc--order-tyres div.step.one h2 span.step { background-position: left top; }
#bc--order-tyres div.step.two h2 span.step { background-position: left -12px; }

#bc--order-tyres div.tyresize {
	float: left;
	margin-right: 103px;
	width: 126px;
	height: 290px;
}
#bc--order-tyres #tyres-width-field {
	padding-top: 13px;
	border-top: solid 1px #4d97cb;
}
#bc--order-tyres div.tyresize div.field {
	margin-bottom: .9em;
}
#bc--order-tyres div.tyresize label {
	position: absolute;
	left: -9999em;
	top: -9999em;
	width: 1px;
	height: 1px;
	text-indent: -9999em;
}
#bc--order-tyres div.tyresize select {
	padding: 2px;
	min-width: 100%;
	font-family: arial;
	font-size: 85%;
	color: #333;
	border: solid 1px #c0bfc9;
}
#bc--order-tyres div.fitting,
#bc--order-tyres div.submit {
	float: left;
	width: 156px;
}
#bc--order-tyres div.fitting div.fields {
	margin-bottom: 1.5em;
	padding-top: 15px;
	background: none;
	border-top: solid 1px #4d97cb;
}
#bc--order-tyres div.fitting div.field {
	margin-bottom: .85em;
}
#bc--order-tyres div.fitting div.field,
#bc--order-tyres div.fitting label {
	display: block;
}
#bc--order-tyres div.fitting input {
	margin-right: .3em;
}
#bc--order-tyres div.fitting label {
	font-family: verdana;
	font-size: 93%;
	font-weight: bold;
}
#bc--order-tyres div.submit p {
	margin-bottom: 1.2em !important;
	font-size: 100%;
	font-weight: bold;
	font-style: italic;
}
#bc--order-tyres input.submit.find-my-tyres {
	width: 123px;
	height: 23px;
	text-indent: -9999em;
	background: url(https://www.blackcircles.com/images/affinity-external-widgets/find-my-tyres.png) left top no-repeat;
	border: none;
	cursor: pointer;
}
#bc--order-tyres input.submit.find-my-tyres:hover {
	background-position: left bottom;
}
#bc--order-tyres p.dont-know-size {
	position: absolute;
	left: 73px;
	bottom: 33px;
	margin: 0;
	font-size: 85%;
	font-weight: bold;
}
#bc--order-tyres p.dont-know-size a {
	margin: 0 .5em;
	font-weight: normal;
	color: #66b3d9;
}
#bc--order-tyres p.powered-by-bc {
	position: absolute;
	left: 196px;
	bottom: 0;
	margin: 0;
	width: 209px;
	height: 25px;
	text-indent: -9999em;
}
#bc--order-tyres p.powered-by-bc a {
	display: block;
	height: 100%;
	overflow: hidden;
}
/* Warning: the following hacks will prevent the CSS from validating */
/* IE6 & 7 hacks */
#bc--order-tyres div.step h2 {
	*white-space: nowrap;
}
#bc--order-tyres div.tyresize select {
	*width: 10.5em;
}
#bc--order-tyres div.fitting {
	*padding-bottom: 1em;
}
#bc--order-tyres input.submit.find-my-tyres {
	*display: block;
	*color: transparent;
	*text-transform: capitalize;
}
/* IE6 only hacks */
* html #bc--order-tyres div.step h2 span.step {
	font-size: 1px;
}

#tyrewidgetspesh{

}


#services-offered {
  background-color:#222;
  border:0;
  display:flex;
  width:100%;
  margin:25px 0 30px;
  padding:0;
}

#services-offered li {
  float:left;
  border:1px solid #333;
  padding:5px;
  height:267px;
  flex-grow:1;
  text-align:center;
  flex-basis:0;
}

#services-offered li a {
  display:flex;
  width:100%;
  height:100%;
  color:#000;
  font-weight:bold;
  text-transform:uppercase;
  box-shadow: inset 1px 0 2em #333;
}

#new-styles #services-offered li a {
  background: #fafafa;
  background: -moz-linear-gradient(top, #fafafa 0%, #eee 50%, #ddd 50%, #e3e3e3 100%);
  background: -webkit-linear-gradient(top, #fafafa 0%,#eee 52%,#ddd 50%,#e3e3e3 100%);
  background: linear-gradient(to bottom, #fafafa 0%,#eee 50%,#ddd 50%,#e3e3e3 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#e3e3e3',GradientType=0 );
}

#services-offered li a span {
  align-self:center;
  overflow-wrap:break-word;
  display:block;
  padding:0;
  font-size:2.6rem;
  margin:auto;
  line-height:1.2;
  font-weight:bold;
}

#services-offered li a:hover {
  opacity:0.9;
  color:#000
}

#services-offered li a:hover span {
  opacity:1;
  text-shadow:0 0 3px #000;
  text-shadow:0 0 6px #444;
}



/* -:END:- */