@font-face{font-family:'Vodafone';src:url("../fonts/VodafoneRg.woff") format("woff");font-weight:400;font-style:normal}
@font-face{font-family:'Vodafone';src:url("../fonts/vodafonergbd-webfont.woff") format("woff");font-weight:700;font-style:normal}
@font-face{font-family:'Vodafone';src:url("../fonts/VodafoneLt.woff") format("woff");font-weight:100;font-style:normal}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-style: inherit;
    font-variant-ligatures: inherit;
    font-variant-caps: inherit;
    font-variant-numeric: inherit;
    font-weight: inherit;
    font-stretch: inherit;
    font-size: 100%;
    line-height: inherit;
    font-family: inherit;
    font-size: 100%;
    vertical-align: baseline;
}

body {
    color: #333;
    font: 400 14px/1.3 "Vodafone",Arial,sans-serif;
    background: #fff;
}

.table>tbody>tr.admin-comment>td{
    border-top:0;
}

.checkbox.RED{
	color: red;
}

.box-body{
	overflow: auto;
}

a:hover, a:active, a:focus {
    color: #e60000;
}

body > .header .navbar {
    margin-left: 300px;
}

body > .header .logo {
    width: 300px;
}

.app-container{
	display:inline-block;
	margin-bottom: 35px;
}

.app{
	position:relative;
	min-width: 150px;
	width: 8%;
	display: inline-block;
	vertical-align: top;
	margin: 10px 10px 0px 0px;
}

.app:hover{
	background-color:#eee;
	cursor:pointer;
}

.app:hover .app-name{
	color:#e60000;
}

.app .app-helper{
	display:none;
}

.app-image{
	min-height:150px;
	position:relative;
}

.app-image img{

	padding:8px;
	max-height: 100%;  
    max-width: 100%; 
    height: auto;
    position: absolute;  
    top: 0;  
    bottom: 0;  
    left: 0;  
    right: 0;  
    margin: auto;
}

.app-name{
	padding: 6px 7px 13px 7px;
	min-height: 59px;
	text-align: center;
	font-size: 1.2em;
}

.app-name span{
	display: inline-block;
	vertical-align:middle;
}

.box-app{
	text-align:left;
}

.app.disable{
	position:relative;
}

.app.disable .app-image img{
	filter: gray; /* IE6-9 */
	filter: grayscale(1); /* Firefox 35+ */
	-webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
	
	opacity: 0.4;
    filter: alpha(opacity=40);
}

.app.disable .app-name{
	opacity: 0.4;
    filter: alpha(opacity=40);
}

.app.disable:hover .app-helper{
	display:block;
	background-image: url("../img/app-disable.png");
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    width: 100%;
    height: 150px;
    z-index: 999;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
	background-color:transparent;
}

/*
.app.tips:hover .app-helper{
    display: block;
    background-color: #eee;
    color: #333;
    position: absolute;
    width: 160%;
    height: auto;
    z-index: 999;
    margin: auto;
    top: 132px;
    left: 70px;
    text-align: left;
    padding: 7px 8px;
	-webkit-box-shadow: 9px 10px 15px 0px rgba(191,191,191,1);
	-moz-box-shadow: 9px 10px 15px 0px rgba(191,191,191,1);
	box-shadow: 9px 10px 15px 0px rgba(191,191,191,1);
}*/


.app-info{
	display:none;
	width: 22px;
	height: 22px;
	top: -7px;
	right: -8px;
	position: absolute;
	cursor:pointer!important;
	z-index:99999;
	 -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform;
    transition-property: transform;
}

.app-info:hover{
	transform: scale(1.1)
}

.app-info img{
	width:100%;
}

.app-container.info-on .app:hover .app-info{
	display:block !important;
	opacity: 1!important;
}


#disable-apps-row{
	display:block;
}

.switcher{
	display:block;
	float:right;
	margin: 10px 9px 0px 6px;
}

.switcher-container{
	
}

.question,
.switch{
	float:left;
	margin-top: 3px;
}

.question{
	min-width: 157px;
	padding-top: 5px;
	color: #8A8A8A;
	font-size: 95%;
}

.switch{

}

/* ============================================================
  COMMON
============================================================ */
#wrapper {
  min-width: 600px;
}

.wrapper {
    overflow-x: initial;
    overflow-y: initial;
}

