html
{
    margin:0;
    padding:0;
    height: 100%;
}

body
{
    margin:0;
    padding:0;
    color:#616161;
    line-height:18px;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size:12px;
    background-color:#fff;    
    height: 100%;
}

p
{
    margin:0px!important;
    padding:0px!important;
}

img
{
    border:0px;
}

h1
{
    font-family: Arial, Verdana, Helvetica, sans-serif;
    line-height:18px;
    margin:0px; 
    color:#2e83c4;
    font-weight: normal;
    position: relative;
    float: left;
    display: inline;
    margin-left: 15px;
    margin-top: 15px;
    font-size: 16px;
    color: #2e83c4;
    
    white-space: nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

#right h1
{
    max-width:800px;
}

h1.block-titel, div.block-titel
{
    position: absolute;
    left: 0px;
    top:21px;
    right: 0px;
    padding-left: 15px;
    height: 25px;
    margin-top:0px;
    margin-left:0px;
    font-size:12px;
    margin-bottom: 8px;
    color: #000;
    font-weight: bold;
    border-bottom: 1px solid #c9c9c9;
}        
          
h2
{
    font-family: Arial, Verdana, Helvetica, sans-serif;  
    font-size:16px;
    line-height:18px; 
    color:#2e83c4;
    font-weight: normal;
}

h3
{
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size:14px;
    line-height:17px; 
    color:#2e83c4;
    font-weight: normal;
}

input[type="text"], input[type="password"]
{
    background-image: url(../../images/shadow-input.gif);
    background-repeat: no-repeat;
    background-position: left top;
    border: 1px solid #dedede;
    color:#000;
    height: 25px;
    padding: 0px 0px 0px 5px;
    margin: 3px 0px 0px 0px;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 12px;
    width: 180px; 
    margin-bottom: 11px;
}

input[type="number"]
{                
    background-image: url(../../images/shadow-input.gif);
    background-repeat: no-repeat;
    background-position: left top;
    border: 1px solid #dedede;
    color:#000;
    height: 25px;
    padding: 0px 0px 0px 5px;
    margin: 3px 0px 0px 0px;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 12px;
    width: 180px; 
    margin-bottom: 11px;
}

input[type="radio"].bftrue
{
    margin-bottom: 20px;
}

input[type="radio"].bffalse{
    margin-bottom: 20px;
    margin-left: 15px;
}

input[type="file"]
{
    background-image: url(../../images/shadow-input.gif);
    background-repeat: no-repeat;
    background-position: left top;
    border: 1px solid #dedede;
    color:#000;
    height: 25px;
    padding: 0px 0px 0px 5px;
    margin: 3px 0px 0px 0px;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 12px;
    width: 189px; 
    margin-bottom: 11px;

    -webkit-appearance: none /* this is the key to clearing the default styling */; 
}

select
{
    background-image: url(../../images/shadow-input.gif);
    background-repeat: no-repeat;
    background-position: left top;
    border: 1px solid #dedede;
    color:#000;
    height: 25px;
    padding: 0px 0px 0px 5px;
    margin: 3px 0px 0px 0px;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 12px;
    width: 187px; 
    margin-bottom: 11px;
}

textarea
{
    background-image: url(../../images/shadow-input.gif);
    background-repeat: no-repeat;
    background-position: left top;
    border: 1px solid #dedede;
    margin: 3px 0px 0px 0px;
    padding: 5px 0px 0px 5px;
    color:#000;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 12px;
    width: 182px; 
    height: 121px; 
    margin-bottom: 11px;
    resize: none;
}                                       

textarea.error, select.error, input.error
{
    background-image: url(../../images/shadow-input-red.gif) !important;
    border: 1px solid #D95252 !important;  
    color:#912323 !important;    
}

a:link, a:visited, a:active
{
    color:#616161;
    text-decoration:none;
    outline: none;
}

a:hover
{
    color: #2e83c4;
    text-decoration:underline;
    outline: none;
}

ul
{
    list-style-position:inside;
}

li
{
    list-style-position:inside;
}

.blue
{
    color: #2e83c4;
}

#login-shine
{
    position: absolute;
    width: 340px;
    height: 78px;
    top: 50%;
    margin-top: 155px;
    left: 50%;
    margin-left: -170px;
    background-image: url(../../images/login-shine.png);
    background-repeat: no-repeat;
}

#login-container
{
    position: absolute;
    width: 300px;
    height: 280px;
    left: 50%;
    top: 50%;
    margin-left: -150px;
    margin-top: -140px;
    border: 1px solid #C9C9C9;
    background-color: #fff;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

#login-content-container{
    position: relative;
    float: left;
    display: inline;
    width: 200px;
    margin-left: 50px;
    margin-top: 33px;
}

#login-titel{
    position: relative;
    float: left;
    display: inline;
    width: 200px;
    margin-bottom: 25px !important;
}

#login-titel h1{
    margin-left:0px !important;
    margin-top:0px !important;
    margin-bottom: 0px !important;
}

