/* Icon fonts */
@font-face {
  font-family: 'fontello';
  src: url('../bundles/visualmmanagement/fonts/fontello.eot?37740838');
  src: url('../bundles/visualmmanagement/fonts/fontello.eot?37740838#iefix') format('embedded-opentype'),
       url('../bundles/visualmmanagement/fonts/fontello.woff?37740838') format('woff'),
       url('../bundles/visualmmanagement/fonts/fontello.ttf?37740838') format('truetype'),
       url('../bundles/visualmmanagement/fonts/fontello.svg?37740838#fontello') format('svg');
  font-weight: normal;
  font-style: normal;
}

/* Firefox remove focus border */
*:focus {outline:none;}
::-moz-focus-inner {border:0;}
a:focus { outline: none; }

/* Document */
html, body {
    height: 100%;
    width: 100%;
}
body {
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 15px;
	color: #737773;
}

/* Heading */
h1 {
    margin: 0;
    font-size: 20px;
    color: #4a4f4a;
    line-height: 60px;
    white-space: nowrap;
    overflow: hidden;
}
h2 {
    margin: 0 0 20px;
    font-size: 17px;
    font-weight: 700;
    color: #4a4f4a;
}

/* Hyperlink */
a,
.btn.btn-link {
    color: #51a0dc;
}
a:hover,
a:focus,
.btn.btn-link:hover,
.btn.btn-link:focus {
    color: #1ab23a;
}
a:focus,
.btn.btn-link:focus {
    text-decoration: none;
}

/* Table */
table th {
    text-align: left;
}
table th, table td {
    padding: 10px;
}

/* List groups */
a.list-group-item {
    color: #51a0dc;
}
a.list-group-item:hover,
a.list-group-item:focus {
    color: #1ab23a;
}
a.list-group-item:focus {
    text-decoration: none;
}

/* Modals */
.modal-header {
    background: #1ab23a;
    color: #fff;
    border-radius: 5.9px 5.9px 0 0;
}
.bootstrap-dialog.type-info .modal-header {
    background-color: #5bc0de;
}
.bootstrap-dialog.type-success .modal-header {
    background-color: #5cb85c;
}
.bootstrap-dialog.type-warning .modal-header {
    background-color: #f0ad4e;
}
.bootstrap-dialog.type-danger .modal-header {
    background-color: #d9534f;
}

/* Panels */
.panel-group .panel,
.panel {
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.panel-default,
.panel-default .panel-heading {
    border-color: #f1eee5;
}
.panel-default > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: #f1eee5;
}
.panel .panel-heading {
    border-radius: 0;
    background-color: #f1eee5;
    padding: 5px 15px;
}
.panel .panel-title {
    color: #1ab23a;
    font-size: 15px;
    text-decoration: none;
}
.panel .panel-title .icon-arrow-up,
.panel .panel-title.collapsed .icon-arrow-down {
    display: inline-block;
}
.panel .panel-title .icon-arrow-down,
.panel .panel-title.collapsed .icon-arrow-up {
    display: none;
}

.panel .panel-title.collapsed {
    color: #6f6b60;
}
.panel .panel-title.collapsed:hover {
    color: #1ab23a;
}

.panel .panel-heading.panel-heading-lg {
    padding: 10px 15px;
    font-size: 18px;
}

