
	/*
	 *  @2011
	 * Print CSS
	 *
	 *
	 */

@import 'clean.css';



	/*
	 *  @2011
	 * Screen CSS
	 *
	 *
	 */

@import 'clean.css';



html { min-height: 100%; }
body { min-height: 100%; background: url(../images/bg-body.png) repeat-y 70% 0; }

@font-face {
    font-family: 'Zurich';
    src: url('f/tt0178m_-webfont.eot');
    src: url('f/tt0178m_-webfont.eot?#iefix') format('embedded-opentype'),
         url('f/tt0178m_-webfont.woff') format('woff'),
         url('f/tt0178m_-webfont.svg#ZurichRoman') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Zurich Bold';
    src: url('f/zurich_bold-webfont.eot');
    src: url('f/zurich_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('f/zurich_bold-webfont.woff') format('woff'),
         url('f/zurich_bold-webfont.svg#ZurichBold') format('svg');
    font-weight: bold;
    font-style: normal;

}

body, input, button, select, textarea { color: #333; font: 11px/16px Arial, Helvetica, sans-serif; }

a { color: #535353; text-decoration: none; }
a:focus, a:hover { color: #a1a1a1; }


#page:after, section header:after, fieldset:after, .list:after { display: block; height: 0; clear: both; font-size: 0; visibility: hidden; content: '.' } 

/* top */
#top { width: 960px; height: 119px; margin: 0 auto; padding: 30px 0 0; }
#logo { width: 169px; float: left; }

nav { display: none; }

/* page */
#page { padding: 35px 0 0; }
#page.col-1-lay { background: url(../images/bg-col-1-lay.jpg) no-repeat 50% 0; }
#page.col-root-2-lay { min-height: 315px; background: url(../images/bg-root-lay.jpg) no-repeat 50% 0; }
.col-1-lay #wrapper > header { height: 111px; }
.col-root-2-lay #content { width: 450px; float: left; }
.col-root-2-lay aside { width: 458px; float: right; }
.col-root-2-lay aside .mod-checkout-login { margin: -50px 0 0; }
.col-root-2-lay .mod { margin: 0 0 10px; padding: 10px 20px; border-radius: 5px; -moz-border-radius: 5px; background: #fff; }
.col-root-2-lay .mod > p { margin: 0 -10px 0 0; }

/* wrapper */
#wrapper { width: 920px; margin: 0 auto; padding: 0 0 0 40px; }
#wrapper a { color: #ee0f36; }
#wrapper > .user-opts { clear: both; margin: 0; padding: 50px 0 0; background: url(../images/icon-dot.png) repeat-x 0 25px; }

.user-opts { text-align: right; }
.user-opts li { display: inline-block; margin: 0 0 0 8px; vertical-align: top }
.user-opts a { display: inline-block; width: 18px; height: 18px; border-radius: 9px; -moz-border-radius: 9px; text-indent: 100em; overflow: hidden; }
.user-opts .link-top { background: url(../images/icon-arrow1.png) no-repeat, url(../images/bg-grad.png) no-repeat }
.user-opts .link-back { background: url(../images/icon-arrow.png) no-repeat, url(../images/bg-grad.png) no-repeat 0 -30px; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); }
.user-opts .link-print { background: url(../images/icon-print.png) no-repeat, url(../images/bg-grad.png) no-repeat 0 0;  }

/* content:header */
#content { }
section header { margin: 0 0 15px; padding: 0 0 15px; background: url(../images/icon-dot.png) repeat-x 0 100%; }
section header h2 { float: left; color: #535353; font: bold 18px/18px Arial, sans-serif; }
section header .user-opts { float: right; }

#quick-action { display: none; }

#link-tutorial { display: block; width: 30px; height: 30px; float: right; margin: -50px 10px 0;  background: url(../images/icon-q.png) no-repeat; text-indent: -100em; overflow: hidden }


#breadcrumbs { height: 40px; line-height: 18px; }
#breadcrumbs li { float: left; }
#breadcrumbs li:before { padding: 0 3px; color: #d5d7d6; content: '\\'; }
#breadcrumbs li:first-child:before { width: 18px; height: 18px; float: left; margin: 0 9px 0 0; padding: 0; background: url(../images/icon-arrow.png) no-repeat 1px 50%,  url(../images/icon-dot2.png); content: ''; }
#breadcrumbs li a { color: #f00a31; }
#breadcrumbs li:last-child a { color: #535353; }


/* content */
#content {  }

h1 { height: 60px; color: #ee0f36; font: 50px/50px 'Zurich' }
h1 strong { display: inline-block; font: 50px/50px 'Zurich Bold' }
h2 { margin: 0 0 10px; color: #ee0f36; font: 24px/24px 'Zurich' }
h3 { color: #535353; font: 20px/20px 'Zurich' }
h4 { color: #535353; font: bold 14px/18px Arial }
h5 { color: #535353; font: 12px/18px Arial }
h6 { color: #535353; font: 11px/16px Arial }

form p { margin: 0 0 10px; }
form label,
form .label { display: inline-block; width: 40px; height: 28px; line-height: 28px; vertical-align: top; }
form input[type=text],
form input[type=password] { width: 260px; height: 28px; line-height: 28px; padding: 0 10px; border: 1px solid #ddd; border-radius: 2px; -moz-border-radius: 2px; }
form select { width: 220px; height: 30px;  }
form button { height: 30px; line-height: 30px; padding: 0 5px; border-radius: 14px; -moz-border-radius: 14px; color: #fff; background: url(../images/bg-grad.png); text-align: left }
form button span { display: inline-block; height: 30px; line-height: 30px; padding: 0 23px 0 10px; background: url(../images/icon-arrow.png) no-repeat 100%  50%; }
form .submit { float: right; margin: -40px 0 0; }

/* jForms */
.jfile,
.jselect {  height: 28px; line-height: 28px; padding: 0 10px; border: 1px solid #ddd; border-radius: 2px; -moz-border-radius: 2px;  }		

.jform input { width: 100%; height: 100%; }

.jselect { display: inline-block; position: relative; padding: 0; background: #fff; vertical-align: middle; cursor: pointer; }
.jselect > span { display: block; position: absolute; top: 0; right: 0; left: 0; width: auto; height: 28px; line-height: 28px; padding: 0 10px; background: url(../images/bg-jform.png) no-repeat 100% -50px; overflow: hidden; z-index: 1 }
.jselect select { min-width: 100%; position: relative; left: 0; top: -3px; height: 28px; padding: 0; cursor: pointer; z-index: 2 }

.jradio,
.jcheckbox { display: inline-block; width: 18px; height: 18px; background: url(../images/bg-jform.png); vertical-align: middle; overflow: hidden }
.jradio { background-position: -18px 0; }
.jradio.focus,
.jradio.jact { background-position: -18px -18px; }
.jcheckbox { background-position: 0 0; }
.jcheckbox.focus,
.jcheckbox.jact { background-position: 0 -18px; }		


.control-list { overflow: hidden }
.control-list > li { width: 210px; margin: 1px 10px -1px 0; float: left; border-bottom: 1px solid #e1e2e3; }
.control-list > li label { width: auto }

.col-list > li { width: 50%; float: left; }
.col-list > li label,
.col-list > li label[for],
.col-list > li .label { width: auto; height: 30px; line-height: 30px; padding: 0; }
.col-list > li label { padding: 0 10px; }

.mod-checkout-login form { margin: 10px 0; padding: 10px; border-radius: 5px; -moz-border-radius: 5px; background: #f5f5f7; }
.mod-register form { margin: 10px 0; padding: 10px; border-radius: 5px; -moz-border-radius: 5px; background: #f5f5f7; }
.mod-register form p { width: 182px; float: left; clear: left; }
.mod-register form p:nth-of-type(4) { float: right; margin: -120px 0 0;  }
.mod-register form p:nth-of-type(5) { float: right; margin: -80px 0 0;  }
.mod-register form p:nth-of-type(6) { float: right; margin: -40px 0 0;  }
.mod-register form label { width: 70px; }
.mod-register form input { width: 90px; }
.mod-register .submit { margin: 0; text-align: right }

.tip { display: block; position: relative; margin: 0 0 15px; padding: 10px 0; border-radius: 5px; -moz-border-radius: 5px; color: #fff; background: #ee0f36; text-align: center }
.tip:before { position: absolute; top: -22px; left: 62%; content: url(../images/bg-tip.png); }

.info-import { float: right; padding: 0 0 0 26px; color: #ee0f36; background: url(../images/icon-e.png) no-repeat 0 0 }
.info-import + * { clear :both }

.btn { display: inline-block; width: 153px; height: 30px; line-height: 30px; margin: 0 0 10px; padding: 0 15px; border-radius: 14px; -moz-border-radius: 14px; color: #fff !important; background: url(../images/icon-arrow.png) no-repeat 160px 50%, url(../images/bg-grad.png) 0 -30px;  }

article em { font-style: italic; }
article strong { font-weight: bold; }
article p { margin: 0 0 1em; }
article ul,
article ol { margin: 0 0 2em; color: #818181; overflow: hidden }
article li { margin: 4px 0 0; padding: 0 0 0 18px; background: url(../images/icon-dot3.png) no-repeat 22px 9px; }
article ul > li:before { display: inline-block; width: 18px; height: 18px; line-height: 18px; margin: 0 18px 0 -18px; color: #fff; background:  url(../images/icon-dot1.png) no-repeat 50% 50%; text-align: right; content: ' .' }
article ol { counter-reset: item; }
article ol > li { counter-increment: item; }
article ol > li:before { display: inline-block; width: 18px; height: 18px; line-height: 18px; margin: 0 18px 0 -18px; color: #fff; background:  url(../images/icon-dot2.png) no-repeat 0 0; text-align: center; content: counter(item) }
article .lead { line-height: 18px; font-size: 14px; }
article .img { display: block; border-radius: 5px; -moz-border-radius: 5px; }
article .img-left { float: left; margin: 0 15px 15px 0; }
article .img-right { float: right; margin: 0 0 15px 15px; }

table { width: 80%; margin: 1em auto; padding: 0 5px; border: dotted #c8cac9; border-width: 0 1px 1px; }
table th { font-weight: bold; white-space: nowrap }
table thead th { height: 20px; padding: 5px 10px; color: #fff; background: #ee0f36; text-align: center; vertical-align: middle }
table thead th:first-child { border: 0; }
table thead th:first-child:before { width: 6px; height: 30px; float: left; margin: -5px 0 -5px -16px; background: #ee0f36; content: '' }
table thead th:last-child:after { width: 6px; height: 30px; float: right; margin: -5px -16px -5px 0; background: #ee0f36; content: '' }
table thead tr:first-child+tr th { color: #535353; background: #ececf0; }
table thead tr:first-child+tr th:first-child:before,
table thead tr:first-child+tr th:last-child:after { background: #ececf0; }
table tbody tr:first-child > * { border: 0; }
table tbody tr > * { padding: 10px; border-top: 1px solid #e1e2e3; color: #535353; text-align: center; vertical-align: middle }
table tfoot tr > * { padding: 10px; border-top: 1px solid #e1e2e3; color: #535353; background: #f5f5f7; vertical-align: middle }

.mod-tbl { margin: 0 0 10px; padding: 15px; border: 1px solid #e1e2e3; border-radius: 7px; -moz-border-radius: 7px }

/* metrics */
.form-metrics aside { width: 183px; float: right; }
.form-metrics fieldset { width: 698px; float: left; }
.form-metrics table { width: 100% }
.form-metrics table input[type=text] { width: 100%; padding: 0 2px; }
.form-metrics button { margin: 10px 0 0; }
.form-metrics button span { width: 140px; }
.form-metrics button.submit-skip { background-position: 0 -30px; }
.form-metrics .submit { width: 183px; float: right; clear: both; }
.form-metrics .mod-tbl > p { margin: 0; text-align: center; }
.form-metrics .mod h4 { float: left; }

.form-step1 fieldset { width: 668px; float: none; margin: 0 0 10px; padding: 15px; border-radius: 7px; -moz-border-radius: 7px; background: #f5f5f7 }
.form-step1 fieldset h4 { float: left; }
.form-step1 .tip { width: 698px; }

.form-step1 .submit { margin-top: -50px; }
.form-step2 .submit { margin-top: -95px; }

#metrics-summary {  }
#metrics-summary aside { width: 183px; float: right; }
#metrics-summary > .mod { width: 668px; float: left; }
#metrics-summary .mod-summary { width: 350px; margin: 0 0 10px; padding: 10px 175px; border-radius: 5px; -moz-border-radius: 5px; background: #f5f5f7; }
#metrics-summary .mod-summary li {  }
#metrics-summary .mod-summary li span { display: inline-block; width: 295px; height: 30px; line-height: 30px; border-bottom: 1px solid #e1e2e3; vertical-align: top;  }
#metrics-summary .mod-summary li strong { display: inline-block; width: 50px; height: 30px; line-height: 30px; padding: 0 0 0 5px; border-bottom: 1px dotted #e1e2e3; color: #ee0f36; font-weight: bold; font-size: 14px; vertical-align: top;  }
#metrics-summary .summary-export .btn { width: 85px; float: left; margin: 10px 0 0; background-position: 95px 7px, 0 -30px;}
#metrics-summary .summary-export .btn:first-child { border-radius: 14px 0 0 14px; -moz-border-radius: 14px 0 0 14px; border-right: 1px solid #cfd3d3; }
#metrics-summary .summary-export .btn:first-child ~ .btn { border-radius: 0; -moz-border-radius: 0; border-left: 1px solid #babdbe; }
#metrics-summary .summary-export .btn:first-child ~ .btn ~ .btn { border-radius: 0 14px 14px 0; -moz-border-radius: 0 14px 14px 0; border: 0; background-position: 95px 7px, 0 0; }
#metrics-summary h6 { font-weight: bold; }
#metrics-summary table { width: 100%; border: 0; }
#metrics-summary th,
#metrics-summary td { text-align: left }
#metrics-summary td:last-child { width: 100px; text-align: center; }



/* aside */
aside { display: none; }

/* footer */
footer { width: 960px; margin: 0 auto; clear: both; padding: 45px 0 0; color: #818181; background: url(../images/icon-dot.png) repeat-x 0 20px; }
footer a { color: #535353; }
footer ul a { display: none; }
footer ul,
footer small { float: left; margin: 0 10px 0 0; }
footer #made { float: right; margin: 0; }