.settings {
  display: table;
  width: 100%;
}
.settings .row {
  display: table-row;
}
.settings .question,
.settings .switch {
  display: table-cell;
  vertical-align: middle;
  padding: 10px;
}
.settings .question {
  width: 600px;
  font-family: "Roboto Slab", serif;
  font-size: 20px;
}


.white-popup {
  position: relative;
  background: #FFF;
  padding: 20px;
  width: auto;
  max-width: 500px;
  margin: 20px auto;
}

.white-popup h4{
	margin-top:18px;
}

/* ============================================================
  COMMON
============================================================ */
.cmn-toggle {
  position: absolute;
  margin-left: -9999px;
  visibility: hidden;
}
.cmn-toggle + label {
  display: block;
  position: relative;
  cursor: pointer;
  outline: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* ============================================================
  SWITCH 1 - ROUND
============================================================ */
input.cmn-toggle-round + label {
  padding: 2px;
  width: 39px;
  height: 21px;
  background-color: #dddddd;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  -ms-border-radius: 60px;
  -o-border-radius: 60px;
  border-radius: 60px;
}
input.cmn-toggle-round + label:before, input.cmn-toggle-round + label:after {
  display: block;
  position: absolute;
  top: 1px;
  left: 1px;
  bottom: 1px;
  content: "";
}
input.cmn-toggle-round + label:before {
  right: 1px;
  background-color: #f1f1f1;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  -ms-border-radius: 60px;
  -o-border-radius: 60px;
  border-radius: 60px;
  -webkit-transition: background 0.4s;
  -moz-transition: background 0.4s;
  -o-transition: background 0.4s;
  transition: background 0.4s;
}
input.cmn-toggle-round + label:after {
  width: 20px;
  background-color: #fff;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  -ms-border-radius: 100%;
  -o-border-radius: 100%;
  border-radius: 100%;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  -webkit-transition: margin 0.4s;
  -moz-transition: margin 0.4s;
  -o-transition: margin 0.4s;
  transition: margin 0.4s;
}
input.cmn-toggle-round:checked + label:before {
  background-color: #8ce196;
}
input.cmn-toggle-round:checked + label:after {
  margin-left: 17px;
}



/*Login Page++++++++++++++++++++++++++++++++++++++++++++++++*/

.login-option{
    margin-top: 16px;
    margin-left: 1px;
}

.login-option a{
	display:block;
	margin-bottom:4px;
}


.login-option a i{
	min-width: 15px;
}


#register-box{
	display:none;
	width: 720px;
	margin-bottom: 120px;
}

#register-box .header{
	padding: 20px 0 0;
	background: #fff !important;
}

#register-box .register-text{
	color: #e60000;
}

#register-box .register-section{
	overflow: hidden;
}

#register-box .register-section .register-option h4{
	margin-top:1px;
	margin-bottom: 14px;
}

#register-box .register-section .register-option.newsletter{
	margin-top:66px;
}

#register-box .register-form,
#register-box .register-option{
	float:left;
}

#register-box .register-form{
	width:360px;
	margin-right:30px;
}

#register-box .register-option{
	width:290px;
}

#register-box .register-form .info{
	margin-top:5px;
	margin-left:1px;
	font-size:10px;
}

#register-box .register-form select.form-control{
	font-size:12px !important;
	color:#999;
	padding: 6px 7px;
}

#register-box .oder-break{
	margin-bottom:1em;
}

#register-flow ul{
    margin: 0;
    padding: 9px 0 0;
    list-style-type: none;
    text-align: center;
    margin-top: 17px;
    font-size: 14px;
    background-color: #e60000;
	
	display:table;
    width:100%;
}

#register-flow ul li {
	display:table-cell;
	padding: 8px 7px 5px;
	width: 25%;
}

#register-flow ul li.active {
	background-color:#EAEAEC;
	color:#333;
	font-weight:bold;
	border-radius: 6px 6px 0 0;
}

#register-flow ul li a
{
	text-decoration: none;
	padding: .2em 1em;
	color: #fff;
	background-color: #036;
}

#register-flow ul li a:hover
{
	color: #fff;
	background-color: #369;
}


#register-user-role input[type=checkbox] {
	position: absolute;
	margin-left: -9999px;
	visibility: hidden;
}

#register-user-role .register-button{
	cursor:pointer;
	padding: 10px 3px;
	border: 3px solid #fff;
	margin-bottom:18px;
	text-align:center;
	min-height:54px;
}

