@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:400,300);
html,body
{
	width:100%;
	margin:0px;
	padding:0px;
}
body{
	font-family: 'Roboto Condensed', sans-serif;
	min-width:0;
	color:#444;
	line-height:1.4em;
	color: rgb(62,61,57);
	font-size: 16px;
	padding-top: 0px;
	text-rendering: optimizeLegibility;
	background:#F1F1F1;
}
body.front-page{
	background:#0070ba;
}
#desktop-page{
	display:block;
}
.desktop{
	display:block;
}
.mobile{
	padding:10px;
	display:none;
}
#mob-page{
	display:none;
}
.white-color{
	color:#FFF;
}
.white-box{
	background:#FFFFFF;
}
.white-box div.header{
	border-bottom:1px solid #F1F1F1;
	padding:10px;
	font-weight:bold;
}
.white-box div.content{
	padding:10px;
}
.underline-white{
	border-bottom: 6px solid #FFF;
}
.step{
	padding:10px;
	font-weight:bold;
	background: #E0E0E0;
	background: linear-gradient(-180deg,#E0E0E0 0,#FBFBFB 45%);
	border: 1px solid #e9e9e9;
	color: #9a9a9a;
	box-shadow: 0 0 6px 0 rgba(116,116,116,.09);
}
.shadowless-step{
	padding:10px;
	font-weight:bold;
	background: #F0F0F0;
	border: 1px solid #e9e9e9;
	color: #9a9a9a;
}
.center-content{
	width:80%;
	margin-left:auto;
	margin-right:auto;
}
.step-header-left{
	width:7%;
}
.step-header-right{
	width:92%;
}
.rect-btn{
	border-radius: 0px !important;
	font-size: 16px !important;
	min-width: 100px;
	padding: 5px !important;
	min-width:100px;
}
.inactive-success{
	padding: 4px;
	border-radius: 10px;
	border: 1px solid black;
	font-size: 10px;
	margin-right: 10px;
}
.active-success{
	padding: 4px;
	border-radius: 10px;
	border: 1px solid green;
	font-size: 10px;
	margin-right: 10px;
	background:black;
	color:#FFFFFF;
}
input[type='search']:hover, input[type='submit']:hover, input[type='button']:hover, button:hover,.button:hover  {
    opacity: 0.75;
}
input[type='search'], input[type='submit'], input[type='button'], button,.button {
    display: inline-block;
    padding: 0px 12px;
    margin-bottom: 0px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    background: #0070ba;
    color: #fff;
    border: 1px solid transparent;
    border-radius: 30px;
    opacity: 1;
    -moz-user-select: none;
}
TextArea{
	border: 1px solid #F1F1F1;
	padding: 5px;
	width:98%;
}
button, html input[type='button'], input[type='reset'], input[type='submit'],.button {
    -webkit-appearance: button;
    cursor: pointer;
}
input, select {
    margin: 1px;
        margin-bottom: 1px;
    padding: 3px 5px;
}
button, input, select[multiple], textarea,.button {
    background-image: none;
}
input, button, select, textarea,.button {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}
button, input,.button {
    line-height: normal;
}
button, input, select, textarea,.button {
    font-family: inherit;
    font-size: 100%;
    margin: 0;
}
a.button:hover{
	color:#FFF;
}
input[type='text'], input[type='password'] {
    border: 1px solid #F1F1F1;
	display: block;
    width: 98.5%;
    padding: 4px 4px;
    font-size: 14px;
    line-height: 1.42857;
    color: #555;
    vertical-align: middle;
    background-color: #FFF;
    background-image: none;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
}
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;
	vertical-align:baseline
}
sup {font-size:xx-small; vertical-align:super;}
ol,ul{list-style:none}table{border-collapse:collapse;border-spacing:0}caption,th,td{text-align:left;font-weight:normal;vertical-align:middle}
q,blockquote{quotes:none}q:before,q:after,blockquote:before,blockquote:after{content:'';content:none}
a:hover, a:focus {
    color: #BA1851;
}
.clear{clear:both;width:100%;}
a {
    text-decoration: none;color: rgb(62,61,57);
}
.centered-div{
	margin-left:auto;
	margin-right:auto;
}
a.link:hover{
	text-decoration:underline;
}
* {margin: 0; padding: 0;}
.tree ul {
	padding-top: 20px; position: relative;
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
}
.tree li {
	float: left; text-align: center;
	list-style-type: none;
	position: relative;
	padding: 20px 5px 0 5px;			
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
}
/*We will use ::before and ::after to draw the connectors*/
.tree li::before, .tree li::after{
	content: '';
	position: absolute; top: 0; right: 50%;
	border-top: 1px solid #ccc;
	width: 50%; height: 20px;
}
.tree li::after{
	right: auto; left: 50%;
	border-left: 1px solid #ccc;
}
/*We need to remove left-right connectors from elements without 
	any siblings*/
	.tree li:only-child::after, .tree li:only-child::before {
	display: none;
}
/*Remove space from the top of single children*/
.tree li:only-child{ padding-top: 0;}
/*Remove left connector from first child and 
right connector from last child*/
.tree li:first-child::before, .tree li:last-child::after{
	border: 0 none;
}
/*Adding back the vertical connector to the last nodes*/
.tree li:last-child::before{
	border-right: 1px solid #ccc;
	border-radius: 0 5px 0 0;
	-webkit-border-radius: 0 5px 0 0;
	-moz-border-radius: 0 5px 0 0;
}
.tree li:first-child::after{
	border-radius: 5px 0 0 0;
	-webkit-border-radius: 5px 0 0 0;
	-moz-border-radius: 5px 0 0 0;
}
/*Time to add downward connectors from parents*/
.tree ul ul::before{
	content: '';
	position: absolute; top: 0; left: 50%;
	border-left: 1px solid #ccc;
	width: 0; height: 20px;
}
.tree li a{
	border: 1px solid #ccc;
	padding: 5px 10px;
	text-decoration: none;
	color: #666;
	font-family: arial, verdana, tahoma;
	font-size: 11px;
	display: inline-block;			
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;			
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
}
/*Time for some hover effects*/
/*We will apply the hover effect the the lineage of the element also*/
.tree li a:hover, .tree li a:hover+ul li a {
	background: #c8e4f8; color: #000; border: 1px solid #94a0b4;
}
/*Connector styles on hover*/
.tree li a:hover+ul li::after, 
.tree li a:hover+ul li::before, 
.tree li a:hover+ul::before, 
.tree li a:hover+ul ul::before{
	border-color:  #94a0b4;
}
a img{border:none}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary{display:block}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}
audio,canvas,video{display:inline-block}
audio:not([controls]){display:none;height:0}[hidden]{display:none}
body{margin:0}
/* Buttons */
input[type='search'],input[type='submit'],input[type='button'],button {
    display: inline-block;
    margin-bottom: 0px;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
	background:#0070ba;
	font-weight:bold;
	color:#fff;
    border: 1px solid transparent;
    border-radius: 10px;
	opacity:1;
    -moz-user-select: none;
	outline:none;
}
.hide-long-text{
	text-overflow: ellipsis;white-space: nowrap;overflow: hidden; 
}
a.underline{
	text-decoration:underline;
}
input[type='search']:hover,input[type='submit']:hover,input[type='button']:hover,button:hover 
{
	opacity: 0.75;
}
#divResult
{
    position:absolute;
    width:534px;
    display:none;
    margin-top:-1px;
    border:solid 1px #dedede;
    border-top:0px;
    overflow:hidden;
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
    -moz-border-bottom-right-radius: 6px;
    -moz-border-bottom-left-radius: 6px;
    box-shadow: 0px 0px 5px #999;
    border-width: 3px 1px 1px;
    border-style: solid;
    border-color: #333 #DEDEDE #DEDEDE;
    background-color: white;
}
#searchResult
{
    position:absolute;
    width:520px;
    display:none;
    margin-top:-1px;
    border:solid 1px #dedede;
    border-top:0px;
    overflow:hidden;
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
    -moz-border-bottom-right-radius: 6px;
    -moz-border-bottom-left-radius: 6px;
    box-shadow: 0px 0px 5px #999;
    border-width: 3px 1px 1px;
    border-style: solid;
    border-color: #333 #DEDEDE #DEDEDE;
    background-color: white;
}
.photo
{
	position: relative;
	display: inline-block;
	width: 129px;
	height: 129px;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: cover;
	margin-left: 7px;
	margin-top: 5px;
	border: 2px solid #FFF;
}
.category-box{
	position:relative;
}
.category-box .label{
	position: absolute;
	bottom: 0;
	left: 0;
	background: #794599;
	width: 100%;
	font-weight: bold;
	color: #FFFFFF;
	text-align: center;
}
.category-box .label .wrapper{
	padding:10px;
}
.light-box{
	background: #F2F8FF;
	padding:5px;
	font-weight:bold;
}
.dashboard-top-menu a{
	color:#000;
}
.dashboard-top-menu a:hover{
	text-decoration:underline;
}
.display_box
{
    padding:4px; border-top:solid 1px #dedede; 
    font-size:12px;
 }
