@charset "utf-8";

.item-page .container_24 {
    width: 100%;
}

.item-page .container_24 .suffix_1 {
    padding: 0
}

.tail2 {
    background: url(./../images/tail1.gif) bottom repeat-x;
    padding-bottom: 18px;
    margin-bottom: 21px
}

.suffix_1 .container {
    overflow: hidden;
    width: 100%;
}

.slide_projects {
    width: 940px;
    margin: 0 auto;
    padding-bottom: 20px
}

ul ul li.current a {
    color: #353535 !important;
    background: url(../images/bg_menu1-act.gif) top left repeat-x !important;
    display: block;
}

/* ##########################  font size  ########################### */
.nivo-controlNav {
    z-index: 150000
}

#fontsize {
    padding: 0;
    margin: 0 20px 0 1px;
    text-align: right;
    margin-bottom: 0px;
    float: none;


}

html,
body {
    font-family: "Titillium Web";
    height: 100%;
    width: 100%;
}

/*----- links -----*/
a {
    color: #3192d6;
    outline: none;
    text-decoration: none;
}

a:hover,
a:focus {
    text-decoration: none;
}

a:active,
a:visited {
    text-decoration: none;
}


/* List */
ul.list {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 14px;
    padding-top: 10px;
}

ul.list li {
    background: url(./../images/marker.gif) top left no-repeat;
    background-position: 0 7px;
    padding-left: 15px;
    overflow: hidden;
    padding-bottom: 7px;
    color: #000;
    text-decoration: none;
    line-height: 18px;
    text-align: left;
}

ul.list li a {
    color: #000;
    text-decoration: none;
    text-align: left;
}

ul.list li a:hover {
    text-decoration: underline;
    text-align: left;
}

/* Ordered list style */
ol {
    margin: 0;
    padding: 0;
    font-weight: bold;
    zoom: 1
}

ol li {
    margin-left: 30px;
    list-style-position: outside;
    list-style-type: decimal;
    font-size: 12px;
    color: 353535;
    zoom: 1
}

ol li a {
    font-size: 12px;
    color: #6f6f6f;
    text-decoration: none;
    line-height: 28px;
    padding-left: 36px;
    background: url(./../images/bg_ol.gif) 2px 4px no-repeat;
    display: block;
    margin-left: -28px;
    font-weight: normal;
    zoom: 1
}

ol li a:hover {
    text-decoration: underline;
    color: #176BA5
}

ol li a strong {
    color: #353535
}



/*  Header styles */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Titillium Web", sans-serif;
    margin: 0 0 0px 0;
    line-height: 1.2em;
    color: #353535;
    position: relative;
}

h1 {
    font-size: 45px;
}

h2 {
    font-size: 40px;
}

h3 {
    font-size: 36px;
}

h4 {
    font-size: 32px;
}

h5 {
    font-size: 28px;
    color: #3192d6
}

h6 {
    font-size: 22px;
    color: #3192d6;
}

.h6 {
    font-size: 24px;
    color: #fff;
    margin-left: 39px;
    letter-spacing: -1px;
    margin-bottom: 18px
}

.hilightBox {
    border: medium none;
    color: #FFF;
    padding: 0 5px 0 5px;
    border-radius: 10px;
    background: none repeat scroll 0 0 #3192d6;
    font-size: 28px;
}

/* Paragraph styling */
p {
    margin-bottom: 21px;
    font-family: "Titillium Web", sans-serif;
}

.p {
    margin-bottom: 0;
}

.p1 {
    margin-bottom: 21px;
}

.p2 {
    margin-bottom: 9px;
}

.p3 {
    margin-bottom: 27px;
}

.head {
    position: relative;
    width: 950px;
    margin: 0 auto;
    height: 180px;
    background: url(./../images/top.gif) top left repeat-x;
}

.head nav {
    position: absolute;
    left: 0;
    top: 140px;
    width: 978px;
    z-index: 20;
}

.logo {
    z-index: 150;
    top: 29px;
    left: 0;
    position: absolute
}

.social_menu_top {
    position: absolute !important;
    top: 147px;
    right: 0;
    z-index: 500
}

.social_menu_top li {
    list-style: none;
    float: left;
    margin: 0 0 0 5px
}

.social_menu_top li a {
    cursor: pointer;
    display: block
}

.button {
    background-color: #3192d6;
    color: #fff;
    font-size: 14px;
    /* line-height: 36px; */
    height: 28px;
    padding: 0px 25px 0px 10px;
    display: inline-block;
    text-decoration: none;
    text-transform: none;
    font-family: "Titillium Web", serif;
    cursor: pointer;
    transition: all 0.3s ease 0s;
    border: none;
    background-image: url(../images/arrow-rm-white.png);
    background-repeat: no-repeat;
    background-position: right center;
    transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s;
    transition-timing-function: ease;
    -webkit-transition-timing-function: ease;
}

.button:hover {
    background-color: #414146;
    color: #fff;
    font-size: 14px;
    /* line-height: 36px; */
    height: 28px;
    padding: 0px 25px 0px 10px;
    display: inline-block;
    text-decoration: none;
    text-transform: none;
    font-family: "Titillium Web", serif;
    cursor: pointer;
    transition: all 0.3s ease 0s;
    border: none;
    background-image: url(../images/arrow-rm-white.png);
    background-repeat: no-repeat;
    background-position: right center;
    transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s;
    transition-timing-function: ease;
    -webkit-transition-timing-function: ease;
}

/* footer */
#footer-outer {
    color: #353535;
    font-size: 12px;
    background: url(./../images/bot.gif) top repeat-x #e6e6e8;
    height: 120px;
    font-family: "Titillium Web", serif;
    position: relative
}

#footer-outer .inside {
    padding: 33px 0px 50px 0px;
    position: relative
}

#footer-outer a {
    color: #d61e20;
    text-decoration: underline
}

#footer-outer a:hover {
    text-decoration: none
}

.title1 {
    position: absolute;
    right: 42px;
    top: 61px;
    font-size: 24px;
    color: #666;
    background: url(./../images/title1.gif) no-repeat 100% 0%;
    padding: 14px 27px 0 0;
    height: 38px;
}

.title1 strong {
    font-size: 18px;
}

.title {
    margin-bottom: 11px
}

#footer-outer ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

#footer-outer ul li {
    margin: 0px;
    display: inline;
    background: url(./../images/bg_li.gif) center left no-repeat;
    float: left;
    padding: 2px 14px 2px 14px
}

#footer-outer ul li:first-child {
    background: none;
    padding-left: 0
}

#footer-outer ul li a {
    color: #353535;
    text-decoration: none;
    display: block;
    float: left;
    text-transform: capitalize
}

#footer-outer ul li a:hover {
    text-decoration: none;
    color: #d61e20
}

#footer-outer ul .first {
    background: none;
    padding-left: 0px
}

#footer-outer ul li .current {
    text-decoration: none;
    color: #d61e20
}

