﻿/*== IMAGES STANDARD STYLES ==*/
img.centerpage {
  margin:15px auto 15px auto; 
  display:block;     
}


/*== Stylesheet for login page ==*/

form {
  margin:0px;
  padding:0px;
}

ul.login-form, ul.login-form li {
  list-style:none;
  margin:0px;
  padding:0px;
}

ul.login-form label {
  display:block;
  margin:6px 0px 2px 0px;
}


input {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  margin:0px 0px 2px 0px;
  padding: 4px;
  border-width: 1px 1px 3px 1px;
  border-style: solid;
  border-color:#cccccc;
  width:167px;
}

input:focus {
  background:#fefec6;
}


input.error {
  border-color:#cc0000;
}

p.errormsg {
  color:#cc0000;
  background: url(images/red-arrow.jpg) no-repeat 2px 0px;
  padding-left:17px;
  display:none;
}

p.successmsg {
  color:#408000;
  font-weight:bold;
  display:none;
}


input#login, input#getpassword {
  display:block;
  margin:5px 0px 0px 0px;
  background-color: #f1f1f1; 
  background: url('images/button-small.png') repeat-x; 
  border-width:1px;
  border-style: solid;
  border-color:#cccccc;
  width:177px;
  cursor:pointer;
  height:25px; 
  font-weight:bold;
  color:#666666;
}

input#login:hover, input#getpassword:hover {
  background: url('images/button-small.png') repeat-x 0px -30px; 
  border-color:#ccc; 
  color:#cc0000;
}

input#login:active, input#getpassword:active {
  background: url('images/button-small.png') repeat-x 0px -35px; 
  border-color:#ccc;
  color:#cc0000;
}

p.login-link {
  text-align:right;
  width:auto;
  font-size:10px;
  color:#999999; 
  line-height:1.5em;
  font-style:italic;
}

p.login-link a {
  font-weight: normal;
}

ul#register-info, ul#register-info li {
  text-align:right;
  list-style:none;
  margin:4px 0px 0px 0px;
  padding:0px;
}

ul#register-info a { 
  padding:5px 0px 0px 0px;
  font-style:italic;
}

#login-services-container {
  width:425px;
  border:1px solid #cccccc;
  padding:5px 10px;  
  -webkit-box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
  -moz-box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
  box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
  background: url('images/dpogradient.png') bottom repeat-x; 

}

#login-services a.services-info {
  display:block;
  width:212px;
  float:left;
  margin-bottom:5px;
}

#login-services a.services-info span {
  text-align:center;
  display:block;
  font-weight:bold;
  padding:0px 10px;
}

.learn-more {
  text-align:right;
  font-style:italic; 
}

/*== NEWS ==*/

#billboard {
    position:relative;
    display:block;
    width:718px;
} 

#whatsnew {
    width:250px;
    height:235px;
    position:absolute;
    right:0px;
    background: url('images/white90.png'); 
    margin:0px;
    padding:10px 15px 10px 15px;
    overflow:auto;
    display:none; 
}

#whatsnew h1 {
  margin-top:10px;
  padding:0px;
}

#whatsnew ul {
    list-style:none;
    padding:0px;
    margin:10px 0px 0px 0px;
}

#whatsnew ul li {
    padding: 3px 0px 3px 0px;
}

.calendar {
  width:32px;
  display:inline;
  float:left;
  margin-left:-38px;
  background:#ffffff;
}

.calendarmonth {
  display:block;
  color:#ffffff;
  background:#cf2216;
  font-size:8px;
  font-weight:bold;
  padding:1px 1px 1px 3px;
}

.calendarday {
  display:block;
  color:#727272;
  font-size:14px;
  font-weight:bold;
  text-align:center;
  border:1px solid #d9d9d9;
  border-top:0px;
  padding:2px 0px;
}

#whatsnew ul li {
  list-style:none;
  margin-bottom:4px;
  padding:3px 2px 5px 35px;
  border-bottom: 1px solid #d9d9d9;
}

#whatsnew ul li.last {
  border-bottom: 0px;
}

/*== HOW TO REGISTER STYLES ==*/