#register-user-role .register-button,
#register-user-role .register-button label{
	cursor:pointer;
	font-weight: normal;
}

#register-user-role .register-button label{
	margin:0;
}

#register-user-role .register-button.checked
{
	color:#fff;
	background-color:#909090;
}

#register-user-role .register-button:hover
{
	color:#fff;
	background-color:#e60000;
}

#register-user-role #register-extern-user,
#register-user-role #register-special-user,
#register-user-role #register-sales-user,
#register-user-role #register-kabel-user{
	padding-top:15px;
}


#field-extern-user,
#field-partner-user,
#field-special-user,
#field-kabel-user{
	display:none;
}

#register-box .general-info,
#register-box .personal-info,
#register-box .setting-info,
#register-box .confirmation{
	margin-top:20px;
}

#register-box .personal-info,
#register-box .setting-info,
#register-box .confirmation{
	display:none;
}


.register-option .checkbox,
.register-form .checkbox
{
	margin-left: 30px;
}

.register-option .checkbox input,
.register-form .checkbox input
{
	 margin-top: 1px;
}

.register-option h2{
    font-size: 17px;
    margin-top: 0;
    margin-bottom: 20px;
}

.setting-info .app-request h2{
    font-size: 17px;
}

.setting-info .register-form{
	margin-top:2px;
}
 

.setting-info .register-form .app-request{
	margin-top:30px;
	margin-bottom: 35px;
}

.setting-info .setting-end{
	clear:both;
	border-top: 1px dashed #CFCFCF;
	padding-top: 27px;
	overflow: auto;
}
 
.personal-info .register-option{
	margin-top: 105px;
}

#register-box .confirmation .form-intro {
    text-align: center;
}

#register-box .email-from-general-info{
	margin: 8px 0 14px;
    background-color: #EAEAEC;
    padding: 6px 12px;
    font-size: 14px;
    border: 1px solid #CCC;
    color: #999;
	cursor:default;
}


/*Admin Section++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

.admin th.apps{
	width:34%;
}

.admin th.action{
	width:18%;
}

.admin .box-footer {
    border-top: 1px solid #C7C7C7;
}

.admin .footer-container {
    height:35px;
}


.btn.btn-danger {
    background-color: #eb0000;
    border-color: #eb0000;
}

.btn.btn-danger:hover, .btn.btn-danger:active, .btn.btn-danger.hover {
    background-color: #D80000;
}

.btn.btn-default {
  background-color: #fafafa;
  color: #666;
  border-color: #ddd;
  border-bottom-color: #ddd;
}
.btn.btn-default:hover,
.btn.btn-default:active,
.btn.btn-default.hover {
  background-color: #f4f4f4;
}

.admin .apps-selection{
    margin-left: 12px;
    margin-top: 18px;
}

.admin .apps-selection input[type=checkbox]{
    margin-top: 1px;
}

.admin .user-section span.infotext{
    min-width:167px;
	display: inline-block;
}

.admin .user-section span.colon{
	padding: 0 12px 0 3px;
	display: inline-block;
}

.admin .user-section{
	margin-top: 12px;
}

.admin td.action .fa{
	font-size:1.5em;
	margin-top: -4px
}

.admin td.action .btn{
	margin: 14px 0;
}

.admin .action-confirmation,
.admin .action-confirmation .apps-confirm,
.admin .action-confirmation .apps-deny,
.admin .user-section .vonumber,
.admin .user-section .email-contact-person,
.admin .user-section .company{
	display:none;
}

.admin .box-footer .footer-container button{
	margin-right:19px;
}

.admin .box-footer .footer-container button:first-child{
	margin-right:8px;
}


 .form-box .footer {
	background: #EAEAEC;
}


.callout {z-index:20;position:absolute;border:0;top:-14px;left:120px;}
    
/*CSS3 extras*/
a.tooltipimc span
{
    border-radius:2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    opacity: 0.9;
}


.alertify-message{
   text-align:left;
}

.box .box-body .row{
    margin: 0 -5px;
}


.content{
	background:#fff;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    color: #333;
    font-family: "Vodafone", Arial, sans-serif;
}
h1{
    font-size: 30px;
    line-height: 32px;
	color:#e60000;
}
h2, .h2 {
    font-size: 22px;
    line-height: 25px;
	font-weight:lighter;
}

a {
    color: #4a4d4e;
}