#container{
    position: relative;
    float: left;
    display: inline;
    width: 100%;
    height: 100%;
    min-height: 750px;
    min-width: 1030px;
}

#header{
    position: absolute;
    width: 100%;
    height: 58px;
    top:0px;
    left: 0px;
    background-color: #272727; 
}

#header-login{
    position: absolute;
    width: 100%;
    height: 58px;
    top:-58px;
    left: 0px;
    background-color: #272727;
}

#bg-left{
    position: fixed;
    width: 165px;
    top:58px;
    bottom: 0px;
    left: 0px;
    background-color: #f5f5f5;
    border-right: 1px solid #e5e5e5;
}

#left-bg{
    position:fixed;
    width: 190px;
    top:0px;
    bottom: 0px;
    left:0px;
    background-color: #f5f5f5;
    border-right: 1px solid #e5e5e5;
    z-index:-1;
}

#left{
    position: absolute;
    width: 190px;
    top:58px;
    bottom: 0px;
    left: 0px;
    background-color: #f5f5f5;
    border-right: 1px solid #e5e5e5;
}

#left-space{
    position:relative;
    float:left;
    display: inline;
    width: 143px;
    height:20px;
}

#right{
    position: absolute;
    top:58px;
    left: 191px;
    bottom: 0px;
    right: 0px;
    background-color: #fff;
}

.doit-online-logo{
    position: absolute;
    width: 137px;    
    height: 40px;
    left: 14px;
    top: 10px;    
}

/* MENU ITEM */
#menu-container{
    position: absolute;
    height: 44px !important;
    left: 191px;
    right: 0px;
    top: 14px;
    z-index: 1;
}

.menu-item-container{
    position: relative;
    float: left;
    display: inline;
    height: 44px;
    margin-left: 2px;
}

.menu-item-container-sub{
    position: relative;
    float: left;
    height: auto;
}

.menu-item-left, .menu-item-left-meer{
    position: relative;
    float: left;
    display: inline;
    width: 8px;
    height: 44px;
    background-image: url(../../images/menu-item-left.gif);
    background-repeat: no-repeat;
    background-position: top;
    outline: none;
}

.menu-item-container:hover .menu-item-left{
    background-position: bottom;
}

.menu-item-left-active{
    position: relative;
    float: left;
    display: inline;
    width: 8px;
    height: 44px;
    background-image: url(../../images/menu-item-left.gif);
    background-repeat: no-repeat;
    background-position: bottom;
    outline: none;
}

.menu-item-center, .menu-item-center-meer{
    position: relative;
    float: left;
    display: inline;
    padding-left: 10px;
    padding-right: 10px;
    height: 44px;
    line-height: 40px;
    color: #fff!important;
    text-decoration: none!important;
    background-image: url(../../images/menu-item-center.gif);
    background-repeat: repeat-x;
    background-position: top;
    outline: none;
}

.menu-item-center-sub, .menu-item-center-sub-active{
    position: relative;
    float: left;
    display: inline;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 4px;
    padding-bottom: 4px;
    line-height: 20px;
    text-decoration: none!important;
    outline: none;
    min-width: 150px;
    background-color: #fff;
    border: 1px solid #e5e5e5;
    margin-bottom: 8px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    background-color: #3e88c0;
    border: 1px solid #519cd4;
    color: #ffffff !important;
}

.menu-item-center-sub:hover, .menu-item-center-sub-active{
    background-color: #fff;
    border: 1px solid #fff;
    color: #2e83c4!important; 
    
}

.menu-item-container:hover .menu-item-center{
    color: #2e83c4!important;
    text-decoration: none!important;
    background-image: url(../../images/menu-item-center.gif);
    background-position: bottom;
}


.menu-item-center-active{
    position: relative;
    float: left;
    display: inline;
    padding-left: 10px;
    padding-right: 10px;
    height: 44px;
    line-height: 40px;
    color: #2e83c4!important;
    text-decoration: none!important;
    background-image: url(../../images/menu-item-center.gif);
    background-repeat: repeat-x;
    background-position: bottom;
    outline: none;
}

.menu-item-center-meer span{
    position: relative;
    top: -1px;
    border-style: solid dashed dashed;
    border-color: transparent;
    border-top-color: #fff;
    display: -moz-inline-box;
    display: inline-block;
    font-size: 0;
    height: 0;
    line-height: 0;
    width: 0;
    border-width: 3px 3px 0;
    padding-top: 1px;
    left: 4px;  
}

.menu-item-container:hover .menu-item-center span{
    border-top-color: #2e83c4 !important;
}

.menu-item-container-submenu{
    position: absolute;
    left: 0;
    top:44px;  
    display: none;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 2px;
    padding-top: 4px;
    width: 173px;
    background-color: #272727;
    border-radius: 0px 0px 7px 7px;
    -moz-border-radius: 0px 0px 7px 7px;
    -webkit-border-radius: 0px 0px 7px 7px;
}

.menu-item-container:hover .menu-item-container-submenu{
    display: block;
}

