﻿.panel {
  border: 1px solid #d4d4d4 !important;
  border-radius: 0;
  padding: 5px;
}

.invisiblepanel {
  padding: 5px;
  background-color:transparent !important;
}

.PanelNoBorder {
  border: none;
  border-radius: 0;
  padding: 5px;
}

.panel-rounded
{
  border-radius:8px;
}


.btn {
  margin-bottom: 10px;
}


.btn-wrap {
  white-space:normal;
}


.alertnomargin 
{
  margin-bottom:0px;
}

.clouds {
  background: url(https://communic8.alpsltd.co.uk/Images/background2%202.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  min-height: 100%;
}

html {
  height: 100%;
}

body {
  min-height: 100%;
}

a.btn-success,
a.btn-primary,
a.btn-warning,
a.btn-danger {
  color: #fff
}

.btn-success {
  background: #119038;
  border: 1px solid #0c7a2e
}

  .btn-success:hover,
  .btn-success:focus,
  .btn-success:active,
  .btn-success.active,
  .open .dropdown-toggle.btn-success {
    background: #0c7a2e
  }



.btn-info {
  background-color: #0CA3D9;
  border: 1px solid #0b93c4;
}


.btn-dark {
  color: #E9EDEF;
  background-color: #4B5F71;
  border-color: #364B5F
}

  .btn-dark:hover,
  .btn-dark:focus,
  .btn-dark:active,
  .btn-dark.active,
  .open .dropdown-toggle.btn-dark {
    color: #FFFFFF;
    background-color: #394D5F;
    border-color: #394D5F
  }

.btn-round {
  border-radius: 30px
}

.btn.btn-app {
  position: relative;
  padding: 15px 5px;
  margin: 0 0 10px 10px;
  min-width: 80px;
  height: 60px;
  box-shadow: none;
  border-radius: 0;
  text-align: center;
  color: #666;
  border: 1px solid #ddd;
  background-color: #fafafa;
  font-size: 12px
}

  .btn.btn-app > .fa,
  .btn.btn-app > .glyphicon,
  .btn.btn-app > .ion {
    font-size: 20px;
    display: block
  }

  .btn.btn-app:hover {
    background: #f4f4f4;
    color: #444;
    border-color: #aaa
  }

  .btn.btn-app:active,
  .btn.btn-app:focus {
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125)
  }

  .btn.btn-app > .badge {
    position: absolute;
    top: -3px;
    right: -10px;
    font-size: 10px;
    font-weight: 400
  }

.modal-footer .btn + .btn
{
  margin-bottom:10px;
}

.label {
  color: #394D5F;
  font-size: 100%;
  border-radius: 1em;
  margin-bottom: 0px;
  white-space:normal !important;
  padding:unset !important;
}


.modal-backdrop {
  background-color: red;
  opacity: 0.1
}

.modal {
  background-color: rgba(0, 0, 25, 0.8) !important;
}


/* Radio button CSS */
.checkcontainer {
  display: block;
  position: relative;
  padding-left: 35px;
  /*margin-bottom: 12px;*/
  cursor: pointer;
  font-size: 18px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-align: left;
  line-height: 1.2em;
  font-size:1.2em;
  color:white;
  font-weight:normal;
}

  /* Hide the browser's default radio button */
  .checkcontainer input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
  }

/* Create a custom radio button */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 22px;
    width: 22px;
    background-color: #eee;
    border: solid 1px #9b9b9b;
    /* border-radius: 50%;*/
}

/* On mouse-over, add a grey background color */
.checkcontainer:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.checkcontainer input:checked ~ .checkmark {
  background-color: #0CA3D9;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.checkcontainer input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.checkcontainer .checkmark:after {
  left: 8px;
  top: 4px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}


::-webkit-input-placeholder { /* WebKit browsers */
  color: #ddd !important;
}

:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  color: #ddd !important;
}

::-moz-placeholder { /* Mozilla Firefox 19+ */
  color: #ddd !important;
}

:-ms-input-placeholder { /* Internet Explorer 10+ */
  color: #ddd !important;
}

:placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #ddd !important;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #ddd !important;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: red !important;
}


.navbar-toggle
{
  margin-right:0px;
  /*margin-top:17px*/
}

.container {
  width: 100% !important;
}



