﻿/*#region body*/
html {
    background: #e4eef2;
    height: 100%;
    width: 100%;
}

body {
    background: #e4eef2;
    font-family : Segoe UI, Regular, Helvetica, Sans-Serif;
    font-size: 1.0em;
    margin: 0px;
    padding: 0px;
}

/* UI Library screen width fixes */

.btn.small {
    width:auto;
    font-size: 1em;
    line-height: 1.25em;
    padding: 5px 0 7px;
}

h2 {
    font-size: 1.875em;
    font-weight: 200;
    letter-spacing: -1px;
    line-height: 1.2em;
    margin-bottom: 0.6em;
}


/*******************************************
       Locale Specific Font Families
********************************************/
/* Japanese */
body:lang(ja-jp) *
{
    font-family: "Meiryo UI", "MS UI Gothic", "MS PGothic", "ＭＳ Ｐゴシック", "MS Gothic", "ＭＳ ゴシック", "sans-serif";
}

/* Chinese Simplified */
body:lang(zh-cn) *
{
    font-family: "Microsoft Yahei UI","Microsoft Yahei","微软雅黑",SimSun,"宋体","sans-serif";
}

/* Chinese Traditional */
body:lang(zh-tw) *
{
    font-family: "Microsoft Jhenghei UI","Microsoft JHengHei","微軟正黑體","MingLiU","細明體","sans-serif";
}

/* Korean */
body:lang(ko-kr) *
{
    font-family: "Malgun Gothic","맑은 고딕","Gulim","굴림","sans-serif";
}

/* Arabic */
body:lang(ar-sa) *
{
    font-family: "Segoe UI","Tahoma","Microsoft Sans Serif","sans-serif";
}

/* Hebrew */
body:lang(he-il) *
{
    font-family: "Segoe UI","Tahoma","Arial","sans-serif";
}

/* Hindi */
body:lang(hi-in) *
{
    font-family: "Nirmala UI","Mangal","sans-serif";
}

/* Thai */
body:lang(th-th) *
{
    font-family: "Tahoma","Microsoft Sans Serif","sans-serif";
}

/* Persian */
body:lang(fa-ir) *
{
    font-family: "Segoe UI","Tahoma","Microsoft Sans Serif","sans-serif";
}

::-webkit-scrollbar {
  height:16px;
  width:16px;
}

::-webkit-scrollbar:disabled {
  display:none;
}

::-webkit-scrollbar-button {
  background-color:#FAFAFA;
  background-repeat:no-repeat;
  cursor:pointer;
  border: 1px solid #C0C0C0;
}

::-webkit-scrollbar-button:horizontal:increment {
  background-image:url('../images/lwa_arrow_staticright_16.png');
  background-position:center;
  height:16px;
  width:16px;
}

::-webkit-scrollbar-button:horizontal:decrement {
  background-image:url('../images/lwa_arrow_staticleft_16.png');
  background-position:center;
  height:16px;
  width:16px;
}

::-webkit-scrollbar-button:horizontal:increment:hover {
  background-image:url('../images/lwa_arrow_hoverright_16.png');
  background-position:center;
  height:16px;
  width:16px;
}

::-webkit-scrollbar-button:horizontal:decrement:hover {
  background-image:url('../images/lwa_arrow_hoverleft_16.png');
  background-position:center;
  height:16px;
  width:16px;
}

::-webkit-scrollbar-button:vertical:increment {
  background-image:url('../images/lwa_arrow_staticdown_16.png');
  background-position:center;
  height:16px;
  width:16px;
}

::-webkit-scrollbar-button:vertical:decrement {
  background-image:url('../images/lwa_arrow_staticup_16.png');
  background-position:center;
  height:16px;
  width:16px;
}

::-webkit-scrollbar-button:vertical:increment:hover {
  background-image:url('../images/lwa_arrow_hoverdown_16.png');
  background-position:center;
  height:16px;
  width:16px;
}

::-webkit-scrollbar-button:vertical:decrement:hover {
  background-image:url('../images/lwa_arrow_hoverup_16.png');
  background-position:center;
  height:16px;
  width:16px;
}

