@charset "utf-8";
/* LAYOUT STARTS */
html {
    font-family:Arial, Helvetica, sans-serif;
    text-align: center;
} 
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
* html legend {
    margin:-18px -8px 16px 0;
    padding:0;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}

/* remember to define focus styles! */
:focus {
    outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
    text-decoration: none;
}
del {
    text-decoration: line-through;
}
html {
    font-size: 62.5%;
    font-family:Arial, Helvetica, sans-serif;
}
strong, th, thead td, h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
}
cite, em, dfn {
    font-style: italic;
}
code, kbd, samp, pre, tt, var, textarea {
    font-size: 92%;
    font-family: Arial, Helvetica, sans-serif;
}
del {
    text-decoration: line-through;
    color: #666;
}
ins, dfn {
    border-bottom: 1px solid #ccc;
}
small, sup, sub {
    font-size: 85%;
}
abbr, acronym {
    text-transform: uppercase;
    font-size: 85%;
    letter-spacing: .1em;
}
a abbr, a acronym {
    border: none;
}
abbr[title], acronym[title], dfn[title] {
    cursor: help;
    border-bottom: 1px solid #ccc;
}
sup { 
    vertical-align: super;
}
sub {
    vertical-align: sub;
}
.Prod_LandingResult sup {
    vertical-align: baseline;
}
.clearfix:after{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/*.clearfix { /zoom: 1; }*/

@media (max-width: 767px) {
    html {
        background-color: #dcdcdc;
    }
    .single {
        background-color: #ffffff;
    }
    small, sup, sub {
        font-size: 65%;
    }
    sup {
        vertical-align: baseline;
    }
}

/* LAYOUT ENDS */

/* BODY BACKGROUNDS */
body {
	color: #4d4d4d;
}
body.grey {
	background: #F2F2F2;
}
body.color {
	background-color: #0c4da2;
}
body.fullImage {
	background: #fff;
}

@media (max-width: 767px) {
    body.navigation-is-open {
        overflow-x: hidden;
    }
}
#container {
	margin: 0 auto;
    padding-left: 0;
    padding-right: 0;
}
.container {
    max-width: 940px;
}
@media (min-width: 400px) {
    #container {
        width: 100%;
    }
}
.image {
	background: #073869 url(/common/img/shop_online2.gif) no-repeat left top;
}

#container.image1 {
	background: #c9bb03 url(/common/img/environment.jpg) no-repeat left top;
}

#container.image2 {
	background: #669900 url(/common/img/news.gif) no-repeat left top;
}

#container.image3 {
	background: #669900 url(/common/img/environment.jpg) no-repeat left top;
}

#container.image4 {
	background: #eeeef0 url(/common/img/epsonworld.jpg) no-repeat left top;
}

#container.pos {
	background: #042020 url(/common/img/epson_receipt_printing_bg.jpg) no-repeat left top;
}

#container.pos2 {
	background: #f2f2f2;
}

#container.pro {
	background: #0C0908 url(/common/img/epson_pro_printing_bg.jpg) no-repeat 50% 0;
}

#container.diskproducer {
	background: #0C0908 url(/common/img/epson_pro_printing_bg.jpg) no-repeat 50% 0;
}

#container.diskproducerxxx {
    background-color: #686868;
    background-image: url(/common/images/bak_business_gradient.png);
    background-repeat: repeat-x;
    background-attachment: scroll;
    background-position: 0pt 0pt;
}		

/* Main */

#content {
	width: 100%;
	margin: 0 auto;
	text-align: left;
    max-width: 940px;
    background: #fff;
}

@media (min-width: 768px) {
    #content {
        border-radius: 7px;
    }
}

@media (max-width: 767px) {
    .container #content.row {
        margin-top: 2%;
    }
}

.width-960 {
    width: 99%;
    max-width: 960px;
    margin: 0 auto;
    padding-top: 1%;
    padding-left: 1%;
}