.display_box:hover
{
    background:#0070ba;
    color:#FFFFFF;
    cursor:pointer;
}
.table-header{
	background:#0070ba;
	border-bottom:solid 1px #000; 
	color:#FFF;
	padding-left:10px;
	font-weight:bold;
}
.zebrastripe{
    line-height:24pt;
}
.zebrastripe:nth-child(odd) {
    background: #e0e0e0;
}
.dashboard-left-menu{
	border-bottom:dotted 1px #0070ba; 
	padding: 5px;
	cursor:pointer;
}
.dashboard-left-menu:hover{
	background:#0070ba;
	color:#FFF;
	transition: color 0.4s ease 0s;
}
#search{width:500px;height: 25px;padding-left:30px;font-size: 13px;margin-top:5px; background: url('../images/search.png') no-repeat scroll 3px 6px #F5F5F5;}
.information, .success, .warning,.validation {
border: 1px solid;
margin: 10px 0px;
padding:0px 10px 0px 50px;
background-repeat: no-repeat;
background-position: 10px center;
}
.inline-block-box{
	border: 1px solid #F2F2F2;
	display:inline-block;
	width: 231px;
	font-size: 20px;
	padding: 10px;
	margin-bottom: 5px;
	margin-left: 5px;
	text-align: center;
}
.inline-block-box:hover{
	background:#0070ba;
	color:#FFF;
	cursor:pointer;
}
.block-container{
	display:inline-block;
	vertical-align:top;
}