.nav-pills > li {
    display: unset;
    width: unset;
  }

    .nav-pills > li > a {
      border-radius: 0px;
      border-top-left-radius: 4px;
      border-top-right-radius: 4px;
      background-color: lightgrey;
    }

@media (min-width: 768px) {
  .container {
    width: 100% !important;
  }
    
}

@media (min-width: 992px) {
  .container {
    width: 90% !important;
  }


}

@media (min-width: 1200px) {
  .container {
    width: 85% !important;
    max-width:1200px;
  }
}


.alert-purple {
  color: #7f42a9;
  background-color: #e9def2;
  border-color: #ddcceb;
}

  .alert-purple hr {
    border-top-color: #cfb9e4;
  }

  .alert-purple .alert-link {
    color: #5e3484;
  }


.btn-purple {
  color: #fff;
  background-color: #be4fd9;
  border-color: #903ad4;
}

  .btn-purple:hover,
  .btn-purple:focus,
  .btn-purple.focus,
  .btn-purple:active,
  .btn-purple.active,
  .open > .dropdown-toggle.btn-purple {
    color: #fff;
    background-color: #af2cc9;
    border-color: #6025ac;
  }

  .btn-purple:active,
  .btn-purple.active,
  .open > .dropdown-toggle.btn-purple {
    background-image: none;
  }

  .btn-purple.disabled,
  .btn-purple[disabled],
  fieldset[disabled] .btn-purple,
  .btn-purple.disabled:hover,
  .btn-purple[disabled]:hover,
  fieldset[disabled] .btn-purple:hover,
  .btn-purple.disabled:focus,
  .btn-purple[disabled]:focus,
  fieldset[disabled] .btn-purple:focus,
  .btn-purple.disabled.focus,
  .btn-purple[disabled].focus,
  fieldset[disabled] .btn-purple.focus,
  .btn-purple.disabled:active,
  .btn-purple[disabled]:active,
  fieldset[disabled] .btn-purple:active,
  .btn-purple.disabled.active,
  .btn-purple[disabled].active,
  fieldset[disabled] .btn-purple.active {
    background-color: #984fd9;
    border-color: #8c3ad4;
  }

  .btn-purple .badge {
    color: #984fd9;
    background-color: #fff;
  }




th
{
    padding: 5px;
}



label.error
{
  margin:3px;
  margin-left:0px;
  margin-top:0px;
  padding:5px;
  color:red;
  /*background-color:#ffa5a5;
  border-radius:5px;*/
  border:0px;
}

.error
{
  border:2px solid red;
}

.navbar-nav {
     margin: 0px; 
}

.navbar-collapse {
    padding-right: 0px;
    padding-left: 0px;
    overflow-x: visible;
    border-top: none;
    /*border-bottom: 1px solid #0CA3D9;*/
    box-shadow: none;
}

/*fixes blurry text - chrome bug*/
b, strong {
  -webkit-filter: blur(0.0000000001px) !important;
}

/*.nav > li {
  float:left;
}*/



.nav-pills > li + li {
  margin-left: 0px;
}