.contact-block span {
    float: right;
    padding-right: 120px
}

#footer-sub {

    padding: 0px
}

/*#footer-outer
{
        padding:0 0 0 0;
                width:100%;
        text-align:left;
        display:block;
        overflow:hidden;
                height:166px;
                position:relative
}*/
file_button_container,
.filefile_button_container_button_container input {
    height: 47px;
    width: 263px;
}

.file_button_container {
    border: medium none;
    border-radius: 5px 5px 5px 5px;
    background: none repeat scroll 0 0 #f3ece1;
    text-decoration: none;
    font-family: "Titillium Web", serif;
    font-size: 15px;
}

.file_button_container input {
    opacity: 0;
}



#footer p {
    margin: 0
}

#footer {
    padding: 0;
    width: 940px;
    margin: 0 auto;
    height: 060px;
    position: relative;

}

.border_bottom {
    border-bottom: 1px solid #d2d2d2;
}

#footer .menu {
    position: absolute;
    left: 0px;
    top: 10px
}

#footer .menu .current a {
    color: #D61E20
}

#footer .menu ul {
    display: none
}

.copy {
    position: absolute;
    top: 40px;
    left: 0;
    color: #353535;
    font-size: 12px;
    text-transform: none;
    font-family: "Titillium Web", serif
}

.copy a {
    text-decoration: underline !important;
    text-transform: none;
    color: #d61e20
}

.copy a:hover {
    text-decoration: none !important;
    text-transform: none;
    color: #353535
}

.copy_title {
    color: #303030;
    font-size: 18px;
    position: absolute;
    top: 55px;
    left: 733px;
    text-transform: uppercase
}

.box {
    text-align: left
}

.box ul {
    list-style-type: none
}

#bottom .newsfeed-item {
    padding: 0;
    margin-bottom: 10px
}

.box .moduletable_menu,
.box .moduletable {
    margin: 10px
}

.box3 {
    padding-left: 10px
}

.box h3 {
    font-size: 1.3em
}

#bottom ul.latestnews {
    padding-left: 0
}

.bankaccount-popup {
    background: #FFF;
    padding: 10px;
    /*border: 2px solid #ddd;*/
    border: 0px #FFF;
    float: left;
    font-size: 1.2em;
    position: fixed;
    top: 10%;
    left: 20%;
    z-index: 99999;
    box-shadow: 0px 0px 20px #999;
    /* CSS3 */
    -moz-box-shadow: 0px 0px 20px #999;
    /* Firefox */
    -webkit-box-shadow: 0px 0px 20px #999;
    /* Safari, Chrome */
    border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
}

p.syndicate {
    float: left;
    display: block;
    text-align: left;
}


.jsstory-top {
    display: none;
    visibility: hidden;
}

.tick_sub_head {
    font-family: "Titillium Web", Arial;
    font-size: 18px;
    /*    font-weight: bold;*/
    color: #505050;
    text-decoration: none;
    text-align: left;
    padding-bottom: 4px;
}

.jscontnt {
    text-align: left;
    padding: 0px;
    font-size: 6px;
}

.listView td {
    border: 1px solid #ffffff;
    /* border: 1px solid #00000047; */
    /* padding: 2px; */
    padding-left: 5px !important;
}

/* .listView tr:first-child td:first-child {
    border-top-left-radius: 8px;
}

.listView tr:first-child td:last-child {
    border-top-right-radius: 8px;
}

.listView tr:last-child td:first-child {
    border-bottom-left-radius: 8px;
}

.listView tr:last-child td:last-child {
    border-bottom-right-radius: 8px;
} */

.OverDiv {
    border: 1px solid #fff;
    /* border-radius: 5px; */
    border: 1px solid #3192D6;
    border-radius: 8px;
    box-shadow: 2px 5px 5px 0 #c0c0c0;
    /* min-height:450px; */
    padding: 2px;
    margin: 0px 10px;
}

.OverDiv table input,
select {
    width: 158px;
    height: 20px;
    border: 1px solid grey;
}


.mainMenu {
    font-family: "Titillium Web", arial;
    font-size: 13px;
    font-weight: normal;
    color: #000000;
    /*#ffffc0;*/
    text-align: justify;
    padding: 0 0 0 30px;
    cursor: hand;
}

.subMenu {
    font-family: "Titillium Web", arial;
    font-size: 11px;
    font-weight: normal;
    color: #6B6060;
    /*#ffffc0;*/
    text-align: justify;
    padding: 0 0 0 50px;
    cursor: hand;

}

.subMenu:hover {
    background: url(../images/btn-sub-hover.png);
    cursor: hand;
}

.header {
    height: 468px;
    overflow: hidden;
    background: url(../images/header-tail.gif) 0 0 repeat-x;
}

.messageSuccess {
    font-family: "Titillium Web", arial;
    font-size: 18px;
    font-weight: bold;
    color: #FFFFFF;
    background-color: green;
    text-align: justify;
}

.messageFailure {
    font-family: "Titillium Web", arial;
    font-size: 18px;
    font-weight: bold;
    color: #FFFFFF;
    background-color: #E34D28;
    text-align: justify;
}

.pageText {
    font-family: "Titillium Web", sans-serif;
    font-size: 15px;
    font-weight: normal;
    color: #353535;
    text-align: left;
    /* line-height: 1.6em;    */
}

.pageText td {
    padding-left: 5px;
    /* line-height: 1.6em;    */
}

img.btn_close {
    /*Position the close button*/
    float: right;
    cursor: pointer;
}

.pageHeading {
    font-family: "Titillium Web", arial;
    font-size: 20px;
    font-weight: bold;
    color: #3192d6 !important;
    text-align: justify;
    -webkit-box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 1);
    -moz-box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 1);
    box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 1);
}

.pageHelp {
    font-family: "Titillium Web", arial;
    font-size: 16px;
    color: #3192d6;
    margin: 5px;
    background: #fff;
    border: 1px solid red;
    border-radius: 10px;
}

.notes {
    font-family: "Titillium Web", arial;
    font-size: 12px;
    color: #3192d6;
    margin: 5px;
    font-style: italic;
}

.pageCaption {
    font-family: "Titillium Web", "Georgia", "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: normal;
    color: #6f6f6f !important;
    text-align: left;
}

.pageSubCaption {
    font-family: "Titillium Web", "Georgia", "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: normal;
    color: #3192d6 !important;
    text-align: left;
    -webkit-box-shadow: -3px 3px 5px 0px rgba(49, 146, 214, 1);
    -moz-box-shadow: -3px 3px 5px 0px rgba(49, 146, 214, 1);
    box-shadow: -3px 3px 5px 0px rgba(49, 146, 214, 1);
}

.webPageCaption {

    font-family: "Titillium Web", arial;
    font-size: 16pt;
    font-weight: bold;
    color: #0092D5;
    height: 50px;
    text-align: justify;

}