.block-container.right{
	float:right;
	width:270px;
	padding-right:15px;
	margin-top: 10px;
}
.second-color-btn{
	background:orange;
}
.main-color{
	color:#0070ba;
}
.pointer{
	cursor:pointer;
}
.information, .success, .warning,.validation,.error p{
	padding-top: 3px;
	padding-bottom: 3px;
}
.information {
color: #00529B;
background-color: #BDE5F8;
background-image: url('../images/info.png');
}
.success {
color: #4F8A10;
background-color: #DFF2BF;
background-image:url('../images/success.png');
}
.warning {
color: #9F6000;
background-color: #FEEFB3;
background-image: url('../images/warning.png');
}
.error {
border: 1px solid;
margin: 10px 0px;
padding:0px 10px 0px 50px;
background-repeat: no-repeat;
background-position: 10px center;
}
.error {
color: #D8000C;
background-color: #FFBABA;
background-image: url('../images/error.png');
}
.graybtn
{
	background:#F8F8F8;
	color:black;
}
.delbtn
{
	background:#D00000 ;
	color:#fff;
}
.bottom-line{
	border-bottom: 1px solid #F8F8F8;
	padding-top:10px;
	padding-bottom:10px;
}
.menu-box{
	border-bottom: 1px solid #F8F8F8;
	padding:5px 5px 5px 10px;
}
.menu-box:hover{
	background:#0070ba;
	color:#FFF;
	cursor:pointer;
}
.bold{
	font-weight:bold;
}
.delete{
	background:#FFFFFF;
	padding:2px;
	font-weight:bold;
    color: red;
    opacity:0;
    transition:opacity 0.5s linear;
    -moz-transition: opacity 0.5s linear;
    -webkit-transition: opacity 0.5s linear;
	cursor:pointer;
	position:absolute;
	top:0px;
	left:0px;
}
.delete_container{
	position:relative;
}
.delete_div{
	position:absolute;
	top: 2px;
	right: -5px;
	background: #FFFFFF;
	visibility:hidden;
}
.delete_div img{
	cursor:pointer;
}
.delete_container:hover .delete_div{
	visibility:visible;
}
.delete:hover{
	text-decoration:none;
}
.image{
	display:inline-block;
	position:relative;
}
.image:hover .delete{
   opacity: 1;
}​
/* Blue Button */
.kcbuttonblue{
    color: #FFF;
    background-color: #428BCA;
    border-color: #428BCA;
	opacity:1;
}
.kcbuttonblue:hover
{
	opacity: 0.75;
}
/* Orange Button */
.kcbuttonorange{
    color: #FFF;
    background-color: #FF5D00;
    border-color: #FF5D00;
	opacity:1;
}
.kcbuttonorange:hover
{
	opacity: 0.75;
}
.newsfeed-box
{
	background:#F8F8F8;
	padding:10px;
	margin-top:10px;
}
.content
{
	background:#FFF;
	padding:10px;
}
.tree ul {
    padding-top: 20px; position: relative;
    
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
}