#content:after {
	content: '';
	display: block;
	clear: both;
}
.single #main {
	clear: both;
    padding: 8px 0;
    border: 1px solid #e1e1e1;
    border-radius: 5px;
    background: #fff;
}

#main {
    min-height: 400px;
}

@media (max-width: 767px) {
    .double #main {
        width: 100%;
    }
}

.double #main .roundCorner {
    padding: 5px;
    overflow: hidden;
}

#mainPage .roundInner,
.single #mainPage .roundInner, 
#main .roundInner,
.single #main .roundInner {
	margin-top: 0px;
}

/* HEROPANE STARTS */

#heroPane {
	margin:10px 0 67px;
}
#heroPaneShort {
	margin:10px 0 35px;
}


.double #heroPane {
	margin-top:0;
	width:710px;
	float:right;
}

#heroMain {
	width: 360px;
	float: right;
}

#heroMain h2 {
	color:#fff;
	font-size:4em;
	line-height:1.2;
	text-transform:uppercase;
}

#heroMain p {
	position: relative;
	margin:10px 0;
	color:#FFF;
	font-size:1.6em;
	font-weight:bold;
	line-height:1.2;
}

#heroPaneShort #heroMain p {
	margin-bottom: -15px;
}

body.grey #heroMain h2,
body.grey #heroMain p {
	color:#4D4D4D;
}

#container .container {
    padding-left: 0;
    padding-right: 0;
}

#container .container .accordion-wrapper .panel-body a {
    font-size: 1.2em;
}

@media (max-width: 767px) {
    #container .container .accordion-wrapper .panel-body a {
        font-size: 1.6em;
    }
}

@media (max-width: 350px) {
    #container .container .accordion-wrapper .panel-body a {
        font-size: 1.8em;
    }
}

#container .row {
    margin-left: 0px;
    margin-right: 0px;
}
#content.row {
    margin: 0 auto;
}

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    padding-left: 5px;
    padding-right: 5px;
}

@media (min-width: 768px) {
    #container #left {
        padding-left: 0;
    }
}

#left {
	font-size: 1.2em;
}

#left ul.nav {
    width: 95%;
    border-bottom: 0px;
}

#leftMenu,
.single #leftMenu {
	margin-bottom: 40px;
}

.double #leftMenu {
	margin-bottom: 20px;
}

#leftMenu h3 {
	padding: 9px 10px 8px;
	line-height: 1.2;
}


.heroNavigation {
	background: url(/common/img/black_60.png);
	font-weight: bold;
}

.heroNavigation ul {
	background: none;
	font-family: Verdana,Arial,sans-serif;
	text-transform: none;
	font-weight: normal;
	font-size: 0.917em;
}

.heroNavigation ul ul {
	font-size: 1em;
}

.heroNavigation li {
	width: 210px;
	line-height: 1.2;
}

.heroNavigation strong,
.heroNavigation a {
	display: block;
	padding: 5px 10px;
	text-decoration: none;
	color: #fff;
}

.heroNavigation a:link,
.heroNavigation a:visited {
	color: #fff;
}

.heroNavigation a:hover {
	text-decoration: none;
	background: #272727;
}

.heroNavigation h4 a {
	background: #252122 url(/common/img/left_menu_header_bg.gif) no-repeat left top;
	padding:6px 20px 6px 10px;
}

.heroNavigation h4 a:hover {
	background: #252122 url(/common/img/left_menu_header_bg.gif) no-repeat left top;
}

.heroNavigation h4.selected a,
.heroNavigation h4.selected a:hover {
	background-position: -210px top;
}

.heroNavigation strong {
	background: #fff;
	color: #000;
}
.heroNavigation strong a {
	margin: -5px -10px;
	background: #fff;
	color: #000;
}

.heroNavigation strong a:link,
.heroNavigation strong a:visited {
	color: #000;
}

.heroNavigation strong a:hover {
	background: none;
	background: #fff;
}

.heroNavigation ul ul strong,
.heroNavigation ul ul a {
	padding-left: 30px;
}