.menu-item-right, .menu-item-right-meer{
    position: relative;
    float: left;
    display: inline;
    width: 8px;
    height: 44px;
    background-image: url(../../images/menu-item-right.gif);
    background-repeat: no-repeat;
    background-position: top;
    outline: none;
}

.menu-item-container:hover .menu-item-right{
    background-position: bottom;
}

.menu-item-right-active{
    position: relative;
    float: left;
    display: inline;
    width: 8px;
    height: 44px;
    background-image: url(../../images/menu-item-right.gif);
    background-repeat: no-repeat;
    background-position: bottom;
    outline: none;
}

/* ADMIN MENU ITEM */
.menu-item-container-gray{
    position: relative;
    float: right;
    display: inline;
    margin-right: 2px;
    height: 44px;
}

.menu-item-left-gray{
    position: relative;
    float: left;
    display: inline;
    width: 8px;
    height: 44px;
    background-image: url(../../images/menu-item-left-gray.gif);
    background-repeat: no-repeat;
    background-position: top;
    outline: none;
}

.menu-item-container-gray:hover .menu-item-left-gray{
    background-position: bottom;
}

.menu-item-left-active-gray{
    position: relative;
    float: left;
    display: inline;
    width: 8px;
    height: 44px;
    background-image: url(../../images/menu-item-left-gray.gif);
    background-repeat: no-repeat;
    background-position: bottom;
    outline: none;
}

.menu-item-center-gray{
    position: relative;
    float: left;
    display: inline;
    padding-left: 10px;
    padding-right: 10px;
    height: 44px;
    line-height: 40px;
    color: #fff!important;
    text-decoration: none!important;
    background-image: url(../../images/menu-item-center-gray.gif);
    background-repeat: repeat-x;
    background-position: top;
    outline: none;
}

.menu-item-admin{
    position: relative;
    float: left;
    display: inline;
    width: 20px;
    height: 44px;
    background-image: url(../../images/menu-item-admin.gif);
    background-repeat: repeat-x;
    background-position: top;
    outline: none;
}

.menu-item-container-gray:hover .menu-item-admin{
    background-position: bottom;
}

.menu-item-admin-active{
    position: relative;
    float: left;
    display: inline;
    width: 20px;
    height: 44px;
    background-image: url(../../images/menu-item-admin.gif);
    background-repeat: repeat-x;
    background-position: bottom;
    outline: none;
}

.menu-item-container-gray:hover .menu-item-center-gray{
    color: #2e83c4!important;
    text-decoration: none!important;
    background-image: url(../../images/menu-item-center-gray.gif);
    background-position: bottom;
}

.menu-item-center-active-gray{
    position: relative;
    float: left;
    display: inline;
    padding-left: 10px;
    padding-right: 10px;
    height: 44px;
    line-height: 40px;
    color: #2e83c4!important;
    text-decoration: none!important;
    background-image: url(../../images/menu-item-center-gray.gif);
    background-repeat: repeat-x;
    background-position: bottom;
    outline: none;
}

.menu-item-right-gray{
    position: relative;
    float: left;
    display: inline;
    width: 8px;
    height: 44px;
    background-image: url(../../images/menu-item-right-gray.gif);
    background-repeat: no-repeat;
    background-position: top;
    outline: none;
}

.menu-item-container-gray:hover .menu-item-right-gray{
    background-position: bottom;
}

.menu-item-right-active-gray{
    position: relative;
    float: left;
    display: inline;
    width: 8px;
    height: 44px;
    background-image: url(../../images/menu-item-right-gray.gif);
    background-repeat: no-repeat;
    background-position: bottom;
    outline: none;
}

.menu-item-language,.menu-item-language select, .menu-item-language option{
    height: 20px;
    margin-top: 10px;
    width: 50px;
    border: 0px;
    outline: none;
    background: none;
    background-color: #6a6a6a;
    color: #fff;
}

.menu-item-website,.menu-item-website select, .menu-item-website option{
    height: 20px;
    margin-top: 10px;
    width: 175px;
    border: 0px;
    outline: none;
    background: none;
    background-color: #6a6a6a;
    color: #fff;
}

#block-left-container{
    position: relative;
    float: left;
    display: inline;
    width: 143px;
    margin-left: 11px;
    margin-top: 11px;
}

#block-left-top{
    position: relative;
    float: left;
    display: inline;
    width: 163px;
    height: 5px;
    line-height: 0px;
    font-size: 0px;
    background-image: url(../../images/block-left-top.gif);    
    background-repeat: no-repeat;
}

#block-left-center{
    position: relative;
    float: left;
    display: inline;
    width: 163px;
    min-height: 50px;
    padding-top: 5px;
    padding-bottom: 10px;
    background-image: url(../../images/block-left-center.gif);    
    background-repeat: repeat-y; 
}

#block-left-content{
    position: relative;
    float: left;
    display: inline;
    margin-left: 14px;
    width: 134px;
}