a:hover, a:active, a:focus {
    color: #4a4d4e;
}

body > .header{
	margin: 0 auto;
    width: 100%;
    padding: 0 10px;
}


body > .header.fullpage {
    max-width: 88%;
    margin: 0 auto;
	width:100%;
}

body > .header .navbar {
    margin-bottom: 0;
    margin-left: 0;
	justify-content: flex-end;
}
a:visited, .link:visited, .link-big:visited, .link-body:visited {
    color: #333;
}

a.btn {
	color: #fff;
}

/*.btn:focus, .btn:visited {
    color: #fff;
}*/

.btn {
    -webkit-tap-highlight-color: transparent;
    -webkit-tap-highlight-color: transparent;
    outline: 0;
	-moz-appearance: none;
    -webkit-appearance: none;
    background: #9c2aa0;
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(50,50,50,0.6);
    color: #fff;
    display: inline-block;
    font-size: 14px;
    font-family: "Vodafone", Arial, sans-serif;
    font-weight: bold;
    margin: 0 6px 10px 0;
    padding: 8px 15px;
    text-align: center;
    line-height: 16px;
    width: 100%;
    border: 1px solid transparent;
}

/*.btn:hover, .btn:focus {
    background: #5e2750;
	color:#fff;
    text-decoration: none;
}*/

.btn.btn-default:hover, .btn.btn-default:focus, .btn.btn-primary:hover, .btn.btn-primary:focus {
	background: #5e2750;
	color:#fff;
    text-decoration: none;
}

a.btn:hover,a.btn:active,a.btn:focus{
	color:#fff;
}

.info-icon{
	width: 16px;
    height: 16px;
    margin: -16px 10px 0 6px;
    cursor: pointer;
}

.info-popout .info-icon{
	margin:0;
	margin-right: 7px;
}

.info-section{
	position:relative;
	display: inline-block;
	min-width: 434px;
}

.info-popout{
    display: none;
    background: #f0f7f9;
    border: 1px solid #007c92;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    font-weight: normal;
    margin-bottom: 15px;
    margin-top: 10px;
    padding: 11px 34px 10px 44px;
    min-height: 52px;
    position: absolute;
    left: 45px;
    top: -4px;
    text-indent: -30px;
	z-index:99;
}

#login-box .btn,
#register-box .btn{

}
.login-logo{
	margin: 0 auto;
}

.login-logo img{
	width:100%;
}

.login-btn{
	color:#fff;
}

#login-box{
	margin: 40px auto 0;
}

#register-box{
	margin: 0 auto;
}

#login-box .body{
	-moz-border-radius: 2px 2px 0 0;
    -webkit-border-radius: 2px 2px 0 0;
    border-radius: 2px 2px 0 0;
	
	padding: 20px 20px 1px;
}

#login-box .footer{
	-moz-border-radius: 0 0 2px 2px;
    -webkit-border-radius: 0 0 2px 2px;
    border-radius: 0 0 2px 2px;
	
	padding-bottom:20px;
	padding-top: 2px;
}

#login-box .body, #login-box .footer {
    background: #f4f4f4;
}

#login-box{
	width:100%;
	box-shadow: 0 1px 3px rgba(50,50,50,0.6);
    border: 1px solid #e9e9e9;
}

#login-box .form-group > input{
	border: 0;
    border-radius: 3px !important;
    -moz-appearance: none;
    -webkit-appearance: none;
    box-shadow: 0 1px 3px rgba(50,50,50,0.6) inset;
    border: 1px solid #e9e9e9;
    font-size: 14px;
	line-height: 14px;
    padding: 10px;
    width: 100%;
	max-width:600px;
}

#login-box .body > .form-group, #login-box .footer > .form-group {
    margin-top: 0px;
}

#login-box .header{
	background: #fff;
	padding: 8px 20px;
	text-align:left;
	border-radius: 3px 3px 0 0;
    box-shadow: 0 1px 3px rgba(50,50,50,0.3);
	border: none;
	margin-bottom: 2px;
}

#login-box .header h3{
	font-size: 16px;
    font-weight: normal;
    padding: 4px 20px 2px 0;
    margin: 0;
	line-height: 30px;
}

#login-box label{
    display: block;
    font-weight: bold;
    padding: 0 0 5px;
}

#login-box .login-selection{
    margin-top: 30px;
	position:relative;
}