.instruction-box {
  border:1px solid #f1f1f1;
  padding:0px 10px 10px 10px;
  position:relative;
}

.nextstep {
  height:40px;
  margin:10px 0px;
  background:url('images/arrow-large.png') no-repeat center;
}

.instruction-box h2 {
  border-bottom-width: 1px;
  border-bottom-style: solid;
}

/*== PRODUCTS LIST STYLE ==*/

.products-list-box {
  border:1px solid #f1f1f1;  
  height:auto;
  margin-top:8px;
  position:relative;
  clear:both;
}

.products-list-box h2 {
  display:block;
  position:absolute;
}

.products-list-box img {
  display:block; /* Removes 2px that would appear below the image if inline */
}

.thelist {
  display:none; 
  padding:10px;
}

.thelist ul, .thelist ul li {
    list-style:none;
    padding:0px;
    margin:0px;
}

.thelist ul {
  float:left;
  margin-right:0px;
  width:174px;
}

.thelist ul li {
  margin-bottom:10px;
}

span.servicesquare {
  display:inline-block;
  width:8px;
  height:8px;
  margin-left:2px;
  font-size:0;
}

span.opa {
  background:#ec7a08;
}

span.vps {
  background:#6a963b;
}

span.customise {
  background:#006fb4;
}

span.printprojects {
  background:#a31a7e;
}

span.usefularticles {
  background:#009697;
}

p span.servicesquare {
  display:inline-block;
  width:8px;
  height:8px;
  margin-right:2px;
  font-size:0;
}

#products-list-legend a{
  margin-right:10px;
}


/* FAQ Styles */
dl.faq {
  margin:0px 0px 1em 0px;
}

dl.faq dt {
  margin:0px;
  font-weight:bold;
}

dl.faq dd {
  margin:0px 0px 0.3em 0px;
  padding-left:8px;
}

dl.faq dd ul, dl.faq dd ol {
  margin-top:0.3em;
}

/* My Camera Styles */

.mycamera-theme {
  position:relative;
  border:1px solid #c1c1c1;
  width:120px;
  height:90px;
  padding:3px;
  margin:0px 22px;
}

.mycamera-title {
  margin-bottom:0px;
  text-align:center;
  font-weight:bold;
}

.small-label {
  font-size:8px;
  background:#cc0000;
  color:#ffffff;
  font-weight:normal;
  padding:1px 2px;
  margin:0px 5px;
  vertical-align:middle;
}

/* Demo pages style */

#locked {
  border:1px solid #f1f1f1; 
  padding:0px 10px 5px 10px; 
  background-color:#ffffff; 
  display:none;
  position:relative;
}

#close-locked {
  display:block; 
  position:absolute; 
  right:0.5em; 
  top:0px;
}


/* Service compatibility pages */

#compatibleproducts ul {
  list-style:none;
  width:150px;
  float:left;
  margin:0px 15px 0px 0px;
  padding:0px;
}

#compatibleproducts ul li {
  list-style:none;
  width:150px;
  margin:0px;
  padding:0px;
}    

#pwReminderForm {
  display:none;
}


/* Download pages */
#download_software {
  display:none;
}

input.checkbox {
  width:auto;
  vertical-align:middle; 
  margin:0px 3px 0px 0px;  
}

/* Note */

#notetop {
  background: url('images/note/notetop.jpg') no-repeat top;
  height:7px;
}
    
#notewrapper {
  margin:30px auto 0px auto;
  position:relative;
  width: 434px;
  background: url('images/note/notebackground.jpg') repeat-y top;
  display:none;
}

#notecontent {
  padding: 0px 25px;
}

#notebottom {
  background: url('images/note/notebottom.jpg') no-repeat bottom;
  height:38px;
}

#notetape {
  position:absolute;
  margin: 0px 0px 0px -40px;
  left:50%;
  top:-12px;
}

/* Articles and other index pages */

ul#article-index {
  list-style:none;
  margin:0px;
  padding:0px;
  position:relative;
}

ul#article-index li {
  margin: 10px 0px;
  position:relative;
}

ul#article-index li a {
  border-width: 0px 0px 3px 0px;
  border-style:solid;
  border-color: #e6e6e6; 
  padding:6px 7px 3px 7px; 
  display:block;
}

