/* GENERAL *****************************************************************/

.clear  {
        clear: both;
        line-height: 1;
        margin: 0;
        padding: 0;        
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;      
        }

.italic {
	font-style: italic;
	}

/* TYPOGRAPHY *****************************************************************/
body    {
        font-family:  "Helvetica neue", Arial, sans-serif;
        font-size: 15px;
        line-height: 1.6em;
        color: #404046;
        background-color: #eaebec;
        }
	
h2,
h3,
h4,
h5 {
	color: #303036;
	}


	
h1      {
        font-size : 4em;
	line-height: 0.6em;
        margin-bottom : 0;
        }	
	
h2      {
        font-size : 2.4em;
	line-height: 1.2em;
        margin-bottom : 0.75em;
        //text-transform: uppercase;
        }

#top h2	{
	color: #aaa;
	font-size: 0.9em;
	font-weight: 400;
	line-height: 1.7em;
	margin-bottom: 0;
	letter-spacing: 1px;
	margin: 20px auto 0;	
	text-transform: uppercase;
        }
        
h2.hi   {
        text-transform: none;
	font-size: 2.1em;
        }
      
h3      {
        //font-size : 1.8em;
	//line-height: 1.2em;
       // margin: 40px 0 20px 0;
        padding: 0px 0 0px 10px;
        //background-color: #404046;
	background-color: #ddd;
        //color: #fff;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        border-radius: 2px;
        }

h3      {
        font-size : 1.9em;
	line-height: 1.4em;
        margin: 40px 0 20px 0;
        }	
	
	
h4      {
	border-bottom: 4px solid #ddd;
	font-size: 1.5em;
	letter-spacing: 0.2px;
	margin: 60px 0 20px;
	padding-bottom: 6px;
	}



h5 {
	background-color: #e4e4e4;
	border-radius: 3px;
	display: inline-block;
	font-size: 1em;
	margin: 20px 0;
	padding: 1px 10px;
	}

p        {
         margin-bottom: 1em;
         margin-bottom: 1em;
         }

#top p   {
	color: #aaa;
	font-size: 0.8em;
	font-weight: 400;
	line-height: 1.7em;
         margin: 0;
         }


table td {
	vertical-align: top;
	}

td.text50,
td.text60,
td.text70 {
	padding-right: 10px;
	}

td.text40{
	width: 40%;
	}

td.text50{
	width: 50%;
	}

td.text60{
	width: 60%;
	}

td.text70{
	width: 70%;
	}


/* COLOR **********************************************************************/
/* 1st color */
a,
a:link,
a:visited {
        color: #218ac2;
        }

#topbutton a,
nav.navigation a.active {
        background-color: #218ac2;
        //background-color: #76d1c4;
	   }
        
/* 2nd color */
a:hover, a:active
        {
        color: #A0795F;
        }

nav.navigation a:hover,
.subnavi a:hover {
        background-color: #A0795F;
        //background-color: #FCD647;
        }

/* subnavi color */	
.subnavi a {
        background-color: #a3d7df;
	//background-color: #76d1c4;
        color: #fff;
	}	
	
/* highlight and warning */
.highlight,
.warning {
	color: #444444;
	display: block;
	padding: 4px 12px;
	margin: 12px 0;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	}

.highlight {
	border-radius: 2px;
	border: 4px solid #51EDB9;
	}

.highlight2 {
	background: #51EDB9;
	padding: 10px 16px;
	margin: 20px 0;
	display: inline-block;
	color: #000;
	box-decoration-break: clone;
	font-weight: bold;
	}

.warning {
	padding: 15px 20px;
	border: 4px solid #eee;
	}

.warningtext {
	color: #ff4229;
	font-weight: bold;
	}


/* LAYOUT **********************************************************************/

#wrapper,
.divider {
	max-width: 865px;
        }
        