.carousel-control.left:hover {
    background-image: linear-gradient(to right, #143a61 0%, rgba(0, 0, 0, .0001) 100%);
}

.carousel-control.right:hover {
    background-image: linear-gradient(to left, #143a61 0%, rgba(0, 0, 0, .0001) 100%);
}

.carousel-control
{
  width:90px;
}

    .carousel-control.left {
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
        background-repeat: repeat-x;
        border-top-left-radius: 50px;
        border-bottom-left-radius: 50px;
    }

    .carousel-control.right {
        right: 0;
        left: auto;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
        background-repeat: repeat-x;
        border-top-right-radius: 50px;
        border-bottom-right-radius: 50px;
    }

.carousel-control.left, .carousel-control.right {
  background-image: none;
}

.icon-prev, .icon-next {
  font-size: 2em !important;
  color: black;
}

.navbar-inverse
{
    all:unset;
}

@media (min-width: 768px) {
    .navbar-header {
    all:unset;
  }
}

@media screen and (min-width: 768px) {
    .carousel-control .glyphicon-chevron-left,
    .carousel-control .glyphicon-chevron-right,
    .carousel-control .icon-prev,
    .carousel-control .icon-next {
        width: 30px;
        height: 30px;
        margin-top: -20px;
        font-size: 30px;
    }
}

.switch-slide {
    padding: 0;
    margin: 15px 0 0;
    background: #FFF;
    border-radius: 0;
    background-image: none;
}

.switch-slide .switch-label {
    box-shadow: none;
    background: none;
    overflow: hidden;
}

    .switch-slide .switch-label:after, .switch-slide .switch-label:before {
        width: 100%;
        height: 65%;
        top: 5px;
        left: 0;
        text-align: center;
        padding-top: 10%;
        box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.2), inset 0 0 3px rgba(0, 0, 0, 0.1);
    }

    .switch-slide .switch-label:after {
        color: #FFFFFF;
        background: #87CEEB;
        left: -100px;
    }

    .switch-slide .switch-label:before {
        background: #eceeef;
    }

.switch-slide .switch-handle {
    display: none;
}

.switch-slide .switch-input:checked ~ .switch-label {
    background: #FFF;
    border-color: #0088cc;
}

    .switch-slide .switch-input:checked ~ .switch-label:before {
        left: 100px;
    }

    .switch-slide .switch-input:checked ~ .switch-label:after {
        left: 0;
    }


[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
    position: absolute;
    left: 0;
    opacity: 0.01;
}

    [type="checkbox"]:not(:checked) + label,
    [type="checkbox"]:checked + label {
        position: relative;
        padding-left: 2.3em;
        text-decoration: none;
        color: unset;
        font-size:1.2em;
        font-weight:unset;
        top:4px;
        /*font-size: 1.05em;
        line-height: 1.7;*/
        cursor: pointer;
    }

        /* checkbox aspect */
        [type="checkbox"]:not(:checked) + label:before,
        [type="checkbox"]:checked + label:before {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            width: 1.4em;
            height: 1.4em;
            border: 1px solid #aaa;
            background: #FFF;
            border-radius: .2em;
            box-shadow: inset 0 1px 3px rgba(0,0,0, .1), 0 0 0 rgba(203, 34, 237, .2);
            -webkit-transition: all .275s;
            transition: all .275s;
        }

        /* checked mark aspect */
        [type="checkbox"]:not(:checked) + label:after,
        [type="checkbox"]:checked + label:after {
            content: '✓';
            position: absolute;
            top: .525em;
            left: .18em;
            font-size: 1.370em;
            font-weight: bolder;
            color: #0CA3D9;
            line-height: 0;
            -webkit-transition: all .2s;
            transition: all .2s;
        }

        /* checked mark aspect changes */
        [type="checkbox"]:not(:checked) + label:after {
            opacity: 0;
            -webkit-transform: scale(0) rotate(45deg);
            transform: scale(0) rotate(45deg);
            background-color: #0CA3D9;
        }

        [type="checkbox"]:checked + label:after {
            opacity: 1;
            -webkit-transform: scale(1) rotate(0);
            transform: scale(1) rotate(0);
            background-color: #0CA3D9;
        }

.checklabel {
    text-decoration: none;
    color: unset;
    padding-top:3px;
}

@media (min-width: 768px) {
    .navbar {
        border-radius: 0px;
    }
}

.navbar-default {
    background-color: #143a61;
}

.navbar {
    border: unset;
}

.navbar-default:not(.dropdown-menu-level1, .dropdown-menu-level2) .navbar-nav > li > a, .dropdown-menu:not(.dropdown-menu-level1, .dropdown-menu-level2) > li > a {
    color: white;
    /*padding: 20px;
    font-size: 20px;*/
}

.navbar-default .navbar-nav > li > a, .dropdown-menu > li > a {
    color: white;
    /*    padding: 10px;*/
}

.dropdown-menu:not(.bootstrap-datetimepicker-widget) {
    background-color: #143a61;
}

.dropdown-menu-level1 {
    min-width: 100% !important;
    width: unset !important;
    max-width: unset !important;
}

.dropdown-menu > li > span {
    padding: 3px 20px;
}


@media (max-width: 767px) {
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        color: white;
    }

        .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
            background-color: #27D7F4 !important;
            color: grey;
        }

    .dropdown-menu-level1 {
        background-color: #394D5F !important;
    }

    .dropdown-menu-level2 {
        background-color: #627e97 !important;
    }
}

@media (min-width: 768px) {
    .navbar-collapse {
        border-top: unset;
        padding-right: 0px;
        padding-left: 0px;
    }
}
