/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 2018-03-30, 13:22:37
    Author     : Konrad
*/
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro');

body{
    background: #f6f7fc;
    font-family: 'Source Sans Pro', sans-serif;
}

@media(min-width:768px) {
    /*menu*/
    .navbar-default{
        border-color: #d9d9d9;
        box-shadow: none;
    }
    .collapse-menu{
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        box-shadow: none;
        border-bottom: 1px solid #e7e7e7;
        padding-left: 0px;
        list-style-type: none;
    }
    .navbar-fixed-side .nav .collapse-menu>li>a{
        padding: 5px 15px 5px 25px;
        transition: .3s all;
        color: #777;
        line-height: 25px;
        display: block;
        text-decoration: none;
    }
    .navbar-fixed-side .nav .btn-collapse{
        text-transform: uppercase;
    }
    .navbar-fixed-side .nav .collapse-menu>li>a:hover, .navbar-fixed-side .navbar-nav>li>a:hover, .navbar-fixed-side .navbar-nav>li>a:focus, .navbar-fixed-side .navbar-nav .collapse-menu>li>a:hover, .navbar-fixed-side .navbar-nav .collapse-menu>li>a:focus{
        background-color: transparent;
        color: #00b0a9;
    }
    /*    .dropdown-toggle{
            display: none !important;
        }*/
    .navbar-fixed-side .navbar-nav .collapse-menu .dropdown-header{
        padding: 12px 24px 0px 14px;
        text-transform: uppercase;
        color: #9d9d9d !important;
        font-size: 0.8em;
    }
    .navbar-fixed-side .navbar-nav .btn-collapse .caret{
        float: right;
        margin-top: 9px;
    }
    /*content*/
    .content{
        background: #fff;
        margin-top: 15px;
        margin-bottom: 15px;
        border: 1px solid #d9d9d9;
        padding: 15px;
        border-radius: 5px;
        min-height: 180px;
    }
    .content-title{
        background: #f6f7fc;
        margin-left: -15px;
        margin-right: -15px;
        margin-top: -15px;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        padding: 10px;
        font-size: 24px;
        text-transform: uppercase;
    }
    .content .control-label{
        text-transform: uppercase;
    }

    /*tabela*/
    /*    .content .table-responsive{
            margin-left: -15px;
            margin-right: -15px;
        }*/
    div.dataTables_wrapper div.dataTables_length label, div.dataTables_wrapper div.dataTables_filter label{
        font-weight: normal;
        color: #999;
    }
    .table>thead>tr>th {
        vertical-align: bottom;
        border-bottom: 2px solid #00b1aa;
    }
    .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-top: 1px dashed #ddd;
    }
    .table>tbody>tr:first-child>td{
        border-top: none;
    }

    /*logowanie*/
    .login-box{
        position: absolute;
        top: 40%;
        left:50%;
        transform: translate(-50%,-50%);
    }
}

.form-control:focus {
    border-color: #00b1aa !important;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0, 177, 170, .6);
}
form{
    margin-bottom: 0px;
}
.content .section-title{
    color: #26328a;
    text-transform: uppercase;
    font-size: 22px;
}
.content .section-title span{
    color: #00b1aa;
}
.content .bottom-nav{
    border-top: 1px solid #eee;
    padding-top: 15px;
}
.content .bottom-nav .success{
    text-align: right;
}
.content .separator{
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    padding-bottom: 25px;
    background: #f6f7fc;
}

/*data tables*/
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    background-color: #00b1aa;
    border-color: #00b1aa;
}
div.dataTables_wrapper div.dataTables_info{
    color: #999;
}
table.dataTable.dtr-inline.collapsed>tbody>tr[role="row"]>td:first-child:before, table.dataTable.dtr-inline.collapsed>tbody>tr[role="row"]>th:first-child:before {
    border: 2px solid #27338a;
    box-shadow: 0 0 3px #fff;
    background-color: #212e87;
}
div.dataTables_wrapper div.dataTables_length select {
    width: 55px;
    display: inline-block;
}
div.dataTables_wrapper .input-sm{
    padding: 5px 5px;
}
.dataTables_wrapper .btn-group, .btn-group-vertical{
    margin-bottom: 15px;
}

