/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */

body
{
    background: url(/img/layout/bg2.jpg) repeat-y white;
    background-position: center;
    background-color: #FAFAFA;
}

h4
{
    color: rgb(51, 102, 255); 
    font-size: large;    
}
    h4 > a
    {
        text-decoration: none!important;
        color: rgb(51, 102, 255)!important; 
    }
h2 > a,
h3 > a
    {
        text-decoration: none!important;
    }
h2 {
        color: #254BBC; 
}
.center
{
    text-align:center;
}
.divcenter
{
    position:relative;
    margin-left:auto;
    margin-right:auto;
}
.pointer
{
    cursor:pointer;
}
.section
{
    clear: both;
    min-height:40px;
}
.section:first-child
{
    padding-top: 50px;
}
.m20
{
    margin-top: 20px;
}
.middle
{
    vertical-align:middle;
}
.left
{
    text-align:left;
}
.yellow
{
    color: #494908;
}
.gray
{
    color: #AAA;
}
nav {
    margin: 0;
    padding: 0;
    width:100%;
    display:block;
    background-color:#111;
}

    nav ul
    {
        display: table;
        margin: 0px;
        margin-left:auto;
        margin-right:auto;
        position:relative;
        background-color: #111;
    }
 
nav ul li {
    display: inline;
    padding: 30px 30px 30px 30px;
    margin: 0;
    display: block;
    float: left;
    text-align:center;
    border-left: dotted 1px grey;
}
    nav ul li:first-child {
        border-left: none;
    }
    nav ul li:hover,
    nav ul li.active
    {
        background: #343234;
    }
nav a.mm {
    text-decoration: none;
    font-variant: small-caps;
    font-weight: bold;
    font-size:45px;
    color: #DDD;
}
 
nav a:hover {
    color: #FFF;
}

.feature img {
    margin-bottom: 15px;
    max-width: 100%;
    height: auto;
}
footer
{
    margin-top:20px;
    clear: both;
    color: #BBB;
    font-size: 1em;
    text-align:center;
}
footer a
    {
        text-decoration: none!important;
        color: #BBB!important;
    }
footer a:hover
    {
        color: #000!important;
    }

.frame
{
    border: solid 9px rgba(255, 255, 255, 0.8);
}
.frame img
{
    border: solid 2px black;
    border-radius: 3px;
    width: 100%;
    height: auto;
}

.dividers > div
{
    border-left: dotted 1px grey;
}
    .dividers > div:first-child {
        border-left: none;
    }

.iconlist
{
    margin-left: 3%;
    margin-right: 3%;
}
    .iconlist img
    {
        margin: -12px 5px 5px 5px;
        width: 50px;
        height:50px;
        float:left;
    }
    .iconlist li
    {
        clear:both;
        min-height:60px
    }

#EditSection
{
    position:absolute;
    background-color: white;
    left: 0px;
    top: 0px;
    z-index:1000;
    padding:5px;
    border-radius:5px;
    border: 1px solid black;
    font-size: 12px;
}
.darkblack
{
   background-color: #666!important;
}
.editlink
{
    position:absolute;
    right:-150px;
    cursor: pointer;
    text-decoration: underline;
    color: blue;
    margin:30px 0 0 0;
    background-color:white;
    padding:5px;
    border-radius:5px;
    border: 1px solid black;
}
.mtop40
{
    margin-top: 70px;
}
.actionlink
{
    display:block;
    cursor: pointer;
    text-decoration: underline;
    color: blue;
    margin:0;
    padding:3px;
    margin:3px;
    border-radius:5px;
    border: 1px solid black;
}
.link
{
    cursor: pointer;
    text-decoration: underline;
    color: blue;
}
.nunderline
{
    text-decoration: none!important;
}

.piclink
{
    cursor:pointer;
}
.piclink:hover
{
    background: url(/img/var/arrow_right.png) no-repeat;
    background-position: center bottom;
}
.piclink > p
{
    min-height:90px;
}
.piclink .arro
{
    float:right;
    margin-top: -40px;
}

/* #Page Styles
================================================== */

form label, form input
{
    display:inline-block!important;
}
form label
{
    width: 140px;
    text-align:right;
}
form label.big
{
    width: 220px;
    text-align:right;
}
label.radio
{
    width: 100%;
    text-align: left;
}
form p
{
    margin: 0px;
}
form input[type="checkbox"]
{
    padding: 6px 4px;
    
    vertical-align:middle;
}
form input[type="submit"]
{
    margin-top: 15px;
    width:210px;
}
.validation
{
    margin:2px!important;
    color: #D00;
    border: solid 1px #D00;
    border-radius: 5px;
    background-color: #FCC;
    text-shadow: 0 1px 0 #FCC;
    padding:10px;
    display:block;
}
.tabelmooi {
	/*width: 100%;*/
    margin-bottom: 15px;
}

.tabelmooi th {
    border-bottom: 2px solid #A0410D;
    color: #A0410D;
    font-size: 14px;
    font-weight: normal;
    padding: 10px 8px;
}

.tabelmooi td {
    color: #000;
    padding: 9px 8px;
    vertical-align: middle;
    border-bottom: 1px dotted #CCCCCC;
}


/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px)
{
    nav ul li
    {
        padding: 20px 20px 20px 20px;
    }
}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
        nav a.mm
        {
            font-size: 40px;
        }
        .hidesmall
        {
            display: none!important;
        }
        .dividers > div
        {
            border-left: none;
        }
        nav ul li
        {
            padding: 20px 10px 20px 10px;
        }
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
nav a.mm {
    font-size:25px;
}
	}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/