#block-left-titel{
    position: relative;
    float: left;
    display: inline;
    width: 134px;
    height: 25px;
    margin-bottom: 8px;
    color: #000;
    font-weight: bold;
    border-bottom: 1px solid #c9c9c9;
}

#block-left-bottom{
    position: relative;
    float: left;
    display: inline;
    width: 163px;
    height: 5px;
    line-height: 0px;
    font-size: 0px;
    background-image: url(../../images/block-left-bottom.gif);    
    background-repeat: no-repeat;
}

#block-pand{
    position: relative;
    float: left;
    display: inline;
    width: 163px;
    height: 100px;
    margin-left: 11px;
    margin-top: 11px;
    background-image: url(../../images/pand.gif);
    background-repeat: no-repeat;
}
            

.btn-container{
    position: relative;
    float: left;
    display: inline;
    height: 26px;
}

.btn-left{
    position: relative;
    float: left;
    display: inline;
    width: 4px;
    height: 26px;
    background-image: url(../../images/btn-left.gif);
    background-repeat: no-repeat;
    background-position: top;
    outline: none;
}

.btn-container:hover .btn-left{
    background-position: bottom;
}

.btn-center{
    position: relative;
    float: left;
    display: inline;
    padding-left: 15px;
    padding-right: 15px;
    height: 26px;
    line-height: 25px;
    color: #fff!important;
    text-decoration: none!important;
    background-image: url(../../images/btn-center.gif);
    background-repeat: repeat-x;
    background-position: top;
    outline: none;
}

.btn-container:hover .btn-center{
    color: #fff!important;
    text-decoration: none!important;
    background-position: bottom;
}

.btn-right{
    position: relative;
    float: left;
    display: inline;
    width: 4px;
    height: 26px;
    background-image: url(../../images/btn-right.gif);
    background-repeat: no-repeat;
    background-position: top;
    outline: none;
}

.btn-container:hover .btn-right{
    background-position: bottom;
}

.btn-gray-container{
    position: relative;
    float: left;
    display: inline;
    height: 20px;
    margin-left: 8px;
}
.btn-gray-container-first{
    margin-left: 0px;
}

.btn-gray-left{
    position: relative;
    float: left;
    display: inline;
    width: 4px;
    height: 20px;
    background-image: url(../../images/btn-gray-left.gif);
    background-repeat: no-repeat;
    background-position: top;
    outline: none;
}

.btn-green-left{
    position: relative;
    float: left;
    display: inline;
    width: 4px;
    height: 20px;
    background-image: url(../../images/btn-green-left.gif);
    background-repeat: no-repeat;
    background-position: top;
    outline: none;
}

.btn-gray-container:hover .btn-gray-left, 
.btn-gray-container-active .btn-gray-left, 
.btn-gray-container:hover .btn-green-left, 
.btn-gray-container-active .btn-green-left
{
    background-position: bottom !important;
}

.btn-gray-center-black{
    position: relative;
    float: left;
    display: inline;
    padding-left: 5px;
    padding-right: 5px;
    height: 20px;
    line-height: 20px;
    color: #000;
    text-decoration: none!important;
    background-image: url(../../images/btn-gray-center.gif);
    background-repeat: repeat-x;
    background-position: top;
    outline: none;
}

.btn-green-center-black{
    position: relative;
    float: left;
    display: inline;
    padding-left: 5px;
    padding-right: 5px;
    height: 20px;
    line-height: 20px;
    color: #FFF!important;
    text-decoration: none!important;
    background-image: url(../../images/btn-green-center.gif);
    background-repeat: repeat-x;
    background-position: top;
    outline: none;
}

.btn-gray-center{
    position: relative;
    float: left;
    display: inline;
    padding-left: 5px;
    padding-right: 5px;
    height: 20px;
    line-height: 20px;
    color: #929292!important;
    text-decoration: none!important;
    background-image: url(../../images/btn-gray-center.gif);
    background-repeat: repeat-x;
    background-position: top;
    outline: none;
}

.btn-green-center{
    position: relative;
    float: left;
    display: inline;
    padding-left: 5px;
    padding-right: 5px;
    height: 20px;
    line-height: 20px;
    color: #FFF!important;
    text-decoration: none!important;
    background-image: url(../../images/btn-green-center.gif);
    background-repeat: repeat-x;
    background-position: top;
    outline: none;
}

.btn-gray-container:hover .btn-gray-center, 
.btn-gray-container:hover .btn-green-center,
.btn-gray-container-active .btn-gray-center,
.btn-gray-container-active .btn-green-center
{
    color: #fff!important;
    text-decoration: none!important;
    background-position: bottom;
}

.btn-gray-container-active .btn-gray-center-black, 
.btn-gray-container:hover .btn-gray-center-black, 
.btn-gray-container-active .btn-green-center-black, 
.btn-gray-container:hover .btn-green-center-black
{
    color: #fff !important;
    text-decoration: none!important;
    background-position: bottom;
}

