/* bootstrap overwrites */

/* Row with equal height columns */
/* Sloopt responsiveness */
/* http://getbootstrap.com.vn/examples/equal-height-columns/
.row-eq-height {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;
}
*/
.flex {
    display:flex;
}
@media (max-width: 768px) {
    .flex {
        display:block;
    }

}
@font-face {
    font-family: 'Conv_Raleway-Regular';
    src: url('/assets/fonts/Raleway-Regular.eot');
    src: url('/assets/fonts/Raleway-Regular.eot?#iefix') format('embedded-opentype'),url('/assets/fonts/Raleway-Regular.svg') format('svg'),url('/assets/fonts/Raleway-Regular.woff') format('woff'),url('/assets/fonts/Raleway-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style:normal;
}

@font-face {
    font-family: 'Conv_Raleway-Bold';
    src: url('/assets/fonts/Raleway-Bold.eot');
    src: url('/assets/fonts/Raleway-Bold.eot?#iefix') format('embedded-opentype'),url('/assets/fonts/Raleway-Bold.svg') format('svg'),url('/assets/fonts/Raleway-Bold.woff') format('woff'),url('/assets/fonts/Raleway-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Conv_Raleway-Light';
    src: url('/assets/fonts/Raleway-Light.eot');
    src: url('/assets/fonts/Raleway-Light.eot?#iefix') format('embedded-opentype'),url('/assets/fonts/Raleway-Light.svg') format('svg'),url('/assets/fonts/Raleway-Light.woff') format('woff'),url('/assets/fonts/Raleway-Light.ttf') format('truetype');
    font-weight: normal;
    font-style:normal;
}

html, body {

    font-family: 'Conv_Raleway-Regular';
    font-size:15.5px;
    color: #1B1726;
    /*
    text-shadow: #fff 0px 1px 1px;
    text-rendering: optimizeLegibility !important;
    -webkit-text-stroke: 1px rgba(0,0,0,0.1);
    -webkit-font-smoothing: antialiased !important;
    */
}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6 {
    font-family: 'Conv_Raleway-Bold';
    color:black;
}
/* deze staan op de originele fonts
.tooltip, .popover
*/

/* active overwrite */
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
    /*background:transparent;*/
}

.table>thead>tr>th {
    color: #DC2763;
    border-bottom:0;
}
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th{
    border:0;
    border-bottom: 1px dotted #C9CACB;
}
.navbar {
    margin-bottom:20px;
}
.btn-default {
    background: #DC2763;
    color:white;
    font-weight:bold;
    border:none;
    margin-top:30px;

}
.btn-default:hover {
    background:rgb(235, 120, 6);
    color:white;
}

.btn-primary {
    border:0;
    outline:none;
    background:none;
    background-image: -webkit-linear-gradient(left, rgb(212, 20, 98), rgb(235, 120, 6));
    background-image: -moz-linear-gradient(right, rgb(212, 20, 98), rgb(235, 120, 6));
    background-image: linear-gradient(to right, rgb(212, 20, 98), rgb(235, 120, 6));
    color:white;
    font-weight:bold;
}
.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
    border:0;
    outline:none;
    background:none;
    -webkit-transition: background-image 0.2s ease-in-out;
    transition: background-image 0.2s ease-in-out;
    background-image: -webkit-linear-gradient(right, rgb(212, 20, 98), rgb(235, 120, 6));
    background-image: -moz-linear-gradient(left, rgb(212, 20, 98), rgb(235, 120, 6));
    background-image: linear-gradient(to left, rgb(212, 20, 98), rgb(235, 120, 6));
}

a.thumbnail, a.thumbnail:hover {
    text-align: center;
    text-decoration:none;
    border: none;
}
/* end bootstrap overwrites */

#navbar {
    padding:15px;
}

/* een handje bij rijen die doorklikbaar zijn */
tr[href] td {
    cursor: pointer;
}

body {
    padding:20px 0;
    background: #EBEBEC url('/assets/images/bg.png') center top;
    background-size: cover;
    background-repeat: repeat-y;
    background-attachment: fixed;
}