/*formularze*/
.btn-blue{
    color: #fff;
    background: #00b1aa;
    border-color: #fff;
    text-transform: uppercase;
    font-size: 16px;
    transition: .3s all;
}
.btn-blue:hover{
    color: #fff;
    background-color: #12928c;
}
.btn-grey{
    /*    background: #999;
        color: #fff;
        border-radius: 0px;
        font-size: 16px;
        text-transform: uppercase;
        transition: .3s all;
    */
    color: #fff;
    background: #aaa;
    border-color: #fff;
    text-transform: uppercase;
    font-size: 16px;
    transition: .3s all;
}
.btn-grey:hover{
    color: #fff;
    background-color: #999;
}
.required-label{
    color: #ff0000;
}

/*logowanie*/
.login-box{
    width: 400px;
    max-width: 400px;
    background: #fff;
    padding: 15px;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
    box-shadow: 1px 1px 10px #ddd;
}
.login-box label{
    display: none;
}
.login-box form{
    margin-bottom: 0px;
    margin-top: 15px;
}
.login-box .btn{
    width: 100%;
    font-size: 20px;
}
.login-box .form-control{
    padding: 10px;
    height: auto;
    font-size: 16px;
    box-shadow: none !important;
    border: 1px solid #ccc;
}


@media(max-width:768px) {
    body{
        background: #fff;
    }
    /*content*/
    .content-title{
        text-align: center;
        text-transform: uppercase;
        background: #efefef;
        padding: 10px;
        font-size: 28px;
        color: #00b1aa;
        margin-bottom: 15px;
    }
    /*menu*/
    .collapse-menu{
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        box-shadow: none;
        border-bottom: 1px solid #e7e7e7;
        padding-left: 0px;
        list-style-type: none;
    }
    .navbar-fixed-side .nav .collapse-menu>li>a{
        padding: 5px 15px 5px 25px;
        transition: .3s all;
        color: #777;
        line-height: 25px;
        display: block;
        text-decoration: none;
    }
    .navbar-fixed-side .nav .btn-collapse{
        text-transform: uppercase;
    }
    .navbar-fixed-side .nav .collapse-menu>li>a:hover, .navbar-fixed-side .navbar-nav>li>a:hover, .navbar-fixed-side .navbar-nav>li>a:focus, .navbar-fixed-side .navbar-nav .collapse-menu>li>a:hover, .navbar-fixed-side .navbar-nav .collapse-menu>li>a:focus{
        background-color: transparent;
        color: #00b0a9;
    }
    /*    .dropdown-toggle{
            display: none !important;
        }*/
    .navbar-fixed-side .navbar-nav .collapse-menu .dropdown-header{
        padding: 12px 24px 0px 14px;
        text-transform: uppercase;
        color: #9d9d9d !important;
        font-size: 0.8em;
    }
    .logo{
        height: 40px;
        width: auto;
    }
    .navbar-brand{
        padding: 6px 6px;
    }
    .navbar-default .navbar-nav>li>a {
        color: #333;
        font-size: 16px;
        text-transform: uppercase;
    }
    .navbar-fixed-side{
        border-radius: 0px;
    }
    .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.open>a{
        background: #00b1aa !important;
        color: #fff !important;
    }
    /*logowanie*/
    .login-box{
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
        border: none;
        border-radius: 0px;
    }
    /*data tables*/
    .dataTables_length{
        float: left;
    }
    .dataTables_filter{
        float: right;
    }
    .form-horizontal{
        margin-bottom: 15px;
    }
}

/*tabela linki*/
.table tbody tr td svg{
    display: inline-block;
    margin-left: 5px;
}
.table .btn-action{
    color: #bbb;
    transition: .3s all;
}
.table .btn-action.edit:hover{
    color: #8bc34a;
}
.table .btn-action.delete:hover{
    color: #f44336;
}
.table .btn-action.preview:hover{
    color: #00b1aa;
}

/*chosen select*/
.chosen-container-multi .chosen-choices{
    background-image: none;
    border: 1px solid #ccc !important;
    border-radius: 4px;
    padding: 6px 12px;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
.chosen-container-active .chosen-choices{
    border-color: #00b1aa !important;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6) !important;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(0, 177, 170, .6) !important;
}

/*tagsinput contact*/
.bootstrap-tagsinput{
    height: 34px;
    padding: 3px 6px;
}
.bootstrap-tagsinput .label{
    position: relative;
    margin: 0px 5px 0px 0;
    padding: 3px 20px 3px 5px;
    border: 1px solid #aaa;
    max-width: 100%;
    border-radius: 3px;
    background-color: #eeeeee;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), to(#eee));
    background-image: linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%);
    background-size: 100% 19px;
    background-repeat: repeat-x;
    background-clip: padding-box;
    -webkit-box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, 0.05);
    color: #333;
    line-height: 18px;
    cursor: default;
    font-size: 13px;
    font-weight: normal;
    font-family: monospace;
    display: inline-block;
}
.bootstrap-tagsinput .tag [data-role="remove"]{
    position: absolute;
    top: 7px;
    right: 3px;
    display: block;
    width: 12px;
    height: 12px;
    background: url('../../chosen_v1.8.3/chosen-sprite.png') -42px 1px no-repeat;
    font-size: 1px;
}
.bootstrap-tagsinput .tag [data-role="remove"]:hover{
    background-position: -42px -10px;
}
.bootstrap-tagsinput .tag [data-role="remove"]:after{
    content: '';
}