ul#article-index li a:hover {
  border-bottom-color:#cc0000; 
}

a .articles-index-h2 {
  position:absolute;
  left:0px;
  top:25px;
  font-size:14px;
  font-weight:bold;
  color:#ffffff;
  padding:0px 5px;
  margin-left:0px;
  background:#666666;
}  

.articles-tagline {
  display:block; 
  text-align:right; 
  font-style:italic; 
  margin-right:5px;
}

/* Hide things */
.IJMonly, .CAMonly {
  display:none;
}

/* EFIGS pages */
ul#chooselanguage, ul#chooselanguage li {
  list-style:none;
  padding:0px;
  margin:4px 0px;
}

ul#chooselanguage li a img {
  margin-right:5px;
  vertical-align:middle;
}

/* Newsletter registration page */

#newsletter-success {
  background: #ffffff url('images/greentick.png') no-repeat;
  padding:9px 9px 9px 44px;
  font-size:21px;
  font-weight:bold;
  color:#408000;
  display:none;
}
#newsletter-error {
  background: url('images/redcross.png') no-repeat;
  padding:9px 9px 9px 44px;
  font-size:12px;
  font-weight:bold;
  color:#b91e14;
  display:none;
}

/* MyCamera */

.mycamera_theme {
  display:block;
  width:130px;
  padding:10px;
  margin:0px 14px;
  text-align:center;
  float:left;
  display:inline;
}
.mycamera_theme img {
  display:block;
  border:1px solid #cccccc;
  padding:3px;
  margin:0px auto;
}

.mycamera_theme_title {
  display:block;
  margin:4px 0px;                
}

a.mycamera_theme_link {
  display:inline-block;
  background-color: #f1f1f1; 
  background: url('images/button-small.png') repeat-x; 
  border-width:1px;
  border-style: solid;
  border-color:#cccccc;
  width:auto;
  cursor:pointer;
  height:auto; 
  padding:5px;
  font-weight:bold;
  color:#666666;
  text-align:center;
  width:118px;
}

a.mycamera_theme_link:hover {
  background: url('images/button-small.png') repeat-x bottom; 
  border-color:#ccc;
  color:#cc0000;
}

/* Useful articles */





/* Craft Zone */

ul.articles-list-cz {
list-style: none;
padding:0px;
margin:0px;
}
ul.articles-list-cz li {
padding:5px;
margin:0px 10px 10px 0px;
border:1px solid #f2f2f2;
width:210px;
display:inline-block;
zoom: 1; /* Hack to make IE behave with inline-block */
*display:inline; /* Hack to make IE behave with inline-block */
-webkit-box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
/* Gecko */
-moz-box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
/* Final CSS3 and IE9 supposedly */
box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
}

.cz-step-container img {
  margin-bottom:10px;
  padding:5px;
  border:1px solid #cccccc;
  background:#ffffff;
}
span.cz-step-number {
  position:absolute;
  top:-8px;
  left:-8px;
  padding:0.2em 0.4em;
  color: #ffffff;
  background-color: #666666;
  font-weight:bold;
  font-style:italic;
  font-size:18px;
  text-align:center;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
}

img.cz-icons {
  margin-right:5px;
  vertical-align:bottom;
}

ol#ordered-instructions {
  list-style:none;
  margin:5px;
  padding:0px;
}

ol#ordered-instructions li{
  list-style:none;
  text-align:center;
  display:inline;
  float:left;
  margin:20px 5px 5px 5px;
  padding:10px;
  width:300px;
  position:relative;
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  border-color: #cccccc;
  background:#fafafa;
  -webkit-box-shadow: 0px 0px 10px #e2e2e2; 
  -moz-box-shadow: 0px 0px 5px #e2e2e2; 
}      

ol#ordered-instructions li.instruction-odd{
  clear:both;
  margin-right:40px;
}          
 
 
/* Digital Print Lesson */ 
 
#movie {
  margin-top:10px;
  width:538px;
  height:509px;
  float:left;
}
 
#dpl-steps {
  float:right;
  width:165px;
  padding-top:15px;
}

