.foo{}
/* REFERENCE FINB COLORS
dark blue header/footer: #00192C
dark blue: #00597F
orange: #EE7523
light gray: #F8F8F8
gray: #E7E7E7
red: #ED1C24
light blue: #0074BD
axa blue: #004A93
*/

html, body, form {
    height: 100%;
}
body {
    padding:0;
    /*font-family: Calibri,"Gill Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size:14px;*/
}
h1, h2, h3 {
    margin: 0 0 10px 0;
}
h1{
    color: #00597F;
    font-size: 36px;
    margin: 30px 0px 30px 0px;
}

a:hover{
    text-decoration:none;
}

header{
    background-image:url('images/headergrd.png');
    background-repeat:no-repeat;
    background-position:center top;
    background-color:#00192C;
}

.container{
    min-width:310px; /* min width + 2 x 15px margin = 340px */
}

#wrap {
    height: auto;
    margin: -112px auto -250px 0;
    min-height: 100%;
    padding: 112px 0 250px;
}

.logo{
    overflow: auto;
    margin-top: 15px;
    max-width: 280px;
}
    .logo figure img {
        display: block;
        float: left;
        max-width: 100%;
        min-width: 120px;
    }
    
.lang{
    overflow:auto;
    padding-bottom:10px;
}
    .lang span{
        background:url('images/langbck.png') repeat-x;
        padding:5px 15px;
        display:block;
        color:#fff;
        font-weight:bold;
        float:right;
    }
    .lang span ul{
        list-style: none;
        padding:0;
    }
        .lang span li{
            float:left;
        }
        .lang span li a{
            padding:0 4px;
            border-right:1px solid #fff;
            text-transform:uppercase;
        }
        .lang span li.last a{
            border-right:0px;
        }
    .lang span a{
        color:#fff;
    }

.breadcrumb{
    background-color: #EE7523;
    color:#fff;
    margin-bottom:0;
    border-radius:0;
}
    .breadcrumb a{
        color:#fff;
    }
    .breadcrumb a:hover{
        color:#00597F;
    }

.homejumbotron
{
    border:0px solid red;
    overflow:auto;
    margin:30px 0 15px 0;
    padding:0;
    position:relative;
}
    .homejumbotron figure img {
        background-color:#fff;
        display: block;
        float: left;
        max-width: 100%;
        min-width: 120px;
    }
        .slogan {
            font-family:Calibri,"Gill Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
            font-weight: lighter;
            color: #00597F;
            display: block;
            position: absolute;
            text-align: right;
            font-size: 260%;
            right: 30%;
            bottom: 55%;
        }

/* menu.css */
.sidebar-nav {
    padding: 9px 0;
}

.dropdown-menu .sub-menu {
    left: 100%;
    position: absolute;
    top: 0;
    visibility: hidden;
    margin-top: -1px;
}

.dropdown-menu li:hover .sub-menu {
    visibility: visible;
}

.dropdown:hover .dropdown-menu {
    display: block;
}

.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu {
    margin-top: 0;
}

.navbar .sub-menu:before {
    border-bottom: 7px solid transparent;
    border-left: none;
    border-right: 7px solid rgba(0, 0, 0, 0.2);
    border-top: 7px solid transparent;
    left: -7px;
    top: 10px;
}
.navbar .sub-menu:after {
    border-top: 6px solid transparent;
    border-left: none;
    border-right: 6px solid #fff;
    border-bottom: 6px solid transparent;
    top: 11px;
    left: -6px;
}

.navbar-collapse {
    padding-left: 10px;
    padding-right: 0;
}

