/*
ccss-fixed-width.css
$Revision: 1.12 $
. styles for content css
(c) 1992-2007 Cisco Systems, Inc. All rights reserved. 
Terms and Conditions: http://cisco.com/en/US/swassets/sw293/sitewide_important_notices.html
*/

/* I so don't want to have to do this, but we have to OVERRIDE framework margins and body tag to fix the width!   */
body#fw-mb { width:902px; } /* changed from #libra */
* html body#fw-mb { width:expression((documentElement.clientWidth>902)?"902px":"902px"); } /* changed from #libra */

.root #framework-content-right {
    width: 196px !important;
    }

#framework-content-main { margin-left:0; margin-right:0;} 

/* remove system generated page titles */
/* currently true for root and solutions,will need to make this more specific as soon as a page type that uses system titles is speced */
/* #framework-content-titles { display: none; } ck: b1975 */


.contentMargins { margin-left: 0; }

.contcss migrate { display:none; }

.contcss .top-parcel { padding-bottom:12px; }
.contcss .top-parcel td { vertical-align:top; }

.contcss .top-parcel .image-text-promo { margin-top:12px; }

.contcss .colset3,
.contcss .colset4,
.contcss .subcol { margin:0; padding:0; }
.contcss .col1,
.contcss .col2 { display:inline; }

.contcss .root .colset3 .col1 { width:222px; float:left; }
.contcss .root .colset3 .col2 { width:222px; margin-left:16px; float:left; }
.contcss .root .colset3 .cols1-2 { width:460px; float:left; }
.contcss .root .colset3 .col3 { width:222px; margin-left:16px; float:left; }

.contcss .root .colset4 .col1 { width:162px; margin-right:17px; float:left; }
.contcss .root .colset4 .col2 { width:162px; margin-right:16px;  float:left; }
.contcss .root .colset4 .col3 { width:162px; margin-right:17px; float:left; }
.contcss .root .colset4 .cols1-3 { width:520px; margin-right:16px; float:left; }
.contcss .root .colset4 .col4 { width:162px; float:left; }

/* start float clearing with no clearing divs */
.contcss .colset3:after,
.contcss .colset4:after,
.contcss .subcol:after,
.contcss .thumb:after {
   content: "."; 
   display: block; 
   height: 0; 
   clear: both; 
   visibility: hidden;
}

.contcss .colset3,
.contcss .colset4,
.contcss .subcol  { %height:1%; }

/* end float clearing styles */

.contcss .feature-holder {
   border:#ccc 1px solid; 
   padding:9px 12px 0px 11px; 
   margin-bottom:12px;
}

.contcss .standard-holder {
   border:#ccc solid; 
   border-width:0 0 1px 1px; 
   padding:9px 12px 0px 12px; 
   margin-bottom:12px; 
   margin-right:0; 
}

.contcss .rtl .standard-holder { border-width:0 1px 1px 0; }

.contcss .header-holder {
   border:#ccc 1px solid; 
   padding:0px 12px; 
   margin-bottom:12px; 
   margin-top:0;
}

.contcss .header-holder .title {
   background-color:#ccc; 
   margin:0 -12px 9px -12px; 
   padding:2px 12px 4px 12px; 
   font-size:109.5%;
   font-weight:bold;
   color:#666;
}

.contcss .cn .header-holder .title,
.contcss .rtl .header-holder .title {
   font-size:108.5%;
   line-height:154%;
}

.contcss .subcol {
   margin:0;
   padding:0;
}

/* unfortunately all these styles seem to need the colset selector to get selected, otherwise I would have left them out */
.contcss .colset3 .subcol .col1, 
.contcss .colset4 .subcol .col1,
.contcss .colset3 .subcol .col2, 
.contcss .colset4 .subcol .col2 { width:50%;  float:left; margin:0; display:inline;  %margin-right:-1px; }

.contcss .rtl .colset3 .subcol .col1, 
.contcss .rtl .colset4 .subcol .col1,
.contcss .rtl .colset3 .subcol .col2, 
.contcss .rtl .colset4 .subcol .col2 { float:right; %margin-right:0; %margin-left:-1px; }