.tree li {
    float: left; text-align: center;
    list-style-type: none;
    position: relative;
    padding: 20px 5px 0 2px;
    
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
}

.tree li::before, .tree li::after{
    content: '';
    position: absolute; top: 0; right: 50%;
    border-top: 1px solid #ccc;
    width: 50%; height: 20px;
}
.tree li::after{
    right: auto; left: 50%;
    border-left: 1px solid #ccc;
}

.tree li:only-child::after, .tree li:only-child::before {
    display: none;
}

.tree li:only-child{ padding-top: 0;}

.tree li:first-child::before, .tree li:last-child::after{
    border: 0 none;
}
.tree li:last-child::before{
    border-right: 1px solid #ccc;
    border-radius: 0 5px 0 0;
    -webkit-border-radius: 0 5px 0 0;
    -moz-border-radius: 0 5px 0 0;
}
.tree li:first-child::after{
    border-radius: 5px 0 0 0;
    -webkit-border-radius: 5px 0 0 0;
    -moz-border-radius: 5px 0 0 0;
}
.tree ul ul::before{
    content: '';
    position: absolute; top: 0; left: 50%;
    border-left: 1px solid #ccc;
    width: 0; height: 20px;
}
.tree li div{
    border: 1px solid #ccc;
    padding: 1px 2px;
    text-decoration: none;
    color: #666;
    font-family: arial, verdana, tahoma;
    font-size: 7px;
    display: inline-block;
    
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
	cursor:pointer;
	
}
.tree li div:hover, .tree li div:hover+ul li div {
    background: #c8e4f8; color: #000; border: 1px solid #94a0b4;
}
.tree li div:hover+ul li::after, 
.tree li div:hover+ul li::before, 
.tree li div:hover+ul::before, 
.tree li div:hover+ul ul::before{
    border-color:  #94a0b4;
}
.trans-header{
	font-weight:bold;border-bottom: 1px solid #333;
}
.transaction{
	border-bottom: 1px solid #F8F8F8;padding-top: 2px;padding-bottom: 2px;
}
.amount{
	display:inline-block;width:150px;
}
.description{
	display:inline-block;width:400px;
}
.date{
	display:inline-block;width:100px;
}
.circle {
    background-color: rgba(0,0,0,0);
    border: 5px solid rgba(0,183,229,0.9);
    opacity: .9;
    border-right: 5px solid rgba(0,0,0,0);
    border-left: 5px solid rgba(0,0,0,0);
    border-radius: 50px;
    box-shadow: 0 0 35px #2187e7;
    width: 50px;
    height: 50px;
    margin: 0 auto;
    -moz-animation: spinPulse 1s infinite ease-in-out;
    -webkit-animation: spinPulse 1s infinite linear;
}

