/******************************************************************
* Bager.com Productions, LLC.
* All Rights Reserved
* Main Cascade Stylesheet for use on beger.com
* $Id: begermain.css 165 2010-09-08 01:15:06Z miroze $

*******************************************************************
* Base Element Styles
*******************************************************************/
body
{
	margin: 0;
	padding: 0;
	font: normal 12px Verdana, Geneva, sans-serif;
	width: 100%;
	background: #7bbff9;
	min-width: 1000px;
	
}
h1 { text-align: center; font-size: 24px; margin: auto; padding: 0; }
h2 { text-align: center; font-size: 18px; width: 100%; margin: auto; padding: 0; color: #1871ba; }
h3 { text-align: center; font-size: 16px; width: 100%; margin: auto; padding: 0; color: #d66100; }
h4 { text-align: center; font-size: 14px; width: 100%; margin: auto; padding: 0; color: #498f04; }
h5 { text-align: center; font-size: 11px; width: 100%; margin: auto; padding: 0; color: #76a3c8; }
a { outline: none; }

.clear { clear: both; margin: 0; padding: 0; display: block; }
.no-border { border: none; }
.no-img-border img { border: none; }
.no-wrap { white-space: nowrap; }
.float-left { float: left; }
.float-right { float: right; }
.align-left { text-align: left; }
.align-right { text-align: right; }
.align-center { text-align: center; }
.pad5 { padding: 5px; }
.pad10 { padding: 10px; }
.pad15 { padding: 15px; }
.indent25 { text-indent: 25px; }
.bold-link { font-size: 14px; font-weight: bold; color: #1871ba; }

/******************************************************************
* Header Styles
*******************************************************************/
#pageContainer { background: #fff url("/img/beger-bg.jpg") top left repeat-x; min-width: 1000px; padding-top: 25px; }
#topNav { white-space: nowrap; height: 200px; }
#logoContainer { position: absolute; top: 0; }
#logoContainer img { border: none; }
#headerLinks { position: fixed; top: 0px; right: 0px; background: transparent url("/img/topnav-bg.gif") top right no-repeat; width: 650px; height: 25px; z-index: 99; padding-right: 10px; color: #fff;  }
#headerLinks a { text-decoration: none; color: #fff; font-weight: bold; }
#headerLinks a:hover { color: #f8e43c; }
#headerLinks .callus { display: inline; float: right; padding-right: 10px; }
#headerLinks .ourlinks { display: inline; line-height: 21px; vertical-align: middle; font-size: 14px; float: right; }
#headerBase { float: right; text-align: right; color: #fff; vertical-align: bottom; font-size: 14px; margin-top: 3px; height: 143px; position: relative;}
#headerBaseContainer { height : 143px; width: 497px; }
#headerBaseContainer.bg1 { background: transparent url("/img/navbg-1.jpg") top right no-repeat; }
#headerBaseContainer.bg2 { background: transparent url("/img/navbg-2.jpg") top right no-repeat; }
#headerBaseContainer.bg3 { background: transparent url("/img/navbg-3.jpg") top right no-repeat; }
#headerButtons {  position:absolute; top: 112px; right: 190px; vertical-align: bottom; }
#headerButtons ul { margin: 0; padding: .2em 0 0 0; list-style-type: none; }
#headerButtons li { margin: 0 3px; padding: 0; display: inline; }
#headerButtons li img { border: none; }

/******************************************************************
* Content Styles
*******************************************************************/
#contentContainer { margin-left: 2%; margin-right: 2%; text-align: center; padding: 15px; }
#contentContainer a { text-decoration: underline; color: #195fff; font-weight: bold; }
#contentContainer a:hover { color: #76a3c8; }
#colLeft { float: left;  min-width: 650px; width: 67%; border-right: 1px solid #9cdcfa; margin: auto; font-size: 14px; overflow: none; }
#colLeft h1 { width: 475px; text-align: center; font-size: 24px; margin: auto; padding: 0; }
#colRight { float: left; width: 30%; margin: auto; overflow: none; }
#colBoth { margin-left: 5%; margin-right: 5%; border: 1px solid #9cdcfa; border-top-style: none; border-bottom-style: none; padding-left: 15px; }

#colBothSmall { margin-left: 25%; margin-right: 25%; }

#colLeft2 { float: left;  min-width: 500px; width: 45%; border-right: 1px solid #9cdcfa; margin: auto; font-size: 14px; overflow: none; }
#colLeft2 h1 { text-align: center; font-size: 22px; margin: auto; padding: 0; }
#colRight2 { float: left; width: 45%; margin: auto; overflow: none; }

#colLeft3 { float: left;  min-width: 600px; width: 60%; border-right: 1px solid #9cdcfa; margin: auto; font-size: 14px; overflow: none; }
#colLeft3 h1 { width: 475px; text-align: center; font-size: 24px; margin: auto; padding: 0; }
#colRight3 { padding-left: 15px; float: left; width: 35%; margin: auto; overflow: none; }

#frontLeft { width: 630px; margin: auto; }
#frontRandomPhotoContainer a { text-decoration: none; }

#seeTheDifference { margin-left: auto; margin-right: auto; white-space: nowrap; padding-top: 25px; overflow: none; }
.padded-block-left { float: left; width: 40%; min-width: 380px;  border-right: 1px dashed #e3f5fe; padding-top: 10px; }
.padded-block-right { float: left;  width: 40%; min-width: 380px;  padding-left: 25px; padding-top: 10px; }
.padded-title { margin-top: 60px; }
.featurelist { text-align: left; white-space: normal; }
.featurelist li { width: 300px; font-weight: bold; margin-bottom: 5px; }
.featurelist li .extended { font-style: normal; font-weight: normal; color: #777; font-size: 14px; margin-left: 15px; margin-top: 5px; }

#servicesLeft { width: 630px; margin: auto; }
#servicesLeft h3 { color: #fff; font-weight: bold; font-size: 16px; text-align: left; background-color: #7ec4ff; padding: 5px; }

#servicesContainer { text-align: left; margin-left: 10%; margin-right: 10%; }
#servicesContainer h3 { padding: 15px 0 5px; }
#servicesContainer h3, #servicesContainer h4, #servicesContainer h5 { text-align: left; }
#servicesContainer h4 a { text-decoration: none; color: #1871ba; font-size: 14px; }

#serviceRightContainer ul { margin: auto; padding: .2em 0 0 0; list-style-type: none; }
#serviceRightContainer li { margin: 10px 3px; padding: 0; color: #ddd; font-weight: bold; font-size: 16px; }
#serviceRightContainer li a { font-size: 16px; text-decoration: underline; }

.priceLine { font-weight: bold; }
.priceLine b { font-weight: bold; font-size: 16px; color: #498f04; }
.priceLine small { font-weight: normal; display: block; }

.prettyTable { margin: auto; text-align: center; }
.prettyTable .prettyCell { float: left; width: 305px; margin: 5px 0 5px 0;}
.prettyTable .prettyCell h4 { color: #5b5b5b; font-weight: bold; font-size: 14px; }
.prettyTable .prettyCell h5 { color: #1871ba; font-weight: bold; font-size: 11px; }

.contactblock { text-align: left; }
.smallblock { color: #777; }

#photoSets { text-align: center; margin-top: 10px; margin-left: auto; margin-right: auto; margin-bottom: 60px; }
#photoSets h4 { color: #055090; font-size: 10px; width: 100px; }
#photoSets table {margin: auto;}
#photoSets table td { padding: 5px; vertical-align: top; }
#photoSetsContainer { margin: auto; width: 760px; }
#photoSets .set { padding: 5px; width: 115px; height: 130px; vertical-align: top; width: 100px; float: left; margin: 0 5px 0 5px; background: transparent url("/img/panel-bg.gif") top right no-repeat; }
#photoSets .set h4 { color: #055090; font-size: 10px; width: 100px; line-height: 1.2em; height: 2.4em; overflow: hidden; } /* truncate any text after first two lines */
#photoSets .set h4 a { color: #055090; text-decoration: none; }

#miniPhotoSetsContainer { margin: auto; width: 515px; text-align: center; padding-top: 10px; }
#miniPhotoSets .set { padding: 5px; width: 115px; height: 130px; vertical-align: top; width: 100px; float: left; margin: 0 5px 0 5px; background: transparent url("/img/panel-bg.gif") top right no-repeat; }
#miniPhotoSets .set h4 { color: #055090; font-size: 10px; width: 100px; line-height: 1.2em; height: 2.4em; overflow: hidden; } /* truncate any text after first two lines */
#miniPhotoSets .set h4 a { color: #055090; text-decoration: none; }

#photoSet { text-align: center; margin-top: 10px; margin-left: auto; margin-right: auto; }
#photoSet h4 { color: #055090; font-size: 10px; width: 100px; }
#photoSet table {margin: auto;}
#photoSet table td { padding: 5px; vertical-align: top; }
#photoSetContainer { margin: auto; width: 555px; }
#photoSetContainer .bottom-link { margin-top: 15px; float: right; margin-right: 200px; }
#photoSet .square { vertical-align: top; float: left; border: 1px solid #ddd; margin: 0px; height: 75px; }
#photoSet .square h4 { display: none; }
#photoSet .square img { width: 75px; height: 75px; }

#photoViewContainer { margin: auto; }
#photoView .photo { vertical-align: top; margin: 15px 0 15px 0; }
#photoView .photo .disable { cursor: default; }
#photoView .photo h4 { display: none; }
#photoView .photo img { border: 3px outset #bbb; }
#photoView #pagination { margin: auto; padding-top: 15px; width: 480px; text-align: center; }
#photoView #pagination ul { margin: 0; padding: .2em 0 0 0; list-style-type: none; }
#photoView #pagination li { margin: 0 3px; padding: 0; float: left; width: 150px; }
#photoView #pagination li img { border: none; }
#photoView #pagination .button a { border: 3px outset #7ec4ff; padding: 8px 25px 8px 25px; line-height: 38px; background-color: #b3e4fb; color: #1871ba; text-decoration: none; }
#photoView #pagination .middle { margin-top: -8px; }
#photoView #pagination .button a:hover { background-color: #d5f5fc; }
#photoView #pagination .button a:active { background-color: #9fd5ff; }
#photoView #pagination .button .disable { border: 3px outset #bbb; padding: 8px 25px 8px 25px; background-color: #ccc; color: #999; font-weight: bold; text-decoration: none; cursor: default; }
#photoView #pagination .button .disable:hover { background-color: #ccc; }
#photoView #pagination .button .disable:active { background-color: #ccc; }

#sponsoredAd .no-decoration a { text-decoration: none; }

#tweets { width: 300px; margin: 15px 0 15px 0; }
#tweets .tweet { border-top: 2px dashed #9cdcfa; padding: 5px; }
#tweets .tweet .tleft { float: left; width: 45px; display: block; text-align: left; }
#tweets .tweet .tright { float: left; width: 245px; display: block; text-align: left; color: #999; font-size: 11px; }
#tweets .tweet b { display: block; color: #444; }

#blogFront { margin: 15px 0 15px 0; }
#blogFront h2 { margin: 15px 0 15px 0; }
#blogFront .article { border: 1px solid #ddd; padding: 5px; margin-bottom: 6px; }
#blogFront .article small { color: #546d9b; font-size: 11px; margin-bottom: 5px; display: block; }

#graphDesignLinks { margin-top: 90px; margin-left: 15px; width: 180px; }
#graphDesignLinks .small { color: #777; font-size: 14px; }
#graphDesignLinks ul { margin: 0; padding: 12px 0 0 0; width: 150px; border-top: 1px solid #ddd; }
#graphDesignLinks ul li { list-style: none; margin: 0; padding: 0;  font-size: 13px; padding-top: 7px; }
#graphDesignLinks ul li img { float: left; border: 1px solid #ccc; padding: 3px; margin-right: 10px; margin-top: -7px; border: none; }
#graphDesignLinks ul li a { text-decoration: none; color: #3491d9; font-weight: normal;}
#graphDesignLinks ul li a:hover { text-decoration: underline; color: #3491d9; }
#graphDesignLinks ul li:after { content: url("/img/beger-arrow.gif"); clear: both; }
#graphDesignLinks .divider { background-color: #ddd; height: 1px; padding: 0; margin: 18px 0 8px 0; }
#graphDesignLinks .divider:after { content: ""; }

/******************************************************************
* Footer Styles
*******************************************************************/
#bottomNav { background: #7bbff9 url("/img/beger-footer-bg.jpg") top left repeat-x; margin-top: 10px; padding: 15px; text-align: center; color: #fff; }
#bottomNav .w3c img { border: none; }
#footerContainer { width: 500px; text-align: center; margin: auto; }


/******************************************************************
* Dialog Styles
*******************************************************************/

.dialogLt { max-width:100%; width: 100%; min-width:8em; color:#000; z-index:1; }
.dialogLt .content, .dialogLt .t, .dialogLt .b, .dialogLt .b div { background:transparent url("/img/dialog.gif") no-repeat top right; _background-image:url("/img/dialog.gif"); }
.dialogRt { max-width:100%; width: 100%; margin-left: 20px; margin-bottom: 15px; min-width:350px; color:#000; z-index:1; }
.dialogRt .content, .dialogRt .t, .dialogRt .b, .dialogRt .b div { background:transparent url("/img/dialog.gif") no-repeat top right; _background-image:url("/img/dialog.gif"); }
.dialogFt { max-width:100%; width: 100%; margin-left: auto; margin-right: auto; min-width:8em; color:#fff; z-index:1; }
.dialogFt .content, .dialogFt .t, .dialogFt .b, .dialogFt .b div { background:transparent url("/img/dialog2.gif") no-repeat top right; _background-image:url("/img/dialog2.gif"); }
.dialogRts { max-width:100%; width: 100%; margin-left: 20px; margin-bottom: 15px; min-width:250px; color:#000; z-index:1; }
.dialogRts .content, .dialogRts .t, .dialogRts .b, .dialogRts .b div { background:transparent url("/img/dialog.gif") no-repeat top right; _background-image:url("/img/dialog.gif"); }

.dialog .content { position:relative; zoom:1; _overflow-y:hidden; padding:5px 12px 0px 0px; }
.dialog .t { position:absolute; left:0px; top:0px; width:12px; margin-left:-12px; height:100%; _height:1600px; background-position:top left; }
.dialog .b { position:relative; width:100%;}
.dialog .b, .dialog .b div { height:15px; font-size:1px; }
.dialog .b { background-position:bottom right; }
.dialog .b div { position:relative; width:12px; margin-left:-12px; background-position:bottom left; }
.dialog .hd, .dialog .bd, .dialog .ft { position:relative; }
.dialog .wrapper { position:static;  overflow:auto; }
.dialog h1, .dialog .wrapper { margin:0px; padding:0.5em 0px 0.5em 0px;}
.dialog h1 { padding-bottom:0px; }

.blueDivider { background-color: #9cdcfa; border: none; height: 2px; }
.blueDividerDashed {  border-top: 4px dashed #9cdcfa; height: 0px; }


.block1 { padding: 15px; font-size: 14px; }
.block1 p { padding: 5px; }
.block1 a { color: #fff; font-weight: bold; }
ol { margin-left: 10px; padding-left: 5px; font-size: 14px; }
ol li { padding: 0 0 15px; }
