/**
 * JustKampers Extended Styles
 * by the JK Dev Team
 */
/*-------------------------------*/
/* Table of Contents             */
/*-------------------------------*/
/* 1. Homepage                   */
/* 2. Extra Block Styles         */
/* 3. Column Three Specific      */
/* 4. Forms                      */
/* 5. Message Styles             */
/* 6. Modal Windows              */
/* 7. Font Styles                */
/* 8. Message Styles             */
/* 9. Profile Page Additions     */
/* 10. Messages                  */
/* 11. Fleet                     */
/* 12. Requests                  */
/* 13. Tab Nav                   */
/* 14. Tag Cloud                 */
/* 15. Articles                  */
/* 16. Pagination                */
/* 17. Multimedia                */
/*-------------------------------*/

/*-------------------------------*/
/* 1. Homepage                   */
/*-------------------------------*/
.hpSortHelper {
  /*border: 1px dashed #fff;
*/
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  background:#E6E6E6;
  opacity:0.4;
  filter:alpha(opacity=40);
}
#dragHelper { z-index: 10000; }

.block-content { min-height:26px; }
.block.hpModule h2, #shop-nav-accordion .block h2 { padding: 4px 21px; }  /* TODO: test if works on all browsers */
.block-tools a.min img {
  display: block;
  width: 12px;
  height: 12px;
  position: absolute;
  top: 9px;
  left: 7px;
}
.block_arrow_all {
  background: transparent url(/images/frontend/header-double-arrow.png) -12px 0px;
}
.block_arrow_ie6 {
  background: transparent url(/images/frontend/header-double-arrow.gif) -12px 0px;
}