.contcss .colset3 .subcol .col1 .item, 
.contcss .colset3 .subcol .col1 .thumb, 
.contcss .colset4 .subcol .col1 .item, 
.contcss .colset4 .subcol .col1 .thumb { padding-right:8px;}
.contcss .colset3 .subcol .col2 .item, 
.contcss .colset3 .subcol .col2 .thumb, 
.contcss .colset4 .subcol .col2 .item, 
.contcss .colset4 .subcol .col2 .thumb { margin-left:8px; }

.contcss .rtl .colset3 .subcol .col1 .item, 
.contcss .rtl .colset3 .subcol .col1 .thumb, 
.contcss .rtl .colset4 .subcol .col1 .item, 
.contcss .rtl .colset4 .subcol .col1 .thumb  { padding-left:8px; padding-right:0;}
.contcss .rtl .colset3 .subcol .col2 .item, 
.contcss .rtl .colset3 .subcol .col2 .thumb, 
.contcss .rtl .colset4 .subcol .col2 .item, 
.contcss .rtl .colset4 .subcol .col2 .thumb { margin-right:8px; margin-left:0; }

.contcss .colset4 .subcol .subcol .col1 ul { padding-right:9px; }
.contcss .rtl .colset4 .subcol .subcol .col1 ul { padding-right:0; padding-left:9px; }


/* basic styles in Content CSS for fonts and header sizes, easy to override if need be */
.contcss {
   font-size: 11px; /* was 86% */ 
   color:#666;
}

.contcss .cn {
   font-size: 109.5%; 
   line-height: 133.5%;
}

.contcss .jp {
   font-family: ms pgothic, arial, helvetica, sans-serif;
   font-size: 109.5%;
   line-height: 133.5%;
}

.contcss .kr {
   font-family: dotum, arial, helvetica, sans-serif;
   font-size: 109.5%;
   line-height: 133.5%;
}

.contcss .rtl {
   font-size:109.5%;
   line-height:133.5%;
   direction:rtl;
}

/* Title parcel styles */
.contcss .content-page-title {
   font-size: 164%;
   color:#666;
   font-weight:normal;
   border-bottom:1px solid #ccc;
   border-left:1px solid #ccc; 
   padding: 3px 12px 6px 12px;
   %padding-bottom:7px;
   margin: 0 ;
}

.contcss .rtl .content-page-title {
   border-left:0;
   border-right:1px solid #ccc; 

}

.contcss .content-page-title h1 {
   font-size:100%;
   font-weight:normal;
   color:#666;
   margin:0;
   padding:0;
}

.contcss .cn .content-page-title,
.contcss .jp .content-page-title,
.contcss .kr .content-page-title,
.contcss .rtl .content-page-title  {
   font-size: 150.5%;
}

.contcss h2 {
   margin:0 0 9px 0;
   padding: 0 0 9px 0;
   font-size: 127.5%;
   border-bottom: solid 1px #ccc; 
   color:#666;
}
   
* html .contcss h2 {
   padding-top:-16px;
}

.contcss .standard-holder h2 {
   margin-left:-12px;
   margin-right:-12px;
   padding-left:12px;
   padding-right:12px;
   font-size:109.5%;
}

.contcss .cn h2 {
   font-size: 108.5%;
   line-height: 154%;
}

.contcss .jp h2,
.contcss .kr h2,
.contcss .rtl h2 {
   font-size: 125.5%;
   line-height: 133.5%;
}

.contcss h3 {
   margin: 0;
   padding: 0 0 9px 0;
   font-size: 109.5%;
   color:#666;
}

.contcss .feature-holder h3 {
   padding-bottom:6px;
}

.contcss .standard-holder h3 {
   border-bottom: solid 1px #ccc; 
   margin: 0 0 9px 0;
}

.contcss .cn h3,
.contcss .jp h3,
.contcss .kr h3,
.contcss .rtl h3 {
   font-size: 108.5%;
   line-height: 154%;
}


.contcss h4 {
   margin: 0;
   padding:6px 0 0 0;
   font-size:100%;
   color:#666;
}

.contcss .cn h4,
.contcss .jp h4,
.contcss .kr h4 {
   line-height: 133.5%;
}
 
.contcss .cn ul, 
.contcss .jp ul,
.contcss .kr ul,
.contcss .rtl ul {
   line-height: 133.5%;
}