.heroNavigation ul ul strong 
{
    color: #fff;
	background: #272727;
    font-weight:normal;
}

.heroNavigation ul ul strong a {
	margin-left: -30px;
	padding-left: 30px;
}

/* HEROPANE ENDS */

/* FOOTER TEASERS STARTS */
/* FOOTER TEASERS ENDS */

/* BREADCRUMBS STARTS */

.breadCrumbs {
	max-width: 940px;
    margin: 0 auto;
    margin-bottom: 10px;
    margin-top: 10px;
}

.breadCrumbs ol,
.breadCrumbs ul {
	overflow: hidden;
	margin-left: 5px;
}

.breadCrumbs li {
	float: left;
	margin-right: 5px;
	text-transform: uppercase;
	font-family: Verdana,Arial,sans-serif;
	color: #303030;
	padding-bottom: 1px;
}

.breadCrumbs a {
	margin-right: 5px;
	text-transform: uppercase;
	color: #303030;
	font-weight: normal;
}

.grey .breadCrumbs li,
.grey .breadCrumbs a,
.breadCrumbs.grey li,
.breadCrumbs.grey a {
	color: #4d4d4d;
}

.white .breadCrumbs li,
.white .breadCrumbs a,
.breadCrumbs.white li,
.breadCrumbs.white a {
	color: #ffffff;
}

.breadCrumbs a:hover {
	text-decoration: underline;
}

@media (max-width: 767px) {
    .breadCrumbs a.glyphicon,
    .breadCrumbs a.visible-xs {
        display: inline-block!important;
        font-size: 97%;
    }
}
@media (min-width: 768px) {
    .breadCrumbs a.glyphicon {
        display: none;
    }
}

/* BREADCRUMBS ENDS */

/*Accordion Starts*/
.panel-heading {
    background-color: #e9edee!important;
}

.panel-title a {
    font-size: 0.7em;
    text-transform: uppercase;
}

@media (max-width: 767px) {
    .panel-title a {
        font-size: 0.8em;
    }
}

@media (max-width: 350px) {
    .panel-title a {
        font-size: 1em;
    }
}

.panel-title span.icon {
    float: right;
    width: 16px;
    height: 16px;
}

.panel-body li {
    padding-top: 5px;
    padding-bottom: 5px;
}

@media (max-width: 767px) {
    .panel-body li {
        padding-top: 8px;
        padding-bottom: 8px;
    }
}

a[aria-expanded="false"] span.icon {
    /*background-image: url("images/ui-icons_444444_256x240.png");*/
    background-image: url("images/ui-icons_ffffff_256x240.png");
    background-position: -15px -128px;
}

a[aria-expanded="true"] span.icon {
    background-image: url("images/ui-icons_ffffff_256x240.png");
    background-position: -47px -128px;
}

.panel-group .panel-heading {
    color: #fff!important;
    background-color: #4899d2!important;
    background-image: none;
    filter: none;
}

/*.collapsed span.icon {
    background-image: url("images/ui-icons_444444_256x240.png");
    background-position: -15px -130px;
}*/
/*Accordion Ends*/