#dpl-steps h2 {
  text-align:center;
}

#dpl-steps ol {
  text-align:left;
  list-style:none;
  padding:0px;
  margin:0px;
}

#dpl-steps li {
  margin:0px;
  padding:5px 0px;
}

#dpl-steps li a.playing, #dpl-steps li a:hover.playing {
  background:url('images/play-arrow.jpg') no-repeat;
  font-style:italic;
}

#dpl-steps li a {
  display:block;
  width:145px;
  padding:0px 5px 0px 15px;
}

#dpl-steps li a:hover {
  background:url('images/play-arrow-light.jpg') no-repeat;
}

ul.articles-list-dpl {
  list-style:none;
  margin:10px 0px 0px 0px;
  padding:0px;
  width:716px;
}

ul.articles-list-dpl li {
  margin:0px 0px 20px 0px;
  padding:0px 20px;
}

ul.articles-list-dpl img {
  margin-top:5px;
  margin-right:10px;
  float:left;
  border:1px solid #cccccc;
  padding:5px;
  background:#ffffff;
}

/* DPB */
ul.articles-list-dpb {
  list-style:none;
  -webkit-padding-start:0px;
  margin:10px 0px 0px 0px;
  padding:0px 0px 0px 0px;
  width:716px;
}

ul.articles-list-dpb li {
  margin:0px 0px 0px 0px;
  padding:0px 0px;
}

/* Bottom list of articles */

#all-articles {
  padding:5px 15px;
  border:1px solid #cccccc;
  background: #f2f2f2 url('images/dpogradient.png') top repeat-x;
  width:686px;
}

#all-articles ul {
  width:200px;
  margin:5px 25px 0px 0px;
  padding:0px;
  list-style:none;
  float:left;
}

#all-articles ul.last {
  margin-right:0px;
}

#all-articles ul li {
margin:0px 0px 10px 0px;
}    
      

/* Other */

.small-label {
  font-size:8px;
  background:#cc0000;
  color:#ffffff;
  font-weight:normal;
  padding:1px 2px;
  margin:0px 5px;
  vertical-align:middle;
}

ul.reallist {
  padding:0 0 0 1.4em;
  margin:0px;
}

/* Professional Print Techniques */

img.ppt-thumb-intro {
  float:right;
  margin-left:10px;
  border:1px solid #b2b2b2;
  padding:5px;
}

img.ppt-middle-nolegend {
  border:1px solid #b2b2b2;
  padding:5px;  
  margin:15px auto; 
  display:block;     
}

img.ppt-middle-withlegend {
  border:1px solid #b2b2b2;
  padding:5px;  
  margin:15px auto 5px auto; 
  display:block;     
}

p.ppt-middle-legend {
  font-style:italic;
  font-weight:bold;
  text-align:center;
  margin-bottom:15px;
  font-size:10px;
  padding:0px 20px;
}

p.ppt-author {
  text-align:right;
  font-style:italic;
}

img.ppt-index-thumbnail {
  border:1px solid #b2b2b2;
  padding:5px;
  margin-right:10px;
  margin-top:5px;
  float:left;
}
ul.articles-list-ppt {
  width: 500px;
  float:left;
  margin:0px;
  padding:5px 0px;
  list-style:inside;
}
ul.articles-list-ppt li {
  margin:0px 0px 5px 0px;
  padding:0px;
}

/* Where to find serial number page */

a.sn img {
  padding:5px;
  border:1px solid #b2b2b2;
  margin:5px;
}
.serial-thumbs {
  text-align:center;
}

/* Demo pages */

.demo-cam, .demo-ij {
  padding: 5px 15px;
  background-color:#fefec6;
  display:none;
}

.demo-content {
  width:580px;
  margin-bottom:35px;
}

.demo-preview {
  float:right; 
  margin-left:10px;
  margin-bottom:10px;
}

p.demo-button-cam a,  p.demo-button-ij a, p.demo-button-all a, p.demo-button a, p.news-button a {
  font-size:12px;
  font-weight:bold;
}

p.demo-button-cam,  p.demo-button-ij, p.demo-button-all {
  text-align:right;
  display:none;
}