.circle1 {
    background-color: rgba(0,0,0,0);
    border: 5px solid rgba(0,183,229,0.9);
    opacity: .9;
    border-left: 5px solid rgba(0,0,0,0);
    border-right: 5px solid rgba(0,0,0,0);
    border-radius: 50px;
    box-shadow: 0 0 15px #2187e7;
    width: 30px;
    height: 30px;
    margin: 0 auto;
    position: relative;
    top: -50px;
    -moz-animation: spinoffPulse 1s infinite linear;
    -webkit-animation: spinoffPulse 1s infinite linear;
}

@-moz-keyframes spinPulse {
    0% {
        -moz-transform: rotate(160deg);
        opacity: 0;
        box-shadow: 0 0 1px #2187e7;
    }

    50% {
        -moz-transform: rotate(145deg);
        opacity: 1;
    }

    100% {
        -moz-transform: rotate(-320deg);
        opacity: 0;
    };
}

@-moz-keyframes spinoffPulse {
    0% {
        -moz-transform: rotate(0deg);
    }

    100% {
        -moz-transform: rotate(360deg);
    };
}

@-webkit-keyframes spinPulse {
    0% {
        -webkit-transform: rotate(160deg);
        opacity: 0;
        box-shadow: 0 0 1px #2187e7;
    }

    50% {
        -webkit-transform: rotate(145deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: rotate(-320deg);
        opacity: 0;
    };
}

@-webkit-keyframes spinoffPulse {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    };
}
.barlittle {
    background-color: #2187e7;
    background-image: -moz-linear-gradient(45deg, #2187e7 25%, #a0eaff);
    background-image: -webkit-linear-gradient(45deg, #2187e7 25%, #a0eaff);
    border-left: 1px solid #111;
    border-top: 1px solid #111;
    border-right: 1px solid #333;
    border-bottom: 1px solid #333;
    width: 10px;
    height: 10px;
    float: left;
    margin-left: 5px;
    opacity: 0.1;
    -moz-transform: scale(0.7);
    -webkit-transform: scale(0.7);
    -moz-animation: move 1s infinite linear;
    -webkit-animation: move 1s infinite linear;
}

#block_1 {
    -moz-animation-delay: .4s;
    -webkit-animation-delay: .4s;
}

#block_2 {
    -moz-animation-delay: .3s;
    -webkit-animation-delay: .3s;
}

#block_3 {
    -moz-animation-delay: .2s;
    -webkit-animation-delay: .2s;
}

#block_4 {
    -moz-animation-delay: .3s;
    -webkit-animation-delay: .3s;
}

#block_5 {
    -moz-animation-delay: .4s;
    -webkit-animation-delay: .4s;
}

@-moz-keyframes move {
    0% {
        -moz-transform: scale(1.2);
        opacity: 1;
    }

    100% {
        -moz-transform: scale(0.7);
        opacity: 0.1;
    };
}