/*Epson Icons From epson.com*/
@font-face {
  font-family: 'epson-icons';
  src: url('/common/fonts/epson-icons.eot?-9bzojg');
  src: url('/common/fonts/epson-icons.eot?-9bzojg#iefix') format('embedded-opentype'), url('/common/fonts/epson-icons.woff2?-9bzojg') format('woff2'), url('/common/fonts/epson-icons.ttf?-9bzojg') format('truetype'), url('/common/fonts/epson-icons.woff?-9bzojg') format('woff'), url('/common/fonts/epson-icons.svg?-9bzojg#epson-icons') format('svg');
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"],
[class*=" icon-"] {
  font-family: 'epson-icons';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-hamburger:before {
  content: "\e800";
}
.icon-down-right-arrow:before {
  content: "\e801";
}
.icon-left-arrow:before {
  content: "\e600";
}
.icon-left-arrow_hover:before {
  content: "\e601";
}
.icon-right-arrow:before {
  content: "\e603";
}
.icon-right-arrow_hover:before {
  content: "\e602";
}
.icon-close:before {
  content: "\e604";
}
.icon-phone:before {
  content: "\e802";
}
.icon-person-headset:before {
  content: "\e803";
}

/*Generic classes to override bootstrap padding */
.no-padding {
    padding: 0;
}

.no-left-padding {
    padding-left: 0;
}

@media (max-width: 767px) {
    .no-gutter-xs-left {
        padding-left: 0;
    }
}

@media (max-width: 767px) {
    .no-gutter-xs-right {
        padding-right: 0;
    }
}

.totheright {
    text-align: right;
}

/*Bootstrap Modal Styles Override Starts*/
.modal .modal-header,
.modal .modal-body,
.modal .modal-footer {
    background-color: #ffffff;
}

/*.modal:before {
    display: inline-block;
    vertical-align: middle;
    content: " ";
    height: 15%;
}*/
.modal {
    top: 40%;
}
/*Bootstrap Modal Styles Override Ends*/
/*Bootstrap Tooltip Styles Override Starts*/
#main #tooltip {
    position: relative;
}

p.white-tooltip {
    /*width: 80%;*/
}

.white-tooltip + .tooltip.bottom {
    opacity: 1;
    padding: 5px 0 0 0;
}   

.white-tooltip + .tooltip.top {
    margin-top: -10px;
    left: 5%!important;
    opacity: 1;
}

.white-tooltip + .tooltip.left {
    opacity: 1;
    margin-top: -10px;
    right: 33px!important;
    left: -123px!important;
    padding: 0;
}

.white-tooltip + .tooltip > .tooltip-inner {
    background-color: #fff;
    color: #000000;
    border: 1px solid #d8d5d5;
    max-width: 320px;
}

.white-tooltip + .tooltip > .tooltip-inner:before,
.white-tooltip + .tooltip > .tooltip-inner:after {
    display: block;
    content: "";
    position: absolute;
    z-index: -100;
    width: 100%;
    top: 2%;
    bottom: 3%;
    left: -1%;
    box-shadow: 5px 4px 10px rgba(0, 0, 0, 0.1);
    transition: transform 200ms ease-out;
}

.tooltip.top .tooltip-arrow {
    border-top-color: #d8d5d5;
    border-width: 15px 15px 0 15px;
    bottom: -5%;
    left: 8%!important;
}

.tooltip.left .tooltip-arrow {
    border-left-color: #d8d5d5;
    border-width: 15px 0 15px 15px;
    top: 36px!important;
    right: -12%;
}
/*Bootstrap Tooltip Styles Override Ends*/

/*iPhone Chrome hack*/
@media (max-width: 767px) {
    hidden-xs.desktop {
        display: none;
    }
}
@media (max-width: 767px) {
    option.hidden-xs.desktop {
        display: none;
    }
}

input.new-button,
a.new-button {
    background-color: #689dcf;
    color: #fff!important;
    padding: 9px;
    font-weight: bold;
    vertical-align: bottom;
    border-radius: 3px;
}
a.new-button {
    line-height: 3em;
}

/*jsDropdown select box inside content area - example Date jsDropdown*/
#container #main a.jsDropdown {
    font-size: 14px!important;
    background: none;
    padding: 3px;
    background-color: #ffffff;
    line-height: initial;
}
#container #main a.jsDropdown:after {
	content: '\25BC';
    color: #acacac;
    text-decoration: none;
    font-size: 85%;
    vertical-align: top;
    padding-left: 7px;
    padding-right: 5px;
}
#container #main a.jsDropdown:focus {
    text-decoration: none;
}
#container #main a.jsDropdown span {
	background: none;
    font-size: 0.9em;
    border-right: 1px solid #d4d4d4;
    padding: 0 7px;
}

.hideOnMobile {
    display: none;
}

@media only screen and (min-width: 768px) {
    .hideOnMobile {
        display: inline;
    }
}