/* CSS Document */

/* 
COOKISS MOBILE CSS
1. CUSTOM FONTS
2. FONT FORMAT
3. FORMS
4. BUTTONS
5. BREADCRUMB
6. BACK TO TOP BUTTON 
7.TABS 
8. HEADER
9. MAIN NAV
10. CONTENT
11. SELECTION DIV (FOR SEND SMS PAGE)
12. DIV STYLE
13. STEPS (STEP DIVIDERS)
14. TABLE  STYLE
15. FOOTER


*/




/* --------------  1. CUSTOM FONTS --------------------*/

@font-face {
    font-family: 'lato';
    src: url('../fonts/lato-regular-webfont.eot');
    src: url('../fonts/lato-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-regular-webfont.woff') format('woff'),
         url('../fonts/lato-regular-webfont.ttf') format('truetype'),
         url('../fonts/lato-regular-webfont.svg#vagron') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'lato-black';
    src: url('../fonts/lato-black-webfont.eot');
    src: url('../fonts/lato-black-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-black-webfont.woff') format('woff'),
         url('../fonts/lato-black-webfont.ttf') format('truetype'),
         url('../fonts/lato-black-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'lato-medium';
    src: url('../fonts/lato-medium-webfont.eot');
    src: url('../fonts/lato-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/lato-medium-webfont.woff') format('woff'),
         url('../fonts/lato-medium-webfont.ttf') format('truetype'),
         url('../fonts/lato-medium-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

html{height:100%}
body {margin: 0px; padding:0px; font:14px 'lato',Arial, Helvetica, sans-serif; width:100%; height:100%; color:#333; background-color:#fff;}
a{color:#c72531; outline:none;-webkit-transition:color 0.2s linear;-moz-transition:color 0.2s linear;transition:color 0.2s linear; -webkit-transition:background-color 0.2s linear;-moz-transition:background-color 0.2s linear;transition:background-color 0.2s linear; }
a.selected, a:hover{color:#333333;}

.txtbox_tp{border:none !important; background-color:transparent!important; width:99%; outline:none!important; color:#fff !important; }



/* --------------  2. FONT FORMAT --------------------*/
.font_10px{font-size:10px!important;}
.font_11px{font-size:11px!important;}
.font_12px{font-size:12px!important;}
.font_13px{font-size:13px!important;}
.font_14px{font-size:14px!important;}
.font_16px{font-size:16px!important;}
.font_18px{font-size:18px!important;}
.font_20px{font-size:20px!important;}
.font_23px{font-size:23px!important;}
.font_24px{font-size:24px!important;}
.font_26px{font-size:26px!important;}
.font_30px{font-size:30px!important;}
.font_34px{font-size:34px!important;}
.font_40px{font-size:40px!important;}

.font_black {font-family:'lato-black';}
.font_med {font-family:'lato-medium';}
.txt_red{color:#c72531;}
.txt_required{color:#ff0000;}
.txt_white{color:#fff;}
.txt_black{color:#333;}

.highlight_txt_grey{color:#5f5f5f; font:35px 'lato-medium'}
.highlight_txt_red{color:#c72531; font:25px 'lato-medium'}

.breadcrumbs{margin-bottom:-15px !important;}

.marginL10 {margin-left:10px; margin-right:10px;}
.marginT10{margin-top:10px;}
.marginT20 {margin-top:20px;}
.marginT40 {margin-top:40px;}
.marginB10 {margin-bottom:10px;}
.marginB30 {margin-bottom:30px;}

.divider_grey{border-bottom:1px solid #cecece; padding-top:10px; margin-bottom:10px;}

.number_grey{background:url(../images/icons/numeric_bg.png) no-repeat; width:30px; height:30px;margin-right:5px;}
.number_grey span{color:#c72531; font-size:13px; font-weight:bold;}

.number_red{background:url(../images/icons/numeric_bg_red.png) no-repeat; width:30px; height:30px;margin-right:5px; display:inline-block;}
.number_red span{color:#fff; font-size:13px; font-weight:bold; display:block; padding-top:7px; text-align:center;}



/* --------------  3. FORMS  --------------------*/
label {color:#333; font-weight:bold;}
select{ padding:2px; border-radius:3px; font-size:13px;}
.txtbox{font:14px 'lato'; border-radius:3px; padding:3px; border:1px solid #909090; width:95%;}
.txtbox2{font:14px 'lato'; border-radius:3px; padding:3px; border:1px solid #909090; width:100%;}
.dropbox_95{width:95%}


/* --------------  4. BUTTONS  --------------------*/
.button{background-color:#c72531; border:0px; padding:5px 10px; font:14px 'lato'; border-radius:3px; color:#fff; display:inline-block; cursor:pointer; -webkit-transition:background-color 0.2s linear;-moz-transition:background-color 0.2s linear;transition:background-color 0.2s linear; }
.button:hover{background-color:#9b1a24; color:#fff;}
.button:active{background-color:#f23341;}

/* -------------- 5. BREADCRUMB  --------------------*/
.breadcrumb {font-size:10px; text-transform:uppercase;}
.breadcrumb a{color:#000; text-decoration:none; -webkit-transition:color 0.2s linear;-moz-transition:color 0.2s linear;transition:color 0.2s linear; }
.breadcrumb a:hover{color:#c72531;}

/* --------------6. BACK TO TOP BUTTON  --------------------*/
#backToTop {bottom:10px; right:10px; position:fixed; display:none; width:50px; height:50px; background-color:#c72531; z-index:99;  }
#backToTop:hover {background-color:#9b1a24;}
#backToTop:active {background-color:#f23341;}
#backToTop img{margin-top:10px; margin-left:3px; width:85%;}


/*----------------------7.TABS ---------------------*/
.tabs {border-bottom:1px solid #333; height:30px; padding:0px 15px 0px 15px; margin:20px 0px; font-size:13px;}
.tabs ul{padding:0px; margin:0px;}
.tabs li{list-style-type:none; float:left;}
.tabs li a{display:block; padding:8px 12px 7px 12px; background-color:#dbdbdd; margin-right:5px; text-decoration:none; color:#b2b2b2; text-transform:uppercase; outline:none;}
.tabs li a:hover {background-color:#bdbdbe; border-top: 1px solid #333; border-left: 1px solid #333; border-right: 1px solid #333; color:#434343; }
.tabs li a.current{background-color:#fff; color:#c72531; font-weight:bold; border-top: 1px solid #333; border-left: 1px solid #333; border-right: 1px solid #333;}
.tabcontainer {padding:10px;}


/* --------------  8. HEADER  --------------------*/
.mainHeader_wrapper{width:auto; margin-top:10px;}
.mainHeader_container {margin:0 auto; width:930px;}

/* --------------  9. MAIN NAV  --------------------*/
.mainNav_container{ background:url(../images/structures/menu_bg.png) repeat-x; width:100%; height:41px;}
.mainNav_container .mainNav {margin:0 auto; width: 1130px; text-align:center;}
.mainNav_container .mainNav a{display: inline-block; color:#fff; text-decoration:none; text-transform:uppercase; padding-top:12px; -webkit-transition:color 0.2s linear;-moz-transition:color 0.2s linear;transition:color 0.2s linear; -webkit-transition:background-color 0.2s linear;-moz-transition:background-color 0.2s linear;transition:background-color 0.2s linear;}
.mainNav_container .mainNav a:hover{color:#fff;}
.mainNav_container .mainNav .selected {color:#d02d3a;}
.noBorder {border-top:none;}
.sub_selected {color:#480e13!important; font-weight:bold; font-family:'lato-black';}

.right-menu {float:right!important;}
.right-menu li{background: #b2242f!important;}
.right-menu li:hover{background: #8a1922!important;}

.balance-menu {float:right; padding:13px 15px; color:#fff; font-family:'lato-medium'; font-size:12px;}


/* -------------- 10. CONTENT  --------------------*/
.content_wrapper {width:auto; min-height: 65%;}
.content_container {margin:50px auto 80px auto; width:930px; }
.page-subTitle {font-family:'lato-black'; font-size:15px; color:#c72531; margin:5px 0px 0px 0px;}
.page-title {font-family:'lato-black'; font-size:25px; color:#c72531; margin:5px 0px 0px 0px; text-transform:uppercase;}
.desc-main{margin:0px 0px 20px 0px; font-size:14px;}
.desc-sub{margin:10px 0px 10px 0px; padding:0px; font-size:14px;}

.pagination{font-size:13px;}
.highlighted_box {margin:0px; background:#cecece; padding:5px 10px; display:inline;}

.login-box{border:1px solid #a5a5a5;padding:20px; border-radius:5px; width:500px; margin:0px auto;}

/*--------------- 11. SELECTION DIV (FOR SEND SMS PAGE) ----------*/
.selection .item{border-top:1px solid #000; padding:10px 0px;}
.selection .item .title {font-weight:bold; cursor:pointer;}
.selection .item .content {background:#f0f0f0; margin-left:20px; margin-top:5px; padding:13px; display:none;}

/* -------------- 12. DIV STYLE  --------------------*/
.line_div {border:1px solid #9b9b9b; padding:10px; margin:5px;}
.dotted_div {border:1px dotted #9b9b9b; padding:10px;}
.greyline_div {border:1px solid #b6b6b6; padding:20px; }
.solidgrey-div {padding:10px; margin:10px 0px 10px 0px ; background:#3b3b3b; color:#fff; font-size:13px;}


/* -------------- 13. STEPS (STEP DIVIDERS) --------------------*/
.divider-step {padding:10px 20px; margin:10px 0px 10px 0px ; font-weight:bold; background:#3b3b3b; color:#fff;}
.divider-step .title{color:#c72531;}
.divider-step a{color:#fff; font-weight:normal; font-size:11px;}
.divider-step a:hover{text-decoration:none;}
.step-container{margin-bottom:30px;}
.step-content{padding:0px 15px 15px 15px;}

.divider-line { background:#f0f0f0;padding:5px 20px 5px 10px; margin:25px 0px 10px 0px ; font-weight:bold; border-top:1px solid #333; border-bottom:1px solid #dbdbdb; }


/* -------------- 14. TABLE  STYLE--------------------*/
.table-style {border:1px solid #b6b6b6; padding:10px; font-size:12px; margin-bottom:10px;}
.table-style th{background-color:#c72531; color:#fff; padding:5px; font-size:11px;}
.table-style td{padding:5px;}
.table-style .alternate td{background:#ededed;}
.table-style tr:hover, .table-style .alternate:hover td {background:#c5c5c5;}

/* -------------- 15. FOOTER  --------------------*/
.footer {border-top:1px solid #c0c0c0; color:#6a6a6a; padding:20px 20px 30px 20px;  font-size:11px; }