#wrapper {
        margin: 20px auto 40px;
        background-color: #fff;
        overflow: hidden;
        padding: 0 50px 40px;
        }

.divider {
        height: 36px;
        border-bottom: 1px dashed #babebf;
        }

#top    {
        padding: 30px 0 54px;
        text-align: center;
        }
	 
	 
ul, ol   {
         padding-left: 18px;
         line-height: 2em;
         }

ul li {
	padding-top: 10px;
	}

ul ul li,
ol ul li {
	padding-top: 0;
	list-style-type: disc;
	}

.narrowlist li {
	padding-top: 0px;
	} 
	 
.indent {
	padding-left: 60px;
	}	 

ul.pages {
        list-style-type: none;
        margin: 0;
        padding: 0;
        }
        
ul.pages li {
        display: inline;
        margin-right: 30px;
        }

ul.changelog {
        margin-top: 0;
        }
        
a, a:link, a:visited
         {
         text-decoration : underline;
         }

pre     {
        background-color: #eee;
        border-radius: 4px 4px 4px 4px;
        line-height: 18px;
        margin-bottom: 1em;
        overflow: auto;
        padding: 20px;
        white-space: pre-wrap;       /* CSS 3 */
	white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
	white-space: -pre-wrap;      /* Opera 4-6 */
	white-space: -o-pre-wrap;    /* Opera 7 */
        }
        
code     {
        font: 13px/1.3 "Courier New", Courier, monospace;
        background: none repeat scroll 0 0 #ECECEF;
        display: inline-block;
        font: 13px/24px "Courier New",Courier,monospace;
        padding: 6px 12px;
        }

.smallgrey {
        font-size: 0.8em;
        color: #aaa;
        }
/*
.bignumber {
        font-size: 28px;
	line-height: 33px;
	font-weight: bold;
        }
*/

.lighter { color: #888; }

.separator-line {
	height: 8px;
	margin: 40px auto 20px;
	width: 50px;
	background-color: #ddd;
	}

.arrow
         {
         font-size: 3em;
         line-height: 1.2em;
         padding: 20px 0 0 200px;
         }

img    {
        max-width: 100%;
        padding: 10px 0;
	color: #ddd;
	font-size: 40px;
	font-style: italic;
	font-weight: bold;
	letter-spacing: 3px;
	}

img.nopadding {
	padding: 0;
	}


/*  TABS *****************************************************************/
.wrapper .tab,
.sub .tab {
	display: none;
	}

.wrapper .tab.active,
.sub .tab.active {
	display: block;
	}

nav.navigation a {
   	float: left;
        line-height: 25px;
        margin: 0 5px 5px 0;
        overflow: hidden;
        padding: 3px 15px;
        position: relative;
        background-color: #404040;
        text-decoration: none;
        color: #fff;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        border-radius: 2px;
	}

/* SUBNAVI *****************************************************************/
.subnavi {
	margin: 0;
	padding: 0;
	clear: both;
	}

.subnavi a {
        font-size: 0.9em;
   	float: left;
        line-height: 25px;
        margin: 0 5px 5px 0;
        padding: 2px 8px;
        position: relative;
        text-decoration: none;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        border-radius: 2px;
	}

.gettingstarted .subnavi a {
	font-size: 1.3em;
	margin: 0 15px 20px 0;
	padding: 8px 15px;
	}
	
	
.subnavi a.last {
        margin-right: 0;
	}
		
.subnavi a.active {
	background-color: #218ac2;
	}

	
/*  TOP BUTTON *****************************************************************/	
#arrow {
    bottom: 130px;
    display: inline-block;
    font-size: 50px;
    font-weight: bold;
    padding: 30px;
    position: relative;
}

#topbutton a {
        position: fixed;
        bottom: 20px;
        right: 20px;
        text-decoration: none;
        color: #fff;
        padding: 3px 13px 10px;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        border-radius: 2px;
        font-size: 25px;
        font-weight: bold;
	}