/* Forms */
.form-horizontal .control-label {
    padding-top: 9px;
    font-weight: 400;
    color: #8c918c;
    text-align: left;
}
.form-control {
    padding: 10px;
    height: 40px;
    color: #737773;
    border-radius: 0;
    border-color: #e4e2de;
    box-shadow: none;
}
.form-control:focus {
    border-color: #8dc6f1;
    box-shadow: none;
}
.form-control.error {
    border-color: #e68484;
}
textarea.form-control {
    resize: vertical;
}
select.form-control {
    padding: 8px 10px;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSIyN3B4IiBoZWlnaHQ9IjdweCIgdmlld0JveD0iMCAwIDI3IDciIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDI3IDciIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwb2x5Z29uIGZpbGw9IiNBMTlFOTUiIHBvaW50cz0iMTUuOTA4LDAuNjk4IDEzLjQ2NiwzLjY4OCAxMS4wNSwwLjczMyAxMC4wNjQsMS44MzkgMTMuNDY2LDYuMzEgMTYuOTA0LDEuODM5ICAgIi8+PC9zdmc+) no-repeat right center;
    
    -webkit-appearance: none;
}
input[type="checkbox"] {
    width: 15px;
    height: 15px;
    border: 1px solid #cad1cc;
    background-color: #fff;
    cursor: pointer;

    -webkit-appearance: none;
}
input[type="checkbox"]:focus {
    outline: none;
}
input[type="checkbox"]:checked {
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSIxMXB4IiBoZWlnaHQ9IjExcHgiIHZpZXdCb3g9IjAgMCAxMSAxMSIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMTEgMTEiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwb2x5Z29uIGZpbGw9IiM2OUQwNjciIHBvaW50cz0iOC45NTUsMC40NzUgNC4wMTUsNy4wNDMgMi40ODcsNS41MjkgMC40OTEsNy41NTIgMy45NjUsMTEuMDEyIDEwLjU2NiwyLjUwMiAgICIvPjwvc3ZnPg==) no-repeat center center;
}
input[type="checkbox"].semi-checked {
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI1cHgiIGhlaWdodD0iNXB4IiB2aWV3Qm94PSIwIDAgNSA1IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA1IDUiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxyZWN0IGZpbGw9IiM2OUQwNjciIHdpZHRoPSI1IiBoZWlnaHQ9IjUiLz48L3N2Zz4=) no-repeat center center;
}

/* Form control feedback */
.form-control-feedback {
    top: 11px;
    left: 100%;
    margin-left: -25px;
    width: 18px;
    height: 18px;
    color: #fff;
    font-size: 9px;
    line-height: 18px;
    border-radius: 50%;
    background-color: #e14048;
    display: none;
}
.form-control.error + .form-control-feedback {
    display: block;
}

/* Form error */
.form-error {
    margin-bottom: 40px;
    padding: 15px;
    font-size: 13px;
    border: 1px solid #ddc2c2;
    display: none;
}

/* Has warning */
.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline {
    color: #ff0000;
}

/* Required */
.required {
    margin-left: 2px;
    width: 4px;
    height: 4px;
    vertical-align: -4px;
    text-indent: -1234em;
    border-radius: 50%;
    background-color: #e55162;
    display: inline-block;
}


