/* CSS styles for UTM/Firewall/VPN Product Line page */

/* start - chart styles */
.chart {
clear: both;
position: relative;
width: 56.5em;
}
#promodels,
#tzmodels {
position: relative;
clear: both;
}
#promodels {
z-index: 1;
}
#tzmodels {
z-index: 0;
position: absolute;
top: 0;
}
.series_hdg {
margin: 0 0 0 13.6em;
padding-top: 0.3em;
clear: left;
position: relative;
}
#content .chart .series_hdg h3 {
font-size: 1.4em;
color: #1A1D55;
padding: 2em 0 0.4em 0.25em;
margin: 0 0 0.1em 0;
height: 1.08em;
}
#content #chart_appliances {
margin-top: -2em;
}
#content .chart .intro {
margin-top: 2em;
margin-bottom: -1em;
}
.series_hdg img.imgover {
width: 12.5em;
height: 2.5em;
position: absolute;
left: 30.2em;
top: 2.3em;
z-index: 1;
}
#content .chart .series_hdg p {
line-height: 140%;
padding: 0.75em 1.4em 1.25em;
margin: 0 0 -0.5em 0;
}
#series_hdg_pro p,
#series_hdg_ts .intro_tspro {
background: url(/images/bg_intro_proseries.jpg) repeat-y;
}
#series_hdg_tz p,
#series_hdg_ts .intro_tstz {
background: url(/images/bg_intro_tzseries.jpg) repeat-y;
}
#series_hdg_totalsecure {
margin-bottom: -1.5em;
}
#series_hdg_tz {
margin-top: 0.3em;
}

#series_hdg_totalsecure.intl {
margin-bottom: 0;
}
#content .chart #series_hdg_totalsecure .copy {
background: url(/images/bg_intro_compare.jpg) repeat-y;
padding: 0 1.5em 0 1.5em;
}
.chart #series_hdg_totalsecure .copy p, 
.chart #series_hdg_totalsecure .copy ul {
margin: 0;
padding: 1em 0 0 0;
position: relative;
}
.chart #series_hdg_totalsecure .copy ul {
margin-top: -5.25em;
}
.chart #series_hdg_totalsecure .copy li {
margin: 0.75em 0 0 1.5em;
}
#content .chart .chart_hdg {
font-size: 1.1em;
color: #1A1D55;
text-transform: uppercase;
padding: 0 0 0.5em 0.75em;
margin: -1.5em 0 0;
border-bottom: 0.184em #F9CE2A solid;
height: 1em;
}
#content .chart .descriptions p, 
#content .chart .model p {
font-size: 1em;
margin: 0;
padding: 0.5em 0.5em 0.5em 0.75em;
height: 1.3em;
border-top: .1em #ccc solid;
line-height: 110%;
}
#content .chart .descriptions p {
padding-left: 0.25em;
}
#content .chart .descriptions p.lines2, 
#content .chart .model p.lines2 {
height: 2.3em;
}
#content .chart p.lines2.caption.wrap {
height: 2.6em;
}
#content .chart .descriptions p.lines3, 
#content .chart .model p.lines3 {
height: 3.4em;
}
#content .chart .descriptions p.lines4, 
#content .chart .model p.lines4 {
height: 4.5em;
}
#content .chart .descriptions p.lines5, 
#content .chart .model p.lines5 {
height: 5.6em;
}
.chart .descriptions p span {
font-size: 1.1em;
}
.chart .descriptions a:hover {
text-decoration: none;
}
.chart .descriptions {
float: left;
width: 13.6em;
position: relative;
z-index: 10;
}
.chart .descriptions .legend {
position: absolute;
top: -6.25em;
left: 0.25em;
}
#chart_totalsecure .descriptions .legend {
top: -4.75em;
}
#content .chart .descriptions .legend p {
border: none;
padding: 0 0 0.75em 0;
line-height: 110%;
clear: left;
height: auto;
}
#content .chart .descriptions .legend p span {
float: left;
font-size: 1em;
width: 11em;
}
.chart .descriptions .legend p img {
float: left;
position: relative;
top: 0.1em;
margin: 0 0.5em 0 0;
width: 1em;
height: 1em;
}
.chart .model {
float: left;
width: 7.1em;
}
#chart_totalsecure .model {
width: 7.1em;
}
.chart #model_ts3g {
width: 7.1em;
}
.chart .model.pro {
background: url(/images/bg_model_proseries.jpg) repeat-y;
}
.chart .model.tz {
background: url(/images/bg_model_txseries.jpg) repeat-y;
}
.chart .model p img.dot {
width: 1em;
height: 1em;
position: relative;
top: 0.2em;
}
.chart p.top {
border-top-color: #707070;
}
#content .chart p.dbl {
border: none;
height: 1.4em;
padding-top: 0;
}
#content .chart p.dbl span, 
#content .chart p.caption span {
position: relative;
top: 0.1em;
}
#content .chart p.caption.wrap span {
top: 0.3em;
}
#content .chart p.btm {
height: 2.5em;
}
#content .chart p.fill {
border: none;
}
#content .chart .descriptions p.modelhdg, 
#content .chart .model p.modelhdg {
border-top: none;
height: 3.75em;
padding-top: 1.25em;
font-weight: bold;
line-height: normal;
}
#content #chart_totalsecure .descriptions p.modelhdg, 
#content #chart_totalsecure .model p.modelhdg {
height: 2.5em;
}
#content .chart .descriptions p.modelhdg.alt, 
#content .chart .model p.modelhdg.alt {
height: 2em;
}
.chart .model p.modelhdg a {
display: block;
}
.descriptions p.modelhdg span {
text-transform: uppercase;
font-size: 1.1em;
font-family: arial,helvetica,sans-serif;
position: relative;
top: 2.2em;
}
#chart_totalsecure .descriptions p.modelhdg span {
top: 1em;
}
.descriptions p.modelhdg.alt span {
top: 0.9em;
}
/* start - styles for model info popups */
.chart .modelsinfo {
position: relative;
z-index: 11;
}
.chart #modelsinfo_tz,
.chart #modelsinfo_tstz {
position: relative;
clear: left;
}
.chart .info {
position: absolute;
background-color: #b4b4b4;
display: none;
}
.chart .info.serviceinfo {
width: 42.8em;
top: 5.75em;
left: 14.1em;
}
#chart_totalsecure .info.serviceinfo {
top: 4.5em;
}
.chart .info.modelinfo {
width: 56.5em;
left: 0.3em;
}
.chart #modelsinfo_pro .info.modelinfo {
top: 17.4em;
}
.chart #modelsinfo_tz .info.modelinfo {
top: 18.9em;
}
#chart_totalsecure .info.modelinfo {
top: 4.5em;
}
.chart .info .container {
background: #eee;
border: 0.1em #707070 solid;
padding: 1.5em;
position: relative;
top: -0.3em;
left: -0.3em;
}
.chart .info.modelinfo .container {
padding-left: 20.25em;
}
#content .chart .info h4 {
padding: 0;
margin: 0;
font-size: 1.2em;
color: #1A1D55;
background: none;
}
.chart .info.modelinfo img {
width: 20em;
height: 14.5em;
position: absolute;
left: 0;
top: -1em;
}
#content .chart .info p {
padding: 0;
margin: 0;
font-size: 1.1em;
border: none;
height: auto;
line-height: 140%;
}
/* start - styles for model info popups */