::-webkit-scrollbar-track {
  background-color:#FAFAFA;
}

::-webkit-scrollbar-thumb {
  border:solid 1px #C0C0C0;
  background-color:#FAFAFA;
}

::-webkit-scrollbar-thumb:vertical {
  min-height:50px;
}

::-webkit-scrollbar-thumb:horizontal {
  min-width:50px;
}

::-webkit-scrollbar-thumb:hover {
  border:solid 1px #A9A9A9;
}

::-webkit-scrollbar-thumb:active {
  background-color: #E0E0E0;
}

::-webkit-scrollbar-corner {
  background-color:#FAFAFA;
}

/* main Styles*/

.clear {
        clear:both;
        visibility:hidden;
}

#main{ position:relative; margin: 0 auto 30px; overflow:hidden; width:1022px; }

#mainContainer{ 
    width:100%; 
    padding:0; 
    overflow:hidden;
    min-height:567px;}

#privacyWrapper { 
    height:22px; 
    float:right;
    margin:5px auto 0; 
}

.privacyText { 
    float: left; 
    font-size:0.7em;
    padding-left:20px;
}


.helpText { 
    float: right; 
    font-size:0.7em;
    padding-left:20px;
}


.smallerBlurredBodyText { font-size: 11px; color: #555555; }
.smallerBlurredBodyW15CopyrightText { font-size: 11px; color: #555555; float:left; padding-top: 13px;}
/*#endregion*/

/*#region header*/

.headerSec { 
    display:block; 
    overflow:hidden; 
    background:#FFF;
    padding: 0 19px;
    border: 1px solid transparent;
    border-top: 0;
}

.Logo .Title {
    height:79px;
    line-height:80px;
    display:inline;
}

.headerSec h2 {
    color:#00AFF0;
}

.headerSec h3 {
    color:#0078ca;
}

.qLinks{ 
    float:right; 
    color:#000; 
    text-align:right; 
    margin-right:20px; 

    color: #00AFF0;
    font-size:18px;
}

.qLinks a{ 
    text-decoration:none;
}

.Logo {
    float:left;
}

.Logo img {
    width:40px;
    padding:20px 20px 19px 0;
    float:left;
    display:table-cell;
    vertical-align:middle;
}

.qLinks .HeaderLinksUser {
    height:79px;
    line-height:80px;
    display:inline;
    float:left;
}

.qLinks #SignOutLink {
    height:79px;
    line-height:80px;
    display:inline;
    margin-left:40px;
}

/*#endregion*/

/*#region content*/
.conSec{ display:block; }

/*nav links*/
.navTitle {
    line-height:24px; margin:25px 0;height: 54px;display:block; 
}

.navTitle .myMeetings {
    float:left;
    margin-right: 20px;
}

#edit-container .navTitle .backToMeetingsArrow {
    height: 50px;
    width: 50px;
    display: inline-block;
    border: 2px solid #00aff0;
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px;
    border-radius: 30px;
    position: relative;
    margin: 0 2px;
    overflow: hidden;
}
#edit-container .navTitle .backToMeetingsArrow:hover, 
#edit-container .navTitle .backToMeetingsArrow:focus {
    background: #00aff0;
    border-width: 4px;
    margin: -2px 0;
}
#edit-container .navTitle .backToMeetingsArrow:before {
    content: url(../Resources/back_arrow.png);
    position: absolute;
    top: 16px;
    left: 15px;
    width: 21px;
    height: 19px;
}
#edit-container .navTitle .backToMeetingsArrow:hover:before,
#edit-container .navTitle .backToMeetingsArrow:focus:before {
    top: -64px;
}
.navTitle .newMeeting {
    float:right;
}

#edit-container .navTitle .newMeeting {
    float:left;
}