#login-box .login-selection .info-icon{
	margin: -9px 10px 0 7px;
}

#login-box .login-selection .info-popout .info-icon{
	margin:0;
	margin-right: 7px;
}

#login-box .login-selection .info-popout{
    background: #f0f7f9;
    border: 1px solid #007c92;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    font-weight: normal;
    margin-bottom: 15px;
    margin-top: 10px;
    padding: 11px 34px 10px 44px;
    min-height: 52px;
    position: absolute;
    left: 230px;
    top: -20px;
    text-indent: -30px;
}

#login-box .login-selection:last-child{
    margin-top: 2px;
	margin-bottom:20px;
}

#login-box .login-selection .btn{
    min-width:175px;
}

#login-box input[type="submit"].btn-block,
#login-box input[type="reset"].btn-block,
#login-box input[type="button"].btn-block {
    width: inherit;
}

.btn-in-form{
	text-align: center;
    color: #fff;
    background-color: #4a4d4e;
    padding: 8px;
	margin-bottom:10px;
	cursor:pointer;
}

.btn-in-form label{
    font-weight: normal;
	cursor:pointer;
}

#content-body{
	max-width:960px;
	margin: 0 auto;
}
#content-body.fullpage{
	max-width: 88%;
}


#logo {
    position: relative;
    margin: 0 -10px 20px;
}

#logo .logo {
    position: absolute;
    top: 5px;
    left: 10px;
    width: 36px;
    height: 36px;
    background-color: #fff;
    border-radius: 18px;
    z-index: 10;
}


#navigation .nav-user a{
	font-weight: bold;
	font-size: 12px;
	padding: 7px 10px 3px 10px;
}

#navigation .nav-user li.user-footer a {
    padding: 8px;
}

#navigation .nav-user .user-menu .user-header{
	background:#fff;
	height: auto;
}

#navigation .nav-user .user-menu .user-footer .btn{
	margin: 3px 0;
}

.navbar-nav > .user-menu > .dropdown-menu > li.user-footer {
    background-color: #fff;
}

.nav>li>a:hover, .nav>li>a:focus {
    text-decoration: underline;
    background-color: transparent;
}

.navbar-nav>li>a.dropdown-toggle {
    padding-top: 15px;
}
	
#navigation .nav-user .user-header .user-avatar{
    font-size: 57px;
    text-align: left;
    margin: 5px 11px;
    border-right: 1px solid #adabab;
    float: left;
    padding-right: 21px;
    height: 75px;
}

#navigation .nav-user .user-header .user-avatar i{
    margin-top:8px;
}

#navigation .nav-user .user-header .user-name{
	font-size: 19px;
	padding-top: 13px;
}

#navigation .nav-user .user-header .user-info{
	
}

#navigation .nav-user .user-footer a{
	font-weight:normal;
}

#navigation .nav-user .user-footer i{
	margin-right:2px;
}

.nav-primary{
	background: #e60000;
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(50,50,50,0.6);
    margin: 0;
    position: relative;
}

.nav-menu{
	display: table;
	outline: none;
}

.nav-menu li {
    position: relative;
    border: 0;
    margin: 0;
	padding: 0;
    display: table-cell;
    border-left: 1px solid #ffffff;
    overflow: visible;
	height: 43px;
}


.nav-menu li:before {
    position: absolute;
    top: 0px;
    left: -1px;
    content: " ";
    width: 1px;
    height: 5px;
    background-color: #e60000;
}

.nav-menu li:after {
    position: absolute;
    bottom: 0px;
    left: -1px;
    content: " ";
    width: 1px;
    height: 5px;
    background-color: #e60000;
}


.nav-menu>li:hover {
    background-color:#f4f4f4;
	position: relative;
    z-index: 110;
    box-shadow: 0 1px 1px #eeeeee;
	
	cursor:pointer;
}


.nav-menu a {
	display:block;
    color: #fff;
    font: normal 18px/22px 'Vodafone', Arial, sans-serif;
    padding: 10px 12px 10px 18px;
    text-decoration: none;
    margin-bottom: -50px;
}


.nav-menu .btn-group.open .dropdown-toggle {
    -webkit-box-shadow: none;
    box-shadow: none
}


.nav-menu a.dropdown-toggle {
	margin-top:-24px;
}


.nav-menu .nav-content a {
    font: normal 16px/20px 'Vodafone', Arial, sans-serif;
}


