/* Copyright (c) 2016 ZipSocket, Inc.  */
/* All rights reserved.      */

/*
 * Help text in the iframe
 *
 */

html, body {
   margin: 0px;
   padding: 0px;
   width: 100%;
   height: 100%;
}

body {
   font-family: 'Open Sans', Helvetica, Arial, sans-serif;
   font-size: 100%;
   overflow: hidden;
}


h1 {
   color: #359EC5;
   font-size: 1.6em;
   margin: 3px 0px;

}

p {
   margin: 8px 0px;
}


ul, ol {
   margin: 5px 0px;
}

a {
   color: #1A8CB6;
   text-decoration: none;
}

.darkBackground {
   color: #DDD !important;
   background-color: #1C4250 !important;
}


.sidenote {
   font-size: 0.9em;
   margin-top: 10px;
}

.helpContainer {
   width: 100%;
   height: 100%;
   padding: 10px 30px;
   box-sizing: border-box;

   /* inherit */
   font-weight: 300;
   font-size: 0.9em;

   /* flexbox */
   display: flex;
   flex-flow: column nowrap;
   align-items: center;
   justify-content: flex-end;

   /* hack to fix the fouc, opacity is set to 0 in html and reset in css */
   opacity: 1 !important;
   transition: opacity 0.2s;
   transition-delay: 0.2s;


   /* animation hack to fix the fouc, opacity is set to 0 in html and reset in css */
   /*-webkit-animation: fadein 0.2s linear 0.2s forwards;*/
   /*animation: fadein 0.2s linear 0.2s forwards;*/
}

.topSpacer {
   flex: 1 1 1px;
}

.helpText {
   flex: 0 0 auto;
}

.helpText h1 {
   text-align: center;
}

.bottomSpacer {
   flex: 0 0 20px;
}

.helpFooter {
   text-align: center;
   flex: 0 0 auto;
   align-self: center;

   display: none; /* disable for now */
}


.lastMeeting {
   display: none;
}

.postMeetingText {

}

.footerLink {
   font-size: 0.8em;
   text-align: center;
   outline: none;
   cursor: pointer;
   user-select: none;
   -moz-user-select: none;

   flex: 1 1 auto;
}

.footerLink:hover {
   color: #3AACD6;
}

.indent {
   margin-left: 20px;
}

@keyframes fadein {
   from { opacity: 0; }
   to   { opacity: 1; }
}

@-webkit-keyframes fadein {
   from { opacity: 0; }
   to   { opacity: 1; }
}


@media (min-width : 800px) {
   .helpContainer {
      align-items: flex-end;
      justify-content: space-around;
      font-size: 1.2em;
   }

   .helpText {
      width: calc(100% - 450px);
   }

   .helpText h1 {
      text-align: left;
   }


   .bottomSpacer {
      flex: 2 1 1px;
   }

   #postMeetingSummaryBox {
      align-self: flex-end;
   }

}

@keyframes fadein {
   from { opacity: 0; }
   to   { opacity: 1; }
}
@-webkit-keyframes fadein {
   from { opacity: 0; }
   to   { opacity: 1; }
}