/*!
 * EA Sign page 
 */


/*Base Mobile Layout*/
.wrap {
	width: 90%;
	margin: 0 auto;
}

#main-content, #sidebar-left, #sidebar-right {
	width: 100%;
	float: left;
}

@media only screen and (min-width: 1024px) {
	.wrap {
		width: 1024px;
		margin: 0 auto;
	}
	
	#main-content {
		width: 20%;
		float: left;
	}
	
	#sidebar-left {
		width: 75%;
		float: left;
        padding-right:100px;
	}
	
	#sidebar-right {
		width: 25%;
		float: left;
	}
}

/*Wide Layout*/
@media only screen and (min-width: 1200px) {
	.wrap {
		width: 1140px;
		margin: 0 auto;
	}
}


.landing-page-content {
    display:flexbox;
    flex-direction: column-reverse;
    float:left;
    flex-wrap:wrap;
}

.page-sign {
    height: 100%;
}

    .page-sign:before {
       /*background-image: url(../../Images/bg1.jpg);*/
       /*background-size: 200px 50px;*/
    }

    .page-sign.layout-full.page-dark {
    background-color: rgb(255, 255, 255);
}

    .page-sign.page-dark.layout-full:after {
        /*background-color: rgba(38,50,56,.6);*/

    }

    .page-sign .page-brand-info {
       margin: 160px 0 0 0px;
    }

        .page-sign .page-brand-info .brand-img {
            vertical-align: middle;
        }

        .page-sign .page-brand-info .brand-text {
            display: inline-block;
            vertical-align: middle;
            margin: 11px 0 11px 20px;
            color: blue;
        }

        .page-sign .page-brand-info p {
            opacity: .6;
            max-width: 650px;
        }

    .page-sign .page-sign-main { 
        position: absolute;
        right: 0;
        top: 0;
        height: auto;
        min-height: 100%;
        padding: 50px 60px 180px;
        color:;
        background: #99CCFF; }


        .page-sign .page-sign-main .brand {
            margin-bottom: 60px;
        }

        .page-sign .page-sign-main .brand-img {
            vertical-align: middle;
        }

        .page-sign .page-sign-main .brand-text {
            display: inline-block;
            vertical-align: middle;
            margin: 11px 0 11px 20px;
            color: #62a8ea;
        }

    .page-sign form {
        width: 350px;
        margin: 45px 0 20px;
    }

        .page-sign form > button {
            margin-top: 38px;
        }

        .page-sign form a {
            margin-left: 20px;
        }

    .page-sign footer {
        /*position: absolute;*/
        bottom: 0;
        left: 0%;
        height: 100px;
        margin: 50px 0;
        text-align: center;
        -webkit-transform: translate(-50%,0);
        -ms-transform: translate(-50%,0);
        -o-transform: translate(-50%,0);
        transform: translate(0%,0);
        
    }

    .page-sign .social .icon, .page-sign .social .icon:active, .page-sign .social .icon:hover {
        color: #fff;
    }

@media (min-width:992px) {
    .page-sign .page-content {
        padding-right: 500px;
    }
}

@media (max-width:768px) {
    .page-sign .page-sign-main {
        padding-top: 60px;
    }
}

@media (min-width:768px) and (max-width:991px) {
    .page-sign .page-sign-main {
        padding-top: 80px;
    }

    .page-sign .page-brand-info {
       margin: 160px 0 0 0px;
    }

        .page-sign .page-brand-info > p {
            opacity: 0;
            color: transparent;
        }
}

@media (max-width:767px) {
    .page-sign .page-sign-main {
        padding-top: 60px;
        width: 100%;
    }

    .page-sign form {
        width: auto;
    }
}

@media (max-width:480px) {
    .page-sign .page-sign-main {
        padding: 50px 30px 180px;
    }

    .page-sign form {
        width: auto;
    }
}
p {
    color:black;
}

.modal-box {
  display: none;
  position: absolute;
  z-index: 1000;
  width: 100px;
  background: white;
  border-bottom: 1px solid #aaa;
  border-radius: 4px;
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  border: 1px solid rgba(0, 0, 0, 0.1);
  background-clip: padding-box;
}
@media (min-width: 32em) {

.modal-box { width: 50%; }
}

.modal-box header,
.modal-box .modal-header {
  padding: 1.25em 1.5em;
  border-bottom: 1px solid #ddd;
}

.modal-box header h3,
.modal-box header h4,
.modal-box .modal-header h3,
.modal-box .modal-header h4 { margin: 0; }

.modal-box .modal-body { padding: 2em 1.5em; font-size:small }

.modal-box footer,
.modal-box .modal-footer {
  padding: 1em;
  border-top: 1px solid #ddd;
  background: rgba(0, 0, 0, 0.02);
  text-align: right;
}

.modal-overlay {
  opacity: 0;
  filter: alpha(opacity=0);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 900;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3) !important;
}

a.close {
  line-height: 1;
  font-size: 1.5em;
  position: absolute;
  top: 5%;
  right: 2%;
  text-decoration: none;
  color: #bbb;
}

a.close:hover {
  color: #222;
  -webkit-transition: color 1s ease;
  -moz-transition: color 1s ease;
  transition: color 1s ease;
}