@import url('https://fonts.googleapis.com/css?family=Poppins|Open+Sans');
.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.oror { width: 320px; margin: 0 auto; height: 44px; margin-top: 10px; }
.oror span { width: 40%; border-bottom: 1px solid #aeaeae; float: left; margin-top: 10px;}
.oror p { margin: 0 auto -20px auto; width: 20%; float: left; }

html {
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 0%, #efefef 100%);
background: -webkit-linear-gradient(top, #ffffff 0%,#efefef 100%);
background: linear-gradient(to bottom, #ffffff 0%,#efefef 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 );
}
    
html, body { margin: 0 auto; font-family: 'Open Sans', sans-serif;} 
footer { text-align: center; color: #4477f2; font-weight: bold; width: 100%; font-size: 0.8em;}
    footer a { text-decoration: none; color: #7d7d7d; } footer a:active { color: #4477f2;}
    footer span { display: block; margin: 20px auto;}
    
    footer, .push { height: 60px; }
        
#box { margin-top: 36px !important; width: 700px; margin: 0 auto; text-align: center;
    animation: fadein 2s;
    -moz-animation: fadein 2s; /* Firefox */
    -webkit-animation: fadein 2s; /* Safari and Chrome */
    -o-animation: fadein 2s; /* Opera */   
    }
    
    .logo { 
      width: 185px;
      position: absolute;
      left: 10px;
      top: 0px;
    }
    #box h1 { font-family: 'Poppins', sans-serif; color: #ff7519; font-size:1.75em; width: 520px; display: block; margin: 22px auto 30px auto; cursor: default; }
    
   /* .gsignin { background: #4285f4; display: block; margin: 0 auto 66px auto; height: 50px; width: 235px; border: 2px solid #4285f4; text-decoration: none; cursor: pointer;}
        .gsignin img { width: 50px !important; height: 50px; padding: 0 12px; box-sizing: border-box; float: left; background: white; }
        .gsignin p { color: white; margin-top: 13px; }
    .gsignin:focus { background: #2466d3; border: 2px solid #2466d3;}*/
    
    #box h3 { color: dimgray; font-weight: 300; font-size: 1em;}
    .forma, #box section { background: white; border: 1px solid #b4b4b4; border-radius: 5px; margin: 0 auto; padding-top: 15px; box-sizing: border-box; width: 320px; }
    
        .forma > span { float: left; width: 100%; display: block; margin: 0; padding: 7px 20px; box-sizing: border-box; }
        .forma > #fNameRow > span{ float: left; width: 100%; display: block; margin: 0; padding: 7px 20px; box-sizing: border-box; }
        .iti--allow-dropdown{
            width: 100%;
        }
        .forma span label { width: 100%; display: block; text-align: left; font-size: 14px; margin-bottom: 10px; }
        .forma span input { width: 100%; padding: 7px 8px; box-sizing: border-box; font-size: 1em; border-radius: 5px; border: none; border: 1px solid #b4b4b4;}
    
        .forma span input:focus, select:focus { border-bottom: 1px solid #ff7519; outline: none; }
    
    .forma button { background: #ff7519; color: white; width: 100%; border: none; padding: 10px 0; margin-top: 25px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; font-size: 1em; font-weight: bold; cursor: pointer;}
    
    #box article { text-align: right; text-decoration: none; width: 320px; margin: 22px auto 0 auto; }
    #box article a { text-decoration: none; color: #7d7d7d; font-weight: bold; font-size: 0.75em;  }

#box section { width: 480px; height: 90px; padding: 23px 0 15px 0; margin-top: 30px; border: none;
-webkit-box-shadow: 0px 3px 20px 0px rgba(0,0,0,0.16);
-moz-box-shadow: 0px 3px 20px 0px rgba(0,0,0,0.16);
box-shadow: 0px 3px 20px 0px rgba(0,0,0,0.16);
}
#box section h2 { color: gray; font-weight: 400; margin: 8px 20px 0 20px; font-size: 1.25em; color: gray; float: left; }
#box section a { width: 166px; height: 32px; padding-top: 10px; float: left; margin: 0 auto; border-radius: 5px; border: 1px solid #ff7519; color: #ff7519; text-decoration: none; font-weight: 500;  }
#box section a:hover { color: white; background: #ff7519;  }

    
@keyframes fadein {
    from { opacity:0; }
    to { opacity:1; } }
@-moz-keyframes fadein { /* Firefox */
    from { opacity:0; }
    to {  opacity:1; } }
@-webkit-keyframes fadein { /* Safari and Chrome */
    from { opacity:0; }
    to {  opacity:1; } }
@-o-keyframes fadein { /* Opera */
    from { opacity:0; }
    to { opacity: 1;  } }

.gsignin input { width: 250px; height: 50px; background: #4285f4; cursor: pointer; color: white; box-sizing: border-box; font-size: 1em; border: none; text-align: right; padding-right: 30px; background-image:url("/png/gsignin.png"); }

.gsignup input { width: 500px; height: 50px; background: #4285f4; cursor: pointer; color: white; box-sizing: border-box; font-size: 1em; border: none; text-align: right; padding-right: 66px; background-image:url("/png/gsignin.png"); background-repeat: no-repeat; font-weight: 600; }

.parentapp { padding: 0px 20px; border: 1px solid #c1c1c1; box-sizing: border-box; width: 100%; border-radius: 10px; margin-top: 100px;}
.parentapp a { float: left; height: 70px; margin: 20px 20px 0 0; }
.parentapp p { text-align: left;  line-height: 150%;}



/*CREATEACC + REQUEST GOOGLE ACCESS*/
.createacc form, .reqaccess form { width: 640px; }
    
.createacc form span:nth-of-type(2), .createacc form span:nth-of-type(3), .createacc form span:nth-of-type(4), .createacc form span:nth-of-type(5) { width: 50%; }

.createacc #box article, .reqaccess #box article { width: 640px; text-align: left; margin: 22px auto 0 auto; }

.reqaccess form span:nth-of-type(1), .reqaccess form span:nth-of-type(2) { width: 50%; }


/*modal message*/

#modal-message-content { color: red;}

@media screen and (max-width: 900px) {
    
    .logo { width: 144px; margin: 0 auto; left: 0; top:0; position: relative; }
    
    #box { width: 90%;}
    #box h1 { width: auto;} .forma { width: 100% !important;} #box article { width: 100%;}
    .forma span { width: 100% !important; }  
    
    #box section { width: 90%; height: auto; margin-top: 44px; text-align: center; }
#box section h2 { margin: 0 auto; float: none; }
#box section a { width: 90%; height: 32px; padding-top: 10px; display: block; margin: 22px auto 22px auto; float: none; border: 2px solid #ff7519; font-weight: 600;  }
#box section a:hover { color: white; background: #ff7519;  }
    
.gsignup { width: 100% !important;}
.gsignup input { width: 100% !important; font-size: 0.8em; box-sizing: border-box; height: 50px; text-align: center; background-image:url("/png/gsignin.png"); padding-left: 55px; background-repeat: no-repeat; font-weight: 600; }
    
}

@media screen and (max-width: 1440px) {
  .parentapp {
    margin: 15px auto;
  }

  footer {
    height: fit-content;
  }

  footer span {
    margin: 0 auto;
  }
}