.gradient-top {
    background-image: -webkit-linear-gradient(left, rgb(212, 20, 98), rgb(235, 120, 6));
    background-image: -moz-linear-gradient(right, rgb(212, 20, 98), rgb(235, 120, 6));
    background-image: linear-gradient(to right, rgb(212, 20, 98), rgb(235, 120, 6));
    padding-top:6px;
    

    /*-webkit-border-image: -webkit-linear-gradient(left, rgb(235, 120, 6), rgb(212, 20, 98));*/
    /*-o-border-image: -o-linear-gradient(right, rgb(235, 120, 6), rgb(212, 20, 98));*/
    /*-moz-border-image: -moz-linear-gradient(right, rgb(235, 120, 6), rgb(212, 20, 98));*/
    /*border-image: linear-gradient(to right, rgb(235, 120, 6), rgb(212, 20, 98));*/
}
.gradient-top > .container-fluid{
    background: white;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

.card {
    width:100%;
    background: white;
    border-radius: 4px;
    -webkit-box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.05);
    -moz-box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.05);
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.05);
    margin-bottom:20px;
}
    .card.gradient-top {
        background-image: -webkit-linear-gradient(left, rgb(212, 20, 98), rgb(235, 120, 6));
        background-image: -moz-linear-gradient(right, rgb(212, 20, 98), rgb(235, 120, 6));
        background-image: linear-gradient(to right, rgb(212, 20, 98), rgb(235, 120, 6));
        padding-top:6px;
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
    }
    .card.gradient-top .header {
        margin-bottom:0;
        padding-bottom:0;
    }

        .card.gradient-top>.header h4 {
            margin-top:5px;
            color:white;
            text-align:center;
        }
    .gradient-top > .gradient-resetter {
        border-bottom-left-radius: 3px;
        border-bottom-right-radius: 3px;
        margin-top: 6px;
    }

    .card.gradient-bottom {
        background-image: -webkit-linear-gradient(left, rgb(212, 20, 98), rgb(235, 120, 6));
        background-image: -moz-linear-gradient(right, rgb(212, 20, 98), rgb(235, 120, 6));
        background-image: linear-gradient(to right, rgb(212, 20, 98), rgb(235, 120, 6));
        padding-bottom:6px;
        border-bottom-left-radius: 4px;
        border-bottom-right-radius: 4px;
    }
    .gradient-bottom > .gradient-resetter {
        border-top-left-radius: 3px;
        border-top-right-radius: 3px;
    }

    .gradient-resetter {
        width:100%;
        background:white;
    }

    .card .header,
    .card .content {
        padding:1px 15px 20px 15px;
        margin: 0 20px;
    }

    .gradient-resetter>.content {
        padding-top:20px;
        padding-left:15px;
        padding-right:15px;
    }

[class^="icomoon-"], [class*=" icomoon-"] {
    font-size: 7em;
}

.aandachtsstijlen {
    color: #EE2A7B;
}
.motoriek {
    color: #36C4ED;
}
.temperamenten {
    color: #F79222;
}
.interactie {
    color: #25BAAA;
}
.talen {
    color:#F8E427;
}
.conflictstijlen {
    color:#E82925;
}
.veranderstijl {
    color:#3C58A6;
}
.werkvormen {
    color:#7E5AA5;
}
.motoroog {
    color:#208457;
}


.dobbelsteen {
    position: relative;
    display:block;
    margin:0 auto;
    font-family: Conv_Raleway-Bold;
    background: url('/assets/images/dobbelsteen.svg') no-repeat center center;
    background-size: 180px 180px;
    width:200px;
    height:200px;
    color:white;
    font-size:2.8em;
    font-weight:bold;
    text-align:center;
    vertical-align:middle;
}
.dobbelsteen .links {
    position:absolute;
    width:81px;
    text-align:center;
    left:26px;
    top:85px;
    -ms-transform: skew(0deg, 30deg); /* IE 9 */
    -webkit-transform: skew(0deg, 30deg); /* Chrome, Safari, Opera */
    transform: skew(0deg, 30deg);
}
.dobbelsteen .rechts {
    position:absolute;
    width:81px;
    text-align:center;
    right:29px;
    top:85px;
    -ms-transform: skew(0deg, -30deg); /* IE 9 */
    -webkit-transform: skew(0deg, -30deg); /* Chrome, Safari, Opera */
    transform: skew(0deg, -30deg);
}


.this-is-me {
    position: absolute;
    left:-1px;
    top:-50px;
    width:100px;
    height:100px;
    background: url('/assets/images/this-is-me.svg') no-repeat;
}
/* zorgt ervoor dat het this-is-me badge ook bij de eerste row goed uitlijnt */
.gradient-resetter .content .row:first-child {
    margin-top:30px;
}
/* voor het highlighten van coaches in performer overzichten */
.coach {
    color:#EB7806;
    font-weight:bold;
}



.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    padding-left: 22px;
    padding-right:22px;
}

.row {
    margin-right: -22px;
    margin-left: -22px;
}

.container-fluid {
    padding-right: 22px;
    padding-left: 22px;
}

.navbar-brand {
    padding-left: 22px;
}

.header.breadcrumps {
    padding:8px 15px;
    padding-bottom:8px !important;
}

.header h4 {
    text-align:center;
    margin: 25px 0;
}
h4.title {
    margin-bottom:12px;
}
.gradient-top .gradient-resetter .header {
    margin-top:-6px;
}
ul.spaced li {
    margin-bottom:20px;
}
.selectize-input > input[placeholder],
.selectize-input.items.not-full,
.selectize-input.items.full {
    width: 200px !important;
}

.selectize-control.single .selectize-input:after,
.selectize-control.single .selectize-input.dropdown-active:after {
    font-family: "Glyphicons Halflings";
    content: '\e003' !important; /*This will draw the icon*/
    border-style:none;
    margin-top:-9px;
    right:20px;
}