﻿/* CSS definitions for ORF Guides */

/* Generic guide styles */

#guide-related-documents {
  border-top: 1px solid #d2d2d2;
  padding: 0px 40px 0px 40px;
  margin: 40px -39px -10px -39px;  
}

#guide-related-documents ul, #guide-related-documents li {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

#guide-related-documents li {
  line-height: 180%;
}

#guide-versions {
  float: right;
  margin-top: -47px;
}

#guide-versions #page-print-link {
  display: block;
  float: left;
  margin: 3px 8px 0 0;
  width: 16px;
  height: 16px;
  line-height: 16px;
  background: transparent url("../images/printer.png") no-repeat center center;
}

/* Guides: Table of Contents */

div.guide-toc {
  margin-top: -15px;
}

div.guide-toc ul, 
div.guide-toc li {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

div.guide-toc ul.toc1 li a {
  display: inline-block;
  margin: 15px 0 5px 0;
  font: normal 18px "GestaBold","Arial",sans-serif;
  color: #777;
}

div.guide-toc ul.toc1 ul.toc2 {
  padding-left: 50px;
}

div.guide-toc ul.toc1 ul.toc2 li a {
  margin: 0;
  font: italic 13px "Trebuchet MS","Arial",sans-serif !important;
  color: #47b4e3;
}

/* Guide List */

ul.guide-list {
  margin-top: 2em;
}

ul.guide-list li a.title {
  font-weight: bold;  
}

ul.guide-list li.featured {
  padding: 0;
  list-style-type: none;
}

ul.guide-list li.featured div.info-box {
  padding: 15px;
}

ul.guide-list li.featured a.title  {
  display: inline-block;
  margin-right: 8px;
  margin-bottom: 5px;
}

ul.guide-list li.featured a.orange-label {
  margin-top: -4px;
}

/* Guide: Configuration Backup */

table.guide-backup-file-list td.type {
  width: 15%;
  text-align: center;  
  font-weight: bold;
}

table.guide-backup-file-list td.filename {
  width: 20%;
  text-align: center;
  font: normal 13px 'Consolas','Courier New',monospace;
}

/* Guide: Deployment */

table.guide-deployment-sr {
  width: 100%;
}

table.guide-deployment-sr .prop {
  width: 25%;
  text-align: center;
}


table.guide-deployment-disk-usage {
  width: 100%;
}

table.guide-deployment-disk-usage td {
  width: 33%;
}

table.guide-deployment-disk-usage .traffic {
  text-align: center;
}

table.guide-deployment-disk-usage .log1day,
table.guide-deployment-disk-usage .log30days {
  text-align: right;
}


table.guide-deployment-ports .port {
  width: 25%;
  text-align: center;
}

div.guide-deployment-notes {
  margin: 8px 0 20px 0;
  color: #777;
  font: normal 11px "Arial","Helvetica",sans-serif;
}

div.guide-deployment-notes sup {
  font-weight: bold;
}

div.guide-deployment-notes p {
  margin: 0.5em 0;
}

/* Guide: ORF 101 */

#orf-101-delivery-scheme-box {
  background-color: #f2f2f2;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;  
  border-radius: 5px;
  padding: 20px 20px 10px 20px;
  margin-bottom: 20px;
}

#orf-101-delivery-scheme-box h4 {
  margin: 0 0 20px 0;
} 

#orf-101-delivery-scheme-box div.image-container {
  margin: 0 0 25px 0;
  padding: 20px 0 10px 0;
  text-align: center;  
  background: #fff;  
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;  
  border-radius: 5px;  
}

#orf-101-delivery-scheme-box div.image-container img {
  width: 481px;
  height: 204px;  
}

#orf-101-protocol-transcripts,
#orf-101-smtp-transcript-dialog div.illustration {
  background-color: #f2f2f2;
  padding: 20px;
  text-align: center;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;    
  border-radius: 5px;
  margin-bottom: 20px;
}

#orf-101-protocol-transcripts a {
  display: block;
}


#orf-101-testing-process {
  float: right;
  margin: 0 0 20px 30px;
}

#orf-101-testing-process img {
  width: 331px;
  height: 188px;
}

#orf-101-testing-process span {
  display: block;
  font-style: italic;
  text-align: center;
  margin-top: 12px;
}

div.guide-box-float-right {
  float: right;
  width: 280px;
  padding: 20px;
  margin: 0 0 20px 20px;
  background-color: #f2f2f2;
  border: 1px solid #eaeaea;
  border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
  
div.guide-box-float-right h3 {
  font: bold 16px/16px 'GestaBold',Arial,Helvetica,sans-serif;
  color: #484848;
  margin: 0 0 0.5em 0;
}

/* Guide: Best practices */
.guide-bp-section {
  
}

.guide-bp-section .left {
  float: left;
  width: 80px;
}

.guide-bp-section .right {
  float: left;
  /*width: 565px;
  border-left: 1px dotted #ccc;
  padding-left: 20px;*/
  margin: 0 0 40px 0;  
  width: 545px;
  padding: 20px;
  border: 1px solid #ccc;
  border-radius: 5px;  
  background-color: #f9f9f9;
}

.guide-bp-section .left span {
  display: inline-block;
  font: normal 50px/60px 'GestaMedium','Arial','Helvetica',sans-serif;
  color: #fff;
  width: 60px;
  text-align: center;
  background-color: #77d021;
  border-radius: 10px 0 10px 0; 
}

.guide-bp-section .right h2 {
  margin-top: 0;
}

.guide-bp-network-setup-examples,
.guide-bp-fp-flowchart-link {
  display: block;
  position: relative;
  float: right;
  padding-bottom: 3em;
  cursor: pointer;
}

.guide-bp-network-setup-examples {
  width: 271px;
  height: 144px;
  margin: 0 0 20px 10px;
  background: url('../images/guides/bp-ihl-examples-thumb.png') 0 0 no-repeat;
}

.guide-bp-fp-flowchart-link {
  width: 261px;
  height: 398px;
  margin: 0 0 20px 20px;
  background: url('../images/guides/bp-fp-select-thumb.png') 0 0 no-repeat;
}

.guide-bp-network-setup-examples span,
.guide-bp-fp-flowchart-link span {
  display: inline-block;
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  text-align: center;
  color: #777;
  font-style: italic;
}

.guide-bp-network-setup-examples:hover span,
.guide-bp-fp-flowchart-link:hover span {
  text-decoration: underline;
}