.btn-green-right{
    position: relative;
    float: left;
    display: inline;
    width: 4px;
    height: 20px;
    background-image: url(../../images/btn-green-right.gif);
    background-repeat: no-repeat;
    background-position: top;
    outline: none;
}

.btn-gray-right{
    position: relative;
    float: left;
    display: inline;
    width: 4px;
    height: 20px;
    background-image: url(../../images/btn-gray-right.gif);
    background-repeat: no-repeat;
    background-position: top;
    outline: none;
}

.btn-gray-container:hover .btn-gray-right,
.btn-gray-container-active .btn-gray-right,
.btn-gray-container:hover .btn-green-right,
.btn-gray-container-active .btn-green-right
{
    background-position: bottom;
}

.module-inhoud{
    position: relative;
    float: left;
    display: inline;
    margin-left: 15px;
    margin-top: 15px;
    width: 90%;
}
                  
.project-foto-rij td, .project-foto-rij tr{
    height: 32px;
    background-image: url(../../images/stripe.gif);
    background-repeat: repeat-x;
    background-position: bottom;
    cursor: move;
}

.project-foto-rij:hover td{
    background-color: #eaf2f9;
    cursor: move;
}

.menu-space{
    background-image: none!important;
    background-color: transparent!important;
}

.submenu-space{
    background-image: none!important;
    background-color: transparent!important;
}

.menu-arrow{
    border: 0px;
    margin-right: 5px;
    vertical-align: middle;
}

.submenu-arrow{
    border: 0px;
    margin-right: 8px;
    margin-left: 5px;
    margin-top: 4px;
    vertical-align: top;
    float:left;
}

.submenu-arrow-empty{
    border: 0px;
    margin-right: 8px;
    margin-left: 5px;
    margin-top: 4px;
    width:6px;
    height:6px;
    vertical-align: top;
    background:transparent;
    float:left;
}

.block-link{
    color: #616161;
    outline: none;
    text-decoration: none;
}

.block-link:hover{
    color: #2e83c4;
    outline: none;
    text-decoration: underline;
}

.block-link-active{
    color: #2e83c4!important;
    outline: none!important;
    text-decoration: underline!important;
}

.submenu-inklappen{
    border: 0px;
    margin-left: 8px;
    margin-top: 5px;
    vertical-align: top;
}

#opties-pagina{
    position: relative;
    float: left;
    display: inline;
    clear: both;
    width: 100%;
    height: 42px;
    margin-top: 13px;
    border-top:1px solid #e5e5e5!important;
    border-bottom: 1px solid #c9c9c9!important;
}

#opties-pagina-buttons{
    position: relative;
    float: left;
    display: inline;
    margin-left: 15px;
    margin-top: 10px;
}

#opties-pagina-melding{
    position: relative;
    float: left;
    display: inline;
    margin-left: 59px;
    color: #bababa;
}

#bg-inputvelden-overzicht{
    position: fixed;
    top:147px;
    left: 180px;
    width: 202px;
    bottom: 0px;
    padding-top: 11px;
    color: #4c4c4c;
    border-right: 1px solid #cccccc;
    background-color: #fff;
}

#inputvelden-overzicht-bg{
    position: absolute;
    top:90px;
    left: 15px;
    top: 147px;
    bottom: 0px;
    width: 202px;
    color: #4c4c4c;
    border-right: 1px solid #cccccc;
    background-color: #fff;
}

#inputvelden-overzicht{
    position: relative;
    float: left;
    display: inline;
    clear:both;
    /*top:90px;*/
    margin-left: 15px;
    width: 202px;
    padding-top: 11px;
    padding-bottom: 20px;
    color: #4c4c4c;
    border-right: 1px solid #cccccc;
    background-color: #fff;  
}

#inputvelden-tinymce{
    position: absolute;
    top:90px;
    left: 218px;
    right: 0px;
    bottom: 0px;
    padding: 10px;
}

#geavanceerde-opties{
    position: relative;
    float: left;
    display: inline;
    width: 195px;
    overflow: hidden;
    display:none;
}

.voorbeeld-foto-container{
    position: relative;
    float: left;
    display: inline;
    height: 64px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.voorbeeld-foto{
    position: relative;
    float: left;
    display: inline;
    height: 64px;
    width: 94px;
}

.img-zoom{

}

.voorbeeld-foto img{
    position: absolute;
    height: 62px;
    cursor: pointer;
    outline: none;
    filter:alpha(opacity=100);
    opacity: 1;
    -moz-opacity:1;
    border: 1px solid transparent;
}

.voorbeeld-foto-container:hover .voorbeeld-foto-groot{
    display: block;
}

.voorbeeld-foto-container:hover .voorbeeld-foto img{
    filter:alpha(opacity=40);
    opacity: 0.4;
    -moz-opacity:0.4;
    border: 1px solid #333;
}

.voorbeeld-foto-groot{
    position: absolute;
    display: none;
    width: 200px;
    right: -170px;
    top: 30px;
    width: 200px;
    background-color: orange;
    z-index: 10;
}

.voorbeeld-foto-groot img{
    position: absolute;
    width: 200px;
    padding-right: 8px;
    padding-bottom: 8px;
    background-image: url(../../images/shadow.png);
    background-repeat: repeat;
    background-position: bottom right;
    cursor: pointer;
    outline: none;
}

/* Contact */
#contactmodule input[type="text"]{
    position: relative;
    float: left;
    display: inline;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 12px;
    background-image: url(../../images/shadow-input.gif);
    background-repeat: no-repeat;
    background-position: left top;
    border: 1px solid #dedede;
    color:#000;
    height: 25px;  
    padding: 0px 0px 0px 5px;
    margin: 3px 0px 5px 5px!important;

}