.tableCaption {
    background: none repeat scroll 0 0 #4c4c4c;
    color: #FFFFFF;
    font-family: "Titillium Web", arial;
    font-size: 14px;
    font-weight: bold;
    /*text-align: justify;*/
}

.tableCaption td {
    padding-left: 5px;
}

.pageTitle {
    font-family: "Titillium Web", Arial;
    font-size: 20px;
    font-weight: bold;
    color: #000;
    text-decoration: none;
    text-align: left;
    padding-bottom: 3px;
    padding-top: 3px;
    padding-left: 18px;
    text-shadow: 1px 1px 0px #000;
    /* border-bottom: 1px solid #eff0f0; */
    position: 10px;
    text-transform: capitalize;
}

.fontToolTip {
    font-family: "Titillium Web", arial;
    font-size: 14px;
    font-weight: normal;
    background-color: #3192d6;
    color: #03100d;
    border-radius: 8px;
    border: 2px solid #3192d6;
    text-align: justify;
    padding: 5px;
    visibility: hidden;
    z-index: 100;
    box-shadow: 10px 10px 5px #888888;
}

a.backLink {
    color: #9f1a09;
    font-family: "Titillium Web", arial;
    font-size: 14px;
    font-weight: bold;
    cursor: hand;
    text-decoration: none;
}

a.backLink:hover {
    color: #9f1a09;
    font-family: "Titillium Web", arial;
    font-size: 14px;
    font-weight: bold;
    cursor: hand;
    text-decoration: underline;
}

a.geneologyLink {
    color: #25726c;
    font-family: "Titillium Web", arial;
    font-size: 16px;
    font-weight: bold;
    cursor: hand;
    text-decoration: none;
}

a.geneologyLink:hover {
    color: #25726c;
    font-family: "Titillium Web", arial;
    font-size: 16px;
    font-weight: bold;
    cursor: hand;
    text-decoration: underline;
}

a.smsLink {
    color: #25726c;
    font-family: "Titillium Web", arial;
    font-size: 14px;
    font-weight: bold;
    cursor: hand;
    text-decoration: none;
}

a.smsLink:hover {
    color: #25726c;
    font-family: "Titillium Web", arial;
    font-size: 14px;
    font-weight: bold;
    cursor: hand;
    text-decoration: underline;
}

a.deleteLink {
    color: #9f1a09;
    font-family: "Titillium Web", arial;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
}

a.deleteLink:hover {
    color: #9f1a09;
    font-family: "Titillium Web", arial;
    font-size: 14px;
    font-weight: bold;
    text-decoration: underline;
}

hr {
    margin-top: 20px;
}

/* table.planDetails{
    border:1px solid #353535 !important;
} */

table.planDetails td {
    border-bottom: 1px solid #353535 !important;
    border-right: 1px solid #353535 !important;
    padding: 2px 5px;
}

ul.terms {
    list-style-type: disc;
    margin-left: 10px;
    margin-right: 10px;
}

ul.terms li {
    padding: 5px;
}

ul.termsSub {
    list-style-type: lower-alpha;
    margin-left: 15px;
}

ul.terms li {
    padding: 5px;
}

/*website required css*/
/*
*/
/*.mandatory{
    color:red;
}
#main_banner{float:left; width:925px; background:url(../images/banner_bottom_shadow.png) no-repeat 0 bottom; padding:0 0 38px; position:relative}
#main_banner ul#rotate{float:left; width:925px; list-style:none; height:250px; overflow:hidden}
#main_banner ul#rotate li{float:left; width:auto; list-style:none;}
#main_banner ul#rotate li img{float:left;}

#main_banner ul#thumb-banner{float:left; width:auto; list-style:none; position:absolute; top:12px; right:6px; _right:-2px; z-index:9999}
#main_banner ul#thumb-banner li{float:left; width:14px; font-size:1px; margin:0 8px 0 0; padding:0; height:10px;}
#main_banner ul#thumb-banner li a{float:left; width:14px; background:url(../images/paging_bg.gif) no-repeat 0 0; color:#fff; text-decoration:none; text-align:center; padding:0; height:10px}
#main_banner ul#thumb-banner li a:hover{float:left; width:14px; background:url(../images/paging_bg.gif) no-repeat 0 bottom; color:#fff; padding:0; height:10px}
#main_banner ul#thumb-banner li.current{float:left; width:14px; margin-right:8px; padding:0; height:10px}
#main_banner ul#thumb-banner li.current a{float:left; width:14px; background:url(../images/paging_bg.gif) no-repeat 0 bottom; color:#fff; padding:0; height:10px}
#main_banner ul#thumb-banner li.current a:hover{float:left; width:14px; background:url(../images/paging_bg.gif) no-repeat 0 bottom; color:#fff; padding:0; height:10px}
#main_banner .gallery_details{float:left; width:925px; background:url(../images/gallery_details_bg.png) repeat 0 0; color:#fff; padding:5px 15px 15px; _padding-bottom:4px; position:absolute; left:0; bottom:0}
*/
.subPanel {
    vertical-align: top;
    border: solid #eff0f0 1px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    background-color: #f5f5f5;
}

.locationClass {
    background: #3192d6;
    padding: 2px;
    padding-left: 10px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 0;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

a.redbutton {
    height: 30px;
    vertical-align: middle;
    background: #c6c6c1;
    display: inline-block;
    font: 14px "Open Sans", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #FE2E2E;
    font-weight: bold;
    padding: 10px 10px 0px 10px;
    border-radius: 3px;
    border: 0px solid #4c4c4c;
    box-shadow: 0px 0px 1px #c6c6c1;
    cursor: pointer;
    text-decoration: none;
}

a.redbutton:hover {
    background: #FE2E2E;
    color: #FFFFFF;
    border-color: #4c4c4c;
    cursor: pointer;
}

.genealogy-view {
    background: url('../images/geneology_bg.png') no-repeat center center;
    text-indent: -9999px;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
    background-position: 50% 50%;
}

/*.genealogy-view{
    width:100%;
    background:url('../images/geneology_bg.png')no-repeat center center;
    background-size:cover;
}*/
/* @media all and (max-width:76em){
    .genealogy-view{
        background:url('../images/geneology_bg_2.png')no-repeat center center;
        text-indent:-9999px;
        -moz-background-size:cover;
        -webkit-background-size:cover;
        background-size:cover;
        background-position:50% 50%;
    }
} */
/* @media all and (max-width:56em){
    .genealogy-view{
        background:url('../images/geneology_bg_3.png')no-repeat center center;
        text-indent:-9999px;
        -moz-background-size:cover;
        -webkit-background-size:cover;
        background-size:cover;
        background-position:50% 50%;
    }
}
@media all and (max-width:36em){
    .genealogy-view{
        background:url('../images/geneology_bg_4.png')no-repeat center center;
        text-indent:-9999px;
        -moz-background-size:cover;
        -webkit-background-size:cover;
        background-size:cover;
        background-position:50% 50%;
    }
} */
/*@media all and (max-width:125em){
    .genealogy-view{
        background:url('../images/geneology_bg_1.png')no-repeat center center;
        background-size:cover;
    }
}*/


.login a {
    background: #204a87;
    border-radius: 0%;
    -webkit-border-radius: 0%;
    box-shadow: 0 1px 1px #FFFFFF, 0 1px 1px rgba(0, 0, 0, 0.15) inset;
    display: block;
    height: 25px;
    position: relative;
    transition: background 250ms ease 0s;
    width: 80px;
    margin: 3px;
    padding: 5px;
}

.login a:hover {
    background: #c0c0c0;
    border-radius: 0%;
    -webkit-border-radius: 0%;
    box-shadow: 0 1px 1px #FFFFFF, 0 1px 1px rgba(0, 0, 0, 0.15) inset;
    display: block;
    height: 25px;
    position: relative;
    transition: background 250ms ease 0s;
    width: 80px;
}

.icon-box-container {
    margin: 10px 0 0px 0;
    float: left;
}

#navFix #nav {
    width: 240px;
    display: block;
    background: #FFFFFF;
    border: 1px solid #d2d2d1;
    z-index: 9999;
    position: absolute;
    top: 33px;
    left: -1px;
    display: none;
    padding-top: 4px;
    padding-bottom: 0px;
}