/* promobox aka vision statement aka grey box gone blue ? */

.contcss .promobox {
   border:1px solid #ccc;
   border-top:0;
   background-color:#d5e0e6;
   min-height:193px; 
   %border-collapse:collapse;
   border-spacing:0;
   margin-top:0;   
   padding-top:0;
   width:100%;  /* so it won't play well with data-driven floating modules */
}

* html .contcss .promobox {
   height:193px;
}

.contcss .promobox td { padding:0; } /* for the image, overridden for the text */

.contcss .promobox .flash-holder {
   background-color:#fff;
   padding:0;
}

.contcss .promobox td #flash-alt {
   padding:0;
   margin:9px 12px 12px 12px;
}

.contcss .promobox #flash-alt p {
   margin-bottom:-1px;
   font-size:100.5%;
   line-height:158.5%;
}

* html .contcss .promobox #flash-alt p {
   padding-bottom:10px; 
   margin:0;
}

.contcss .promobox td.promobox-text {
   padding:12px 16px 16px 16px;
   margin-bottom:0;
   line-height:133.5%;
}

* html .contcss .promobox-text {
   padding-top:9px;
}

.contcss .promobox-text h2{
   color:#666;
   font-size:145.5%;
   line-height:normal;
   border:0 !important;
   margin-bottom:0 !important;
}

.contcss .cn .promobox-text h2,
.contcss .rtl .promobox-text h2 {
   font-size: 142%;
   line-height:123.6%;
}

.contcss .promobox-text p {
   margin:0;
   padding:0 0 6px 0;
   font-weight:bold;
}

.contcss .cn .promobox-text p {
   line-height: 158.5%;
}

.contcss .jp .promobox-text p,
.contcss .kr .promobox-text p {
   line-height: 142%;
}

.contcss .rtl .promobox-text p {
   line-height:146.5%;
}

.contcss .promobox-link {
   background: transparent url(/web/fw/i/promo_arrow.gif) no-repeat left 2px;
   padding-left:11px;
   font-weight:bold;
}

.contcss .rtl .promobox-link {
   background: none;
   padding-left:0;
   font-size:99%;
   line-height:146.5%;
}

.contcss .cn .promobox-link {
   line-height: 158.5%;
}

.contcss .jp .promobox-link,
.contcss .kr .promobox-link  {
   line-height: 142%;
}

/* Set of image/text modules going across page */

.contcss .promo-set {
   %border-collapse:collapse;
   border-spacing:0;
   margin-top:8px;
}

* html .contcss .promo-set {
   margin-top:7px;
}

.contcss .promo-set th {
   border-left:1px #ccc solid;
}

.contcss .rtl .promo-set th {
   border-right:1px #ccc solid;
   border-left:0;
}

.contcss .promo-set th h2{
   border:0;
   padding:8px 12px 1px 12px;
   margin-bottom: 7px;
   text-align:left;
   font-size: 104.5%;
}

.contcss .cn .promo-set th h2 {
   font-size:96%;
   line-height:158.5%;
}

.contcss .rtl .promo-set th h2 {
   font-size:120%;
   line-height:133.5%;
   text-align:right !important;
}

.contcss .promo-set th.gutter {
   padding: 0;
   margin: 0;
   border-left: #fff;
   width: 16px;
}

.contcss .promo-set td {
   border-collapse: separate !important;
   background-color:#eaeff2;
   border: 1px #ccc solid;
   padding:0;
   vertical-align:top;
   width:220px;
}

.contcss .promo-set .text {
   margin:0; 
   padding:9px 11px 2px 11px;
}

* html .contcss .promo-set .text {
   padding-right:12px;
}

.contcss .promo-set .text p {
   margin:0;
   padding:0;
   padding-bottom:6px;
}

.contcss .promo-set .text ul {
   margin:0;
   padding:0;
   padding-bottom:6px;
   font-size:100.5%;
   line-height:133.5%;
}

.contcss .promo-set .text li {
   padding-bottom:0.4em;
}

/* List modules, and paragraphs */

.contcss .feature-holder p {
   margin-top:0;
   padding-top:0;
   padding-bottom:4px;
   margin-bottom:0;
}

