@import url('font-sans.css');

/* Fonts */

body {
    background-color: #fff;
    color: #0e1b42;
    font-family: 'Source Sans Pro', sans-serif;
}

li {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 400
}

h4, h5 {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 600
}

h3 {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 600
}

h1, h6 {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 600
}

.mokablue a:link, .mokablue a:active, .mokablue a:visited {
    color: #FFF;
}

.btn-default:hover {
    color: #FFFFFF;
    background: #223886;
    border-color: #223886;
    opacity: 0.9;
}


/* Flatten das boostrap */
.well, .navbar-inner, .popover, .btn, .tooltip, input, select, textarea, pre, .progress, .modal, .add-on, .alert, .table-bordered, .nav > .active > a, .dropdown-menu, .tooltip-inner, .badge, .label, .img-polaroid {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    /*-webkit-border-radius: 0px !important;*/
    /*-moz-border-radius: 0px !important;*/
    /*border-radius: 0px !important;*/
    /*border-collapse: collapse !important;*/
    background-image: none !important;
}



/* Colors */
/* mask: */

.gsm {
    background: #2574A9;
    border: 0;
}

.darkblue {
    background: #063760;
    color: #FFFFFF;
}

.mokablue {
    background: #223886;
    color: #FFFFFF;
    font-size: 14px;
}

.btn-check:checked + .btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check) + .btn:active {
    color: #FFFFFF;
    background: #223886;
    border-color: #223886;
    opacity: 0.9;
}

.green {
    background: #7ED321;
    color: #FFFFFF;
}

.blue {
    background: #223886;
    color: #FFFFFF;
}

.greentxt {
    color: #7ED321;
}

.mokabluetxt {
    color: #004D8D;
}

.white {
    color: #FFFFFF;
}

.bg-img {
    background: url('../img/bg.jpg');
    background-repeat: no-repeat;
    background-position: 10% 50%;
}

/* Jumbotron SM screen adjust */

@media only screen and (max-width: 490px) {
    .jumbotron {
        margin-bottom: 0px;
    }
}

/* Navbar custom */

@media (min-width: 768px) {
    .navbar-nav {
        float: none;
        margin: 0 auto;
        display: table;
        table-layout: fixed;
    }
}

.navbar-default {
    background-color: #fff;
    font-size: 1.1em;
    border: 0;
    margin-top: -10px;
    margin-bottom: 5px;
}

    .navbar-default .navbar-brand, .navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
        color: #004D8D;
    }

    .navbar-default .navbar-nav > li > a {
        color: #004D8D;
    }

        .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
            color: #004D8D;
            text-decoration: underline;
        }

    .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
        color: #FFF;
        background-color: #004D8D;
    }

    .navbar-default .navbar-text {
        color: #FFF;
    }

    .navbar-default .navbar-toggle {
        border-color: #004D8D;
        color: #004D8D;
        background-color: #004D8D;
    }

        .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
            background-color: #063760;
        }

        .navbar-default .navbar-toggle .icon-bar {
            background-color: #FFF;
        }

/* Helpers */

.container {
    background-color: #FFFFFF;
    width: auto;
    max-width: 1200px;
    padding: 40px;
}

.round {
    border-radius: 15px;
}

.bold {
    font-weight: bold;
}

.row {
    margin-bottom: 15px
}

.row-app {
    margin-top: 10px;
    margin-bottom: 10px
}

.row-mini {
    margin-top: 0px;
    margin-bottom: 0px
}

.btn-green {
    border-color: #7ED321;
    border-width: 2px;
    color: #004D8D;
    font-weight: bold;
}

.margin-top0 {
    margin-top: 0em;
}

.margin-top1 {
    margin-top: 0.9em;
}

.margin-top2 {
    margin-top: 3em;
}

.largerfont {
    font-size: 1.2em;
}

.mokabtn {
    border: 2px solid #004D8D;
    color: #004D8D;
}

    .mokabtn:hover {
        border: 2px solid #004D8D;
        color: #FFFFFF;
        background-color: #004D8D;
    }


.mokabtnwhite {
    border: 1px solid #FFF;
    background-color: #004D8D;
    color: #FFF;
}

form .form-control::-moz-placeholder {
    color: #eee;
    opacity: 1;
}

form .form-control:-ms-input-placeholder {
    color: #eee;
}

form .form-control::-webkit-input-placeholder {
    color: #eee;
}

/* Print Styles */

@page {
    size: A4;
    margin: 2.5cm;
}

@media print {
    .no-print,
    .no-print * {
        display: none !important;
    }
}

.sozlesme {
    color: #000000;
    font-family: 'Arial', sans-serif;
    font-size: 12px;
}

/* Custom Overrides, Elements */

.form-control:focus {
    border-color: #004D8D;
    border-width: 2px;
    box-shadow: none;
    -webkit-box-shadow: none;
    background-color: #eeeeee;
}

.has-error .form-control:focus {
    box-shadow: none;
    -webkit-box-shadow: none;
    border-width: 2px;
}

.btn-default.active {
    background-color: #004D8D;
    color: #FFFFFF;
}

.btn-huge {
    padding-top: 20px;
    padding-bottom: 20px;
}


label {
    font-size: 18px;
}

/* Progress */

.ssl-container {
    float: right;
}

.ssl {
    display: block;
    float: right;
    font-size: 24px;
    background: #EFEFEF;
    padding: 14px;
    border-radius: 35px;
}

.ssl-text {
    display: block;
    float: right;
    padding: 10px 10px 0 10px;
    color: #555;
    text-align: center;
}

.step {
    background: #eee;
    font-size: 1em;
    color: #ccc;
    padding: 15px;
    font-size: 1.25em;
}

    .step.active {
        color: #004D8D;
    }

    .step .caret {
        position: absolute;
        margin: 0;
        color: #eee;
        opacity: 1.0;
    }

        .step .caret.right {
            right: 1px;
            top: 0px;
            border-top: 27px solid transparent;
            border-bottom: 28px solid transparent;
            border-left: 30px solid;
        }

        .step .caret.bottom {
            bottom: -15px;
            left: 35%;
            border-top: 15px solid;
            border-right: 50px solid transparent;
            border-left: 50px solid transparent;
        }

@media(max-width:991px) {
    .step {
        text-align: center;
        margin-top: 20px;
        height: 80px;
    }

        .step .caret.right {
            top: 20px;
            border-top: 40px solid transparent;
            border-bottom: 40px solid transparent;
        }
}

@media(max-width:767px) {
    .step {
        height: auto;
    }

    .ssl-container {
        float: none;
        margin: 0 auto;
        width: 220px;
    }
}

@media(min-width:768px) {
    .step {
        margin-right: 20px;
        font-size: 16.1px;
    }
}