.collapsed .block-tools a.min img { background-position: 0px 0px; }
.block-tools a.edit {
  display: block;
  position: absolute;
  width: auto;
  right: 8px;
  top: 8px;
  font-size: 12px;
  font-weight: 400;
}
.block-tools a:link, .block-tools a:visited { color:#FFF; }
.block-tools a:hover, .block-tools a:active { color: #306085; }
.hpModuleBody .edit_box .headline {
  margin-bottom:8px;
}
.hpModuleBody .edit_box .submit_holder {
  text-align:right;padding-top:8px;
}
.hpModuleBody .edit_box {
  padding:8px;
  background:#4E4E4E;
}
.hpModuleBody .edit_box input[type=text] {
  width:100%;
}
.hpModuleBody .edit_box input[type=submit] {
  padding:2px;
}
.hpModuleBody .edit_box select {
  width:100%;
}

.cp-content p.overlay span { display:block; }

.friend_fp_holder {
  float:left;padding-right:10px;
  text-align:center;
}

/*****************************/
/* 1.4.2 - Weather Sprites   */
/*****************************/

.weather_entry_image {
  width:68px;
  float:left;
}
.weather_entry_description {
  float:left;
  width:135px;
}

img.weather { width: 60px; height: 60px; background: url(/images/frontend/weather_icons.png) 0px 0px no-repeat; overflow: hidden; }

img.clear,
img.sunny               { background-position:0px    0px }
img.sunny_intervals     { background-position:0px  -60px }
img.cloudy              { background-position:0px -120px }
img.drizzle,
img.light_rain          { background-position:0px -180px }
img.light_showers       { background-position:0px -240px }
img.heavy_rain          { background-position:0px -300px }
img.heavy_showers       { background-position:0px -360px }
img.sleet               { background-position:0px -420px }
img.sleet_showers       { background-position:0px -480px }
img.hail_showers        { background-position:0px -540px }
img.hail                { background-position:0px -600px }
img.light_snow          { background-position:0px -660px }
img.light_snow_showers  { background-position:0px -720px }
img.heavy_snow          { background-position:0px -780px }
img.heavy_snow_showers  { background-position:0px -840px }
img.thundery_showers    { background-position:0px -900px }

/*----------------------------------------------*/
/* 1.4.4 - Shop Homepage Blocks                 */
/*----------------------------------------------*/
.shop-product p { margin-left:112px; padding-bottom:2.75em; }
.product-img-box { width:225px; }

/*-------------------------------*/
/* 2. Extra Block Styles         */
/*-------------------------------*/
.block .pad-content, .block-blog-post .pad-content { padding: 8px; }
.block .pad-content p { margin: 8px 5px; padding: 0; font-size:12px; line-height:15px;}
.block .pad-content h3 { margin: 15px 5px 0 10px; padding: 0 0 0 5px; color:#40246c; font-size:16px;}
.block .pad-content p.first { margin-top: 0; }
.block .pad-content h3, .block .pad-content h4 { margin: 0 0 10px 0; }
#join-community li, .block ul.arrow-bullets li {
  padding: 4px 5px;
}
.numbered-menu li div { margin-left: 16px; }
.numbered-menu .number { position: absolute; left: 8px; }
.float50pc { width: 50%; float: left; }

/*-------------------------------*/
/* 3. Column Three Specific      */
/*-------------------------------*/
#join-community #join-now {
  width: 80px; height: 80px;
  position: absolute; right: 3px; top: 38px;
}

/*-------------------------------*/
/* 4. Forms                      */
/*-------------------------------*/
.form li { padding:3px 5px 5px; }
.form .form-row, .form .form-actions { clear: left; }
.form label { float: left; width: 90px; padding: 4px 0; }
.form label.width130 { float: left; width: 130px !important; padding: 4px 0; }
.form label.inline { float:none; width:auto; padding:0; }
.form .label-150 label { width: 150px; }
.form .form-row div, .form .form-actions { margin: 0 0 10px 100px; }
.form .form-actions130 { margin: 0 0 6px 130px; }
.form span.description {
  display: block;
  padding: 3px 5px 3px 20px;
  font-size: 90%;
  background: url(/images/form-info-icon.png) no-repeat 2px 3px;
}
.form .text,
.form .validate-select {
  border: 1px solid #D5D5D5;
  background-color: white;
  padding: 3px;
  color: black;
  width: 200px;
}
.form .text-wide { width: 300px }
.form div.range { margin-left:90px; }
.form div.range_width130 { margin-left:130px; }

.form .radio_list li {
  display:inline; clear: none;
}
.form .radio_list label {
  float:none;
}

/* To make a 'proper' form then use fieldset, the above styles will be adjusted to suit */
.form fieldset label { width: 140px; }
.form fieldset .text { width: 250px; }
.form fieldset .validate-select { width: 258px; }
.form fieldset .form-row div, .form fieldset .form-actions { margin-left: 145px; }
.form fieldset { margin: 12px 0 18px; padding: 8px; border: 1px solid #D5D5D5; }
.form legend { padding: 2px 10px; background-color: #E3E3E3; color: #306085; font-weight: bold;}
.form fieldset dl { float: right; width: 250px; margin: 0 8px 0 0; font-size: 11px;
  background: #C1DDFF url(/images/information.gif) no-repeat top right; 
}
.form fieldset dt { float:none; padding:0; margin:4px; display:block; font-weight:bold; }
.form fieldset dd { float:none; padding:0; margin:4px 4px 8px 12px; border:0; display:block; }
.form fieldset .radio_list { padding-top: 4px; }
.form .radio_list li {border:none !important}
.niceform-actions { margin-left: 154px; }

#required-field-msg { background-color: #FFF6C1; padding: 4px 8px; margin: 8px 0; width: 17em; font-style: italic; }
#required-field-msg span, span.required-star { font-weight: bold; font-size: 13px; color: #C80000; font-family: serif; }
span.required-star, span.not-required { width: 16px; float: left; text-align:center; }

fieldset.register-login { width: 430px; float: left; margin: 12px 12px 18px 0; padding: 8px; border: 1px solid #D5D5D5; }
fieldset.register-login legend { font-weight: bold;color:#333333; font-size: 14px; }

input.search-box {
  background:url(/images/frontend/search-box-bg.gif) 0px 0px no-repeat;
  border:none;
  padding:4px 10px;
  width:177px;
  height:15px;
}

.form-3col .form-row {
  float:left; clear:none;
  width:225px;
}
.form-3col .clear-both {
  clear:both;
}

/*-------------------------------*/
/* 5. Modal windows              */
/*-------------------------------*/

#modalOverlay {
  background-color:#000;
  cursor:wait;
}

#modalContainer {
  height:auto;
  width:680px;
  left:50%;
  top:64px;
  margin-left:-340px; /* half the width, to center */
  /*background-color:#fff;*/
  /*border:3px solid #ccc;*/
}

#modalContainer a.modalCloseImg {
  background:url(/images/x.png) no-repeat;
  width:25px;
  height:29px;
  display:inline;
  z-index:3200;
  position:absolute;
  top:-14px;
  right:-18px;
  cursor:pointer;
}

.alert_box_wrap {
  position:relative;
  margin:0 !important;
}
  .alert_box_wrap div { margin:0 !important; }
  
  .alert_box {
    position:absolute; z-index:10;
    left:0px; top:10px;
    
    width:300px;
    padding:10px 10px 11px 35px;
    
    background-color:#aaa;
    background-position:9px center;
    background-repeat:no-repeat;
    
    border:2px solid #555;
    border-radius:6px;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
  }
    
    .alert_box .html {
    }
    .alert_box .close {
      padding:10px 0 0;
    }

/*-------------------------------*/
/* 6. Modal friends              */
/*-------------------------------*/
.friends_list_modal,
.edit_post_modal {
  display:none;
}


.modal_friend_item {
  padding:8px;
  border-bottom:1px solid #E5E5E5;
  background:#fff;
  color:#666666;
}

.modal_friend_item strong {
  color:#000000;
}

.modal_friends_list_holder {
  max-height:400px;
  overflow:scroll;
}

.friends_list_modal .top {
  border-bottom:1px solid #D9D9D9 !important;
  background:#F2F2F2 !important;
}

.friends_list_modal .bottom {
  border-bottom:none !important;
}

.modal_friend_item .image {
  float:left;
  width:92px;
}

.modal_friend_item .details {
  float:left;
  width:318px;  
  padding-top:3px;
}
.modal_friend_item .menu {
  float:left;
  width:140px;
  color:#F7941E;
  font-weight:bold;
  padding-top:29px;
  text-align:right;
}
.modal_friend_item .menu a:link,.modal_friend_item .menu a:visited {
  color:#F7941E;
}



/*-------------------------------*/
/* 7. Font Styles                */
/*-------------------------------*/
.font-medium1 { font-size: 110%; }
.font-medium2 { font-size: 120%; }


/*-------------------------------*/
/* 8. Message Styles             */
/*-------------------------------*/
.message, p.message {
  padding: 6px 10px 5px 30px;
  background-repeat: no-repeat;
  background-position: 6px 5px;
  margin: 10px 0;
  color: black;
}
ul.message {
  margin: 10px 0;
  margin-bottom:9px !important;
}
ul.message li {
  list-style-type: none;
  border-top: 1px dashed #F9E5E8;
  padding: 2px 0;
}
ul.message li.top {
  border-top: none;
  padding-top: 0;
}
.success { 
  background-image: url(/images/icons/tick.png);
  background-color: #AEDFA0;
}
.error { 
  background-image: url(/images/icons/exclamation.png);
  background-color: #F1C4C6;
}
.warning { 
  background-image: url(/images/icons/warning.png);
  background-color: #ECC895;
}
.info { 
  background-image: url(/images/icons/information.png);
  background-color: #A5C2E0;
}

ul.messages { padding:1em; margin:0; list-style:none; }
ul.messages li { margin:0; overflow:hidden; }
ul.messages li.success-msg { padding:0 0 0 24px; background:url(/images/frontend/tick.png) 0px 50% no-repeat; color:#060; }
ul.messages li.error-msg { padding:0 0 0 24px; background:url(/images/frontend/cross.png) 0px 50% no-repeat; color:#600; }
ul.messages li ul { float:left; width:100%; margin:0; list-style:none; }

/*-------------------------------*/
/* 9. Profile Page Additions     */
/*-------------------------------*/
#profile-status .block-content { min-height: 72px; }
#profile-status p { margin-left: 78px; }

/*-------------------------------*/
/* 10. Messages                   */
/*-------------------------------*/
.inbox_message_li {
}
.thread_unread {
  background:#FFF9E5 !important;
}
.inbox_message_li .thread_checkbox {
  width:40px;
  padding-top:25px;
  float:left;
}
.inbox_message_li .profile_image_holder {
  width:120px;
  float:left;  
}
.inbox_message_li .thread_recipients {
  width:250px;
  float:left;
  padding-top:15px;
}
.inbox_message_li .thread_recipients a:link, .inbox_message_li .thread_recipients a:visited {
  font-weight:bold;
}
.inbox_message_li .thread_preview {
  width:200px;
  float:left;
  font-size:11px;
  padding-top:15px;
}
.inbox_message_li .thread_controls {
  width:65px;
  float:left;
  padding-top:25px;
  text-align:right;
}
.inbox_messages_list .profile_image {
  width:100px;
  float:left;  
}
.inbox_messages_list .profile_details {
  width:100px;
  float:left;
  text-align:right;
  padding-right:20px;
}
.inbox_messages_list .single_message {
  width:460px;
  float:left;
  padding-bottom:8px;
  border-bottom:1px solid #E5E5E5;
}
.message_reply_holder {
  padding-left:220px;
  padding-right:10px;
}

/*------------------------*/
/* 11. Fleet              */
/*------------------------*/
.vehicle_fleet_entry .image {
  float:left;
  width:150px;
}
.vehicle_fleet_entry .description {
  float:left;
  width:530px;
}

/*------------------------*/
/* 12. Requests           */
/*------------------------*/
.request_entry .image {
  width:100px;
  float:left;
}
.request_entry .description {
  width:360px;
  float:left;
  padding-top:15px;
}
.request_entry .controls {
  width:220px;
  text-align:right;
  padding-top:15px;
  float:left;
}

/*------------------------*/
/* 13. Tab Nav            */
/*------------------------*/
ul.tabnav {
  text-align: left;
  margin: 8px 0 0;
  border-bottom: 1px solid #D9D9D9;
  font-weight:bold;
  list-style-type: none;
  padding: 3px 8px;
}

ul.tabnav li {
  display: inline;
  overflow:hidden;
}

ul.tabnav li.tab_active {
  border-bottom: 1px solid #fff;
  background-color: #fff;
}
ul.tabnav li a, .tabnav li a:link, ul.tabnav li a:visited {
  padding: 3px 4px;
  border: 1px solid #D9D9D9; -moz-border-radius:6px 6px 0 0; -webkit-border-radius:6px 6px 0 0;
  background-color:#f7941e; /*#E6E6E6;*/
  color:#fff; /*#666;*/
  margin-right: 0px;
  text-decoration: none;
  border-bottom: none;
}
ul.tabnav li.highlight a, .tabnav li.highlight a:link, ul.tabnav li.highlight a:visited {
  background-color:#f7941e;
  color:#fff;
}
ul.tabnav li.tab_active a, ul.tabnav li.tab_active a:link, ul.tabnav li.tab_active a:active {
  border-bottom:1px solid #fff !important;
  background-color: #fff !important;
  color: #000;
  position: relative;
  padding-top: 4px;
}
ul.tabnav li a:hover {
  background:#E6E6E6; /*#fff;*/
  color:#000;
}

/*------------------------*/
/* 14. Tag Cloud          */
/*------------------------*/
.tag-cloud {
  padding: 8px 4px;
  line-height: 2em;
}
.tag-cloud ul {
  list-style-type:none;
  padding:0;margin:0;
}
.tag-cloud li {
  padding:2px;margin:0;
  float:left;
}

.tag-cloud .extra-small {
  font-size: 10px;
}
.tag-cloud .small {
  font-size: 12px;
}
.tag-cloud .medium {
  font-size: 14px;
}
.tag-cloud .large {
  font-size: 16px;
}
.tag-cloud .extra-large {
  font-size: 20px;
}


.tag-cloud a, .tag-cloud a:link, .tag-cloud a:visited  {
  color: #000;
  padding: 3px 6px;
  text-decoration:none;
}
.tag-cloud a:hover, .tag-cloud a:active {
  color: #306085;
}

/*------------------------*/
/* 15. Articles           */
/*------------------------*/
.block .article h3 { margin-bottom: 4px; }
.article-dateline { font-family: "Courier New",courier,monospace; font-size: 11px; font-weight: bold; }
.block .article-excerpt p { margin: 4px 0 2px; }
.article-morelink { text-align: right; font-size: 11px; }
.block .articles em { font-style: italic; color: #666; }


/*-------------------------------*/
/* 16. Pagination                */
/*-------------------------------*/

/*
.pagination { padding:6px 10px; font-size:90%; font-weight:bold; text-align:right; }
.pagination img { vertical-align:middle; }
.pagination-nopadd { font-size:90%; font-weight:bold; text-align:right; }
.pagination-nopadd img { vertical-align:middle; }
*/
.pagination {
  text-align:right;
  font-weight:bold;
  font-size:12px;
  padding:6px 4px;
}

.pagination-nopadd {
  text-align:right;
  font-weight:bold;
  font-size:12px;
}


.pagination a, .pagination-nopadd a {
  border: 1px solid #cccccc;
  color: #000000;
  margin:2px;
  padding:2px 5px;
  text-decoration: none !important;
}
.pagination span.current, .pagination-nopadd span.current {
  border: 1px solid #cccccc;
  color: #fff;
  background: #cccccc;
  margin:2px;
  padding:2px 5px;
  
}


/*------------------------*/
/*     17. Multimedia     */
/*------------------------*/

.multimedia_preview h3 {
  margin:0 !important;
}


.multimedia_preview p {
  padding:0 !important;
  margin:0 !important;
}
.multimedia_preview .description {
  padding-top:8px;
}

.multimedia_preview .thumb {
  margin:0 8px 8px 0;
  float:left;
  border:1px solid #999;
}


.multimedia_item .description {
  width:520px;
  float:left;
  padding-right:10px;
}
.multimedia_item .items {
  width:150px;
  float:left;
  padding-top:8px;
}
.multimedia_item .items .title {
  background:#5C88A5;color:#fff;font-weight:bold;padding:2px 0 3px 5px
}
.multimedia_item .items .list {
  border:1px solid #DDDDDD;background:#F3F3F3;padding:8px;
}
.multimedia_item .items .list ul {
  padding:0;margin:0;
  list-style-type: none;
}

/*------------------------*/
/* 18. Blog post          */
/*------------------------*/
.blog-post-data {
  margin-top:8px;
  overflow:hidden;
}
.blog-post-data em, .blog-post-data ul, .blog-post-data li, .blog-post-data ol {
  border: 0 !important;	padding: 0 !important; outline: 0 !important;	font-weight: inherit !important;	font-style: inherit !important; font-size: 100% !important;	font-family: inherit !important;	vertical-align: baseline !important; color: inherit !important;
}

/*------------------------*/
/* 19. How-Tos Stuff      */
/*------------------------*/
.videos_table {
  width:448px !important;
}
.videos_table .video_thumb {
  float:left;
  width:139px;
  text-align:center !important;
  padding:0px 5px 15px 5px !important;
}
.videos_table .video_thumb p {
  padding:0 !important;
  margin:0 !important;
}
.videos_table .video_thumb .date {
  font-size:10px;
  color:#999;
}
 


/*------------------------*/
/* 99. Others             */
/*------------------------*/
.block h1 span.edit {
  display:block;
  font-size:12px;
  font-weight:400;
  position:absolute;
  right:8px;
  top:8px;
  width:auto;
  color:#ffffff;
}
.block h1 span.edit a:link, .block h1 span.edit a:visited {
  color:#ffffff;
}

.no_profile_image {
  border: 1px solid #E6E6E6;
  padding: 5px 6px;
  background:#fff !important;
}

.images_box li {
  width:95px !important;
  text-align: center;
  float:left;
  position:relative;
  padding:8px 8px !important;
}

.blog_post_title {
  font-size:14px;
}

/*--------------------------------------------*/
/* 99. Replacing some stuff from engine's css */
/*--------------------------------------------*/

#profile-friends li {
  width:95px !important;
  text-align:center !important;
}
#profile-friends li img {
  display:inline;
}

#product-attributes p {
  font-size: 12px;
}
.shop-product p { margin-left:112px; }

.friends_thumbs_list {
  list-style-type: none;
  margin:0 !important;
}
.friends_thumbs_list li {
  display:inline;
  width:95px !important;
  text-align: center !important;
}

.error_h1 {
  background:#990000 !important;
}
a.black, a.black:link, a.black:visited { color: black; }