.contactgegevens-item{
    position: relative;
    float: left;
    display: inline;
    width: 100%;
    height: 25px;
    margin: 3px 0px 5px 0px;
}

.contactmodule-itemtoevoegen {
    position: relative;
    float: left;
    display: inline;
    font-weight: normal;
    margin: 0px 0px 10px 15px;  
    clear: left;
}

.contactmodule-itemtoevoegen2 {
    position: relative;
    float: left;
    display: inline;
    font-weight: normal;
    margin: 0px 0px 0px 15px;  
    clear: left;
}

.contactgegevens-item-overzicht{
    position: relative;
    float: left;
    display: inline;
    width: 100%; 
    margin: 10px 0px 10px 10px; 
}

#contactmodule-groeptoevoegen{
    position: relative;
    float: left;
    display: inline;
    font-size: 12px;
    width: 650px;
    border: 1px solid #DEDEDE;
    margin: 0px 0px 25px -15px;
    clear: left;  
}

.contactmodule-groeptoevoegen-uitklappen{
    position: relative;
    float: left;
    display: inline;
    font-size: 12px;
    width: 635px;   
    margin: 0px 0px 0px 0px;  
    line-height: 32px;
    background-color: #f5f5f5;
    border-bottom: 1px solid #c9c9c9!important;
    padding: 0px 0px 0px 15px;
    margin: 0px 0px 20px 0px;
}

#contactmodule-groeptoevoegen-container{
    position: relative;
    float: left;
    display: inline;
    width: 100%;
    height: 100px;
    overflow: hidden;
}

.contactmodule-bloktitel{
    position: relative;
    float: left;
    display: inline;
    font-size: 12px;
    font-weight: bold;
    width: 635px;
    height: 32px;
    line-height: 32px;
    background-color: #f5f5f5;
    border-bottom: 1px solid #c9c9c9!important;
    padding: 0px 0px 0px 15px;
    font-weight: bold;
    color: #000;
}

.contactmodule-blok{
    position: relative;
    float: left;
    display: inline;
    font-size: 13px;
    font-weight: bold;
    width: 650px;
    border: 1px solid #DEDEDE;
    margin: 0px 0px 25px -15px;
    clear: left;
}

/* Help */
.helpmodule-bloktitel{
    position: relative;
    float: left;
    display: inline;
    font-size: 12px;
    font-weight: bold;
    width: 635px;
    height: 32px;
    line-height: 32px;
    background-color: #f5f5f5;
    border-bottom: 1px solid #c9c9c9!important;
    padding: 0px 0px 0px 15px;
    font-weight: bold;
    color: #000;
}

.helpmodule-blok{
    position: relative;
    float: left;
    display: inline;
    font-size: 13px;
    font-weight: bold;
    width: 650px;
    border: 1px solid #DEDEDE;
    margin: 0px 0px 25px -15px;
    clear: left;
}

.helpmodule-item-overzicht{
    position: relative;
    float: left;
    display: inline;
    width: 100%; 
    margin: 0px 0px 0px 0px; 
    height: 250px;
}

.helpmodule-item{
    position: relative;
    float: left;
    display: inline;
    width: 270px; 
    margin: 0px 40px 0px 0px; 
    padding: 0px 0px 0px 10px; 
    height: 22px;
    line-height: 22px;
    font-weight: normal; 
    background-image: url(../../images/arrow.gif);
    background-position: left center; 
    background-repeat: no-repeat;
}

#schuifcontainer{
    position: relative;
    float: left;
    display:inline;
    width: 650px;
}

#schuifblokcontainer{
    position: absolute;
    top: 0px;
    right: 0px;
    width: 465px;
    height: 250px;
    overflow:hidden;
}

.schuifblok{
    position: absolute;
    top: 0px;
    left: -465px;
    width: 465px;
    height: 250px;
    text-align: center;
}

.schuifblok img{
    width: 465px;
    height: 250px;   
}

#schuifknoppencontainer{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
}

#schuifknoppen{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 179px;
    height: 250px;
    line-height: 40px;
    padding: 0px 0px 0px 0px;
    font-weight: normal;
    border-right: 5px solid #307AB3;
}

.schuifnaarpositie{
    position: relative;
    float: left;
    display: inline;
    font-size: 12px;
    height: 48px;
    line-height: 48px;
    width: 159px;

    border-top: 1px solid #FFF;
    border-bottom: 1px solid #C9C9C9;
    padding: 0px 0px 0px 20px;
}