.nav-content>li>a>.fa {
    margin-right: 5px;
	position:absolute;
	top: 12px;
	left: 15px;
}


.nav-menu .nav-content li a{
    padding: 10px 14px;
	margin:0;
	margin-left: 27px;
}

.nav-menu .nav-content{
	padding: 0;
	margin-top: 0px;
	background: #f4f4f4;
}

.nav-menu .nav-content li {
    position: relative;
    border: 0;
    margin: 0;
	padding: 0;
    display: inline-block;
    border-left: none;
    overflow: initial;
	height: auto;
}

.nav-content>li>a:hover {
    background-color: transparent;
	text-decoration:underline;
    color: #333;
}

.nav-menu li:first-child {
    border-radius: 3px 0 0 3px;
    border-left: 0;
}


.nav-menu .nav-content li:before,
.nav-menu .nav-content li:after,
.nav-menu li:first-child:before,
.nav-menu li:first-child:after {
    background-color: transparent;
}




.nav-primary h3{
    color: #fff;
    font-size: 18px;
    line-height: 44px;
    padding: 0 20px;
    position: relative;
	text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}



.box .box-header h2.box-title{
	font-size: 22px;
	line-height: 25px;
	font-weight:lighter;
	padding-left: 18px;
	padding-top: 17px;
}

.box-header {
    padding: 0;
	padding-bottom:10px;
}

.box{
	margin-top: 5px;
	margin-bottom: 37px;
    box-shadow: 0 1px 3px rgba(50,50,50,0.6);
    border: 1px solid #e9e9e9;
}


table.dataTable tbody th, table.dataTable tbody td {
    padding: 4px 10px;
}

table .btn{
	margin: 0;
	max-width:120px;
}

table.dataTable tbody th, table.dataTable tbody td {
    vertical-align: middle !important;
}

#logo .vodafone-logo {
    left: 10px;
    position: absolute;
    z-index: 10;
}

#logo .vodafone-logo img {
    margin-top: 5px;
    width: 35px;
}

#logo .logo .vf-icon-inner {
    position: relative;
    top: -4px;
    left: -3px;
    width: 67px;
    height: 67px;
}

#logo .logo .vf-icon-inner, #logo .logo .vf-icon-inner .st0, #logo .logo .vf-icon-inner [fill] {
    color: #fff;
    fill: #fff;
}


.alertify, .alertify-log {
    font-family: "Vodafone",Arial,Helvetica,sans-serif;
}

.footer-version{
	width: 100%;
    left: 0;
    background-color: white;
    bottom: 0;
    padding: 5px;

}