#nav li {
    list-style: none;
    line-height: normal;
    font-size: 13px;
    color: #555555;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 45px;
    background: url(../images/navi-d.png) no-repeat right center;
    margin: 0px 6px;
    border-top: 1px solid #aeaeae;
}

::selection {
    background: #046eb2;
    color: #ffffff;
}

#nav .drop {
    display: none;
    margin: 0;
    padding: 0;
    width: 420px;
    position: absolute;
    top: 4px;
    left: 218px;
    background: #fdfdfd;
    height: 323px;
    border: 1px solid #d2d2d1;
    -webkit-box-shadow: 3px 1px 5px 2px #e2e2e2;
    box-shadow: 3px 1px 5px 2px #e2e2e2;
    padding: 10px;
}

#nav a {
    font-size: 13px;
    color: #555555;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 45px;
    display: block;
    padding: 0px 6px;
    margin: 0;
    text-align: left;
    text-decoration: none;
}

#nav .current a,
#nav li:hover>a {
    background: #696969 url(../images/navi-dh.png) no-repeat right center;
    color: #fff;
}

#nav .drop ul.cat {
    width: 400px;
    margin-left: 10px;
    float: left;
    margin-top: 5px;
    padding-right: 15px;
}

#nav .drop ul.cat ul li a:hover {
    border: none;
    color: #e09a0d;
}

#nav .drop ul.cat li:hover>a {
    background: none;
    border: none;
}

#nav .drop ul.cat .cld {
    background: none;
    margin-left: 10px;
    border: none;
}

foot {
    background: -webkit-linear-gradient(#e5e5e5, #fff);
    /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#e5e5e5, #fff);
    /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#e5e5e5, #fff);
    /* For Firefox 3.6 to 15 */
    background: linear-gradient(#e5e5e5, #fff);
    /* Standard syntax */
    padding-top: 5px;
    padding-bottom: 5px;
}


#submitButton {
    padding: 6px 12px 6px 12px;
    border-radius: 4px;
    border: 1px solid #e5e5e5 !important;
    float: none;
    font-size: 15px;
    font-weight: 500;
    background: -webkit-linear-gradient(#6495ED, #1464F4);
    /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#6495ED, #1464F4);
    /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#6495ED, #1464F4);
    /* For Firefox 3.6 to 15 */
    background: linear-gradient(#6495ED, #1464F4);
    /* Standard syntax */

}

#footImages {
    float: right;
    padding-left: 10px;
    padding-top: 10px;
    padding-bottom: 5px;
    padding-right: 10px;
    vertical-align: center;
    width: 60;
    height: 33;
}

#navFix {
    float: left;
    width: 240px;
    border: 1px solid #b98317;
    position: relative;
    list-style: none;
    background: #eba210 url(../images/nnavbg.jpg) repeat-x 0 0;
    height: 37px;
    -webkit-border-radius: 5px 5px;
    border-radius: 5px 5px;
}

#navFix .tlt {
    color: #553800;
    font-size: 18px;
    font-family: Arial, Helvetica, sans-serif;
    padding: 0 12px;
    line-height: 37px;
    background: url(../images/ndarrow.png) no-repeat right center;
    display: block;
    text-align: left;
}

.prev_thumb {
    margin: 5px;
    min-height: 100px;
    min-width: 100px;
}

.cart {
    color: #FFF;
    padding: 6px 8px 6px 8px;
    border: 1px solid green;
    background-color: #5FC51B;
    display: inline-block;
    font-weight: 500;
    outline: none;
    font-size: 15px;
    cursor: pointer;
    width: 150px;
    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    -ms-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out;
    border-radius: 2px;
    box-shadow: inset 0px -1px 0px 0px rgba(0, 0, 0, 0.2);
    letter-spacing: -0.2px;
    align-items: flex-start;
    text-align: center;
    box-sizing: border-box;
    text-decoration: none;

}

.productcontact {
    color: #FFF;
    padding: 6px 8px 6px 8px;
    border: 1px solid orangered;
    background-color: orange;
    display: inline-block;
    font-weight: 500;
    outline: none;
    font-size: 15px;
    cursor: pointer;
    width: 150px;
    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    -ms-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out;
    border-radius: 2px;
    box-shadow: inset 0px -1px 0px 0px rgba(0, 0, 0, 0.2);
    letter-spacing: -0.2px;
    align-items: flex-start;
    text-align: center;
    box-sizing: border-box;
    text-decoration: none;
}

.cart:hover {

    background: #c0c0c0;
    border: 1px solid #c0c0c0;
    width: 150px;
    /*    border-radius: 0%;
        -webkit-border-radius: 0%;
        box-shadow: 0 1px 1px #FFFFFF, 0 1px 1px rgba(0, 0, 0, 0.15) inset;
        display: block;
        height: 25px;
        position: relative;
        transition: background 250ms ease 0s;
        width: 80px;*/



}

.productcontact:hover {
    background: #c0c0c0;
    border: 1px solid #c0c0c0;
    width: 150px;
    /*    border-radius: 0%;
        -webkit-border-radius: 0%;
        box-shadow: 0 1px 1px #FFFFFF, 0 1px 1px rgba(0, 0, 0, 0.15) inset;
        display: block;
        height: 25px;
        position: relative;
        transition: background 250ms ease 0s;
        width: 80px;*/
}

/*DNB Developers*/
.tdAlign {
    text-align: right;
}

.readOnlyTextBox {
    /*background-color: honeydew;*/
    background-color: #fffee6 !important;
    border: 1px solid grey;
}

select {
    height: 25px;
    width: 173px;
    border: 1px solid grey;
}

input[type="text"] {
    border: 1px solid grey;
}

.mendatory,
.mandatory {
    color: red;
}

.amount {
    width: 60px;
}