.subject { margin: 32px 0 20px 20px; color:#999999; font-size:12px; display:block; }

/*meetings list*/
.lftNavigation{ 
    display: inline;
    float: left;
    width: 345px;
    min-height:398px; 
    overflow-x:hidden; 
    overflow-y:auto; 
}
.newConfNavigation{ width:inherit; margin-bottom:20px;}/**\\**/
.navList{width:inherit; display:block; /*padding-bottom:20px; min-height:730px;*/ overflow:hidden;}
.navList p{ color:#999999; font-size:12px; padding:20px 0 5px 15px;}
.navList ul{ list-style:none; padding:0; width:inherit; /*height: 608px;*/}
.navList ul li{ list-style:none;  margin:0; width:345px; height:40px; display:block; padding:0; vertical-align:bottom; text-overflow:ellipsis;}
.navList ul li a{ color:#666666; font-size:13px; text-decoration:none; padding:10px 10px 5px 19px; outline:none; overflow:hidden; text-overflow:ellipsis; width:300px; max-height:25px;float:left; display:inline;white-space:nowrap;}
.navList ul li span.left, .navList ul li span.right {float:left; display:inline; width:0px; height:100%;}

.navList ul li.selected { background-color: #b1d6f0; width:100%;}
.navList ul li.selected:hover { background-color:#e6f2fa; border-top: 1px solid #b1d6f0; border-bottom: 1px solid #b1d6f0; height:38px;}
.navList ul li.selected a, .navList ul li.selected a:focus, .navList ul li.selected:hover a { border:0;outline:none; color:#0072C6; width:300px; text-overflow:ellipsis;}
.navList ul li.selected span.left, .navList ul li.selected:hover span.left{ width:0px;}
.navList ul li.selected span.right, .navList ul li.selected:hover span.right{ width:0px;}

.navList ul li:hover , .navList ul li.focus { outline:none; background-color:#cde6f7; text-overflow:ellipsis;}
.navList ul li:hover span.left, .navList ul li.focus span.left{ outline:none;}
.navList ul li:hover span.right, .navList ul li.focus span.right{ outline:none;}
.navList ul li.selected, .navList ul li:hover {border: 1px solid transparent;border-right: 0;width:344px; height:38px;}

.rgtSecs { 
    float:left; 
    display: inline;
    background-color:white; 
    overflow:hidden;
    border:1px solid transparent;
}

/* detail */

#detail-container {
    border: 1px solid transparent; /* for contrast mode */
    width: 673px;
}

#detail-container .buttons {
    float: left;
}

.detail.formFields {
    padding: 30px 0;
}

.formFields.detail .col1 {
    width: 614px;
}

.detail.formFields .p1 {
    color:#6b6c6f;
}

.detail.formFields .buttons .button {
    float:left;
    padding: 30px 20px 0 0;
}

#formContainer{ 
    overflow: auto; 
    min-height:200px;
}

#formEditContainer{
    overflow:auto; 
    min-height:252px; 
    overflow-y:auto;
}

.formFields { 
    display:block; 
    overflow:hidden; 
}

.formFields .col1, .formFields .col2 {
    padding:0 30px;
    width:449px;
}

.formFields .col1 {
    float:left;
    border-right:1px solid #e4eef2;
}

.formFields .col2 {
    float:right;
}

.formFields .header {
    width:100%;
    padding:30px;
}

.formFields .fields {
    width:100%;
    clear: both;
}

.formFields .fields .fieldRow{
    padding-bottom: 20px;
    max-width:360px;
}

.formFields .fields select {
    width:375px;
}

.formFields .fields select option {
    width: 355px;
    padding-left: 12px;
}

.formFields .fields input[type="checkbox"] {
    left: 0;
    position: absolute;
    width: 40px;
    opacity: 0;
}

.formFields .fields input[type="checkbox"] + label span {
    display:inline-block;
    width:21px;
    height:21px;
    border: 1px solid #4eadfc;
    margin: 1px 10px 1px 1px;
    float:left;
}

.formFields .fields input[type="checkbox"]:checked + label span:before {
    content: url(../Resources/SkypeCheckbox.png);
    position: absolute;
    top: 6px;
    left: 4px;
}

.formFields .fields input[type="checkbox"]:focus + label span,
.formFields .fields input[type="checkbox"]:hover + label span {
    border-width: 2px;
    margin: 0px 9px 0px 0px;
}

.formFields .fields .date, .formFields .fields .time {
    width:120px;
}

.formFields .fields .time {
    margin-left: 20px;
    width: 140px;
}

.formFields .fields textarea {
    height:120px;
}

.formFields .buttons {
    float:right;
}

.formFields .buttons .button {
    float:left;
    padding:30px 30px 30px 0;
}

.formFields #charsleft { 
    color:#939598; 
    float:right; 
    font-size:0.875em;
}

/* calendar */
.ui-datepicker-trigger { 
    margin:0 20px;
    width:25px;
    cursor:pointer;
    height:21px;
}

/* detail info */
.meet-detail {
    padding: 0 30px 30px;
}

.meet-detail .colm1 {
    float:left;
    width:40%;
}

.meet-detail .colm2 {
    float:left;
    width:60%;
    word-wrap:break-word;
}

/*alert box*/
#alertBox{ width:600px; min-height:18px; padding:0px; margin:10px 0; margin-left:20px; border:1px solid #b3a455; background:#ffff85;}
.alertBoxBg{ width:14px; margin:2px; background: url(../Resources/information_icon.PNG) no-repeat; height:14px; }
.alertMessage{ float:left; font-size:12px; color:#3b3b3b; margin:0 14px 0 0; }
/*#endregion*/

/* error */
.formFields .validationError {
    color:red;
    font-size:0.875em;
}

.fieldRow input.error:focus, .fieldRow input.error:hover {
    border: 2px solid #e81123;
}

.fieldRow textarea.error:focus, .fieldRow textarea.error:hover {
    border: 2px solid #e81123;
}

/*#region LoginControl.css*/

.MainContainer
{
    background-color:#FFF;
    left:441px;
    position:absolute;
    top:0;
    right:0;
    height:100%;
    min-height:660px;
    min-width:648px;
}

.SkypeBrandText 
{
    color: #ffffff;
    font-family: Segoe UI;
    font-size: 33pt;
    line-height: 115%;
    font-weight: 400;
    overflow: visible !important;
    width:100%;
    overflow:hidden;
}

#divLoginForm 
{ 
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: White;
}

#loginFormLeftBorderCell
{
    width: 15px;
}

.backgroundGradient
{
    height:100%;
    width:100%;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    z-index:-1;
}

#W15loginFormLeftBorderCell
{    
    width: 441px;
    min-height:660px;
    background:#00AFF0;
    border-right: 1px solid #00AFF0;
    text-align:center;
    height:100%;
    bottom:100%;
    position:absolute;
    left:0;
    top:0;
}

.SkypeLoginLogo
{
    padding-top:213px;
}

.SkypeLoginLogo img
{
    height:120px;
    width:120px;
}

#loginFormRightBorderCell
{
    /*background: url("../Resources/loginFormRightBorder.gif") repeat-y scroll 0 0 transparent;*/
    width: 15px;
}

#loginFormMainContentTable 
{
    border-collapse: collapse;
    width: 503px;
    padding: 0;
}

.W15ErrorMessage
{
    padding: 10px 0;
}

#trErrorMessage { height: 60px; }

#loginFormMainContentTable .ErrorMessage
{
    padding: 0 40px;
}

#loginFormMainContentTable .W15ErrorMessage
{
    padding-left:132px;
}


.ErrorMessageLabel
{
        color: #ee0000;
}

.W15ErrorMessageLabel
{
        color: #ee0000;
}

#loginFormMainTable {    
    padding: 150px 0 0 132px;
}

.LoginFormTitle {
    color: #00AFF0;
}

.nowrap { 
    white-space:nowrap; 
    padding-top:13px;}

.logincontent 
{
    padding: 8px 30px 0 40px;
}

.W15LoginForm
{
    padding-top:13px;
    padding-right:40px;
}

.secRdo 
{
    margin: 0 12px 0 32px;
}

.expl 
{
    color: #999999;
}

.loginButton
{
    display:inline-block;
}

#loginFooterTable
{
    /*background-image: url("../Resources/loginFormBg_Bottom.png");*/
    background-repeat: no-repeat;
    border-collapse: collapse;
    height: 88px;
    margin-left: 2px;
    padding:  0;
    width: 501px;
}

.loginFooter
{
    bottom: 28px;
    height: 27px;
    left: 132px;
    right: 46px;
    min-width:476px;
    position:absolute;
}

.W15OfficeLogo
{
    float:right;
}

#loginFooterCell 
{
    padding: 0 38px 16px 24px;
    vertical-align: bottom;
}

#ErrorMessage
{
    color: Red;
}

/*#endregion*/

/* #region lightbox */

.overlay{ 
    position:fixed;
    _position:absolute; 
    left: 0; 
    top: 0; 
    width: 100%; 
    height: 100%; 
    _height:900px; 
    margin: 0; 
    visibility: hidden; 
    float:none; 
    clear:both; 
    background-color: black; 
    z-index:1001; 
    -moz-opacity: 0.8; 
    opacity:.80; 
    filter: alpha(opacity=80); 
    max-width: inherit;
    min-width: inherit;
}

.popup
{
    display: none;
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: transparent;
    top:0px;
    left:0px;
    z-index: 1002;
}

.popup_middle {
    display: table-cell;
    vertical-align: middle;
}

.popup_inner {
    color: #333333;
    margin-left: auto;
    margin-right: auto; 
    min-height: 130px;
    overflow: hidden;
    padding: 30px;
    word-wrap: break-word;
    width: 490px;
    position:relative;
}

.popup_savemeeting .popup_inner{
    width: 780px;
}

.popup_confirmdelete .popup_inner{
    width: 520px;
}

.popup_loading .popup_inner{
    width: 180px;
}

.popup_edit_del_meeting .popup_inner{
    width: 285px;
}

.popup .popup_content {
    background:#FFF;
    padding: 30px;
    border: 1px solid transparent;
}

.popup .header { 
   height:auto;
   margin-bottom: 10px;
}

.popup .cross {
    cursor: pointer;
    display: block;
    position: absolute;
    right: 5px;
    top: 5px;
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px;
    border-radius: 30px;
    border: 2px solid transparent;
    width: 50px;
    height: 50px;
    background: #000;
}
.popup .cross:hover, .popup .cross:focus {
    border-width: 4px;
    top: 3px;
    right: 3px;
}
.popup .cross:before {
    content: url(../Resources/close.png);
    position: absolute;
    top: 16px;
    left: 16px;
}

.popup .contentarea {
    display: block;
    overflow: hidden;
    padding: 0; 
}

.popup .contentarea .message {
    padding:30px 0 0;
}


.popup .borderarea { 
    width:380px; 
    border:1px solid #a2adb8; 
    margin: 8px auto 0 auto; 
    padding: 8px; 
    font-size:18px; 
    color:#333333;
}


#invitePhone {
    float: left;
    padding-right: 20px;
    text-align: left;
}
.strConferenceID {
    padding:30px 0;
}

.popup .error { 
    color: #ee0000; 
}

.popup .sec {
    margin: 16px 0 8px 0; 

}

#popupCtrl{ 
    background: none repeat scroll 0 0 #fff;
    display: block;
    padding-top:30px;
}

#popupCtrl .buttons{
    list-style:none; 
    padding:0; 
    margin:0; 
    overflow:hidden; 
    height:40px; 
}

#popupCtrl .buttons .button{
    float:left;
    margin-right:30px;
}
 
.loading{ background:url("../Resources/loader.gif") no-repeat transparent; padding-left: 28px; height: 24px; font-size: 14px; color: gray; }
.loading_anim{ position:absolute; left: 720px; top:320px;display:none; }

.popup #popup_savemeeting .contentarea .borderarea {
    margin: 30px 0 0;
    padding: 30px;
    width: auto;
}

.popup #popupCtrl .buttons #btnMeetingICal.button {
    float:right;
    margin-right:0px;
}

.popup #popup_confirmdelete #del_meetingTitle {
    padding-top:30px;
}

.popup .timezones, .popup .del_timeZone {
    color:#939598;
    padding-left:10px;
    text-overflow:ellipsis;
}

/* #endregion */