/* Background color */
.bg-green { background: #009530; }
.bg-white { background: #fff; }
.bg-natural { background: #f1eee5; }

/* Text color */
.text-light { color: #a3a8a3; }
.text-natural { color: #a19e95; }
.text-brand-visualmedia { color: #009530; }
.text-brand-twitter { color: #55acee; }
.text-brand-facebook { color: #3b5998; }
.text-brand-linkedin { color: #0976b4; }

/* Text size */
.smaller { font-size: 75%; }
.smallest { font-size: 65%; }

/* Spacer */
.spacer { display: block; font-size: 1px; color: transparent; height: 30px; clear: both; }
.spacer.spacer-small { height: 15px; }
.spacer.spacer-large { height: 60px; }

/* Icons */
[class^="icon-"]:before, [class*=" icon-"]:before {
    font-family: "fontello";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: .2em;
}

.icon-dashboard:before { content: '\e800'; } /* '?' */
.icon-gear:before { content: '\e801'; } /* '?' */
.icon-stats:before { content: '\e802'; } /* '?' */
.icon-pencil:before { content: '\e803'; } /* '?' */
.icon-help:before { content: '\e804'; } /* '?' */
.icon-envelope:before { content: '\e805'; } /* '?' */
.icon-trash:before { content: '\e806'; } /* '?' */
.icon-plus:before { content: '\e807'; } /* '?' */
.icon-arrow-down:before { content: '\e808'; } /* '?' */
.icon-arrow-up:before { content: '\e809'; } /* '?' */
.icon-arrow-long-left:before { content: '\e80a'; } /* '?' */
.icon-arrow-long-right:before { content: '\e80b'; } /* '?' */
.icon-cross:before { content: '\e80c'; } /* '?' */
.icon-search:before { content: '\e80d'; } /* '?' */
.icon-user:before { content: '\e80e'; } /* '?' */
.icon-product:before { content: '\e80f'; } /* '?' */
.icon-eye:before { content: '\e810'; } /* '?' */
.icon-arrow-right:before { content: '\e811'; } /* '?' */
.icon-brand-visualmedia:before { content: '\e812'; } /* '?' */
.icon-brand-twitter:before { content: '\e813'; } /* '?' */
.icon-brand-facebook:before { content: '\e814'; } /* '?' */
.icon-brand-linkedin:before { content: '\e815'; } /* '?' */
.icon-check:before { content: '\e816'; } /* '?' */
.icon-upload-cloud:before { content: '\e817'; } /* '?' */
.icon-folder:before { content: '\e818'; } /* '?' */
.icon-download-cloud:before { content: '\e819'; } /* '?' */

/* Buttons */
.btn {
    padding: 9px 10px;
    font-weight: 600;
}
.btn:active {
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, .1);
}
.btn:focus {
    outline: none;
}
.btn-default {
    color: #a19e95;
    border-color: #ececec;
}
.btn-default:hover,
.btn-default:focus,
.btn-default:active {
    color: #737773;
    border-color: #cccac4;
    background-color: #fff;
}
.btn-primary {
    color: #fff;
    border-color: transparent;
    background-color: #d76e96;
}
.btn-primary:hover {
    color: #fff;
    border-color: transparent;
    background-color: #1ab23a;
}

/* Alerts */
.alert,
.alert.alert-success,
.alert.alert-info,
.alert.alert-warning,
.alert.alert-danger{
    padding: 8px 10px;
    border: 0;
}

/* Badge */
.badge {
    position: relative;
    top: -8px;
    height: 14px;
    min-width: 14px;
    padding: 0;
    font-size: 9px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
    color: #fff;
    border-radius: 7px;
    background-color: #d76e96;
    display: inline-block;
}

/* Side */
.side {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #f1eee5;
    z-index: 50;
    transition: transform 0.3s;
}
.side.asleep {
    transform: translateY(-100%);
}
.side .side-container {
    height: 60px;
    width: 100%;
}

/* Pagination */
.pagination > li > a,
.pagination > li > span {
    color: #51a0dc;
    border-color: #ececec;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
    position: relative;
    color: #1ab23a;
    border-color: #cccac4;
    background-color: transparent;
    z-index: 2;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
	background-color: #1ab23a;
	border-color: #1ab23a;
}

/* AdminList Page Size dropdown */
.adminlist-page-size {
    float: left;
    margin: 18px 15px 18px 0;
}

/* Header */
.header {
    position: relative;
    height: 60px;
    width: 100%;
    border-bottom: 1px solid #ececec;
    background-color: #fff;
    transition: transform 0.3s;
}
.header.content-padding {
    padding-top: 0;
    padding-bottom: 0;
}

/* Extra */
.extra {
    height: 60px;
    font-size: 14px;
    line-height: 60px;
    border-bottom: 1px solid #ececec;
    background-color: #fff;
}
.extra.content-padding {
    padding-top: 0;
    padding-bottom: 0;
}

/* Filtering */
.filtering {
    background-color: #fcfcfc;
}
.filtering.content-padding {
    padding-top: 20px;
    padding-bottom: 20px;
}
.filtering .form-control {
    background-color: #fff;
}

/* Main */
.main {
    padding-top: 120px;
    min-height: 100%;
    background-color: #fff;
}

/* Logo */
.logo {
	width: 80px;
	height: 60px;
	text-indent: -1234em;
	display: block;
	float: left;
    background: #009530 url('../bundles/visualmmanagement/images/vm-wit.svg') 50% 50% no-repeat;
    background-size: auto 75%;
}

/* Profile */
.profile {
    position: absolute;
    top: 0;
    right: 0;
}
.profile > a {
    position: relative;
    padding: 10px 20px 10px 0;
    display: block;
}
.profile > a figure {
    position: relative;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    z-index: 2;
}
.profile > a figure img {
    position: absolute;
    top: -10px;
    left: -10px;
    width: 60px;
    display: block;
    z-index: 1;
    transition: transform 1s;
    transform: scale(.8);
}
.profile > a:hover figure img,
.profile.open > a figure img {
    transform: scale(1);
}
.profile > a i[class*="icon-"] {
    position: absolute;
    top: 50%;
    left: 42px;
    margin-top: -7px;
    width: 14px;
    height: 14px;
    color: #878377;
    font-size: 14px;
    border-radius: 50%;
}
.profile > a:hover i[class*="icon-"],
.profile.open > a i[class*="icon-"] {
    color: #fff;
    background-color: #1ab23a;
}
.profile > a i[class*="icon-"]:before {
    position: relative;
    top: -3px;
    left: -3px;
}
.profile .dropdown-menu {
    left: auto;
    right: 5px;
}

/* Content padding */
.content-padding {
    padding: 20px;
}

/* Back */
.back {
    position: absolute;
    left: 0;
    top: 0;
}
.back > a {
    height: 60px;
    width: 20px;
    color: #4a4f4a;
    font-size: 16px;
    line-height: 60px;
    text-align: center;
    display: block;
}
.back > a:hover {
    color: #1ab23a;
}
.back > a i {
    margin-right: -2px;
    vertical-align: -1px;
}

/* Actions */
.actions {
    position: absolute;
    top: 0;
    right: 20px;
    padding: 10px 0 0 5px;
    height: 59px;
    background-color: #fff;
}
.actions .actions-group {
    margin-left: 5px;
    float: left;
}
.actions .actions-group:first-child {
    margin-left: 0;
}

/* Search */
.search .search-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    z-index: 1000;
    display: none;
}
.search.open .search-container {
    display: block;
}
.search .search-container:before {
    height: 100%;
    width: 0;
    content: '';
    vertical-align: middle;
    display: inline-block;
}
.search .search-container:after {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: '';
    background-color: rgba(0, 0, 0, .7);
    display: block;
    z-index: 1;
}
.search input[type="search"] {
    position: relative;
    padding: 15px 45px 15px 15px;
    width: 80%;
    height: 50px;
    border-radius: 4px;
    border-color: transparent;
    display: inline-block;
    z-index: 2;
}
.search button {
    position: relative;
    margin: 0;
    padding: 0;
    width: 40px;
    height: 40px;
    line-height: 40px;
    color: #a19e95;
    border: none;
    background-color: transparent;
    z-index: 2;
}
.search .search-container button {
    margin-left: -40px;
    display: none;
}
.search.open .search-container button {
    display: inline-block;
}
.search button:hover {
    color: #1ab23a;
}
.search button:focus {
    outline: none;
}

/* Dropdown */
.dropdown.open {
    z-index: 999;
}
.dropdown.open .dropdown-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    z-index: 1000;
}
.dropdown.open .dropdown-wrapper:before {
    height: 100%;
    width: 0;
    content: '';
    vertical-align: middle;
    display: inline-block;
}
.dropdown.open .dropdown-wrapper:after {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: '';
    background-color: rgba(0, 0, 0, .7);
    display: block;
    z-index: 1;
}
.dropdown-menu {
    position: relative;
    top: 0;
    margin: 0;
    padding: 10px 0;
    width: 80%;
    text-align: left;
    border-radius: 3px;
    border-color: transparent;
    vertical-align: middle;
    float: none;
    z-index: 2;
}
.dropdown.open .dropdown-menu {
    display: inline-block
}
.dropdown-menu > li > a {
    padding: 10px 20px;
    color: #737773;
}
.dropdown-menu > li > a:hover {
    color: #4a4f4a;
    background-color: #f3f9f3;
}
.dropdown-menu .divider {
    background-color: #ececec;
}

/* Wrapper */
#wrapper {
    height: 100%;
}

/* Login logo */
.login-logo {
    display: inline-block;
    width: 60px;
    height: 60px;
    background: transparent url('../bundles/visualmmanagement/images/vm-wit.svg') 0 0 no-repeat;
    background-size: contain;
}

/* Login panel */
.login-panel {
    margin: 0 20px;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Feed items */
.feeditem {
    padding: 20px;
}
.feeditem .feeditem-brand {
    display: none;
}
.feeditem .feeditem-footer {
    border-top: 1px solid #ececec;
    margin-left: -20px;
    margin-right: -20px;
    margin-bottom: -20px;
    margin-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
    line-height: 50px;
    font-size: 0.9em;
}
.feeditem .feeditem-footer a {
    text-decoration: none;
}

.feeditem .feeditem-date {
    display: block;
    line-height: 1;
    margin-bottom: 0.5em;
}
.feeditem.feeditem-rss .feeditem-content a,
.feeditem.feeditem-facebook .feeditem-content a {
    color: inherit;
    text-decoration: none;
}
.feeditem.feeditem-rss .feeditem-content .feeditem-title a:hover {
    color: #1ab23a;
    text-decoration: underline;
}

.feeditem .feeditem-title {
    font-size: 22px;
    line-height: 26px;
    font-weight: normal;
}


/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {

    /* Heading */
    h1 {
        font-size: 22px;
    }

    /* Forms */
    input[type="checkbox"] {
        width: 13px;
        height: 13px;
    }

    .form-control-feedback {
        margin-left: -8px;
    }

    /* Side */
	.side {
		bottom: 0;
		width: 80px;
		height: auto;
	}
    .side.asleep {
        transform: none;
    }
    .side .side-container {
        height: 100%;
    }

    /* Login side */
    .login-side {
        width: 600px;
        margin-top: 30px;
        margin-left: auto;
        margin-right: auto;
    }

    /* Header */
    .header {
        position: fixed;
        top: 0;
        left: 80px;
        right: 0;
        width: auto;
    }

    /* Main */
    .main {
        padding-top: 60px;
        padding-left: 80px;
    }

    /* Logo */
    .logo {
        float: none;
    }

    /* Profile */
    .profile {
        position: relative;
    }
    .profile a {
        padding: 10px 20px;
    }
    .profile a i[class*="icon-"] {
        left: 62px;
    }
    .profile .dropdown-menu {
        left: 50%;
        right: auto;
    }

    /* Content padding */
    .content-padding {
        padding: 30px;
    }

    /* Max */
    .max-width {
        max-width: 600px;
    }

    /* Back */
    .back > a {
        width: 30px;
    }

    /* Actions */
    .actions {
        right: 30px;
    }

    /* Search */
    .search .search-container {
        position: static;
        width: auto;
        height: auto;
        display: block;
        float: left;
    }
    .search .search-container:before,
    .search .search-container:after {
        display: none;
    }
    .search input[type="search"] {
        padding: 10px 30px 10px 10px;
        height: 40px;
        width: 0;
        border-color: #e4e2de;
        opacity: 0;
        transition: width .3s, opacity .3s;
    }
    .search.open input[type="search"] {
        width: 160px;
        opacity: 1;
    }
    .search button {
        margin-left: -40px;
        float: left;
    }
    .search.open .search-container button {
        display: none;
    }

    /* Dropdown */
    .dropdown.open .dropdown-wrapper {
        position: relative;
        width: auto;
        height: auto;
        text-align: left;
        z-index: 1000;
    }
    .dropdown.open .dropdown-wrapper:before,
    .dropdown.open .dropdown-wrapper:after {
        display: none;
    }
    .dropdown-menu {
        position: absolute;
        top: 100%;
        margin: 0;
        padding: 10px 0;
        width: auto;
        min-width: 160px;
        text-align: left;
        border-color: rgba(0, 0, 0, .05);
    }
    .dropdown-menu > li > a {
        padding: 5px 20px;
    }

    /* Login panel */
    .login-panel {
        margin: 0 auto;
        width: 500px;        
    }
    
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {

	/* Side */
	.side {
		width: 180px;
	}

    /* Header */
    .header {
        left: 180px;
    }

    /* Main */
    .main {
        padding-left: 180px;
    }

    /* Logo */
	.logo {
		width: 100%;
	}

    /* Profile */
    .profile a figure {
        width: 60px;
        height: 60px;
    }
    .profile a figure img {
        width: 80px;
    }
    .profile a i[class*="icon-"] {
        left: 82px;
    }
    .profile .dropdown-menu {
        top: 50px;
        left: 80px;
    }

    /* Content padding */
    .content-padding {
        padding: 40px;
    }

    /* Back */
    .back > a {
        width: 40px;
    }

    /* Actions */
    .actions {
        right: 40px;
    }

    /* Feeditems */
    .feeditem {
        padding: 40px 40px 40px 60px;
        position: relative;
    }
    .feeditem .feeditem-brand {
        display: block;
        position: absolute;
        font-size: 16px;
        line-height: 16px;
        left: 15px;
        top: 40px;
    }

    .feeditem .feeditem-footer {
        margin-left: -60px;
        margin-right: -40px;
        margin-bottom: -40px;        
        padding-left: 60px;
        padding-right: 40px;
    }
}