.description {
    height: 20px !important;
}

.popupHeading {
    background-color: #3192d6;
    color: white;
    text-align: left;
    border-bottom: 2px solid rgb(72, 72, 72);
    text-transform: uppercase;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

.popupHeading h5 {
    color: white;
    font-size: 28px;
}

.closePopup {
    background-color: transparent;
    background-image: url(../images/icon_block.png);
    border: 0px;
    height: 20px;
    width: 19px;
    z-index: 1100;
    cursor: pointer;
}

center b {
    color: #3192d6;
}

.custom-hidden,
.hide-branches {
    display: none;
    visibility: hidden;
}

/* Radio Button */

.radio,
.checkbox {
    position: relative;
    display: block;
    min-height: 18px;
    margin-bottom: 5px;
}

.radio label,
.checkbox label {
    display: inline-block;
    padding-left: 35px;
    margin-bottom: 0;
    cursor: pointer;
    line-height: 20px;
}

.radio input[type=radio] {
    position: absolute;
    margin-left: -30px;
    margin-top: 1px \9;
    line-height: normal;
    box-sizing: border-box;
    padding: 0;
    width: 25px;
    height: 18px;
    top: -2px;
}

/* Checkbox/Radio Inline Button */

.checkbox-inline,
.radio-inline {
    display: inline-block;
    padding-left: 30px;
    margin-bottom: 0;
    font-weight: 400;
    vertical-align: middle;
    cursor: pointer;
    max-width: 100%;
}

.checkbox-inline input[type=checkbox],
.radio-inline input[type=radio] {
    position: absolute;
    margin-top: 4px \9;
    margin-left: -25px;
    width: 25px;
    height: 18px;
}

.button-default {
    background-color: #3192d6;
    color: #fff;
    font-size: 14px;
    height: 28px;
    padding: 0px 20px 0px 20px;
    text-decoration: none;
    text-transform: none;
    font-family: "Titillium Web", serif;
    cursor: pointer;
    border: none;
    margin-bottom: 5px;
    text-align: center;
    width: 100%;
}

.home-btn {
    padding: 17px 10px;
}

.home-btn i {
    color: #010101;
    font-size: 25px;
    position: relative;
    top: 7px;
}

.home-btn:hover {
    background: #c5c9ca;
}

.home-btn-color {
    background: #97cf7f;
}

.dashboard-btn-color {
    background: #ffaf42;
}

.search-btn-color {
    background: #2daefd;
}

.search-inventory-btn-color {
    background: #e0bd00;
}

.notification-btn-color {
    background: #e0bd00;
}

.master-btn-color {
    background: #cc65fe;
}

.my-account-btn-color {
    background: #fe4040;
}

.whatsapp-btn-color {
    background: #00e676;
}

.img-info {
    vertical-align: middle;
    cursor: pointer;
    margin-left: 5px;
}

.control-textbox {
    min-width: 60%;
}

.control-label-td {
    width: 30%;
    text-align: right;
}

.required-msg {
    color: red;
    font-weight: 600;
}

.select-loading {
    background: white url(../images/auto-image.gif) 95% center no-repeat;
}

.input-loading {
    background: white url(../images/auto-image.gif) right center no-repeat !important;
}

.view-password {
    cursor: pointer;
    height: 26px;
    text-align: center;
    width: 30px;
    padding: 0px 8px 3px 8px;
}

.view-password:hover {
    background-color: #d4d4d4
}

.view-password img {
    width: 16px;
    margin-top: 5px;
    position: relative;
    top: 4px;
}

.view-password.active {
    background-color: #d4d4d4
}

/* Style the div - display items horizontally */
.div-inline {
    display: inline-block;
    /*    flex-flow: row wrap;
    align-items: center;*/
}

/* Add some margins for each label */
.div-inline label {
    margin: 5px 10px 5px 0;
}

/* Style the input fields */
.div-inline input {
    vertical-align: middle;
    margin-right: 10px;
}

.clearfix-mb-10 {
    clear: both;
    margin-bottom: 5px;
}

.alert {
    padding: 5px;
}

.alert-delete p {
    color: red;
    font-weight: bold;
    margin: 0px 0px 15px 0px;
}

.alert-delete p {
    color: red;
    font-weight: bold;
    margin: 0px 0px 15px 0px;
}

.alert-delete ul>li {
    list-style: disc;
    font-weight: bold;
    color: red;
}

.search-section {
    background: #dfeef9;
    margin-bottom: 24px;
}

.summary-section {
    margin-bottom: 24px !important;
}

.action-section {
    background: #defbc9;
}

.rules-section {
    background: #dfeef9;
    margin-bottom: 24px;
}

.modal-rules-section {
    background: #dfeef9;
    margin-bottom: 18px;
}

.info-section {
    background: #dfeef9;
    margin-bottom: 24px;
}

.seperator,
.separator {
    display: inline-block;
    margin-left: 3px;
    padding-left: 3px;
    border-left: 1px solid #c5c2c2;
    top: 2px;
    position: relative;
    height: 15px;
}

#overlay,
.process-loader-index {
    position: fixed;
    z-index: 99999;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    text-align: center;
    background: rgba(0, 0, 0, 0.9);
    transition: 1s 0.4s;
}

#overlay img,
.process-loader-index img {
    margin-top: 15%;
    width: 10%;
}

#overlay p,
.process-loader-index p {
    color: #DDD;
}

.tooltip {
    /*position: relative;*/
    display: inline-block;
    /*border-bottom: 1px dotted #4c4c4c;*/
    z-index: 999;
}

.tooltip .tooltiptext {
    font-family: "Titillium Web", arial;
    font-weight: bold;
    font-size: 11px;
    visibility: visible;
    position: absolute;
    min-width: 50px;
    max-width: 300px;
    background-color: rgba(76, 76, 76, 0.9);
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 5px;
    z-index: 999;
    /*top: 150%;
    left: 50%;*/
    margin-left: -50px;
    margin-top: 8px;
}

/*.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent black transparent;
}*/

.tooltip:hover .tooltiptext {
    visibility: visible;
}

/* DASHBOARD CSS */
#details ul {
    list-style: none;
    display: inline;
    padding: 0;
}

#details .heading {
    font-weight: bold;
    background: #4c4c4c;
    color: #FFFFFF;
    padding: 5px;
    margin: 0px 0px 5px;
}

#details .subpanel {
    border: 1px solid #d7d7d7;
    vertical-align: top;
    box-shadow: 2px 2px 2px 0px #d7d7d7;
    padding: 0px 0px 10px;
}

.subpanel ul li {
    padding: 0px 5px;
}

div #quick-links {
    margin: 5px 0 0 1px;
    padding: 0 0px 0 8px;
}

#quick-links {
    display: inline-block;
}

ul#quick-links {
    list-style: none;
    display: inline;
    padding: 0;
}

#quick-links li {
    float: left;
    list-style-type: none;
    margin: 5px 0 0 1px;
    padding: 0 0px 0 8px;
    text-align: center;
    width: 8.50em;
    height: 8.6em;
}