.contcss ul.flush,
.contcss ul.no-bullet {
   margin-top:0;
   padding-top:0;
   padding-bottom:9px;
   margin-bottom:0;
}

.contcss ul.news {
   margin-top:0;
   padding-top:0;
   padding-bottom:7px;
   margin-bottom:0;
}

.contcss ul.compact {
   padding-bottom:0px !important;
}

.contcss .no-bullet,
.contcss .news {
   list-style-type:none;
   margin:0;
   padding:0;
}

.contcss .flush {
   margin-left:12px;
   padding-left:0;
   %padding-left:4px;
}

.contcss .rtl .flush {
   margin-left:0;
   margin-right:12px;
   padding-right:0;
   %padding-right:4px;
}

.contcss .flush li, .contcss .no-bullet li {
   padding-bottom: 0.4em;
}

 .contcss .news li  {
   padding-bottom: 0.55em;
}

.contcss li.chevron  {
   list-style:none;
   background-image: url(/web/fw/i/chevrons.gif);
   background-repeat:no-repeat;
   background-position:left 0.4em;
   padding-left:10px;
   padding-bottom: 0.4em;
}

/* .contcss .rtl li.chevron  {
   background-position:right 0.4em;
   padding-right:10px;
} live site doesn't switch this, chevron points wrong way */

.contcss .standard-holder hr, .contcss .feature-holder  hr {
   height:0;
   border:0;
   border-top:1px #ccc solid;
   margin:9px 0;
   %margin:2px 0;
}

.contcss .thumb img {
   float:left;
   margin: 3px 10px 13px 0px;
   width:60px; height:60px;
}

.contcss .thumb .thumb-txt {
   margin-left:72px;
   min-height:60px;
   padding-bottom:6px;
}
* html .contcss .thumb .thumb-txt {
   height:60px;
}

.contcss .thumb .thumb-txt h2,
.contcss .thumb .thumb-txt p,
.contcss .thumb .thumb-txt a {
   margin:0;
}

.contcss .feature-holder .thumb .thumb-txt h3 {
   padding-bottom:4px;
}

.contcss .thumb.wrap .thumb-txt{
   margin-left:0px;   
}

.contcss .standard-holder .main-title {
   border-bottom:1px solid #d6d8da;
   padding:4px 10px;
   margin:0 -10px;
}

.contcss .js-only { display:none; }
.contcss .subcol form {
   padding:3px 0 9px 0;
   margin:0;
}

.contcss .subcol form select {
   font-size: 100%;
   color: #666;
}

.contcss .feedback-link {
   background-color:#eaeff2;
}



.contcss table.promobox-cat {
   empty-cells: show;
   }

.contcss .promobox-cat td {
   border: solid 1px #ccc;
   margin: 0;
   padding: 0;
   }

.contcss .promobox-cat td.main {
   border-bottom: none;
   width: 100%;
   vertical-align: top;
   }

.contcss .promobox-cat td.base-link {
   border-top: none;
   vertical-align: bottom;
   }

.contcss .promobox-cat td.base-link br {
   line-height: 0;
   }

.contcss .promobox-cat .base-link-holder {
   border-top: solid 1px #ccc;
   padding-top: 9px;
   margin: 0 12px 13px 12px;
   }

.contcss .promobox-cat td.videobar {
   background-color: #e5e5e5;
   border: none;
   border-left: solid 8px #fff;
   vertical-align: top;
   }

.contcss .promobox-cat .main-content {
   margin: 9px 12px 0 12px;
   %margin-bottom: 0;
   }

.contcss .promobox-cat .main-content h3 {
   padding: 0;
   }

.contcss .promobox-cat .main-content p {
   padding: 0;
   margin-top: 10px;
   margin-bottom: 10px;
   }

.contcss .promobox-cat .main-content .flush {
   padding-bottom: 9px;
   }

.contcss .promobox-cat .flash-alt {
   min-width: 164px;
   %width: 164px;
   }

.contcss .promobox-cat .promo-video {
   padding: 9px 12px 12px;
   }

.contcss .promobox-cat .promo-video h3 {
   padding-bottom: 3px;
   }

.contcss .promobox-cat .promo-video p {
   margin: 9px 0 1px;
   }