/* Navbar */
.menuholder{
    float:right;
}
.navbar {
	background-image: linear-gradient(to bottom, #FFFFFF 0px, #F8F8F8 100%);
	background-repeat: repeat-x;
	border-radius: 4px 4px 4px 4px;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset, 0 1px 5px rgba(0, 0, 0, 0.075);
}
.navbar-brand .glyphicon{
	color: #00597F;
	font-size:14px;
}
.navbar-brand .glyphicon:hover{
	color: #EE7523;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
	background-color: #E7E7E7;
	color: #EE7523;
}

.navbar-default .navbar-nav > li > a {
	color: #00597F;
}
.navbar-default .navbar-nav > li > a:hover {
	color: #EE7523;
}

/* Tiles */
.tile{
    position:relative;
    display:block;
    color: white;
    border:2px solid white;
    background-repeat: no-repeat;
}
    a.tile:link, a.tile:visited 
    {
        color: #fff;
        text-decoration: none;
    }
    a.tile:hover{
        color:#fff;
        text-decoration:none;
    }
    a.tile:active 
    {
        border-color:white!important;
        color: #fff;   
    }

.square {
	padding: 10px;
	margin-bottom: 30px;
    background-position: 95% 15%;
	height: 150px;
	width: 150px;
}
     .square h3 {
        font-weight:bold;
        font-size: 14px;
    }    
.large {
	padding: 20px;
	margin-bottom: 30px;
    background-position: 95% 15%;
	min-height: 150px;
}
     .large h3 {
        font-size: 18px;
    }
.medium {
    padding: 6px;
	margin-bottom: 30px;
	min-height: 129px;
    background-position: top right;
}
    .medium h3 {
        font-size: 18px;
        margin-bottom: 0px;
    }
.small {
    padding: 15px;
	margin-bottom: 13px;
}
    .small h3 {
        font-size: 22px;
        margin-bottom: 0px;
    }
    
.investment{
    min-height:165px;
}
    .investment .imageblock{
        background-color: #FFFFFF;
        margin-bottom: -18px;
        margin-left: -18px;
        min-height: 120px;
        padding: 15px 15px 0;
        width: 220px;
        text-align:center;
    }

.blue {
    background-color: #00597F;
}
    .blue:hover {
    	border-color:#EE7523;
    }
.orange {
    background-color: #EE7523;    
}
    .orange:hover {
    	border-color:#00597F;
    }
.axablue {
    background-color: #004A93;    
}
    .axablue:hover {
    	border-color:#EE7523;
    } 
.red {
    background-color: #ED1C24;
}
    .red:hover {
    	border-color:#00597F;
    }
.lightblue {
	background-color: #0074BD;
}
    .lightblue:hover {
    	border-color:#EE7523;
    }
.readmore {
    position: absolute;
    right: 15px;
    top: 110px;
    display: inline-block;
    line-height: 32px;
}
    .blue:active .readmore .glyphicon {
        color: #EE7523;
    }
    .orange:active .readmore .glyphicon {
        color: #00597F;
    }
    .red:active .readmore .glyphicon {
        color: #00597F;
    }
    .lightblue:active .readmore .glyphicon {
        color: #EE7523;
    }

    /* Background on tiles */
    .bills {
        background-image: url("images/bills.png");
    }
    .umbrella {
        background-image: url("images/umbrella.png"); 
    }
    .piggybank {
        background-image: url("images/piggybank.png");
    }
    .graphics {
        background-image: url("images/graphics.png");
    }
    .building {
        background-image: url("images/building.png");
    }
    .hand {
        background-image: url("images/hand.png");
    }
    .immo {
        background-image: url("images/immo.png");
    }
    .vermogensbeheer {
        background-image: url("images/vermogensbeheer.png");
    }
    .axa {
        background-image: url("images/axa.png");
    }    

.homeinfopage {
    padding: 8px;
}
.homeinfopage ul  {
    padding: 0 0 0 25px;
    margin: 0px;
    list-style-type: none;
}
.homeinfopage li a  {
    margin: 0px;
    padding: 0px;
    font-size: 19px;
    color: white;
}
.homeinfopage li a:hover  {
    color: #00597F;
}
/* Content */
.sub-rightside{
    background-color:#E7E7E7;
    padding: 15px;
}
.infoblock{
    padding-bottom:30px;
}
    .infoblock figure img{
    	max-width:260px
    }
    
/* offices page */
.map figure img {
    display: block;
    float: left;
    max-width: 100%;
    min-width: 120px;
}
.googlemap{
    border: 1px solid #E7E7E7;
    clear: both;
    margin-bottom: 30px;
    margin-top: 30px;
    overflow: auto;
    padding: 15px 15px 10px;
}

/* partners / gip partners */
.frame {
    height: 120px;      /* equals max image height */
    width: 120px;
    border: 1px solid #E7E7E7;
    text-align: center; margin: 1em 0;
    float: left;
    margin: 10px;
    padding:1px;
}
    .partners .frame:hover {
        padding:0px;
        border: 2px solid #EE7523;
    }
    .partners .frame > img {
        width:100px;
    }
.helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.partner{
    
}
.subpartner h4{
    margin-left:15px;
}
.subpartner h4{
    font-size:12px;
}
/* vacancy */
.vacancy{
    margin-bottom:15px;
}
    .vacancy h4{
        border-bottom: 1px solid #E7E7E7;
    }
    .vacancy .date{
        font-size:11px;
    }

/* form css */
.buttonsend
{
	border-color: #00597F;
	border-style: solid;
	border-width: 1px;
	width: auto;
	background-color: #fff;
	font-size: 10pt;
	font-family: Trebuchet MS, Tahoma, Verdana, Arial, Helvetica, Sans-Serif;
	color: #575757;
	margin: 2px 2px 15px 471px;
	padding: 4px 8px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

.buttonsend:hover
{
	background-color: #fff;
	border-color: #EE7523;
}

#contactform
{
	padding: 15px;
	background-color:#F4F3F0;
	width:580px;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;	
	border:1px solid #EE7523;
}
.contactformtableholder
{
	width:400px;	
}
.contactformtable
{
	width:520px;
}
.contactformtable td
{
	vertical-align:top;
	line-height:20px;
	padding: 4px;	
}

.validationgroup
{
	color:red;
	margin-left:15px;
}

.validationmarker
{
	color:red;
}

.dynamicformfield
{
	width:408px;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	padding:2px 2px 2px 5px;
	border:1px solid #00597F;
}

div.registrationform
{
	border: 2px solid #7A8383;
	background-color: #CCCCCC;
	width: 470px;
	margin-top: 10px;
	padding-left: 8px;
	padding-bottom: 8px;
}

.readonlytextbox
{
	background: transparent;
	color: #575757;
	border: 0px;
	font-weight: bold;
	font-size: 14px;
	padding-bottom: 1px;
}

/* Footer */
footer{
    background-image:url('images/headergrd.png');
    /*background-image:url('images/footergrd2.png');*/
    background-repeat:no-repeat;
    background-position:center top;
    background-color:#00192C;
    border-bottom:16px solid #EE7523;
    min-height:250px;
    padding-top:25px;
    font-size:12px;
    color:#fff;
}
    footer a:link, footer a:visited 
    {
        color: #fff;
        text-decoration: none;
    }
    footer a:hover, footer a:active 
    {
        color: #EE7523;
    }
    footer ul 
    {
        list-style: none;
        padding:0;
    }
    footer .links li 
    {
        line-height:40px;
    }
    footer .info ul{
        list-style: disc outside none;
        padding:0 0 0 15px;
    }
    footer .finbgroup{
        overflow:auto;
        padding-left:40px;
        background:url("images/icongroup.png") no-repeat 3px 0;
    }
    footer .finb{
        overflow:auto;
        padding-left:40px;
        background:url("images/iconfinance.png") no-repeat 3px 0;
    }
    footer .finbimmo{
        overflow:auto;
        padding-left:40px;
        background:url("images/iconimmo.png") no-repeat 3px 0;
    }
    footer .gip{
        overflow:auto;
        padding-left:40px;
        background:url("images/icongip.png") no-repeat 3px 0;
    }

@-webkit-viewport   { width: device-width; }
@-moz-viewport      { width: device-width; }
@-ms-viewport       { width: device-width; }
@-o-viewport        { width: device-width; }
@viewport           { width: device-width; }

/* Large desktop */
@media (max-width: 1200px) { 
    footer{background-image:none;}
    .mainmenu{
        width:100%;
    }
    .nav > li > a {
        font-size:14px;
        padding: 14px 9px;
    }
}
 
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
    footer{background-image:none;}
    .mainmenu{
        width:100%;
    }
    .lang {
        /*margin-top: -25px;*/
        margin-top: -92px;
        padding-bottom: 75px;
    }
    .nav > li > a {
        font-size:14px;
        padding: 13px 6px;
    }
    .slogan {
        font-size: 180%;
    }
    .menuholder{
        float:none;
    }
}
 
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
    footer{background-image:none;}
    #brand{display:none;}
    .lang {
        /*margin-top: -25px;*/
        margin-top: -92px;
        padding-bottom: 75px;
    }
    .slogan {
        font-size: 140%;
    }
    .breadcrumb{
        display:none;
    }
    .menuholder{
        float:none;
    }
}
 
/* Landscape phones and down */
@media (max-width: 480px) { 
    footer{background-image:none;}
    #brand{display:none;}
    .lang {
        /*margin-top: -25px;*/
        margin-top: -92px;
        padding-bottom: 75px;
    }
    .slogan {
        font-size: 100%;
        bottom: 45%;
    }
    .breadcrumb{
        display:none;
    }
    .menuholder{
        float:none;
    }
}





