
/*------------------------------------------------------------------------------
                       Layout and Positioning
/*----------------------------------------------------------------------------*/
.feature-container {
   max-width: 600px;
   min-width: 375px;
width: 58%;   margin: 20px auto 20px 0px;
}

.feature {
   min-height: 120px;
   margin-right: 15px;
   padding: 0 0 7px 20px;
}

.feature h3 {
   margin: 0px auto 7px 60px;
   padding-top: 12px;
}

.feature .step-number {
   float: left;
   margin: 9px 10px 13px 2px;
   padding: 0;
}

.feature-container .more {
   float: right;
   width: 100px;
   height: 20px;
}

.feature-container .filler {
   margin: 0;
   padding: 0;
   height: 20px;
}

.feature .effects-container div {
   margin: 0;
   padding: 10px 0 0 0;
   text-indent: 0px;
}

.feature img.left {
   float: left;
   margin: 2px 10px 5px 0;
   padding: 0;
}


/*------------------------------------------------------------------------------
                               Styles and Color
/*----------------------------------------------------------------------------*/

.feature-container {
   background: url(/images/tpl-feature/feature.png) 100% 0% no-repeat;
}

.feature {
   background: url(/images/tpl-feature/feature.png) 0% 0% no-repeat;
}

.feature .step-number {
   text-indent: 0;
   font-weight: 700;
   font-size: 32px;
}

.feature h3 {
   font-size: 18px;
}

.feature .text {
   text-indent: 25px;
}

.feature-container .filler {
   background: url(/images/tpl-feature/feature.png) 0% 100% no-repeat;
}

.feature-container a .more,
.feature-container a:link .more,
.feature-container a:hover .more,
.feature-container a:visited .more {
   background: url(/images/tpl-feature/feature.png) 100% 100% no-repeat;
   color: #f5f5ee;
   color: #f7f3db;
   font-weight: 700;
   text-indent: 7px;
   font-size: 11px;
   line-height: 16px;
   font-style: italic;
   cursor: pointer;
}

.feature-container a:hover .more {
   color: #ffffff;
}