@-webkit-keyframes move {
    0% {
        -webkit-transform: scale(1.2);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(0.7);
        opacity: 0.1;
    };
}
.headerlist
{
	display:inline-block;position:relative;
}
.note-bubble
{
	background:red;
	color:#FFF;
	position:absolute;
	top:-10px;
	left:-10px;
	border-radius: 20px;
}
.headerlist-box a:hover {
    color: #0070ba;
	font-weight:bold;
    text-decoration: none;
}
.headerlist-box:hover {
    opacity: 1;
	cursor: pointer;
	color:#0070ba;
	font-weight:bold;
}
.headerlist .icon .main-text
{
	text-align:center;
	width: 60px;
	margin: 0px 3px;
	height: 15px;
	text-transform: uppercase;
	font-size: 10px;
	letter-spacing: 0.5px;
}
.headerlist .icon .main-img
{
	display:block;
	width:35px;
	margin-top:5px;
	margin-bottom:5px;
	margin-left: auto;
	margin-right: auto
}
.headerlist .icon span
{
	display:block;
}
#fixedheader
{
   height:80px;
   position: relative;
   z-index:1;
   position: fixed;
   width: 100%;
   top: 0px;
   font-size:17px;
   box-shadow: 0 0 1px 1px #ccc;
   background-color: #fff;
   color:#0070ba;
   font-weight:bold;
}
#fixedheader a{
	color:#0070ba;
	font-weight:bold;
}
#fixedheader a:hover{
	color:#0070ba;
	opacity: 0.75;
}
.push{margin-top:90px;width:100%;}
.left-menu
{
	background:#0070ba;
	color: #FFF;
	font-weight:bold;
	width:104px;
	text-align:center;
	margin-bottom:3px;
	padding-top:15px;
	height:46px;
	display:inline-block;
	cursor:pointer;
}
.left-menu .inner
{
	margin-top:10px;
	margin-left:auto;
	margin-right:auto;
}
.left-menu .inner img
{
	width:30px;
}
h1.dashboard
{
	font-size:20px;
}
h1
{
	font-size:18px;
	border-bottom:1px solid #0070ba;
	padding-bottom: 5px;
}
h1,h2,h3,h4
{
	color:#0070ba;
	font-weight:bold;
}
h1.black,h2.black,h3.black,h4.black
{
	color:#000;
	font-weight:bold;
	border-bottom:1px solid #000;
}
.line
{
	margin-bottom:10px;
	border-bottom:1px solid #0070ba;
}
.line-black
{
	margin-bottom:10px;
	border-bottom:1px solid #000;
}
.blue-box
{
	border:1px solid #0070ba;
}
.vertical-divider
{
	border-right:1px solid #0070ba;
	height:100%;
	display:inline-block;
}
.vertical-divider.centered
{
	text-align:center;
}
.ball {
    background-color: rgba(0,0,0,0);
    border: 5px solid rgba(0,183,229,0.9);
    opacity: .9;
    border-top: 5px solid rgba(0,0,0,0);
    border-left: 5px solid rgba(0,0,0,0);
    border-radius: 50px;
    box-shadow: 0 0 35px #2187e7;
    width: 50px;
    height: 50px;
    margin: 0 auto;
    -moz-animation: spin .5s infinite linear;
    -webkit-animation: spin .5s infinite linear;
}