/* start - styles for compare models */
.comparehdg {
display: none;
}
#content .chart .comparehdg form {
background: url(/images/bg_intro_compare.jpg) repeat-y 0 0;
padding: 0.75em 1.4em 1.5em;
margin: 0;
}
#content .chart .comparehdg form p {
padding: 0;
margin: 0;
line-height: normal;
}
#content .chart .comparehdg .compareintro {
font-size: 1.1em;
font-family: arial, helvetica, sans-serif;
padding: 0 2em 0.5em 0;
margin: 0;
}
.comparehdg .modelselect {
float: left;
padding: 0;
margin: 0;
}
.comparehdg #modelselect_pro {
width: 16em;
}
.comparehdg #modelselect_tz {
width: 16em;
}
#compare_hdg_ts #modelselect_tspro {
width: 18em;
}
#compare_hdg_ts #modelselect_tstz {
width: 15em;
}
.comparehdg #modelselect_tz,
.comparehdg #modelselect_tstz {
margin-left: 2.25em;
}
#content .chart .comparehdg .modelselect .selectitem {
padding: 0;
margin: 0;
height: 2em;
font-weight: bold;
}
.comparehdg #modelselect_tz .selectitem input,
.comparehdg #modelselect_tstz .selectitem input {
position: relative;
top: 0.15em;
}
#compare_hdg_appl #modelselect_pro .selectitem.hide input,
#compare_hdg_appl #modelselect_tz .selectitem.hide input,
#compare_hdg_ts #modelselect_tspro .selectitem.hide input {
visibility: hidden;
}
.comparehdg #modelselect_tz .selectitem.radiobtn,
.comparehdg #modelselect_tstz .selectitem.radiobtn {
padding-bottom: .5em;
font-weight: bold;
}
/* end - styles for compare models */

.chart .footnote {
clear: left;
font-size: 1em;
padding: 0.75em 2em 0 13.75em;
}
/* end - chart styles */