/*Media Queries +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/


@media only screen and (max-width: 309px){
	#login-box .login-selection .info-icon {
		margin-left: 3px;
	}
	#login-box .login-selection .info-popout {
		left: 0px;
		top: -113px;
		right: 0px;
	}
}


@media only screen and (max-width: 363px){
	.info-popout{
		left: 40px;
		top: 0px;
	}
}


@media screen and (max-width: 370px) {
	.app{
		display:inline-block;
		width:100%;
		margin: 10px auto;
	}
	.app-image img{
		padding:12px;
	}
	.app-name{
		padding: 12px;
	}
}


@media only screen and (max-width: 452px){
	.btn {
		width: 75%;
	}
}


@media only screen and (max-width: 500px){
	.info-popout{
		top: 35px;
	}
}


@media only screen and (max-width: 528px){
	.btn {
		width: 89%;
	}
}


@media only screen and (max-width: 555px){
	.info-popout{
		left:0;
	}
}


@media screen and (max-width: 560px) {
	body > .header .logo,
	body > .header .navbar {
		width: 100%;
		float: none;
		position: relative!important;
	}
	body > .header .navbar {
		margin: 0;
		margin-left:0;
	}
	body.fixed > .header {
		position: fixed;
	}
	body.fixed > .wrapper,
	body.fixed .sidebar-offcanvas {
		margin-top: 100px!important;
	}
	.vodafone-logo {
		text-align: center;
	}
}


@media only screen and (max-width: 579px){
	.btn {
		width: 90%;
	}
}


@media only screen and (max-width: 586px){
	.btn {
		width: 88%;
	}
}


@media only screen and (max-width: 599px){
	.btn {
		width: 91%;
	}
	#login-box .login-selection .info-popout{
		left: 0px;
		top: -20px;
		right: 85px;
	}
}


@media only screen and (min-width: 600px){
	.btn {
		width: auto;
		font-size: 14px;
		padding: 8px 15px;
	}
	.btn-block {
		width: 100%;
	}
	body > .header{
		padding: 0 8px;
	}	
}


@media only screen and (max-width: 756px){
	.info-section{
		min-width: auto;
	}
}


@media only screen and (min-width: 768px){
	.navbar-right {
		margin-right: 2px;
	}
	.nav-menu {
		background: transparent;
		border-radius: 3px 0 0 3px;
		border-top: 0;
	}
	
	.nav-content {
		background: #f4f4f4;
		border-radius: 0 3px 5px 5px;
		left: 0;
		position: absolute;
		z-index: 100;
		box-shadow: 0 1px 3px rgba(50,50,50,0.6);
		border: 1px solid #e9e9e9;
		border-top: 1px solid #f4f4f4;
	}
	
	#logo{
		position: relative;
		padding: 0 0 0 68px;
		margin-left: 0;
		margin-right: 0;
		margin-bottom: 0;
	}
		
	#logo .logo {
		top: 33px;
		left: -2px;
		width: 50px;
		height: 50px;
		background-color: #e60000;
		border-radius: 25px;
	}
	
	.nav-menu>li:hover a {
		color: #000;
		border-left-color: transparent;
	}
	
	.nav-menu>li:hover .nav-content>li>a {
		color: #777;
	}
	
	.nav-menu>li:hover .nav-content>li:hover>a {
		color: #000;
	}
	
	.nav-menu li:hover .nav-content>li:hover:after {
		background-color: transparent;
	}
	
	.nav-menu li:hover:before {
		background-color: #ffffff;
	}
	
	.nav-menu li:hover:after {
		background-color: #ffffff;
		width: 1px;
		height: 100%;
		left: auto;
		right: -1px;
	}
	
	.nav-menu li:hover:first-child {
		box-shadow: 0 1px 1px #eeeeee;
		border-radius: 3px 0 0 0;
	}
	
	.nav-menu li:first-child:before {
		background-color: transparent;
	}
	
}


@media only screen and (max-width: 767px){
	#navigation .nav-menu{
		margin-top:53px;
	}
	#login-box {
		width: 100%;
	}
	.navbar .navbar-right {
		float: right;
		margin-right: 19px;
	}
	.navbar-nav > .notifications-menu > .dropdown-menu, .navbar-nav > .user-menu > .dropdown-menu, .navbar-nav > .tasks-menu > .dropdown-menu, .navbar-nav > .messages-menu > .dropdown-menu {
		position: absolute;
		top: 100%;
		right: 0;
		left: auto;
		border-right: 1px solid #dddddd;
		border-bottom: 1px solid #dddddd;
		border-left: 1px solid #dddddd;
		background: #ffffff;
	}
}


@media only screen and (min-width: 1025px){
	h1, .h1{
		font-size: 45px;
		line-height: 50px;
	}
	h2, .h2 {
		font-size: 30px;
		line-height: 34px;
	}
	
	#logo{
		padding: 0 0 0 28px;
	}
	
	#logo .logo {
		left: -42px;
	}

	body > .header{
		padding: 0 16px;
		max-width: 960px;
	}	
}


@media only screen and (min-width: 1072px){}
	#logo .logo {
		top: 28px;
		left: -62px;
		width: 60px;
		height: 60px;
		border-radius: 30px;
	}
}


@media only screen and (min-width: 1085px){
	#logo .vodafone-logo {
		left: -72px;
	}
	#navigation{
		margin-left:0;
	}
}


@media only screen and (min-width: 1128px){
	#logo{
		padding: 0;
	}
	
	#logo .logo {
		left: -90px;
	}
}

@media only screen and (max-width: 1360px){
	.dropdown-menu{
		left:auto;
		right:0;
	}
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
/* IE10+ specific styles go here */ 
	.nav-menu li {
		height: 43px;
	}
}
