.ball1 {
    background-color: rgba(0,0,0,0);
    border: 5px solid rgba(0,183,229,0.9);
    opacity: .9;
    border-top: 5px solid rgba(0,0,0,0);
    border-left: 5px solid rgba(0,0,0,0);
    border-radius: 50px;
    box-shadow: 0 0 15px #2187e7;
    width: 30px;
    height: 30px;
    margin: 0 auto;
    position: relative;
    top: -50px;
    -moz-animation: spinoff .5s infinite linear;
    -webkit-animation: spinoff .5s infinite linear;
}
/* 21.07.2017 */
/* Side bar menu */
.sidebar{
    background-color: #0070ba;
}
.sidebar a{
	color:#FFFFFF;
}
.sidebar-menu > li:hover > a{
    color: #fff;
    background: #1e282c;
	border-left: 3px solid green;
}
.sidebar a:hover {
    text-decoration: none;
}
.sidebar-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.sidebar-menu > li {
  position: relative;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid #FFF;
}
.sidebar-menu > li > a {
  padding: 12px 5px 12px 15px;
  display: block;
}
.sidebar-menu > li > a > .fa,
.sidebar-menu > li > a > .glyphicon,
.sidebar-menu > li > a > .ion {
  width: 20px;
}
.sidebar-menu > li .label,
.sidebar-menu > li .badge {
  margin-top: 3px;
  margin-right: 5px;
}
.sidebar-menu li.header {
  padding: 10px 25px 10px 15px;
  font-size: 12px;
}
.sidebar-menu li > a > .fa-angle-left {
  width: auto;
  height: auto;
  padding: 0;
  margin-right: 10px;
  margin-top: 3px;
}
.sidebar-menu li.active > a > .fa-angle-left {
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
.sidebar-menu li.active > .treeview-menu {
  display: block;
}
.sidebar-menu .treeview-menu {
  display: none;
  list-style: none;
  padding: 0;
  margin: 0;
  padding-left: 5px;
}
.sidebar-menu .treeview-menu .treeview-menu {
  padding-left: 20px;
}
.sidebar-menu .treeview-menu > li {
  margin: 0;
}
.sidebar-menu .treeview-menu > li > a {
  padding: 5px 5px 5px 15px;
  display: block;
  font-size: 13px;
}
.sidebar-menu .treeview-menu > li > a:hover {
	font-weight:bold;
}
.sidebar-menu .treeview-menu > li > a > .fa,
.sidebar-menu .treeview-menu > li > a > .glyphicon,
.sidebar-menu .treeview-menu > li > a > .ion {
  width: 20px;
}
.sidebar-menu .treeview-menu > li > a > .fa-angle-left,
.sidebar-menu .treeview-menu > li > a > .fa-angle-down {
  width: auto;
}
.box {
	padding: 0.715em;
    box-shadow: 0px 0px 0.4em #999;
    border-collapse: separate;
    background-color: #F5F5F5;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 1.43em;
	border-collapse: separate;
}
.inline-block{
	display:inline-block;
	vertical-align:top;
}
.spinner {
  margin: 20px;
  height: 30px;
  width: 30px;
  animation: rotate 0.8s infinite linear;
  border: 8px solid #0070ba;
  border-right-color: transparent;
  border-radius: 50%;
  margin-left:auto;
  margin-right:auto;
}
@keyframes rotate {
  0%    { transform: rotate(0deg); }
  100%  { transform: rotate(360deg); }
}
.spinner-white {
  margin: 30px;
  height: 80px;
  width: 80px;
  animation: rotate 0.8s infinite linear;
  border: 8px solid #FFF;
  border-right-color: transparent;
  border-radius: 50%;
  margin-left:auto;
  margin-right:auto;
}
@keyframes rotate {
  0%    { transform: rotate(0deg); }
  100%  { transform: rotate(360deg); }
}
table.cells{
    border-collapse: collapse;
    border: 1px solid #F4F4F4;
}
table.cells td{
    border: 1px solid #F4F4F4;
    padding: 10px 10px;
	font-size:11px;
}
table.cells.big td{
	font-size:12px;
}
table.cells.big tr:hover{
	background-color: #f5f5f5;
}
.table-header td{
	font-weight:bold;
}
.mob-menu{
	display:none;
	width: 72px;
	padding-left: 15px;
	vertical-align: top;
	margin-top: 15px;
}
.cart {
   position:relative;
}
.cart[data-badge]:after {
   content:attr(data-badge);
   position:absolute;
   top:-10px;
   right:-10px;
   font-size:.7em;
   background:#00aff0;
   color:white;
   width:18px;height:18px;
   text-align:center;
   line-height:18px;
   border-radius:50%;
   box-shadow:0 0 1px #333;
}
.logout{
	float:right;
	padding-right: 20px;
	margin-left: 10px;
}
.dashboard-left{
	display:inline-block;
	vertical-align:top;
}
#sidebar{
	display:block;
}
.inline-block.rightside{
	
}
#animation{
	display:none;
}
#animation2{
	display:none;
}
#animation3{
	display:none;
}
.blue-link{
	color:blue;
}
.blue-link:hover{
	text-decoration:underline;
}
.remain-inline{
	display:inline-block;
	vertical-align:top;
}
.bottom-line.product .inline-block.name{
	padding-left:10px;
}
.grid-item { width: 200px; }
.grid-item--width2 { width: 400px; }
.mob-content{
	display:none;
}
.bordered-btn{
	background:#FFFFFF;
	border:1px solid black;
	color:#000;
}
.center{
	text-align: center;
}
.centered-div{
	margin-left:auto;
	margin-right:auto;
}
.payment_btn{
	margin-top: 10px;
	margin-bottom: 10px;
}
.full-width{
	width:100%;
}
.cart-icon{
	padding-right:10px;
}
.normal{
	font-weight:normal ! important;
}
.search-content{
	padding:5px;
	color:black;
	font-weight:normal;
}
.search-content .bottom-line:hover{
	background:#0070ba;
	color:#FFF;
}
.desktop-left-padding{
	padding-left:10px;
}
/* Mobile CSS */
@media only screen and (max-width: 640px) {
	#desktop-page{
		display:none ! important;
	}
	#mob-page{
		display:block ! important;
	}
	.desktop{
		display:none ! important;
	}
	.desktop-left-padding{
		padding-left:0px ! important;
	}
	.mobile{
		display:block ! important;
	}
	.bottom-space{
		margin-bottom:10px;
	}
	.mob-no-padding{
		padding:0px ! important;
	}
	.block-container{
		display:block ! important;
		width:100%;
	}
	.block-container.right{
		width:100% ! important;
		float:none;
		padding-right: 20px;
		padding-left: 4px;
	}
	.mob-left{
		text-align:left ! important;
	}
	#fixedheader{
		height: 190px;
	}
	#search{
		width:96% ! important;
		margin-left: -10px;
	}
	.inline-block{
		display:block ! important;
		width:100% ! important;
	}
	.inline-block.leftside{
		display:block ! important;
		width:100% ! important;
	}
	.inline-block.rightside{
		display:block ! important;
		width:100% ! important;
		padding:0px ! important;
		margin-bottom:10px ! important;
	}
	.inline-block.rightside.second{
		display:block ! important;
		width:100% ! important;
		padding:0px ! important;
		margin-right:0px ! important;
		margin-bottom:20px ! important;
	}
	.inline-block.remain-inline{
		display:inline-block ! important;
	}
	.bottom-line.product .inline-block.name{
		padding-left:0px !important;
		margin-bottom:10px;
	}
	.bottom-line.product .inline-block.price{
		margin-bottom:10px;
	}
	.right-float{
		float:left ! important;
		margin-top:10px;
		margin-bottom:10px;
	}
	.push{
		margin-top: 210px;
	}
	.block-container.search-box{
		padding: 20px 0px 10px 0px ! important;
	}
	.mob-menu{
		display:inline-block ! important;
		float:right;
		padding-right:10px;
	}
	.dashboard-logo img{
		width:60px ! important;
		margin-top:20px ! important;
		margin-left: -10px;
	}
	.logout{
		padding-right:12px ! important;
	}
	#sidebar{
		display:none;
	}
	.dashboard-left{
		display:block ! important;
		width:100% ! important;
	}
	.dashboard-right{
		margin-top:10px;
		display:block ! important;
		width:100% ! important;
	}
	.heading{
		margin:10px;
	}
	#feedback{
		padding: 5px;
	}
	h1,h2,h3,h4{
		padding-left:5px;
		padding-right:5px;
	}
	select{
		width:100% ! important;
	}
	input[type='text'], input[type='password'] {
		width: 97% ! important;
	}
	.mob-wrapper{
		padding:10px;
	}
	.grid-item { width: 100% ! important; }
	.grid-item--width2 { width: 100% ! important; }
	.step-header-left{
		width:20% ! important;
	}
	.step-header-right{
		width:78% ! important;
	}
	.mob-content{
		display:inline-block !important;
	}
	.cart-icon{
		float: right;
		padding-right: 20px;
	}
	#divResult{
		width: 96% !important;
		margin-left: -10px;
	}
	.margin-bottom{
		margin-bottom:10px;
	}
	.no-padding-right{
		padding-right:0px ! important;
	}
	.content.mini{
		font-size:11px;
	}
}