p.demo-button {
  text-align:right;
}

img.serieslogo {
  margin:0px 5px;
}

span.big-square {
  display:inline-block;
  height:12px;
  width:12px;
  margin-left:10px;
  font-size:0px;
}

span.big-square.orange {
  background-color:#ec7a08;
}

span.big-square.green {
  background-color:#6a963b;
}

span.big-square.blue {
  background-color:#006fb4;
}

span.big-square.purple {
  background-color:#a31a7e;
}

span.big-square.greenish {
  background-color:#009697;
}

.news-preview {
  float:left; 
  margin-right:10px;
  margin-bottom:10px;
  padding:5px;
  border:1px solid #b2b2b2;
}

p.news-button {
  text-align:right;
}

/*== REGISTRATION - COUNTRY SELECTION ==*/

a.country img.flag {
  display:block;
  margin:0px auto;
} 

a.country {
  display:block;
  width:98px;
  text-align:center;
  min-height:65px;
  float:left;
  margin-right:10px;
  margin-bottom:10px;
  padding:5px 0px;
  border:1px solid #ffffff;
}

a.country:hover {
  border:1px solid #cccccc;
  background-color:#fafafa;
}



.twitter-share-button {
    cursor:pointer;
    margin:1px 0px;
}



/*== EOS MOVIE Articles ==*/


.eosmovie-video-preview-container {
 padding:10px 0px; 
}

.eosmovie-video-preview-wrapper {
  width:480px;
  margin:0px auto;
  border:1px solid #f1f1f1;
  padding:10px;
  -webkit-box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
  /* Gecko */
  -moz-box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
  /* Final CSS3 and IE9 supposedly */
  box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
}

.eosmovie-video-preview-wrapper img {
}

.eosmovie-video-preview-wrapper p {
  margin:10px 0px 0px 0px;
  padding:0px;
  font-size:10px;
  font-style:italic;
}

.eosmovie-play-button {
  display:block;
  margin-right:0px !important;
  width:40%;
  text-align:center;
  float:left;
  background-color: #f1f1f1; 
  background: url('images/button-big.png') repeat-x; 
  border-width:1px;
  border-style: solid;
  border-color:#cccccc;
  cursor:pointer;
  height:auto; 
  padding:10px 3%;
  font-weight:bold;
  font-size:14px;
  color:#666666;
}

a.eosmovie-play-button:hover {
  background: url('images/button-big.png') repeat-x bottom; 
  border-color:#ccc;
  color:#cc0000;
}

.video-button {
  height:16px;
  background:url('images/film-strip-16.png') no-repeat 0px 0px;
  padding-left:24px;
}

a.eosmovie-play-button:hover .video-button {
  background:url('images/film-strip-16.png') no-repeat 0px -32px;
  padding-left:24px;
}

.eosmovie-play-button.floatright {
  float:right;
}

.video-image-container {
  position:relative;
  margin-bottom:13px;
  width:100%;
}

.audio-content {
  position:absolute;
  display:block;
  right:-3px;
  bottom:-3px;
  padding:3px;
  background:#666666;
  color:#ffffff;
  font-size:8px;
}

img.eos-movie-video-frame {
  float:left;
  margin-right:10px;
  margin-bottom:10px;
  border:1px solid #f1f1f1;
  padding:5px;
  -webkit-box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
  /* Gecko */
  -moz-box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
  /* Final CSS3 and IE9 supposedly */
  box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
  
}

img.eos-movie-lens {
  float:right;
  margin-left:20px;
}

.eos-movie-article {
  width: 330px;
  border:1px solid #f1f1f1;
  padding:5px;
  padding-bottom:0px;
  -webkit-box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
  /* Gecko */
  -moz-box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
  /* Final CSS3 and IE9 supposedly */
  box-shadow:0px 3px 5px #b2b2b2; /* CSS3 */
  margin-top:10px;
  margin-bottom:10px;
  float:left;
}

.eos-movie-article span {
  display:block;
  margin-top:3px;
  margin-bottom:5px;
  font-size:11px;
  font-weight:bold;
  text-align:center;
}

.eos-movie-article-odd {
  margin-right:20px;
}
