﻿* { box-sizing: border-box !important; -moz-box-sizing: border-box !important;}

body {margin: 0; padding: 0; font-family: 'Montserrat', sans-serif; font-size: 16px; background: #f5f5f5; }
input[type=text], input[type=email], input[type=number],input[type=password],input[type=date],input[type=datetime-local], select { font-family: 'Montserrat', sans-serif; width: 100%; padding: 10px; border: 1px solid #ccc; font-size: 1em;}
textarea { width: 100%; height: 100px; font-family: 'Montserrat', sans-serif; border: 1px solid #ccc; padding: 10px; font-size: 1em;}

label.required:before { display:inline-block; color: red; content:"*"; padding-right: 5px;} 

.readonly.formContainer label { border-bottom: 1px solid #ccc; margin-bottom: 0; padding-bottom: 5px;}
input:read-only, textarea:read-only { border:0; padding: 10px 0; background: none; }

textarea:read-only { overflow:visible;}

.bigNote { height: 300px;}

h1, h2, h3, h4 { margin: 0 0 20px 0; padding: 0; line-height: 1em;}

h1 { font-size: 2em;}
h2 { font-size: 1.5em;}

.smallTitle { font-size: .8em;}
.sideTitle, .smallTitle { color:#999; text-transform:uppercase; padding: 0 0 10px 0; border-bottom: 1px solid #ccc; }

/*** Main Header ***/
header { height: 50px; background:#161d34; padding: 0; position:fixed; width: 100%; z-index:1;}
    header img { height: 40px; width: auto; position: absolute; top: 5px; left: 10px;}

.mainNav { float:left; padding: 0 0 0 70px;}
    .mainNav ul { list-style:none; margin: 0; padding: 0;}
        .mainNav ul li { float:left; position: relative;}
            .mainNav ul li a { display:block; padding: 16px 15px 16px; font-weight: 700; color:#fff; text-decoration:none; font-size: 14px;}
                .mainNav ul li:hover a { background:#229cd1; color:#fff;}

        .mainNav ul ul { position: absolute;    width: 200px;    background: #0c1224; margin-top: 0; left: -999999px;}
            .mainNav ul ul li { width: 100%; display:block;}
                .mainNav ul li:hover ul li a { font-size: 12px; background:#161d34}
                .mainNav ul li:hover ul li a:hover {background:#229cd1; color:#fff;}

        .mainNav ul li:hover ul { left: -1px;}



.acctinfo { float:right;}
.acctinfo a { display:block; padding: 16px 15px 16px; font-weight: 700; color:#fff; text-decoration:none; font-size: 14px;}
.acctinfo a:hover { background:#229cd1;}

/* Left Menu */
.leftMenu { position:fixed; top: 50px; bottom: 0; overflow:auto; width: 250px; background: #fff; border-right: 1px solid #ccc; padding: 20px; font-size: .8em; }
.leftMenu .button { width: 100%;}

/* Right Menu */
.rightMenu { position:fixed; top: 50px; bottom: 0; right: 0; overflow:auto; width: 250px; background: #fff; border-left: 1px solid #ccc; padding: 20px; font-size: .8em; }
.rightMenu .button { width: 100%;}

/*Main Content 3 Col*/
.mainContent { padding: 20px; position:fixed; top: 50px; bottom: 0; left: 250px; right: 250px; overflow:auto;}

/*Main Content 2 Col*/
.mainContent2col { padding: 20px; position:fixed; top: 50px; bottom: 0; left: 250px; right: 0; overflow:auto;}

/*Main Content Full*/
.mainContentFull { padding: 20px; position:fixed; top: 50px; bottom: 0; left: 0; right: 0; overflow:auto;}

/*Search*/
.searchContainer { }
.searchContainer input { background: none; border: 0; border-bottom: 1px solid #ccc; padding: 0; width: 100%; padding: 20px 0 20px 0; font-size: 16px; font-weight: 700;}
.searchContainer input:focus {outline: none;}

/*Data Grid*/
.dataGridContainer .k-grid { border: 0 !important;}
.dataGridContainer div.k-grid-header, .dataGridContainer div.k-grid-header:hover { background:none !important;}
.dataGridContainer .k-grid-header .k-header, .dataGridContainer .k-grid-header:hover .k-header:hover { background: none !important; text-transform:uppercase; font-weight: 700 !important; border-left: 0 !important; padding: 10px 0 !important; font-size: .8em;}
.dataGridContainer .k-grid-header tr { background: none !important;}
.dataGridContainer .k-grid-header-wrap {border:0 !important;}


.dataGridContainer .k-grid tbody td:first-child { border-left:1px solid #ccc !important;}
.dataGridContainer .k-grid tbody td:last-child { border-right:1px solid #ccc !important;}

.dataGridContainer .k-grid .k-pager-wrap { border: 1px solid #ccc !important;}

.dataGridContainer tbody td a { font-weight: 700; color:#229cd1; text-decoration:none;}
.dataGridContainer tbody tr:hover { background:#def5ff !important;}
.dataGridContainer .k-alt {background:#f1fbff; }

.dataGridContainer * { -webkit-box-sizing: content-box !important;  box-sizing: content-box !important;}
.dataGridContainer * input { box-sizing: border-box !important; -moz-box-sizing: border-box !important;}

.dataGridContainer tfoot tr, .dataGridContainer tfoot tr:hover { background:#229cd1;}
.dataGridContainer tfoot tr td { border-color:#229cd1; color:#fff;}

.dataGridContainer .k-grid { background: none !important;}
.dataGridContainer .k-grid-content { background: #fff;}

/*Pin List*/
.pinList { list-style:none; padding:0; margin:0; }
    .pinList li { }
    .pinList li a {display:block; padding: 5px; border-bottom: 1px solid #ccc; color:#229cd1; text-decoration:none; }
        .pinList li a:hover { background:#229cd1; color: #fff;}


/*Tabstrip */
.k-tabstrip-wrapper { box-shadow: none !important;}
#tabstrip { border: 0 !important;
    background: none; box-shadow: none !important;}
.k-tabstrip-items { padding: 0 !important; }
.k-tabstrip > .k-content { margin: 0 !important; border: 1px solid #ccc !important; padding: 20px !important;}

#tabstrip .k-item { background: none !important; border:0 !important;border-bottom: 5px solid #f5f5f5 !important; font-weight: 700;}
    #tabstrip .k-item.k-state-active span { color:#229cd1 !important;}

#tabstrip .k-item.k-state-active{border-bottom: 5px solid #229cd1 !important;}

/*Breadcrumbs*/
.breadCrumb { font-size: 10px; padding-bottom: 20px;}
.breadCrumb a { text-decoration:none; color:#229cd1}

/*Contact*/
.contactContainer { padding-bottom: 20px;}
.contactMobile {margin-top: 10px; }


/*TitleWindow*/
.k-window-titlebar { height: auto !important; z-index:9;}
.k-window .k-window-content { padding: 20px !important;}

.saveContainer { background:#f5f5f5; border-top: 1px solid #ccc;     position: absolute;    bottom: 0;    left: 0;    right: 0;    padding: 20px;}


/*Form Container*/
.formContainer { margin-bottom: 20px;}
.formContainer label { margin-bottom: 5px; display:block; font-size: .8em; }


.contentContainer { margin-bottom: 20px;}

.button { background:#229cd1; color:#fff; border-radius: 5px; -moz-border-radius: 5px; padding: 10px; text-align:center; display:inline-block; text-decoration:none; font-weight: 700; font-size: .8em; text-transform:uppercase; }
    .button:hover { background:#1a8fc2; }

.fontSmaller { font-size: .8em;}

.floatLeft { float:left;}
.floatRight { float:right;}
.clearBoth:after {display:block; content: ""; clear:both;}

.width50 { width: 50%; float:left; padding-right: 10px;}
.width50:last-child { padding-left: 10px;}

.width70 { width: 70%; float:left; padding-right: 10px;}
.width30 { width: 30%; float:left; padding-left: 10px;}

.width33 { width: 33.3333%; float:left; padding: 0 10px 0 0;}
.width33:nth-child(2) { padding: 0 10px;}
.width33:nth-child(3) { padding: 0 0 0 10px;}

.width25 { width: 25%; float:left; padding: 0 10px 0 0;}
.width33:nth-child(2), .width33:nth-child(3) { padding: 0 10px;}
.width33:nth-child(4) { padding: 0 0 0 10px;}