﻿body {
   background-color:#3377B8;
   margin:0;
 
}

#divCloudsTop{
    position:relative;
     background-image:url('cloudsTop.png');
     width:100%;
     height:325px;
     background-repeat:repeat;
     z-index:2;
}

#divCloudsBottom{
     position:relative;
     background-image:url('cloudsBottom.png');
     width:100%;
     height:310px;
     background-repeat:repeat;
     position:absolute;
     bottom:0;
     z-index:1;
      font-family: 'Raleway', sans-serif;
}
#divContentContainer{
    top:0;
    position:absolute;
    margin:auto;
    z-index:3;
    text-align:center;
    width:100%;
     font-family: 'Raleway', sans-serif;
     color:black;

}

#divContentContainerInner{
    position:relative;
    margin-top:2%;
    background-image:url('alpha.png');
    background-repeat:repeat;  
    z-index:3;
}

#imgLogoP{
    display:none;
    margin:auto;
}

#divContentContainerInner2{
    position:relative;
    z-index:4;

}

@media screen and (max-height: 500px) {    
    #divCloudsBottom{
        display:none;
    }
}

@media screen and (max-width: 700px) {    
    #imgLogoFull{
        display:none;
    }
    #imgLogoP{
        display:block;
    }
}

#divUl
{
    min-width:110px;
    max-width:400px;
    margin:auto;
    text-align:left
}

#divText {
    font-size:15pt;
}

#divForms{
    position:relative;
   text-align:center;
    z-index:10;
    min-height:200px;

}

#divSplashLogin{
     margin:auto;
}
#divRegister{
     margin:auto;
    position:relative;
    display:none;
}


select
{
    border: 1px solid #ccc;
    padding: 2px;
    font-size: 1.2em;
    color: #444;
}

#imgBG{
    width:100%;
    height:100%;
}
.buttonStyle
{
    padding:5px 15px 5px 15px;
    border-radius: 4px;    
    color:White;
    border:none;
    cursor:pointer;
}

.lighterBlue { background-color:#02BDF4; }

.lightBlue { background-color:#236EB1; }

.lightGrey { background-color:#B6B6B6 }

.darkGrey { background-color:#636363 }



:-moz-placeholder {
  color: #c9c9c9 !important;
  font-size: 13px;
}

::-webkit-input-placeholder {
  color: #ccc;
  font-size: 13px;
}


.error {
    color: Red;
}

input[type="text"], input[type="password"]
{
    border: 1px solid #1B4D59;
    padding: 2px;
    font-size: 1.2em;
    color: #444;
    width: 200px;
    padding: 7px;
    -webkit-box-shadow: inset 2px 2px 2px 0px #dddddd;
    -moz-box-shadow: inset 2px 2px 2px 0px #dddddd;
    box-shadow: inset 2px 2px 2px 0px #dddddd;
    border-radius: 4px;
    outline:none;
    margin-top:5px;
}

.passwordChecklist
{
    
    width: 320px;
    height:120px;
    -webkit-box-shadow: 2px 2px 2px 0px #dddddd;
    -moz-box-shadow: 2px 2px 2px 0px #dddddd;
    box-shadow: 2px 2px 2px 0px #dddddd;
    border-radius: 4px;
    border:1px solid #F3F3F3;
    color: Black;
    display: none;
    padding: 5px;
    background-color:#fff;
    margin:auto;
    position:relative;
    top:-246px;
    z-index:8;
}

.passworkChecklistItem
{
    clear: left;
    float: left;
    font-size: small;
    margin-top: 3px;
}

.passworkChecklistItem img
{
    float: left;
    width: 20px;
    height: 20px;
    margin-right: 5px;
}

.editor-label{
    margin-top:10px;
}


/* Module Window
----------------------------------------------------------*/
.divModuleWindowOverlay
{
    position: fixed;
    width: 100%;
    height: 100%;
    margin: 0px;
    background-image: url('blackBg.png');
    top: 0px;
    left: 0px;
    text-align: center;
    display: none;
    z-index:2000;
}

.divModuleWindowContainer
{
    background-color: White;
    border: 1px solid black;
    border-radius: 10px;
    background-color: #FFFFFF;
    box-shadow: 1px 1px 5px rgba(0,0,0,.2);
    -webkit-box-shadow: 1px 1px 5px rgba(0,0,0,.2);
    -moz-box-shadow:  1px 1px 5px rgba(0,0,0,.2);
    position: fixed;
    top: 15%;
    left: 40%;
    text-align: left;
    width: auto;
}

.divModuleWindowClose
{
    position: absolute;
    top: 3px;
    right: 3px;
    width: 50px;
    height: 50px;
}
.divModuleWindowClose img
{
    width: 50px;
    height: 50px;
}

.divModuleWindowInner
{
    clear: left;
    float: left;
    background-color: #FFFFFF;
    margin: 10px;
    max-width:310px;
    min-width:275px;
     max-height:500px;
     overflow:auto;
}

#divSocialMedia{
    width:95%; 
    position:relative;
    z-index:15;
    text-align:right
}
#divSocialMedia a{ cursor:pointer; }

#imgMovingClouds{
  position:fixed;
}

#imgMovingClouds2{
  position:fixed;
  left:-700px;
  top:500px;
}

#imgMovingClouds3{
  position:fixed;
  left:200px;
  top:250px;
}