.schuifnaarpositie:hover{
    background-color: #F4F4F4;    
}

#schuifknoppencontainer a{
    color: #000;    
    text-decoration:none;
}

#schuifblokcommentaarcontainer{
    position: absolute;
    top: 190px;
    right: 0px;
    width: 300px;
    height: 40px;
    background-color: #333;
    overflow: hidden;
    border-left: 1px solid #FFF;
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #FFF;    
}

.schuifblokcommentaar{
    position: absolute;
    left: 20px;
    top: -40px;
    width: 270px;
    height: 40px;
    color: white;
}

#schuifblokpauze{
    position: absolute;
    top: 10px;
    right:10px;
    width: 25px;
    height: 25px;
    background-image: url(../../images/pauze.gif);
    background-repeat:no-repeat;
    display: none;
}

/* Admin */
#adminmodule input[type="text"], #adminmodule select{
    margin: 0px 0px 5px 5px!important;
}

.adminmodule-span{
    display: block;
    width: 500px !important; 
    margin: 0px 0px 5px 0px; 
    padding: 0px 0px 0px 10px; 
    height: auto;
    line-height: 25px;
    font-weight: normal; 
}

.adminmodule-bloktitel{
    position: relative;
    float: left;
    display: inline;
    font-size: 12px;
    font-weight: bold;
    width: 635px;
    height: 32px;
    line-height: 32px;
    background-color: #f5f5f5;
    border-bottom: 1px solid #c9c9c9!important;
    padding: 0px 0px 0px 15px;
    font-weight: bold;
    color: #000;
}

.adminmodule-blok{
    position: relative;
    float: left;
    display: inline;
    font-size: 13px;
    font-weight: bold;
    width: 650px;
    border: 1px solid #DEDEDE;
    margin: 0px 0px 25px -15px;
    clear: left;
}

.adminmodule-item-overzicht{
    position: relative;
    float: left;
    display: inline;
    width: 630px; 
    margin: 20px 0px 20px 20px; 
    min-height: 50px;
    font-weight: normal;
}

.adminmodule-item{
    position: relative;
    float: left;
    display: inline;
    width: 600px; 
    margin: 0px 0px 5px 0px; 
    padding: 0px 0px 0px 10px; 
    height: 25px;
    line-height: 25px;
    font-weight: normal; 
    clear: left;
}

.adminmodule-item span {
    position: relative;
    float: left;
    display: inline;
    width: 240px; 
    margin: 0px 0px 5px 0px;     
}

.adminmodule-item span.instellingen{
    width:300px !important;
}

.adminmodule-item input.instellingen,.adminmodule-item select.instellingen
{
    width:280px !important;
}

.backend-menuitem{
    background: url(../../images/adres-stripes.gif) no-repeat bottom;    
    padding-bottom:6px;
    margin-bottom:5px;
}


.inline-field{
    margin-bottom: 5px !important;
}

/* [entity]-toevoegen - foutmeldingen */
#melding-toevoegen
{
    display: none; 
    color: green; 
    font-weight: bold;
}

#melding-bewerken
{
    display: none; 
    color: green; 
    font-weight: bold;
}

#melding-wijzigingen
{
    display: none;
}

#melding-fouten
{
    display: none;
    color: #912323; 
    font-weight: bold;
}

.menu-item-center-small{
    padding:0px!important; 
    background-position: top!important;
}
.menu-item-other-small{
    background-position: top!important;
}

#paginamodule
{
    margin-top:46px;
    padding-bottom:20px;
}

.table-spaced
{
    margin-left:15px; 
    border-right: 1px solid #dcdcdc!important; 
    border-left: 1px solid #dcdcdc!important;
}         

img.menu-vink
{
    cursor:pointer;
    border: 0px;
    text-align: center;
    outline: none!important;
}

.stripes
{
    margin-top: 15px; 
    margin-bottom: 17px;
}

/* alles m.b.t. volgorde */
.menu-volgorde-container
{
    position: relative;
    float: left;
    display: inline;
    margin-top: 5px;
    width:100%;
}

table tbody.sortable-body tr td{
    cursor: move;
}

#fm-close-button{
    position:absolute;
    top: 2px;
    right: 18px;
    width: 62px;
    height: 26px;
    line-height: 24px;
    cursor: pointer;
    outline: none;
    background-image: url(../../images/bg-close-btn.gif);
    background-position: top;
    background-repeat: no-repeat;
    text-align: center;
    color: #fff;
}

#fm-close-button:hover{
    background-position: bottom;
    color: #fff;
}

input[type="hidden"]{
    display:none; 
}
.span-image{
    padding-top:0px;
    display:block;
    float:right;
    padding-right:20px;
}

/* nieuwe tabellen */
table.autoWidth{
    /*width:800px; */
    width:98%;
    border:1px solid #CCCCCC;
    border-left:0px;
    table-layout: fixed; 
    border-spacing:0px;   
    *border-collapse: collapse; /* hack is needed for IE7 also */ 
    color: #616161;    
}