#slidercontrol {
	margin-left: 17px;
}
#slidercontrol .slider-selection, #slidercontrol .slider-tick.in-selection {
	background: #c00000;
}
#slidercontrol .slider-handle {
	background: #e60000;
}
#slidercontrol.slider-disabled .slider-selection, #slidercontrol .slider-tick.in-selection {
	background: #cdcccc;
}
#slidercontrol.slider-disabled .slider-handle {
	background: #808080;
}
#timeslot_table .timeslot_cell, #weekday_table .weekday_cell {
	display: inline-block;
	width: 80px;
	padding: 6px;
	margin: 3px 3px 3px 0;
	border: 1px solid #808080;
	text-align: center;
	cursor: pointer;
	font-size: 14px;
	background-clip: border-box;
}
#weekday_table .weekday_cell.disabled {
	display: inline-block;
	width: 80px;
	padding: 6px;
	margin: 3px 3px 3px 0;
	border: 1px solid #808080;
	text-align: center;
	cursor: not-allowed;
	background-color: #808080;
}
#timeslot_table .timeslot_cell.selected, #weekday_table .weekday_cell.selected {
	background-color: #e60000;
	color: #ffffff;
}
#timeslot_table .timeslot_cell.highlight {
	font-weight: bold;
	border: 3px solid #808080;
}
#weekday_table .weekday_cell.selected.disabled {
	background-color: #808080;
	color: #ffffff;
	cursor: not-allowed;
}

nav .nav .btn-group.open > a, nav .nav .btn-group.open > a:focus, nav .nav .btn-group.open > a:hover {
	background-color: transparent;
}
nav .nav .btn-group.open .dropdown-toggle {
	-webkit-box-shadow: none;
	box-shadow: none;
}
a.fc-event {
	border: 1px solid #000 !important;
}
a.apm_business {
	background-color: #3a87ad;
}
a.apm_service {
	background-color: #489e24;
}
a.apm_beratung {
	background-color: #b2600e;
}
a.apm_tv {
	background-color: #7b757c;
}
a.apm_blocker {
	background-color: #7c7975;
}

.form-group label {
	font-weight: bold;
}

#onlinebooking_urls thead tr {
    display: block;
    position: relative;
}

#onlinebooking_urls tbody {
    display: block;
    overflow: auto;
    width: 100%;
    height: 263px;
}

#onlinebooking_urls {
    table-layout: fixed;
}

#onlinebooking_urls td:nth-child(1),
#onlinebooking_urls th:nth-child(1) {
    width: 81px;
}

#onlinebooking_urls td:nth-child(2),
#onlinebooking_urls th:nth-child(2) {
    min-width: 388px;
}

#onlinebooking_urls td:nth-child(3),
#onlinebooking_urls th:nth-child(3) {
    width: 110px;
}

div.dataTables_scrollBody {
	overflow: unset !important;
}

table.dataTable thead .sorting {
	background-image: none !important;
}

table.dataTable thead .sorting_asc {
	background-image: none !important;
}

table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:after {
	display: none;
}

table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_asc:after {
	display: none;
}

table.dataTable thead .sorting_desc {
	background-image: none !important;
}

button.ui-datepicker-current {
	display: none;
}

#pastAppointmentDateSearch {
	float: left;
	position: relative;
}

#tableDate {
	border-width: 1px;
	width: 129px;
	height: 30px;
	border-color: #d2d6de;
	border-style: solid;
}

#tableDateClear {
	position: absolute;
	right: 5px;
	z-index: 10;
	padding: 5px 0;
}

div.dataTables_filter input {
	border: 1px #d2d6de black;
}

#pastAppointmentList_filter {
	float:left!important;
}

div.dataTables_wrapper div.dataTables_processing {
	z-index: 100;
	background-color: red !important;
	top: 50px;
	left: 0;
	right: 0;
	bottom: 0;
	margin: 0 auto;
	background: none;
	color: white;
	font-size: 22px;
	font-weight: bold;
	padding-bottom: 35px;
	padding-top: 10px;
}

#appointmentList {
	border-bottom: black;
	border-bottom-style: solid;
}

.modalfade {
	animation: fadeIn 0.5s;
	-moz-animation: fadeIn 0.5s; /* Firefox */
	-webkit-animation: fadeIn 0.5s; /* Safari and Chrome */
	-o-animation: fadeIn 0.5s; /* Opera */
}

@keyframes fadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@-moz-keyframes fadeIn { /* Firefox */
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@-webkit-keyframes fadeIn { /* Safari and Chrome */
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@-o-keyframes fadeIn { /* Opera */
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.no-underline {
	text-decoration: none;
}

#appointmentDetailsTable > *:first-child:not(thead) td:first-child {
	font-weight: bold;
	width:250px;
}