﻿body.answerbook {
padding-top:0;
background:#119CD4;/*#6dcff6;*/
font-family:"Fira sans", verdana, helvetica, sans-serif;
font-size:1.45rem;
}
.container {
padding-right:1em;
padding-left:1em}

header {background:#fff;}
header .container{width:100%;}
.translation-dropdown {top:0;right:1em;}
.logo-brand 
{display:block;
    padding:0.6em 1em 0.6em 0;
             width:146px;}
.nav-lang {overflow:hidden;background:#ddd;}
main .container {padding-top:0.6em;}
.hidden-sm {display:block;}
 h1.sub__header {
    text-align:right;
    font-size:3.8rem;
    margin: 1em 1.6em 1em 0;
 }
 .row-top p {color:#fff;}
 .header-site {
    font-family: "Futura ExtraBold", Arial, Helvetica, sans-serif;
    margin:1em 0 0 1.5em;
    font-size: 1.65rem;

    color: #222;}
.link-signout {display:block; 
    min-width:8rem;text-align:right;padding:0.3em;
    position: absolute;
    top: 0;
    right: 0;}
.row-error .btn-txt {border:1px solid #2376D1; border-radius:4px;font-size:1.85rem;padding:0.6em 1em;}
.row-error .btn-back {margin-top:2.6em;}
/*flex*/
.row-flex {display:flex;
           
 }
.flex-child {flex:0;}
.flex-max {flex:1;}
.flex-child.self-center {align-self: center;}
header .row-flex {align-items: center;}
    .row-flex.flex-row {
        flex-direction:row;}

/*small view*/
@media (max-width: 520px) {


}
 @media (max-width: 767px) {
    .container {
    padding-right:0.3em;
    padding-left:0.3em}
    .row-flex {flex-direction:column;}
    .hidden-sm {display:none;}
    .logo-brand {
             width:96px;}
    h1.sub__header {font-size:2.4rem;;text-align:center; margin:0.4em auto;}
    .translation-dropdown {top:0;right:0;}
    .translation-dropdown .btn-translation {right:0;}
    .header-site {margin-left:0;margin-top:0;}
}
 @media (max-width: 820px) {
 h1.sub__header {
    
    margin: 0.4em 0.5em 0.4em 0;}
 }


 @media (min-width: 768px) {
    .container {
      width: 750px; } }
  @media (min-width: 992px) {
    .container {
      width: 920px; } }
  @media (min-width: 1200px) {
    .container {
      width: 920px; } }

/*content*/
.link-home {display:inline-block;}
.row-intro{display:none;border-top:none;margin:0 2em 1em 1em;padding-top:2em;}
.row-signin {
    position:relative;
    width:360px;
    margin:auto;
    background:#fff;
    padding:0.4em 2.6em 1.6em 3.6em;
    margin-bottom:1em;}
.answerbook .arrow-down {
  position:absolute;
  top:10%;
  left:0;
  width: 0; 
  height: 0; 
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  
  border-top: 20px solid #119CD4;
}
.answerbook .arrow-right {
  position:absolute;
  top:10%;
  left:0;
   width: 0; 
  height: 0; 
  border-top: 24px solid transparent;
  border-bottom: 24px solid transparent;
  border-left:24px solid #119CD4;
}
.dt-box{background:#F1F2D4;padding:0.2em;border-radius:0.25em;}
.dt-output{color:#a3a3a3;}
.block-error {background:#fff; 
    border-radius: 0.35em;
padding: 1.5em 3em 3em;
color: #222;
max-width: 720px;          
              
              }
.block-error p {margin:2em 0;}
/*viewer*/
.header-wksheet-title
{color:#333; font-size:1.8rem; font-weight:700;border:1px solid #ccc;padding:0.1em;color:#119CD4;display: inline-block;

width: auto;}
.dt-sub {padding:0 0.3em;color:#119CD4;}
.dt-level {padding:0 0.3em;}
.viewer-outer iframe{width:100%;height:calc(100vh - 46px);}
/*--------form-------------*/
.form-label {display:block;font-weight:600;color:#666;margin-bottom:0.03em;}
.row-signin .form-control {color:#666;
    height: auto;
    padding: 0.36em 0.8em;
    font-size: 1.8rem;}
.row-signin .form-control:focus {
    border:2px solid #087DB3;
    box-shadow:none;
    
}
.row-signin .form-set{margin-bottom:1.2em;}
.row-signin .btn-submit {
display:block;padding:0.6em 2em;

}
.row-signin .btn.btn-red {
color:#D04056;
border-color:#D04056;
width:100%;
}
.row-signin .btn.btn-red:hover {
color:#fff;

}
.row-signin .form-set.form-set-noerror {margin-bottom:1.2em;}
.unhappyMessage {
    color:#DB0000;}
.txt-helper {font-size:1.15rem;color:#737373;}
.header-form { 
    font-size: 2.0rem;
    border-bottom:none;
     padding-top:1.0em;
    line-height: 1.1em;
    font-family: "Futura ExtraBold", Arial, Helvetica, sans-serif;
    color: #087DB3;}
/*small view*/
 @media (max-width: 767px)  
 {
    .arrow-right{display:none;} 
   .row-signin  {
    
    padding:0.4em 2.6em 1em 2.6em;}
 }
 
 @media (min-width: 992px)  
 {
    .btn {
    
    font-size:14px;}
 }
 
 .flag-cover {
    width: 80px;
    height: 80px;
    position: absolute;
    opacity: 100;
    right: 13px;
    top: 0px;
    background-color: #ffffff;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 65%;
}

.flag-cover-usa {
    background-image: url("/assets/images/flag-usa.png"); 
}

.flag-cover-can {
    background-image: url("/assets/images/flag-can.png");
}

.flag-cover-mex {
    background-image: url("/assets/images/flag-mex.png");
}