table.tableContainer > tbody > tr:hover > td{
    background-color:transparent !important;
}

table.table-spaced{
    width:400px;
    margin-top:10px;
}

table.autoWidth td {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding:0px;
    height: 32px;
}

table.autoWidth > tbody > tr > td{
    background-image: url(../../images/stripe.gif);
    background-repeat: repeat-x;
    background-position: bottom; 
} 

table.autoWidth > tbody > tr > td:first-child, table.autoWidth > thead > tr > td:first-child {
    padding-left:20px;
}

table.autoWidth > thead > tr > td{
   font-weight: bold;
    color: #000;
    background-color: #f5f5f5;
    height: 32px;
    border-bottom: 1px solid #c9c9c9!important;  
}

table col.fixed0{
    width:0;
}
table col.fixed50{
    width:50px;
}
table col.fixed60{
    width:60px;
}
table col.fixed75{
    width:75px;
}
table col.fixed80{
    width:80px;
}
table col.fixed100{
    width:100px;
}
table col.fixed110{
    width:110px;
}
table col.fixed120{
    width:120px;
}
table col.fixed125{
    width:125px;
}
table col.fixed150{
    width:150px;
}
table col.fixed200{
    width:200px;
}
table col.fixed250{
    width:250px;
}
table col.fixed300{
    width:300px;
}
table col.fixed350{
    width:350px;
}
table col.fixed400{
    width:400px;
}

table.autoWidth col.nonfixed1{
    width:100%;
}
table.autoWidth col.nonfixed2{
    width:50%;
}
table.autoWidth col.nonfixed3{
    width:33%;
}
table.autoWidth col.nonfixed4{
    width:25%;
}
table.autoWidth col.nonfixed5{
    width:20%;
}
table.autoWidth col.nonfixed6{
    width:16.7%;
}
table.autoWidth col.nonfixed7{
    width:14.2%;
}
table.autoWidth col.nonfixed8{
    width:12.5%;
}
table.autoWidth td.centered{
    text-align:center;
}

table.autoWidth > tfoot > tr > td{
    height: 32px;
    background-color: #f5f5f5;
    text-align: center;
    color: #b7b7b7!important; 
}

 table.autoWidth > tbody > tr.submenu-rij > td{
    background-color: #f7f7f7;
}

table.autoWidth > tbody > tr:hover > td{
    background-color: #eaf2f9;
}

table thead tr td a{
    text-decoration:underline!important;    
}

table thead tr td a.active-asc, table thead tr td a.active-desc{
    color: #2e83c4;
    padding-right: 15px;
}

table thead tr td a.active-asc{
    
    background: url('../../images/sort-arrows.png') no-repeat 100% -9px    
}

table thead tr td a.active-desc{
    background: url('../../images/sort-arrows.png') no-repeat 100% 7px;
}

.charLimit{
    color: #912323 !important;
}

div.pagina-container{
    border-left:0px;
    width:799px;
    height:25px;
    text-align:center;
    display:block;
    margin-top:5px;
    padding-top:5px;
}
div.pagina-container-sub{
  display:inline-block;
}
div.pagina-container a.pagina{
    float:left;
    border:1px solid #B7B7B7;
    width:30px;
    height:18px;
    text-align:center;
    display:block;
    margin-left:5px;
    color: #616161;
    background:#FFF;
}
div.pagina-container a.active,div.pagina-container > a:hover{
    border:1px solid #2E83C4;
    font-weight: bold;
}
div.pagina-container a.disabled,div.pagina-container > a.disabled:hover{
    color:#CCC !important;
    font-weight:normal !important;
    border:1px solid #B7B7B7;
    text-decoration:none !important;
}

input[type="text"].predefined{
    color:#CCC;
    font-style: italic; 
}

.tinymce-title-block {
    position: relative;
    float: left;
    padding: 6px 10px 3px 10px;
    margin-bottom: 3px;
    border-top: 1px solid #e1e1e1;
    border-left: 1px solid #e1e1e1;
    border-right: 1px solid #e1e1e1;
    color: #6b6b6b;
    font-style: italic;
    font-size: 12px;
    margin-top: 10px;
}

.clear{
    clear: both;
}

.referentie-field {
    margin: 20px 0;
}

.referentie-field table {
    border: 1px solid #CCC;
}

.infoMark{
    position: relative;
    display: inline-block;
    padding: 3px 4px 2px 4px;
    background-color: #FFF;
    border: 1px solid #DDD;
    cursor: pointer;
}

.infoMark div{
    display: none;   
    position: absolute;
    top: -1px;
    left: 18px;
    padding: 8px;
    width: 175px;
    height: auto;
    border: 1px solid #DDD;
    background: #FFF;
}

.infoMark:hover div{
    display: block;
}

.groepSelect{
    float: left;
    position: relative;
    width: 95%;
    margin: 10px 0 0 15px;
}