/* override */
html {background:url(../images/bg-paper-grey.jpg)}
body {background:none}
.contain-to-grid {background:#fff;box-shadow:0 5px 5px -5px rgba(0,0,0,.15) inset,0 -5px 5px -5px rgba(0,0,0,.15) inset;-moz-box-shadow:0 5px 5px -5px rgba(0,0,0,.15) inset,0 -5px 5px -5px rgba(0,0,0,.15) inset;-webkit-box-shadow:0 5px 5px -5px rgba(0,0,0,.15) inset,0 -5px 5px -5px rgba(0,0,0,.15) inset;border-bottom:solid 1px #ccc}
.top-bar {margin-bottom:0;background:#fff;box-shadow:0 5px 5px -5px rgba(0,0,0,.15) inset,0 -5px 5px -5px rgba(0,0,0,.15) inset;-moz-box-shadow:0 5px 5px -5px rgba(0,0,0,.15) inset,0 -5px 5px -5px rgba(0,0,0,.15) inset;-webkit-box-shadow:0 5px 5px -5px rgba(0,0,0,.15) inset,0 -5px 5px -5px rgba(0,0,0,.15) inset;border-bottom:solid 1px #ccc!important;height:55px;line-height:55px}
.top-bar ul > li:hover, .top-bar ul > li.active { background: none;}
.top-bar ul > li a:not(.button) { color: #6e6e6e;font-size:12px;height:55px;line-height:55px}
.top-bar ul > li.divider { background: #ececec;height:54px}
.top-bar ul > li.has-dropdown .dropdown, .top-bar ul > li.has-dropdown .dropdown li {background:#f9f9f9}
.top-bar ul > li.has-dropdown .dropdown li.divider {border-color:#ececec}
.top-bar ul > li.has-dropdown .dropdown li a {color:#666}
.top-bar ul > li.has-dropdown .dropdown li a:hover { color:#333;background: #fff; }
.top-bar ul > li.has-dropdown .dropdown li.active a { background: #ddd; }
li.name h1{margin-top:0!important;margin-bottom:0!important;padding-top:4px}
.title-brand {background: url(../images/logo.png) no-repeat 20px 50%;width:150px;height:45px!important;line-height:45px!important;}
@media only screen and (max-width: 940px) {
.top-bar {height:55px;background:#1A304F;background-image: linear-gradient(bottom, #1A304F 0%, #2B4D7F 100%);background-image: -o-linear-gradient(bottom, #1A304F 0%, #2B4D7F 100%);background-image: -moz-linear-gradient(bottom, #1A304F 0%, #2B4D7F 100%);
background-image: -webkit-linear-gradient(bottom, #1A304F 0%, #2B4D7F 100%);background-image: -ms-linear-gradient(bottom, #1A304F 0%, #2B4D7F 100%);}
.top-bar > ul {height:55px;}
.top-bar ul > li.name { background: #fff;box-shadow:0 0 5px rgba(0,0,0,.1) inset; height:55px}
.top-bar ul > li.name h1 a {height:55px;line-height:55px!important}
.top-bar ul > li.divider { border-bottom: solid 1px #fff; border-top: solid 1px #ececec;}
.top-bar ul > li:hover, .top-bar ul > li.active { background: #none!important;}
.top-bar ul > li.toggle-topbar {height:55px}
.top-bar ul > li.has-dropdown.moved .dropdown li a:hover { background: #none;}
.top-bar.expanded ul li.toggle-topbar a {border-color:transparent transparent rgba(0, 0, 0, 0.5)}
.top-bar ul > li.has-dropdown a:after {border-color:transparent transparent transparent rgba(0, 0, 0, 0.5)}
.top-bar ul > li.has-dropdown.moved .back.title a:before {border-color:transparent rgba(0, 0, 0, 0.5) transparent transparent}
.top-bar ul > li.has-dropdown.moved .back.title h5 a {font-size:13px;color:#003366}
.top-bar ul > li.has-dropdown.moved .back.title {border-bottom:dashed 1px #ececec;border-top:dashed 1px #ececec;background:#fdfdfd}
}
h5.subheader, h4.subheader {margin:5px 0}
ul.inline-list {margin-left:-10px}
ul.inline-list li {margin-left:10px}
ul.link-list li a {font-size:11px}
ul.circle li {font-size:11px}
ol.smaller li {font-size:11px;font-weight:bold;margin-bottom:20px}
p.smaller {font-size:13px;margin-bottom:5px}
.fA {font-family: Arial, sans-serif!important;}
.fC {font-family: 'Coda', cursive;}
.bold {font-weight:bold;font-size:12px;color:#000}
.bolder {font-size:14px}
/* select jquery */
select {background-color: white;border: 1px solid #CCCCCC;border-radius: 2px 2px 2px 2px;box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;color: rgba(0, 0, 0, 0.75);display: block;  font-family: inherit;font-size: 11px;height: 22px;margin: 0 0 12px;padding:2px;transition: all 0.15s linear 0s;width:100%;}
select:focus { background: #fafafa; outline: none !important; border-color: #888; }
label.smaller {font-size:11px;}
label.smaller.inline {display:inline-block;line-height:normal!important;margin:0}
fieldset {background:#f9f9f9;margin:5px 0 18px}
fieldset legend {padding:3px 10px;border:solid 1px #ececec;border-radius:4px;-webkit-border-radius:4px;-moz-border-radius:4px}
.button {background: #006699;border-color:#003366}
.button:hover { background-color: /*#003366*/#00377d;}
a {color:#00377d}
a:hover {color:#000}
.th img {border-color:#f3f3f3}

.clearfix:after {clear:both;content:" ";display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}
.clearfix {display: inline-table;}
* html .clearfix {height: 1%;}
hr {clear:both;height:0px;border-top:solid 1px #ddd;border-bottom:solid 1px #fff;border-left:none;border-right:none;margin:8px 0;}
hr.styled {border-top:solid 1px #efbd8c;border-bottom:solid 1px #ececec;border-left:none;border-right:none;height:0;}
a.intext {font-weight:bold;font-style:normal;display:inline;padding:1px 15px 1px 4px;text-align:center;white-space:nowrap;background:#f3f3f3 url(../images/icon-popup.png) no-repeat 98% 12%;border-radius:3px;border:solid 1px #ececec}
a.inlink {font-weight:bold;font-style:normal;display:inline;padding:1px 5px;text-align:center;white-space:nowrap;background:#a8dbeb;color:#1a88a9!important;text-shadow:1px 1px 1px #fff;border-radius:3px;border:solid 1px #2284A1}
p.footer {font-size:11px;margin-bottom:0;line-height:normal}
.btm {border-bottom:solid 1px #ececec;padding-bottom:5px}
.ctr {text-align:center}
.txl {text-align:left}
.txr {text-align:right}
.m0 {margin:0!important}
.mb10 {margin:0 0 10px}
.mb5 {margin:0 0 5px}
.mr10 {margin:0 10px 0 0!important}
.p0 {padding:0}
.pr0 {padding-right:0}
.pl0 {padding-left:0}
.p10 {padding:10px 0}
.pg10 {padding:10px}
header#top {background:#13A7C7;background:rgba(19,167,199,.4);padding:10px 0 10px 0;border-bottom:solid 1px #13A7C7}
header#top h5, header#top h6{margin:0 0 3px 0;}
header#top h5 {font-family: 'Coda',cursive;font-weight:normal;font-size:20px;color:#fff;text-shadow:0 1px 1px rgba(0,0,0,.5);margin-bottom:0}
header#top h5 span {display:inline-block;width:30px;height:30px;line-height:24px;text-align:center;padding:0;background:#13A7C7;border:solid 3px #fff;border-radius:50%;-moz-border-radius:50%;-webkit-border-radius:50%;box-shadow:0 0 5px rgba(0,0,0,.5);-moz-box-shadow:0 0 5px rgba(0,0,0,.5);-webkit-box-shadow:0 0 5px rgba(0,0,0,.5);font-weight:bold;font-size:18px;margin-right:5px}
header#top h6 {font-weight:normal;font-size:11px;line-height:1.45em}
header#top h6 span {font-weight:bold;font-size:14px;}
header#index, section#cont {background:#f9f9f9;background:rgba(249,249,249,.7);padding: 20px 0;border-bottom:solid 1px #ddd;box-shadow:0 15px 15px -5px rgba(0,0,0,.15) inset;-moz-box-shadow:0 15px 15px -5px rgba(0,0,0,.15) inset;-webkit-box-shadow:0 15px 15px -5px rgba(0,0,0,.15) inset}
header#index h5 {color:#333;text-shadow:1px 1px 1px #fff}
header#index h6 {font-weight:normal;color:#111;text-shadow:1px 1px 1px #fff}
header#index hr {border-top:solid 1px #ddd;border-bottom:solid 1px #fff;border-left:none;border-right:none;height:0;margin:0 0 8px}
#content {padding:15px;margin:0 15px 15px;background:#fff;background:rgba(255,255,255,1);border:solid 1px #ccc;border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;}
footer#bottom {/*background:#fff;background:rgba(255,255,255,.8);*/background:url(../images/tile.png);box-shadow:0 5px 5px -5px rgba(0,0,0,.15) inset,0 -5px 5px -5px rgba(0,0,0,.15) inset;-moz-box-shadow:0 5px 5px -5px rgba(0,0,0,.15) inset,0 -5px 5px -5px rgba(0,0,0,.15) inset;-webkit-box-shadow:0 5px 5px -5px rgba(0,0,0,.15) inset,0 -5px 5px -5px rgba(0,0,0,.15) inset;margin:0;padding:10px 0;border-bottom:solid 1px #f3f3f3;border-top:solid 1px #e9eef4}
footer#bottom .block-grid.twelve-up > li {padding-bottom:0;text-align:center}
footer ul.link-list {margin-bottom:0}
/* table */
table tbody tr:nth-child(2n) {background:#f9f9f9}
table {background: #FFFFFF;border-collapse: collapse;font-size: 12px;text-align: left;max-width:100%;width:100%;border-spacing:0;margin:0;border:0 none!important;}
table img.fits {width:100%;/*height:auto;max-width:100%*/}
table thead {background:none}
table tfoot {border-top:solid 1px #a8dbeb;background:#f9f9f9}
table tfoot tr.grand {background:#eef7f8;border-top:solid 1px #50B7D7}
table th {border-bottom: 2px solid #50b7d7;color: #000;font-size: 12px;font-weight: normal!important;padding: 10px 8px;}
table td {border-bottom: 1px dotted #ececec;color: #000;padding: 6px 8px;font-size:12px!important;display: table-cell;}
table tbody tr:hover td {color: #333;background:#e6f6fb;}
table h6 {color:#000;font-size:12px;margin:0}
@media only screen and (max-width: 767px) {
table.responsive { margin-bottom: 0; }
table td, .pinned table td { display: table-cell; }
.pinned table img { /*width:auto;max-width:35%!important;*/width:100% }
.pinned { position: absolute; left:0; top:0; background: #fff; width: 30%;height:100%;overflow-y: hidden; overflow-x: scroll; border-right: 1px solid #a8dbeb; border-left: 1px solid #a8dbeb;}
.pinned table { border-right: none; border-left: none; width: 100%; }
.pinned table th, .pinned table td { white-space: nowrap; }
.pinned table th, .pinned table td { white-space: nowrap;padding: 9px 8px 8px; }
.pinned td:last-child { border-bottom: 0; }
div.table-wrapper { position: relative; margin-bottom: 20px; overflow: hidden; border-right: 1px solid #a8dbeb; }
div.table-wrapper div.scrollable table { margin-left: auto; }
div.table-wrapper div.scrollable { overflow: scroll; overflow-y: hidden;margin-left:30% }	
table.responsive td, table.responsive th { position: relative; white-space: nowrap; overflow: hidden; }
table.responsive th:first-child, table.responsive td:first-child, table.responsive td:first-child, table.responsive.pinned td { display: none; }
}
/* paging steps */
.paging-step {margin: 0;padding:0}
.paging-step ul {border-radius: 4px 4px 4px 4px;box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);display: inline-block;margin-bottom: 0;margin-left: 0;}
.paging-step ul > li {display: inline;}
.paging-step ul > li > a, .paging-step ul > li > span {-moz-border-bottom-colors: none;-moz-border-left-colors: none;-moz-border-right-colors: none;-moz-border-top-colors: none;   background-color: #FFFFFF;border-color: #DDDDDD;border-image: none;border-style: solid;border-width: 1px 1px 1px 0;float: left;line-height: 20px;padding: 4px 12px;text-decoration: none;}
.paging-step ul > li > a:hover, .paging-step ul > .active > a, .paging-step ul > .active > span {background-color: #F5F5F5;}
.paging-step ul > .active > a, .paging-step ul > .active > span {color: #003366;text-shadow:1px 1px 1px #fff;font-weight:bold;cursor: default;background:#fff;box-shadow:0 0 3px #ddd inset;-moz-box-shadow:0 0 3px #ddd inset;-webkit-box-shadow:0 0 3px #ddd inset}
.paging-step ul > .done > a, .paging-step ul > .done > span {color: #ccc;text-shadow:1px 1px 1px #fff;cursor: default;background:#fdfdfd}
.paging-step ul > .def > a, .paging-step ul > .def > span {color: #2693BA ;text-shadow:1px 1px 1px #fff;cursor: default;background:#f9f9f9}
.paging-step ul > .disabled > span, .paging-step ul > .disabled > a, .paging-step ul > .disabled > a:hover {background-color: #f9f9f9;color: #999999;cursor: default;}
.paging-step ul > li:first-child > a, .paging-step ul > li:first-child > span {border-bottom-left-radius: 4px;border-left-width: 1px;border-top-left-radius: 4px;}
.paging-step ul > li:last-child > a, .paging-step ul > li:last-child > span {border-bottom-right-radius: 4px;border-top-right-radius: 4px;}
.paging-step-centered {text-align: center;}
.paging-step-right {text-align: right;}
.paging-step-large ul > li > a, .paging-step-large ul > li > span {font-size: 17.5px;padding: 11px 19px;}
.paging-step-large ul > li:first-child > a, .paging-step-large ul > li:first-child > span {border-bottom-left-radius: 6px;border-top-left-radius: 6px;}
.paging-step-large ul > li:last-child > a, .paging-step-large ul > li:last-child > span {border-bottom-right-radius: 6px;border-top-right-radius: 6px;}
.paging-step-mini ul > li:first-child > a, .paging-step-small ul > li:first-child > a, .paging-step-mini ul > li:first-child > span, .paging-step-small ul > li:first-child > span {border-bottom-left-radius: 3px;border-top-left-radius: 3px;}
.paging-step-mini ul > li:last-child > a, .paging-step-small ul > li:last-child > a, .paging-step-mini ul > li:last-child > span, .paging-step-small ul > li:last-child > span {border-bottom-right-radius: 3px;border-top-right-radius: 3px;}
.paging-step-small ul > li > a, .paging-step-small ul > li > span {font-size: 11.9px;padding: 2px 10px;}
.paging-step-mini ul > li > a, .paging-step-mini ul > li > span {font-size: 10.5px;padding: 1px 6px;}
.tribot, .triup {width:auto;min-height:40px;padding:15px;position:relative;word-wrap:break-word;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;margin-bottom:2em;}
.tribot {background:#fff;border:solid 1px #ddd;}
.triup {background:#c3e0f1;border:solid 1px #80d4e6;margin-bottom:10px}
.tribot:after{content:'';display:block;position:absolute;top:100%;left:30px;width:0;height:0;border-color: #fff transparent transparent transparent;border-style:solid;border-width: 10px;}
.triup:after{content:'';display:block;position:absolute;top:-20px;left:30px;width:0;height:0;border-color: transparent transparent #c3e0f1 transparent;border-style:solid;border-width: 10px;}
.social {margin:3px 0 0 0!important}
@media only screen and (max-width: 767px) {.social {margin-left:-10px!important}}
@media only screen and (max-width: 940px) {.social {margin-left:-10px!important}}
.gray {
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
filter: gray;
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
}
.gray:hover {
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
-ms-filter: grayscale(0%);
-o-filter: grayscale(0%);
}

/*stepy*/
        * { font-family: Verdana; font-size: 96%; }
        label { width: 10em; float: left; }
        label.error { float: none; color: red; padding-left: .5em; vertical-align: top; }
        p { clear: both; }
        .submit { margin-left: 12em; }
        em { font-weight: bold; padding-right: 1em; vertical-align: top; }
        h3.steps {margin-top: 10px}
ul.stepy-titles li span {
    display: block;
    font: 16px verdana !important;
    font-weight: bolder !important;
}
#wizard ul li {
    float: left;
    padding-right: 14px;
}

a.button-back { float: left; }
a.button-next, .finish { float: right; }

input.finish { border-style: none; cursor: pointer; padding: 3px 9px; }
/*
a.button-back, a.button-next, .finish {
	background-color: #AAA; color: #FFF; padding: 5px 10px; text-decoration: none;
	border-radius: 4px; -khtml-border-radius: 4px; -moz-border-radius: 4px; -opera-border-radius: 4px; -webkit-border-radius: 4px;
        margin: 10px;
}*/

a.button-back:hover, a.button-next:hover, .finish:hover { background-color: #69C; }

a.button-back, a.button-next, .finish {
    /*background: none repeat scroll 0 0 #2BA6CB;*/
    border: 1px solid #1E728C;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
    color: white;
    cursor: pointer;
    display: inline-block;
    font-family: inherit;
    font-size: 14px;
    font-weight: bold;
    line-height: 1;
    margin: 0;
    outline: 0 none;
    /*padding: 10px 20px 11px;*/
    position: relative;
    text-align: center;
    text-decoration: none;
    transition: background-color 0.15s ease-in-out 0s;
    width: auto;
    margin-bottom:10px;
    font-size: 10px;
    padding: 5px 10px 6px !important;
}

.finish{
    font-weight:bold !important;
}

fieldset.step { border: 1px solid #DDD; clear: left; font: 10px verdana; width: 100%; margin-left:10px;}
/*fieldset.step label { color: #444; display: block; font: bold 10px verdana; margin: 10px 0 3px 7px; }*/
fieldset.step label { color: #444; display: block; font: 11px verdana; margin: 0px; }
fieldset.step legend { color: #4080BF; font: bold 14px verdana; padding: 0 2px 3px 2px; }
fieldset.step input, fieldset.step textarea, fieldset.step select { border: 1px solid #AAA; font: 13px verdana; margin-left: 7px; margin-top: 2px;}

li.error-image { /*background: url('../images/error.png')*/ no-repeat right top; }

ul.stepy-titles { list-style: none; margin: 0; padding: 0; width: 100%; }
ul.stepy-titles li { color: #DDD; cursor: pointer; font: bold 18px verdana; float: left; padding: 10px; }
ul.stepy-titles li.current-step { color: #369; cursor: auto; }
ul.stepy-titles li span { font: 11px verdana; display: block; }

/*** Optionaly (jQuery Validate) ***/

label.error { /*background: url('../images/alert.png')*/ no-repeat; color: #DE5130 !important; display: block; float: right; font: 10px verdana; height: 16px; margin: -15px 3px 0 10px !important; padding-left: 21px; padding-top: 2px; width:85px !important;position: absolute;right: 0;}/*width:150px*/

input.error, select.error, textarea.error { background-color: #FAF4F4; }
.likedislike{
    clear: both;
    margin: 2px;
    float: left;
}

html, body {height:100%;width:100%;margin:0;padding:0}
p {line-height:1.5em}
#containerletter {width:900px;background:url('<?= base_url()?>images/tile.png');margin:0 auto;padding:10px;border:solid 1px #ececec}
#containerletter.small {background:url('<?= base_url()?>images/tile-1.png')}
.wrap {background:#fff;padding:10px}
.tableinside {background:#fff;padding:10px;width:840px}
/**/

span.def{
    display: inline;
    background: none repeat scroll 0 0 #F9F9F9;
    color: #2693BA;
    cursor: default;
    text-shadow: 1px 1px 1px #FFFFFF;
    border-bottom-left-radius: 4px;
    border-left-width: 1px;
    border-top-left-radius: 4px;
    float:left;
    padding: 4px 12px;
    line-height: 20px;
    border-color: #DDDDDD;
    border-width: 1px 1px 1px 0;
    border: solid 1px #DDDDDD;
}
.twelve, .row .twelve {
    font-size: 11px;
    width: 100%;
}
fieldset.step {
    border: 1px solid #DDDDDD;
    clear: left;
    font: 10px verdana;
    margin-left: 0px;
    width: 100%;
}
.paging-step ul > li > div, .paging-step ul > li > span {-moz-border-bottom-colors: none;-moz-border-left-colors: none;-moz-border-right-colors: none;-moz-border-top-colors: none;   background-color: #FFFFFF;border-color: #DDDDDD;border-image: none;border-style: solid;border-width: 1px 1px 1px 0;float: left;line-height: 20px;padding: 4px 12px;text-decoration: none;font-weight: lighter;color:#999999;background-color: #F9F9F9;}
ul.stepy-titles li {
    color: #DDDDDD;
    cursor: pointer;
    float: left;
    font: bold 18px verdana;
    padding: 0px;
}
.noned{
    display:none !important;
}
.active{
    display:block !important;
}

header#top h5 span {
    padding-top: 3px;
}
fieldset.step textarea {
    border: 1px solid #AAAAAA;
    font: 13px verdana;
    margin-left: 7px;
    /**/
}
label.smaller.inline {
    display: inline-block;
    line-height: normal !important;
    margin: 0;
    width:auto;
    min-width: 170px;
    min-height:25px;
}
@media only screen and (max-width: 767px) {a.button-next, .finish {width:100%;font-weight:bold;margin-bottom:10px;}}
@media only screen and (max-width: 767px) {a.button-back {width:100%;font-weight:bold;margin-bottom:0px;}}
@media only screen and (max-width: 767px) {a.button-next, .finish {width:100%;font-weight:bold;margin-bottom:10px;}}

.step legend {
    display:none;
}
.top-bar.expanded {
    height: 110px !important;
}

.current-step div{
    background: none repeat scroll 0 0 #FFFFFF;
    box-shadow: 0 0 3px #DDDDDD inset;
    color: #003366;
    cursor: default;
    font-weight: bold;
    text-shadow: 1px 1px 1px #FFFFFF;
}
.paging-step ul > .current-step > div, .paging-step ul > .current-step > span {
    background: none repeat scroll 0 0 #FFFFFF;
    box-shadow: 0 0 3px #DDDDDD inset;
    color: #003366;
    cursor: default;
    font-weight: bold;
    text-shadow: 1px 1px 1px #FFFFFF;
}
.paging-step ul > li:last-child > div, .paging-step ul > li:last-child > span {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}
label.smaller.inline {
    display: inline-block;
    line-height: normal !important;
    margin: 0;
    min-height: 25px;
    min-width: 150px;
    width: auto;
    font-size:13px;
}