@import url(http://fonts.googleapis.com/css?family=Fira+Sans&subset=latin,latin-ext);

html,body{margin:0;padding:0; background-color: #ffffff; height: 100%;}
body{font-family: 'Fira Sans',arial,sans-serif; font-size:12px; font-weight: 300; text-align:left; color:#363636; position: relative; background-color: #f7f7f7; padding-bottom: 105px; height: auto; min-height: 100% }

/* General */
*{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
*:focus{outline: 0 none;}

p{padding: 0; margin:0; word-wrap: break-word;}
a{color: #595959; text-decoration: none;}
a:hover{color: #000000; text-decoration: none;}
.input, textarea, input, select{font-family: 'Fira Sans', arial, sans-serif; font-weight: 300; border: 1px solid #c1c1c1; border-radius: 2px;padding: 2px 3px; font-size: 14px;}
input[type=submit]{cursor: pointer; background-color: #f0f0f0;}
.noBorder tr, .noBorder td, .noBorder{border: none !important;}


hr{border: 0px; border-bottom: 1px solid #555;}
ul{ margin:	0; padding:0;}
h1, h2, h3, h4,
.h1, .h2, .h3, .h4{ padding:0; margin: 0; font-weight: 100;}
h1, .h1{    font-size: 24px;    font-weight: 100;    margin: 15px 0 0 0;    padding: 0;}
h2, .h2{    font-size: 20px;    font-weight: 100;    margin: 15px 0 15px 0;    padding: 0;}
h3, .h3{    font-size: 16px;    font-weight: 300;    margin: 15px 0 5px 0;    padding: 0;}
h4, .h4{    font-size: 14px;    font-weight: 300;    margin: 20px 0 0 0;    padding: 0;}
h5, .h5{    font-size: 12px;    font-weight: 300;    margin: 15px 0 0 0;    padding: 0;}

.f28{font-size: 28px;}
.f20{font-size: 20px;}
.f16{font-size: 16px;}
.f12{font-size: 12px;}
.f10{font-size: 10px;}

.l20{line-height: 20px;}
.l24{line-height: 24px;}

.left{    float: left;}
.right{    float: right;}
.hidden{display: none;}
.floatNone{    float: none;}
.middle{    margin: 0 auto;}
.clear, .clr{    clear: both;}
.textCenter{ text-align: center;}
.textRight{ text-align: right;}
.textBold{ font-weight: bold;}
.textHighlighted{color:#9e205f;}

.clickable {cursor: pointer;}

.success {color: green;}
.error {color: #c52b2d;}

.overlay{ background-color: #000000;    opacity: 0.75;    width: 100%;    position: absolute;    top: 0px;    left: 0px;    z-index: 10000; display: none;}
.overlay_holder{    position: absolute;    z-index: 10001;    width: 780px;    padding: 30px 0px;    color: #363636;    background-color: #F5F5F5;    border-radius: 10px;    box-shadow: 0px 0px 10px #FFFFFF;}
.overlay_holder .title{    font-size: 24px;    text-align: center;}
.overlay_holder .desc{    font-size: 16px;    text-align: center;    padding: 10px 30px;}

.floatError {position: absolute; background-color: #9e205f; color: #fff; padding: 4px 10px; border-radius: 4px; box-shadow: 0 0 6px #9e205f; cursor: pointer;}

/* Style */
/* main color : #FF4C4C; or 239 0 146 */
.wrapper{ width: 1140px; margin: 0 auto;}
.main { height: 100%; position: relative;}
#map-canvas {height: 100%; margin: 0; padding: 0; width: 100%;}

.loadedContent { padding: 0;}

.header{border-top: 3px solid #9e205f; height: 70px; width: 100%; line-height: 56px; font-size: 18px; padding-top: 5px; background-color: #fff; box-shadow: 0 0 7px #777;}
.header .logo{background: url("../images/logo.png") no-repeat; width: 66px; height:56px;display: inline-block; margin: 0 40px 0 0;}
.header a {}

.footer{border-top: 3px solid #9d1f5f; height: 105px; background-color: #232323; color: #fff; font-size: 14px; text-align: center; padding-top: 30px; position: absolute; bottom: 0; width: 100%;}

/* LOGIN */
.outerSite .header{box-shadow: none;}
.outerSite .loginHolder{width: 100%; height:456px; background: url("../images/login_bg.png") no-repeat top center; padding: 1px; background-color: #791347; border-bottom: 1px solid #E6D9E0;}
.outerSite .login{width: 800px; height: 400px; border: none; box-shadow: 0 0 40px #555; margin: 160px auto 0 auto; background-color: #fff;z-index: 100; position: absolute; left: calc(50% - 400px);}
.outerSite .login form {display: block; width: 630px; margin: 0 auto; padding: 50px 0; font-size:18px;}
.outerSite .login label{display: block; color: #595959;}
.outerSite .login input{display: block; width: 630px; height: 45px; border: 1px solid #b8b8b8; border-radius:2px; padding: 10px; color: #b8b8b8; margin: 5px 0 30px 0; font-size: 18px;}
.outerSite .login input[type=submit]{width: 200px; border: 1px solid #9d1f5f; color: #9d1f5f; margin: 0 auto; background-color: transparent;}
.outerSite .login input[type=submit]:hover {box-shadow: 0 0 7px #9d1f5f;}

/* NAVI */
.navi{}
.naviMenu {font-size: 18px; font-weight: 300; line-height: 62px; display:inline-block;}
.naviMenu li {display: inline-block; width: auto; line-height: 62px; list-style: none; position:relative;}
.naviMenu li h2 {margin: 0; padding: 0; border-left: 10px solid #fff;}
.naviMenu li a {display: block; width: auto; text-align: left; padding: 0 5px;}
.naviMenu li.active a, .naviMenu li:hover a{color: #9d1f5f;}
.naviMenu li.active:before{
    top: -5px;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(157, 31, 95, 0);
    border-top-color: #9d1f5f;
    border-width: 10px;
    margin-left: -10px;
}

.naviMenu li ul{display: none; list-style: none; padding: 0 10px; font-size: 18px; min-width: 200px; background-color: #fff; box-shadow: 0 0 7px #777; z-index:1000; border: 3px solid #ccc}
.naviMenu li:hover ul{display: block; position:absolute; top: 62px; left: 0;}
.naviMenu li ul:after, .naviMenu li ul:before {bottom: 100%;left: 50%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;}
.naviMenu li ul:after {border-color: rgba(255, 255, 255, 0);border-bottom-color: #fff;border-width: 10px;margin-left: -10px;}
.naviMenu li ul:before {border-color: rgba(119, 119, 119, 0);border-bottom-color: #ccc;border-width: 16px;margin-left: -16px;}
.naviMenu li ul li{line-height: 40px; width: auto; display: block; border-bottom: 1px solid #c1c1c1;}
.naviMenu li ul li:last-of-type{border-bottom: none;}
.naviMenu li ul li a, .naviMenu li:hover ul li a, .naviMenu li.active ul li a {color: #595959;}

.naviMenu li ul li.active a,.naviMenu li ul li:hover a{color: #9d1f5f;}


/* scaffoldGrid */
.scaffoldGrid{width: 1140px; margin: 0 auto; border-collapse:collapse; font-size: 14px;}
.scaffoldGrid tr:nth-child(even){background-color: #eeeeee;}
.scaffoldGrid tr:hover{background-color: #E2B8CE;}
.scaffoldGrid tr.selected{background-color: #ffff77;}
.scaffoldGrid tr.bgGreen{background-color:#a7e0a2;}
.scaffoldGrid tr.bgRed{background-color: #E2B8CE;}
.scaffoldGrid th, .scaffoldGrid td{padding: 3px 5px; border: 1px solid #aaa;}
.scaffoldGrid th:hover, .scaffoldGrid td:hover{background-color: #E2B8CE;}
.scaffoldGrid th .gridOrderLink{padding: 3px 2px; margin: 0px;}
.scaffoldGrid th:hover .gridOrderLink{}
.scaffoldGrid td a{color: #9d1f5f; cursor: pointer; text-decoration: none;}
.scaffoldGrid td a:hover{color: #7a1347;}
.scaffoldGrid .lwssearchRow input[type=checkbox]{width: 45px;}
.scaffoldGrid .lwssearchRow input{width: 60px;}
.scaffoldGrid .lwssearchRow input:focus{width: 150px;}
.scaffoldGrid .lwssearchRow select{width: 60px;}
.scaffoldGrid .lwssearchRow select:focus{width: 150px;}
.scaffoldGrid thead tr:first-child { text-transform: uppercase; color: #595959; font-weight:bold; }
.scaffoldGrid thead tr:first-child th { border-bottom: 0; }
.scaffoldGrid tbody tr:first-child td { border-top: 0; }
.scaffoldGridList.embedGrid{height: auto; overflow: auto;}
.scaffoldGridList.embedGrid input{width: 100px;}

/* scaffoldGridPager */
.scaffoldGridPager{margin: 10px 10px;}
.scaffoldGridPager ul{list-style: none; overflow: auto; margin: 0px; padding: 0px;}
.scaffoldGridPager li{border: 1px solid #aaa; border-radius: 2px; background-color: #eeeeee; text-align: center; margin: 0px 5px; }
.scaffoldGridPager li a {display: inline-block; width: 25px; height: 25px; line-height: 25px;}
.scaffoldGridPager li.active{font-weight: bold; background-color: #dddddd;}

/* scaffoldToolbar*/
.scaffoldToolbar{ width: 1140px; padding: 0 5px; margin: 30px auto 20px auto; height: 50px; color: #fff; background: #9d1f5f;
    background: -moz-linear-gradient(top,  #9d1f5f 0%, #7a1347 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9d1f5f), color-stop(100%,#7a1347));
    background: -webkit-linear-gradient(top,  #9d1f5f 0%,#7a1347 100%);
    background: -o-linear-gradient(top,  #9d1f5f 0%,#7a1347 100%);
    background: -ms-linear-gradient(top,  #9d1f5f 0%,#7a1347 100%);
    background: linear-gradient(to bottom,  #9d1f5f 0%,#7a1347 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9d1f5f', endColorstr='#7a1347',GradientType=0 );
}
/*.scaffoldToolbar:nth-child(2) {background:none; margin: 0 auto; border: 1px solid #aaa; border-top: none;}*/
.scaffoldToolbar a{line-height: 20px; margin: 10px 5px; padding: 3px 10px; color: #fff; border: 2px solid #fff; border-radius:2px;}
.scaffoldToolbar:first-child a:hover{ }
/*.scaffoldToolbar:nth-child(2) a {color: #9d1f5f; border: 2px solid #9d1f5f;}
.scaffoldToolbar:nth-child(2) a:hover{ color: #7a1347;}*/

.scaffoldToolbar h2 { font-size: 22px; line-height: 50px; margin: 0 0 0 5px;}
/*.scaffoldToolbar:nth-child(2) h2 { display:none;}*/

/* scaffoldImageList */
.scaffoldImageList li{list-style: none; border: 1px solid #eee; border-radius: 3px; margin: 5px; paddin: 5px;}
.scaffoldImageList li div{text-align: right; padding: 4px 2px 2px 2px; background-color: #fafafa; margin-top: 5px; border-top: 1px solid #eee;}

/* scaffoldForm */
.scaffoldForm {border: 1px solid #c1c1c1; padding: 10px; width: 1140px; margin:0 auto;}
.scaffoldForm table{}
.scaffoldForm table tr:hover{background-color: #eee;}
.scaffoldForm table tr.selected{background-color: #eee;}
.scaffoldForm table tr td:first-of-type{width: 200px; font-size:18px;}
.scaffoldForm input, .scaffoldForm select{width: 350px; background: transparent; margin: 2px; line-height: 20px; padding: 4px 10px; font-size: 16px;}

.smtpSettingsBox{height: 170px; width: calc(50% - 10px); border: 1px solid #c1c1c1; border-radius: 0; padding: 0; float: left; margin: 10px 0;}
.smtpSettingsBox:nth-of-type(odd){margin-right: 10px;}
.smtpSettingsBox:nth-of-type(even){margin-left: 10px;}
.smtpSettingsBox.offline{background-color: #eee;}
.smtpSettingsBox .head{height: 35px; border-bottom: 1px solid #c1c1c1;}
.smtpSettingsBox .headInner{padding: 5px 10px;}
.smtpSettingsBox .head input, .smtpSettingsBox .head .input{margin-left: 10px; color: #9d1f5f; border: 2px solid #9d1f5f;}
.smtpSettingsBox .body{padding: 10px;}
.smtpSettingsBox p{margin: 5px 0;}
.smtpSettingsBox label{width: 300px; display:inline-block; font-size: 14px;}
.smtpSettingsBox input{width: 80px; display: inline-block; font-size: 14px; background-color: #fafafa; color: #515151;}
.smtpSettingsBox.offline input{background-color: #eee;}
.smtpSettingsBox .percentSlider{margin: 10px;}
.smtpSettingsBox .ui-widget-header {background-color: #9d1f5f}
.smtpSettingsBox .ui-state-hover, .smtpSettingsBox .ui-state-focus {background-color:#E2B8CE; border-color: #7a1347;}

.tableView p{margin: 5px 0;}
.tableView label{width: 200px; display:inline-block; vertical-align: top;}
.tableView input, .tableView select{width: 300px; display:inline-block;}

.progressBar{height: 10px; border-radius:10px; background-color:#c1c1c1;}
.progressValue{height: 10px; border-radius:10px; border-right: none; background-color: #9d1f5f;}

.modal-content{max-height: 800px; overflow: auto;}

/* Cookie layer */
.cc_container {background: rgba(0,0,0,0.7) !important;}

/* Icons */
.statDeviceIcon {display: inline-block; height: 28px; margin: 0 10px; vertical-align:sub;}
.statDeviceIcon.deviceMobile {background: url('../images/icons/deviceMobile.png') no-repeat; width:16px;}
.statDeviceIcon.deviceDesktop {background: url('../images/icons/deviceDesktop.png') no-repeat; width:32px;}
.statDeviceIcon.deviceOther {background: url('../images/icons/deviceOther.png') no-repeat;width:42px;}

/* notifies holder */
.notifiesHolder{width: 640px; margin: 0 auto;}
.notifiesHolder .errorHolder {border: 1px solid #E6D9E0; margin: 10px; padding: 10px;}
.notifiesHolder .errorHolder textarea {width: 100%; height: 350px;}
.notifiesHolder .errorHolder ul { margin-left:20px; list-style: none;}

/* RESPONSIVE DETAILS */
@media only screen and (max-width: 960px) {
}

@media only screen and (max-width: 840px) {
}

@media only screen and (max-width: 760px) {
}

@media only screen and (max-width: 700px) {
}

@media only screen and (max-width: 480px) {
}