/*spinner*/
.spinner {
    margin: 0 auto;
    width: 40px;
    height: 40px;
    position: absolute;
    left: 50%;
    right: 50%;
    top: 20px;
    text-align: center;

    -webkit-animation: sk-rotate 2.0s infinite linear;
    animation: sk-rotate 2.0s infinite linear;
}

.dot1, .dot2 {
    width: 60%;
    height: 60%;
    display: inline-block;
    position: absolute;
    top: 0;
    background-color: #00b1aa;
    border-radius: 100%;

    -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
    animation: sk-bounce 2.0s infinite ease-in-out;
}

.dot2 {
    top: auto;
    bottom: 0;
    -webkit-animation-delay: -1.0s;
    animation-delay: -1.0s;
}

@-webkit-keyframes sk-rotate { 100% { -webkit-transform: rotate(360deg) }}
@keyframes sk-rotate { 100% { transform: rotate(360deg); -webkit-transform: rotate(360deg) }}

@-webkit-keyframes sk-bounce {
    0%, 100% { -webkit-transform: scale(0.0) }
    50% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bounce {
    0%, 100% { 
        transform: scale(0.0);
        -webkit-transform: scale(0.0);
    } 50% { 
        transform: scale(1.0);
        -webkit-transform: scale(1.0);
    }
}

/*mapa*/
#mapModal{
    height: 100%;
}
#mapModal .data-box{
    position: absolute;
    z-index: 2;
    top: 25px;
    left: 25px;

}
#mapModal .data-marker{
    width: 300px;
}
#mapModal #map {
    height: 65%;
}
#previewModal #map{
    height: 300px;
}
.modal-header .close{
    font-size: 26px;
}
.modal-header{
    background: #00b1aa !important;
    color: #fff !important;
    text-transform: uppercase !important; 
}
#previewModal .modal-body{
    font-size: 16px;
}
#previewModal .modal-body svg{
    color: #00b1aa;
}
#previewModal .maker-modal-title{
    background: #12a29d;
    color: #fff;
    margin-top: -15px;
    margin-bottom: 25px;
    padding: 15px;
    padding-bottom: 25px;
}
#previewModal .modal-header{
    border-bottom: none;
}
.btn-map{
    width: 100%;
    margin-top: 25px;
}

.pac-container {
    z-index: 1051 !important;
}

/*select*/
.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover{
    background-image: linear-gradient(to bottom,#00b1aa 0,#00b1aa 100%);
    background-color: #00b1aa;
}
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover{
    background-color: #e8e8e8;
    background-image: linear-gradient(to bottom,#e8e8e8 0,#e8e8e8 100%);
}

/*lista kategorii*/
.hierarchy-select.open .dropdown-toggle{
    box-shadow: none;
}

.scrollable-menu {
    height: auto;
    max-height: 200px;
    overflow-x: hidden;
}

#scrollable-dropdown-menu .tt-dropdown-menu {
    max-height: 150px;
    overflow-y: auto;
}

/*licznik*/
.btn-counter{
    height: 34px;
}
.counter-input{
    text-align: center;
}

/*surowce*/
#material-table_wrapper, #material-table-results-none{
    margin-top: 25px;
}

.remind_link {
    position: relative;
    color: #00b1aa;
    text-decoration: none;
    text-transform: uppercase;
}
.remind_link:hover {
    color: #00b1aa;
    text-decoration: none;
}
.remind_link:after{
    content: '';
    position: absolute;
    width: 0; 
    height: 3px;
    display: block;
    margin-top: 1px;
    right: 0;
    background: #00b1aa;
    transition: width .3s ease;
    -webkit-transition: width .3s ease;
}

.remind_link:hover:after{
    width: 100%;
    left: 0;
    background: #00b1aa;
}


@media(min-width:768px) {
    .ue-img{
        max-width: 800px;
        border: 1px solid #eee;
        position: absolute;
        bottom: 15px;
        left: 0;
        right: 0;
    }
}
