﻿/*****************************************************************************************
******************************************************************************************
**                                                                                      **
**                                     fog.email                                        **
**                                   CSS Stylesheet                                     **
**                                                                                      **
**                             Copyright 2011-2013 iProtus                              **
**                               http://www.iprotus.com                                 **
**                                                                                      **
******************************************************************************************
**                                                                                      **
**                              Thanks particularly to:                                 **
**                                                                                      **
**              Shay Howe, http://learn.shayhowe.com/html-css/box-model                 **
**                           for an excellent primer on CSS,                            **
**                                                                                      **
**     Inayaili de Leon for pointing out the finer details of CSS selectors, here:      **
**    http://coding.smashingmagazine.com/2009/08/17/taming-advanced-css-selectors/      **
**                                                                                      **
**           Noah Stokes, http://alistapart.com/article/css-positioning-101             **
**        for cutting a few basics out in an informative and entertaining way,          **
**                                                                                      **
**                    and to W3C for their excellent validators:                        **
**                     CSS: http://jigsaw.w3.org/css-validator/                         **
**                         HTML: http://validator.w3.org/                               **
**                                                                                      **
**      And last but not least, this invaluable info on measuring HTML elements         **
**          http://msdn.microsoft.com/en-us/library/hh781509(v=vs.85).aspx              **
**                                                                                      **
******************************************************************************************
*****************************************************************************************/

/*****************************************************************************************
**           CSS reset from http://meyerweb.com/eric/tools/css/reset/                   **
*****************************************************************************************/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small,
strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form,
label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas,
details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section,
summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}

/*****************************************************************************************
**                                  General priming.                                    **
** Textalign in DIV and BODY in order to cope with old browsers not centering properly. **
**       See http://www.maxdesign.com.au/presentation/center/ and a thanks to him.      **
**                 Includes (now possibly redundant) old priming styles.                **
*****************************************************************************************/

*
{
	padding: 0px;
	margin: 0px;
}
body
{
	color: #123456;
	background-color: #ABCDEF;
	text-align: center;
	font-size: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin: 0px;
	padding: 0px;
	cursor: default;
	line-height: 1.2;		/* Do not use a unit here, see https://developer.mozilla.org/en-US/docs/CSS/line-height */
}
div
{
	text-align: left;
	font-size: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

/*****************************************************************************************
**                               Text and formatting                                    **
*****************************************************************************************/

h1	{font-weight: bold;		font-size: 2em;		color: #123456;}
h2	{font-weight: bold;		font-size: 1.7em;	color: #123456;}
h3	{font-weight: bold;		font-size: 1.5em;	color: #123456;}
h4	{font-weight: bold;		font-size: 1.3em;	color: #123456;}
h5	{font-weight: bold;		font-size: 1.2em;	color: #123456;}
h6	{font-weight: bold;		font-size: 1.1em;	color: #123456;}
p	{font-weight: normal;	font-size: 1.0em;}

/*****************************************************************************************
**                                Tables and lists                                      **
*****************************************************************************************/

table	{margin: 0px; padding: 0px;}
tr		{margin: 0px; padding: 0px;}
th		{margin: 0px; padding: 0px;}
td		{margin: 0px; padding: 0px;}

/*****************************************************************************************
**                                Links and related                                     **
*****************************************************************************************/

a:link		{font-weight: bold; color: #1234EF; text-decoration: none; cursor: pointer;}
a:active	{font-weight: bold; color: #1234EF; text-decoration: underline; cursor: pointer;}
a:visited	{font-weight: bold; color: #1234EF; text-decoration: none; cursor: pointer;}
a:hover		{font-weight: bold; color: #1234EF; text-decoration: underline; cursor: pointer;}

/*****************************************************************************************
**                                      Misc.                                           **
*****************************************************************************************/

.TableCell			{display: table-cell;}
.TextHCenter		{text-align: center;}
.TextVCenter		{display: table-cell; vertical-align: middle;}
.TextVAlign			{vertical-align: baseline;}
.TextNoWrap			{white-space: nowrap;}
.TextFullWidth		{width: 100%;}
.Clear				{clear: both;}
.Absolute			{position: absolute;}
.Fixed				{position: fixed;}
.Relative			{position: relative;}
.Z5					{z-index: 5;}
.Z10				{z-index: 10;}
.Z15				{z-index: 15;}
.Z20				{z-index: 20;}
.Z25				{z-index: 25;}

/*****************************************************************************************
**                                                                                      **
** Hack to vertically center elements in a DIV also in IE. According to specs standards **
** a simple style="display: table-cell; vertical-align: middle;" should suffice, but    **
** alas, not with IE, the usual suspect :p                                              **
**                                                                                      **
** A lot of thanks for Bruno Fassino for this, saved me many hours :-)                  **
** See: http://www.brunildo.org/test/img_center.html                                    **
**                                                                                      **
** To use, insert an empty span as first child element of the "vertical-align: middle"  **
** DIV with the contents to be vertically centered. As in:                              **
**                                                                                      **
**   <div style="display: table-cell; vertical-align: middle;">                         **
**     <span class="IeVCenterLayoutHack"></span> Blablabla...                           **
**   </div>                                                                             **
**                                                                                      **
**   --- or ---                                                                         **
**                                                                                      **
**   <div class="TextVCenter">                                                          **
**     <span class="IeVCenterLayoutHack"></span> Blablabla...                           **
**   </div>                                                                             **
**                                                                                      **
*****************************************************************************************/

.IeVCenterLayoutHack
{
	width: 1px;
	height: 100%;
	display: inline-block;
	vertical-align: middle;
}

/*****************************************************************************************
******************************************************************************************
**                                                                                      **
**                                                                                      **
**                               MasterPage related                                     **
**                                                                                      **
**                                                                                      **
******************************************************************************************
*****************************************************************************************/

/*****************************************************************************************
******************************************************************************************
**                                                                                      **
**                                                                                      **
**                               ContentPage related                                    **
**                                                                                      **
**                                                                                      **
******************************************************************************************
*****************************************************************************************/
