/*
File name: style.css
Description: global CSS file for Microsoft Office O15 Academic
Website: 
Page width: 960px
*/

/* ---------------------------------------------
 General Styling
--------------------------------------------- */

/*
@font-face {
    font-family: 'Segoe UI';
    src: url('segoeui.eot'); 
    src: url('segoeui.eot?#iefix') format('embedded-opentype'), 
         url('segoeui.woff') format('woff'), 
         url('../font/segoeui.ttf')  format('truetype'), 
         url('segoeui.svg#svgFontName') format('svg'); 
}

@font-face {
    font-family: 'Segoe UI Light';
    src: url('segoeuil.eot'); 
    src: url('segoeuil.eot?#iefix') format('embedded-opentype'), 
         url('segoeuil.woff') format('woff'), 
         url('../font/segoeuil.ttf')  format('truetype'), 
         url('segoeuil.svg#svgFontName') format('svg'); 
}
*/
* {margin:0;padding:0;}
    html, body {height: 100%;}
    body {position: relative; font-family: "Segoe UI", Tahoma, Geneva, sans-serif; font-size: 16px; line-height: 20px;}

#container {min-height: 100%; min-width:960px; overflow-x:hidden}

ul {margin: 0; padding-left: 0; list-style: none;}
  .headerNavigation li, .tabs li, .productKey li {float: left; display: inline; border-right: 1px solid #ccc; padding-right: 10px; margin-right: 10px; line-height: 14px;}
  .headerNavigation li.last, .headerNavigation li:last-child, .tabs li {border-right: none; padding-right: 0; margin-right: 0;}
  .productKey li {border-right: none; padding-right: 2px; margin-right: 2px; line-height: 30px;}
  .productKey li input {width: 80px; padding: 5px; font-size: 16px; font-weight: bold;}

ol {list-style-type: decimal; padding-left: 40px;}

.hrTop {border-top: 1px solid #ccc;}
.hrBottom {border-bottom: 1px solid #ccc;}
.titleBold {font-weight: bolder;}

p { padding:10px 0px; }
.noMargin { margin:0; }
.noPadding { padding:0 }
.fake { border:1px dashed red; }
 	  
/* ---------------------------------------------
 Page
--------------------------------------------- */
#mainPage {overflow: hidden; padding-bottom: 70px;}  /* must be same height as the footer */
    #mainPage .mainContent, #footer .wrapper {margin: 0 auto;} /* /mainPage */
   
/* My Product Page */
    .mainProductInfo {min-height: 80px; display: block; clear: both;}
        .mainProductInfo .wrapper {height: 240px; display: block; clear: both;}
        .mainProductInfo .productWrapper {height: 90px; padding-top: 5px;} 
        .mainProductInfo .wrapper h1 {padding-top: 100px;}
    .mainContentWrapper_1 {float: left; } 
        .mainContentWrapper_1 h2 {margin: 10px 0;}
    .mainContentWrapper_2 {margin: 40px 0 0 0; float: right; font-size: 12px; color: red;}
    
 	p.checkBox_1 {padding: 20px 0 20px 20px;}
 	p.child_4 {margin: 20px 0;}
 	
	  .prodKeyWrapper {font-size: 14px; margin-top: 20px;}
	  p.prodInfoLink {margin-top: 0; padding-left:30px; background-image: url(../images/up.png) no-repeat; }
 	  .productKeyContainer {width: 960px; height: 40px; xmargin: 15px 0;}
 	  .productInfoSlider {margin-bottom: 30px; color: #999; padding-left:30px;}
 	  .findProductImg {width: 200px; height: 169px; margin: 20px 0; background: url(../images/POSA_animated_en_Combo.gif) no-repeat;}

      .productContent h3 {margin: 0 0 15px 0; }
      .productContent ol {padding-bottom: 10px;}
      p.redemption, p.prodKey {padding-bottom: 10px;}
  
  .productInfoContainer { clear:both;}
  	  .productInfoContainer p {padding: 0 0 20px 0;}
  	  .productInfoContainer ul { height:80px; }
 	  .productInfoContainer li {float: left;}
 	  .productInfoContainer li label {display:block;}
 	  .productInfoContainer li.first {margin-right: 20px;}
 	  .productInfoContainer select {width: 160px; margin-top: 10px; padding: 8px;}

.productDownloadContainer .downloadNowInstructions { float:right; width: 190px; padding:5px 0; }

/* ---------------------------------------------
 Masthead 
--------------------------------------------- */
 #masthead .headerContent {font-size: 14px;}
    #masthead .headerContent .subChild_1 {
        margin-bottom: 3px;
        height: 50px;
        line-height: 50px;
        background-color: #000;
        font-size: 14px;
        color: #fff;
    }
   
   #masthead .headerContent .subChild_1 a {text-decoration: none;}
            .headerContent .subChild_1 a:hover{text-decoration: none;background-color:#444}
            .headerContent .subChild_1 .wrapper {margin: 0 auto;}/* /wrapper */
            .headerContent .subChild_1 .wrapper .logo {width: 120px; height: 33px; margin-top: 2px; float: left;}
            .headerContent .subChild_1 .wrapper .content {min-width: 170px; float: right; text-align: right;background-color: #E1E1E1; color:#444444 /*background-color: #EBECEE;*/}
            .headerContent .subChild_1 .wrapper .content a { color: #444444 ; font-weight: normal !important}
            .headerContent .subChild_1 .wrapper .content .liveid{ cursor: pointer;}
            .headerContent .subChild_1 .wrapper .content .liveid a:hover{ text-decoration: underline !important; background-color:#E1E1E1 !important}
            .headerContent .subChild_1 .wrapper .content .name { padding: 10px 5px 10px 10px}
            .headerContent .subChild_1 .wrapper .content_TEST a {width: 280px; float: right; text-align: right; color: #fff; padding-right: 0;}
            .headerContent .subChild_1 .wrapper .navLinks .signin {background-color :#444}
            .headerContent .subChild_1 .wrapper .navLinks .signin:hover{background-color :#707070}
           
            .navLinks { float: right; }
            .headerContent .subChild_1 .wrapper a{ padding: 16px 8px;color: #ffffff; }
            .headerContent .subChild_1 .wrapper a:hover {text-decoration: none;background-color: #444 }

   
   #masthead .headerContent .subChild_2 {margin: 0 auto; padding: 15px 20px 0 0; font-size: 12px;} /* /headerContent_sub2 */
        #masthead .headerContent .subChild_2 .wrapper {float: right;}/* /wrapper */
        #masthead .headerContent .subChild_2 .wrapper .content .headerNavigation li a{color:#0044cc}

   #masthead .headerContent .subChild_3 { width: 960px; margin-left:auto; margin-right:auto; clear: both; }            
        #masthead .headerContent .subChild_3 .ms-officeLogo {background: url(../images/O15_logo.png) no-repeat; width: 295px; height: 136px; display: block; }             
       .mainProductInfo {padding: 0; border-bottom: 3px solid #ccc; margin-bottom:20px; }
       .logo_large { display:none; }
            
   #mainContent {width: 960px; margin: 0 auto; padding: 20px 0 0 0;}
            #mainContent .bottomProductContent h2, #mainContent .bottomProductContent h6 {padding: 0 0 20px 0;}
                #mainContent .child_2 .button.getItNow {float: left;}
                #mainContent .child_2 .button, #mainContent .child_5 .button {float: right;}
                #mainContent .bottomProductContent .checkBox_1,  #mainContent .bottomProductContent .checkBox_2 {padding: 5px 0 5px 20px;}
                #mainContent .bottomProductContent .child_5.hrBottom {margin-top: 20px;}
   
        
/* ---------------------------------------------
 Footer
--------------------------------------------- */
#footer {
    position: relative;
    margin-top: -50px; /* negative value of footer height */
    height: 50px;
    clear:both;
    line-height:0px;
    min-width:960px;
   } 
    #footer ul.footerNavigation {padding: 20px 0 0 20px; list-style: none; font-size: 12px; float:right;color:#707070}
    #footer ul.footerNavigation li {float: left; display: inline; /*border-right: 1px solid #ccc;*/ padding-right: 10px; margin-right: 10px; line-height: 14px;}
    #footer ul.footerNavigation li.last, li:last-child {border-right: none; padding-right: 0; margin-right: 0;}

        
/*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
    content:"";
    height:100%;
    float:left;
    width:0;
    margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}

/* Impressum Link */
#footer ul.footerNavigation li.impressum { display:none; }

[lang=de-DE] #footer ul.footerNavigation li.impressum { display:inline; padding-left:10px; margin-left:10px; border-right:none; border-left: 1px solid #ccc; }

/* ---------------------------------------------
 Marketing Page
--------------------------------------------- */
#mainContent.impPage .mainProductInfo {height: 190px;}
	.impPage .productContent h2 {margin-bottom: 20px;}
	



/* ---------------------------------------------
Home Page
--------------------------------------------- */
.prodKeyWrapper a { padding-left:30px; margin-bottom:10px; display:block; height:20px; width:100%; background-image: url(../image/up.png) no-repeat; cursor:pointer; }
#submitButton{float:right;}
#cancelButton{float:right; margin-left:15px;}
#productTokenEntry p.heading2 { padding-bottom:22px; }

/* ---------------------------------------------
ESD Page
--------------------------------------------- */
.ESDLandingPage button {margin-top: 30px; }

/* ---------------------------------------------
 Images and Grphics
--------------------------------------------- */
.logo_office {width: 50px; height: 50px; display: block; background: url(../images/office.png) no-repeat; float: left; }
.logo_sm1 {display: block; float: left;color: #fff !important;font-size: 22px;padding-left: 21px;padding-right: 20px; font-family:'Segoe UI Light','Segoe UI Web Light','Segoe UI Web Regular','Segoe UI','Segoe UI Web','Segoe UI Symbol',HelveticaNeue-Light,'Helvetica Neue',Arial,sans-serif;}
.logo {background: url(../images/product_logo.png) no-repeat;}
.productImg {background: #fff url(); float: left;}

.note_icon {width: 100%; height: 32px; display: block; float: left; margin: 5px 0 5px 5px; border: 1px solid;}
.note_text { margin-left:32px; }
 
.arrow {width: 20px; height: 20px; cursor:pointer; }
.expand .arrow {background: url(../../resources/default/images/up_arrow_gray_12x7.png) no-repeat 5px}
.collapse .arrow {background: url(../../resources/default/images/down_arrow_gray_12x7.png) no-repeat 5px;}
.arrowUp {background: url(../../resources/default/images/up_arrow_gray_12x7.png) no-repeat 5px;}
.arrowDown {background: url(../../resources/default/images/down_arrow_gray_12x7.png) no-repeat 5px;}


/* ---------------------------------------------
 Error Message Style
--------------------------------------------- */
.errorMessange {padding: 10px 0; font-size: 14px; color: red}

/* ---------------------------------------------
 Content Styling (fonts, colors, weight, etc.)
--------------------------------------------- */
/* text styles */
.note_title {font-weight: bold; text-transform: uppercase;}

.brickColor, p.redemption {color: #} 

a.printWrapper {color: #990000 !important;}

/* headers */
h1 {font-size: 28px; font-family: "Segoe UI Light", sans-serif;}
h2 {font-size: 24px; font-family: "Segoe UI Light", sans-serif;}
h3 {font-size: 18px; font-family: "Segoe UI Light", sans-serif; line-height: 30px; padding:20px 0 15px 0;}
h4 {font-size: 16px; font-family: "Segoe UI Light", sans-serif;}
h5 {font-size: 14px; font-family: "Segoe UI Light", sans-serif;}

/* Links Styles*/
  a:hover {color: #0044cc; text-decoration: underline;}
  
  a:active, a:visited, .grayTxt {color: #636363;}
  a:hover {color: #0044cc; text-decoration: underline;}

.cntPSWhite, a.cntPSWhite, a.cntPSWhite:link, a.cntPSWhite:active, a.cntPSWhite:visited {color: #fff;}
  a:hover {color: #0044cc; text-decoration: underline;}

.cntPSExLink, a.cntPSExLink:active {color: #388222;}
  a.cntPSExLink:visited {color: #6633b3;}
  a.cntPSExLink:hover {color: #0044cc; text-decoration: underline;}

.cntPSMeta1 {font-size: 14px; padding-bottom: 7px;}
  a.cntPSMeta1:visited {color: #101010;}
  a.cntPSMeta1:hover {color: #0044cc; text-decoration: underline;}

.gradient_blue {
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: -moz-linear-gradient(top, rgba(30,87,153,1) 0%, rgba(125,185,232,0) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(30,87,153,1)), color-stop(100%,rgba(125,185,232,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(30,87,153,1) 0%,rgba(125,185,232,0) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(30,87,153,1) 0%,rgba(125,185,232,0) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(30,87,153,1) 0%,rgba(125,185,232,0) 100%); /* IE10+ */
    background: linear-gradient(top, rgba(30,87,153,1) 0%,rgba(125,185,232,0) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#007db9e8',GradientType=0 ); /* IE6-8 */ 
} /* gradient_blue */

/* ---------------------------------------------
 Buttons Styles
--------------------------------------------- */
.btnContainer  
{

}


a.button { padding:5px 20px; }
button:hover, a.button:hover {background-color: #707070; color: #ffffff; text-decoration: none; }
a, a:link, a.button {text-decoration: none;}

.footerNavigation .a, .footerNavigation a:link, .footerNavigation a.button {text-decoration: none; color:#707070}
.footerNavigation a:hover, a:link:hover, a.button:hover {text-decoration: none; color:#333}

.cntPSNeuButton {background-color: #d9d9d9; font-size: 16px; color: #373737;}
.cntPSOrButton {background-color: #fcd116; font-size: 16px; color: #373737;}
.cntPSSecButton {background-color: #ffffff; font-size: 16px; color: #505050; border: 1px solid #898989;}


/*O15 Button - Common Styles*/
.btnContainer {background-color: #707070; color: #ffffff; cursor:default; xdisplay:block; text-align:center; padding-left:20px; padding-right:20px; }

/*Ellipsis for Overflow*/
.btnContainer  {
    text-overflow:ellipsis; 
    overflow:hidden; 
    white-space:nowrap; 
    display:-moz-inline-stack;
    display:inline-block;
    zoom:1;
    *display:inline;
    max-width: 240px;}

/*Hover State*/
button.btnContainer:hover,
a.btnContainer:hover,
div.btnContainer:hover,
span.btnContainer:hover {background-color:Red;background-color: #707070; color: #ffffff;}

/*Button Sizes*/
.btnContainer.btnSmall {font-size: 14px; padding-top:5px; padding-bottom:5px; line-height:15px; }
.btnContainer.btnMedium {font-size: 16px; padding-top:5px; padding-bottom:5px; line-height:21px; }
.btnContainer.btnLarge {font-size: 24px; padding-top:5px; padding-bottom:5px; line-height:37px; }

/*Green Button*/
.btnContainer.btnGreen {border:1px #118b04; background-color:#118b04;}
.btnContainer.btnGreen,
.btnContainer.btnGreen a:visited,
.btnContainer.btnGreen a:active { color:#fff; cursor:default; }



/* ---------------------------------------------
 Notification Styles
--------------------------------------------- */
.notification { width:100%; }
    .notification .summary.container { padding:11px 11px 11px 11px; min-height:32px; position:relative; }
        .notification .summary.container .wrapper {  }
            .notification .summary.container .text { padding-left:49px; padding-top:4px; padding-bottom:4px;}
    .notification.error .summary.container {background: #f8d4d4 url(../../resources/default/images/Error_Icon_32x32.png) no-repeat; background-position:left center; border: 1px solid #f5a6a7;} 
    .notification.alert .summary.container {background: #fff19d url(../../resources/default/images/Alert_Icon_32x32.png) no-repeat; background-position:left center; border: 1px solid #d7d889;}
    .notification.info .summary.container {background: #dbe5f1 url(../../resources/default/images/Info_Icon_32x32.png) no-repeat; background-position:left center; border: 1px solid #aed3c2;}
    .notification .description.container {padding:11px 0;}
    .notification .description.container ul {list-style-type:disc; list-style-position: inside;}
    
.notification.close .summary.container { padding-right:31px;  }
    .notification.close .summary.container .close { display:block; height:18px; width:18px; background:url(../../resources/default/images/X_close.png) no-repeat; position:absolute; right:6px; top:6px; }


/* ---------------------------------------------
 Language Support
--------------------------------------------- */

ol.hebrewLang {list-style-type: hebrew;}
ol.hiraganaLang {list-style-type: hiragana;}
ol.katakanaLang {list-style-type: katakana;}
ol.georgianLang {list-style-type: georgian;}
ol.cjk-ideographicLang {list-style-type: cjk-ideographic;}
ol.armenianLang {list-style-type: armenian;}
ol.lower-greekLang {list-style-type: lower-greek;}


.hide { display:none; }