#quick-links li a {
    text-decoration: none;
    cursor: pointer;
    text-align: center;
}

.quick-links-info {
    width: 8em;
    height: 8em;
    clear: both;
    box-shadow: 0 0 0px 0px #9FA0A0 inset, 0 2px 3px #4C4B4B;
    background-color: #f9f9f9;
    border: 1px solid #e3e3e3;
    background: -moz-linear-gradient(top, #f9f9f9 0%, #f9f9f9 47%, #f9f9f9 56%, #f9f9f9 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f9f9f9), color-stop(47%, #e3e3e3), color-stop(56%, #d7d7d7), color-stop(100%, #e8e8e8));
    background: -webkit-linear-gradient(top, #f9f9f9 0%, #e3e3e3 47%, #d7d7d7 56%, #e8e8e8 100%);
    background: -o-linear-gradient(top, #f9f9f9 0%, #e3e3e3 47%, #d7d7d7 56%, #e8e8e8 100%);
    background: -ms-linear-gradient(top, #f9f9f9 0%, #e3e3e3 47%, #d7d7d7 56%, #e8e8e8 100%);
    background: linear-gradient(to bottom, #f9f9f9 0%, #f9f9f9 47%, #f9f9f9 56%, #f9f9f9 100%);
    border-radius: 6px;
    -ms-border-radius: 6px;
}

.quick-links-info-remove {
    width: 8em;
    height: 8em;
    clear: both;
    box-shadow: 0 0 0px 0px #9FA0A0 inset, 0 2px 3px #4C4B4B;
    color: #fff;
    background-color: #f9f9f9;
    border: 1px solid #ff0b00;
    background: -moz-linear-gradient(top, #e84b4b 0%, #e84b4b 47%, #e84b4b 56%, #e84b4b 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e84b4b), color-stop(47%, #e3e3e3), color-stop(56%, #d7d7d7), color-stop(100%, #e8e8e8));
    background: -webkit-linear-gradient(top, #e84b4b 0%, #e3e3e3 47%, #d7d7d7 56%, #e8e8e8 100%);
    background: -o-linear-gradient(top, #e84b4b 0%, #e3e3e3 47%, #d7d7d7 56%, #e8e8e8 100%);
    background: -ms-linear-gradient(top, #e84b4b 0%, #e3e3e3 47%, #d7d7d7 56%, #e8e8e8 100%);
    background: linear-gradient(to bottom, #e84b4b 0%, #e84b4b 47%, #e84b4b 56%, #e84b4b 100%);
    border-radius: 6px;
    -ms-border-radius: 6px;
}

.quick-links-info:hover {
    background: linear-gradient(to bottom, #f9f9f9 0%, #e3e3e3 47%, #d7d7d7 56%, #e8e8e8 100%);
}

.quick-links-info-remove:hover {
    background: linear-gradient(to bottom, #e85151 0%, #ea8282 47%, #f98383 56%, #f79898 100%);
}

/*    .content-list-info a{
        cursor: pointer; text-decoration: none; position: relative; left: 20%; top:4px; font-weight: bold; 
    }*/
.quick-links-info img,
.quick-links-info-remove img {
    width: 64px;
    height: auto;
    margin: 2px 0px 0px 0px;
    border-style: none;
}

/* Page Heading - Video Tutorial Icon */
.pageTitle .video-tutorial-icon {
    width: 30px;
    height: auto;
    vertical-align: bottom;
    cursor: pointer;
    margin-left: 10px;
}

.video-tutorial input[type="radio"] {
    width: 20px;
    height: 20px;
    position: relative;
    top: 5px;
    margin-right: 5px;
    margin-left: 10px;
    cursor: pointer;
}

.video-tutorial label {
    cursor: pointer;
}

/* Tabs */

.container {
    width: 100%;
    margin: 0 auto;
}

ul.tabs {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

ul.tabs li {
    /*background: none;*/
    background: linear-gradient(top, #cecece 0%, #eee9f0 100%);
    background: -webkit-linear-gradient(top, #cecece 0%, #eee9f0 100%);
    background: -o-linear-gradient(top, #cecece 0%, #eee9f0 100%);
    background: -ms-linear-gradient(top, #cecece 0%, #eee9f0 100%);
    color: #222;
    display: inline-block;
    padding: 10px 15px;
    cursor: pointer;
    font-weight: bold;
}

ul.tabs li.current {
    background: #FFFFFF;
    /*3192d6*/
    color: #222;
}

.tab-content {
    display: none;
    background: #FFFFFF;
    padding: 15px;
}

.tab-content.current {
    display: inherit;
}

.delete-order {
    color: red;
    font-weight: bold;
}

/* MASTER SETTING PAGE UI */

#master-settings-quick-links {
    display: inline-block;
}

ul#master-settings-quick-links {
    list-style: none;
    display: inline;
    padding: 0;
}

#master-settings-quick-links li {
    float: left;
    list-style-type: none;
    margin: 5px 0 0 1px;
    padding: 0 0px 0 8px;
    text-align: center;
    width: 16.6em;
    height: 8.6em;
}

#master-settings-quick-links li a {
    text-decoration: none;
    cursor: pointer;
    text-align: center;
}

#master-settings-quick-links .quick-links-info {
    width: 16.30em;
    height: 8em;
    clear: both;
    box-shadow: 0 0 0px 0px #9FA0A0 inset, 0 2px 3px #036bad;
    background-color: #f9f9f9;
    border: 1px solid #e3e3e3;
    background: -moz-linear-gradient(top, #f9f9f9 0%, #f9f9f9 47%, #f9f9f9 56%, #f9f9f9 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f9f9f9), color-stop(47%, #e3e3e3), color-stop(56%, #d7d7d7), color-stop(100%, #e8e8e8));
    background: -webkit-linear-gradient(top, #f9f9f9 0%, #e3e3e3 47%, #d7d7d7 56%, #e8e8e8 100%);
    background: -o-linear-gradient(top, #f9f9f9 0%, #e3e3e3 47%, #d7d7d7 56%, #e8e8e8 100%);
    background: -ms-linear-gradient(top, #f9f9f9 0%, #e3e3e3 47%, #d7d7d7 56%, #e8e8e8 100%);
    background: linear-gradient(to bottom, #f9f9f9 0%, #f9f9f9 47%, #f9f9f9 56%, #f9f9f9 100%);
    border-radius: 6px;
    -ms-border-radius: 6px;
}

#master-settings-quick-links .quick-links-info:hover {
    background: linear-gradient(to bottom, #f9f9f9 0%, #e3e3e3 47%, #d7d7d7 56%, #e8e8e8 100%);
}

#master-settings-quick-links .quick-links-info i {
    color: #fe3f3f;
    position: relative;
    top: 10px;
}

#master-settings-quick-links .quick-links-info span {
    color: #121212;
    font-size: 18px;
    font-weight: bold;
    position: relative;
    top: 20px;
}

#master-settings-quick-links .quick-links-info [class*="icon-"] {
    display: inline-block;
}

#master-settings-quick-links .quick-links-info:hover [class*="icon-"] {
    -webkit-animation: icon-spin 2s linear infinite;
    -moz-animation: icon-spin 2s linear infinite;
    animation: icon-spin 2s linear infinite;
}

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

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

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

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

.action-icon-size {
    font-size: 23px;
}

.sms-template {
    line-height: 20px;
    border: 1px solid #c1c0c0;
    background: #faebd7;
    padding: 10px;
    border-radius: 10px;
    font-weight: bold;
    margin-bottom: 5px;
}

ul.info-content {
    padding-left: 20px;
}

ul.info-content li {
    list-style: disc;
}

ul.info-content li.list-style-none {
    list-style: none;
}

.highlight-1 {
    background-color: #F6F54D;
    padding: 5px 15px;
    font-size: 15px;
    font-weight: bold;
    border: 1px solid #cac8c8;
    margin: 0 10px;
    cursor: text;
    line-height: 1.5;
    text-align: center;
}

.highlight-danger {
    background-color: #ff4343;
    padding: 5px 15px;
    font-size: 15px;
    font-weight: bold;
    border: 1px solid #ffd7d7;
    margin: 0 10px;
    cursor: text;
    color: #fff;
    line-height: 1.5;
    text-align: center;
}

.highlight-success {
    background-color: #40be47;
    padding: 5px 15px;
    font-size: 15px;
    font-weight: bold;
    border: 1px solid #78c27a;
    margin: 0 10px;
    cursor: text;
    color: #fff;
    line-height: 1.5;
    text-align: center;
}

.highlight-info {
    background-color: #7dcbf9;
    padding: 5px 15px;
    font-size: 15px;
    font-weight: bold;
    border: 1px solid #45bbff;
    margin: 0 10px;
    cursor: text;
    color: #000;
    line-height: 1.5;
    text-align: center;
}

label.highlight-info {
    line-height: 2;
}

.inline-block {
    display: inline-block;
}

div.width-auto {
    width: auto;
    word-wrap: break-word;
    margin: 0 5px;
}

.button:disabled,
.button[disabled] {
    background-color: #cccccc;
    color: #666666;
}

ul.with-icon {
    padding: 0;
}

ul.with-icon li i {
    padding-right: 5px;
    font-weight: bolder;
    color: #3192d6;
}

.error {
    color: red;
    font-weight: 600;
}

.text-center {
    text-align: center;
}

.text-bold {
    font-weight: bold;
}

/* --------------------------------- BUTTON --------------------------------- */

.btn {
    background-color: #f64249d4;
    border: none;
    color: white;
    padding: 10px 24px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    cursor: pointer;
    margin-bottom: 10px;
}

.btn:hover {
    /* box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19); */
    box-shadow: 0px 2px 4px 1px rgb(0 0 0 / 24%);
}

.btn.btn-block {
    display: block;
    width: 100%;
}

.bg-color-1 {
    background-color: #f64249d4 !important
        /* Green */
}

.btn-success {
    background: #309122d4 !important;
    color: #fff;
}

.btn-success:hover {
    color: #fff;
    background-color: #218838 !important;
    border-color: #1e7e34 !important;
}

.btn-md {
    padding: 5px 5px;
    font-size: 12px;
    margin-bottom: 0px;
}

.btn-primary {
    background-color: #3192d6 !important;
}

.btn-primary:hover {
    background-color: #414146 !important;
}

.btn-secondary {
    background-color: #f64249d4 !important
        /* Green */
}

.btn-secondary:hover {
    background-color: #414146 !important;
}

.btn-default {
    color: #fff;
    background-color: #898989;
    border-color: #898989;
}

.btn-default:hover {
    color: #fff;
    background-color: #5a6268;
    border-color: #545b62;
}

.btn-blue {
    background-color: #3192d6 !important;
}

.btn-blue:hover {
    background-color: #414146 !important;
}

.btn-small {
    padding: 0px 5px;
    font-size: 12px;
}

.btn-danger {
    background: #f44336 !important;
    color: #fff !important;
}

.btn-danger:hover {
    color: #fff;
    background-color: #c82333 !important;
    border-color: #bd2130 !important;
}

.btn-action {
    background-color: #f64249d4;
    color: #fff;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.btn-action:hover {
    background: #f41c25d4;
    color: #fff;
}

.btn-action:not(:disabled):not(.disabled) {
    cursor: pointer;
}

.btn-action:focus,
.btn-action:hover {
    text-decoration: none;
}

.btn-action-md {
    padding: 10px 12px;
    font-size: 13px;
    margin: 5px 0;
}

/* ------------------------------- Text Colors ------------------------------ */

.text-danger {
    color: #f44336 !important;
}

.text-primary {
    color: #3192d6;
}

.text-secondary {
    color: #f84345;
}

.text-white {
    color: #FFFFFF;
}

.text-success {
    color: #28a745;
}

.text-info {
    color: #17a2b8 !important;
}

/*------------------- Lock Screen ----------------- */

.lock-screen {
    text-align: center;
}

.pin input {
    width: 30px;
    padding: 10px;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    border: 1px solid #a49c9c;
    border-radius: 10%;
    margin-bottom: 10px;
}

.pinTextBox {
    width: 3% !important;
    margin-left: 10px;
    padding: 6px;
    font-size: 20px;
    text-align: center;
}

div.view-password {
    padding: 3px;
    display: inline-block;
    position: relative;
    top: -8px;
    margin-left: 5px;
    background-color: #f44547;
    color: #FFFFFF;
    border-radius: 50%;
    width: 25px;
    height: 25px;
}

div.view-password i {
    position: relative;
    top: 5px;
}

div.view-password:hover {
    opacity: 1;
    background-color: #f44547;
    ;
}

/** --------------------- fa action Icon --------------------- */
.list-action-icon {
    vertical-align: text-top;
    text-decoration: none;
    cursor: pointer;
}

.list-action-icon i {
    font-size: 18px;
}

.list-action-icon i.print-icon {
    font-size: 22px;
    color: #000000;
}

/** --------------------- Add Supplier --------------------- */

.add-supplier,
.small-square-btn {
    cursor: pointer;
    height: 24px;
    width: 24px;
    font-size: 12px;
    background-color: #3192d6;
    margin-right: 10px;
    border: none;
}

.small-square-btn:disabled {
    background: #b3b3b3;
}

/* ------------------------------ read only div ----------------------------- */
.readOnlyDiv {
    width: auto;
    background-color: #fffee6;
    padding: 3px;
    margin: 3px
}

/* ------------------------------ fa icon size ------------------------------ */
.fa-icon-size-action {
    font-size: 0.9em;
}

/* ----------- icon size for information in place of the checkbox ----------- */
.check-box-info-icon {
    cursor: pointer;
    margin-right: 5px;
}

.check-box-info-icon i {
    font-size: 24px;
    color: #17a2b8;
}

/* -------------------------- Action Option Buttons ------------------------- */
ul.option-buttons {
    padding: 0;
    margin: 0;
}

.option-buttons li {
    display: inline-block;
    margin: 5px;
}

/* --------------------------------- Cursor --------------------------------- */

.pointer {
    cursor: pointer;
}

/* ---------------------------- Float left/right ---------------------------- */

.pull-left {
    float: left;
}

.pull-right {
    float: right;
}

/* --------------------------------- Margins -------------------------------- */

.mt-24 {
    margin-top: 24px;
}

.mb-none {
    margin-bottom: 0 !important;
}

.mb-xs {
    margin-bottom: 2px !important;
}

.mt-none {
    margin-top: 0;
}

.mlr-none {
    margin-left: 0;
    margin-right: 0;
}

.mt-xs {
    margin-top: 2px !important;
}

.ml-5 {
    margin-left: 5px;
}

.mr-5 {
    margin-right: 5px;
}

.mt-13 {
    margin-top: -13px;
}
/* -------------------------------- Paddings -------------------------------- */

.p-none {
    padding: 0px;
}

/* -------------------------------- Text Css -------------------------------- */

.text-right {
    text-align: right;
}

.text-left {
    text-align: left;
}

/* -------------------------------- Other Css ------------------------------- */

.inline-block {
    display: inline-block;
}

/* ------------------------------ Sortable Css ------------------------------ */

#sortable,
#sortable_label {
    list-style-type: none;
    margin: 0;
    padding: 0;
    font-size: 60%;
    width: 100%;
}

#sortable li {
    margin-bottom: 10px;
    padding: 5px;
    font-size: 15px;
    height: auto;
    text-align: center;
    color: #353535 !important;
    font-weight: normal;
    cursor: move;
}

#sortable_label li {
    background: #F6F6F6;
    border: 1px solid #CCCCCC;
    color: #1C94C4;
    font-weight: bold;
    margin-bottom: 10px;
    padding: 5px;
    font-size: 15px;
    height: auto;
    text-align: center;
    color: #353535 !important;
}

#sortable li span {
    position: absolute;
    margin-left: -1.3em;
}

/* ------------------------------ Slide Out Help Button ------------------------------ */
.container-wa .card {
    position: absolute;
    width: 450px;
    height: 260px;
    background-color: white;
    border-radius: 5px;
    right: 40px;
    bottom: 88px;
    display: none;
    border: 1px solid rgba(0, 0, 0, 0.15);
    z-index: 10000;
}

.container-header {
    background-color: dodgerblue;
    color: white;
    font-weight: 500;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 25px
}

.image {
    border-radius: 50px;
    width: 60px;
    height: 65px;
    margin-top: -12px;
    margin-bottom: 10px
}

.text {
    font-weight: 600;
}

.blinking {
    animation: blinking 2s infinite;
    font-weight: 900;
    display: block;
    line-height: 1.5;
    font-size: 15px;
    border: 1px solid rgb(0, 0, 0, 0.15);
    border-radius: 5px;
    padding: 10px 6px;
    margin-top: 9px;
}

@keyframes blinking {
    0% {
        color: #000;
    }

    25% {
        color: #ff4040;
    }

    50% {
        color: #8f2c2c;
    }

    75% {
        color: #ff4040;
    }

    100% {
        color: #8f2c2c;
    }
}

#slideout-label {
    animation: slideout-label 4s infinite;
    transform: translate(-110px, -110px) rotate(270deg);
    transform-origin: top right;
    background-color: #fe423e;
    padding: 2px 5px;
    margin: 0;
    width: 100px;
    display: block;
    font-weight: bold;
    color: white;
    font-size: 12px;
    letter-spacing: 1px;
    cursor: pointer;
}

@keyframes slideout-label {
    0% {
        background-color: #fe423e;
    }

    25% {
        background-color: #000000;
    }

    50% {
        background-color: #fe423e;
    }

    75% {
        background-color: #000000;
    }

    100% {
        background-color: #fe423e;
    }
}

#slideout-label-arrow {
    float: left;
    font-size: 1.0em;
}

.label-arrow-left {
    margin: -2px 0px 6px 8px;
    transform: rotate(90deg);
    transform-origin: 0;
}

.label-arrow-right {
    margin: 5px 10px 0 5px;
    transform: rotate(-90deg);
    transform-origin: 0;
}

#slideout {
    position: fixed;
    bottom: -25px;
    padding: 0;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    z-index: 1000;
}

#slideout-inner {
    font-weight: bold;
    font-size: 14px;
    position: fixed;
    bottom: 0px;
    background: #e3ecfc;
    width: 280px;
    height: 290px;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    text-align: left;
    color: #000;
    margin-top: 200px;
}

.slideout-hidden {
    left: 0px;
}

.slideout-visible {
    left: 280px;
}

.slideout-inner-hidden {
    left: -295px;
}

.slideout-inner-visible {
    left: 0;
}

.slideout-overlay {
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    visibility: visible;
    background: #000000;
    opacity: 0.9;
    display: none;
}

.return-product, .return-product td textarea, .return-product td input, .return-product td select {
    color: #fff;
    background: red;
    border: white;
}

.return-product-partially, .return-product-partially td textarea, .return-product-partially td input, .return-product-partially td select {
    color: #ffffff;
    background: #ffc107 !important;
    border: #ffffff;
}

.return-product .readOnlyDiv, .return-product-partially .readOnlyDiv {
    background-color: transparent !important;
}


/* ---------------------------- Country Code box ---------------------------- */

.country-code-box {
    display: inline-block;
    padding: 0 7px;
    background-color: #fffee6;
    border: 1px solid #808080;
    height: 22px;
    position: relative;
    top: 2px;
    text-align: center;
}

.country-code-box span {
    position : relative;
    top : -2px;
}

/* ------------------------------ label & input ----------------------------- */
label.label-control {
    margin: 5px 10px 5px 0;
}

.input-control {
    width:auto;
    /* vertical-align: middle; */
    margin: 5px 10px 0px 0;
    padding: 5px;
    background-color: #fff;
    border: 1px solid gray;
}

select.input-control {
    height: 30px;
}

.prescription-tbl .input-control {
    margin: 0;
}

/* --------------------------------- Labels --------------------------------- */

.label {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

.label {
    display: inline;
    padding: 0.2em 0.6em 0.3em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25em;
}

.label-default {
    background-color: #777;
}

.label-primary {
    background-color: #3192d6;
}

.label-secondary {
    background-color: #f64249d4;
}

.label-success {
    background-color: #5cb85c;
}

.label-info {
    background-color: #5bc0de;
}

.label-warning {
    background-color: #f0ad4e;
}

.label-danger {
    background-color: #d9534f;
}

/* --------------------------------- alerts --------------------------------- */

.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}

.alert-success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

.alert-info {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1;
}

.alert-warning {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}

.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}