body {background: #c1dade!important;}
.arrow  {height: 27px;    transform: rotate(5deg);}
.nav-item {	text-transform: uppercase;}


img {
	box-shadow: 0 0 5px #7f8688;
    border-radius: 5px;
}


hr.style-eight {
    overflow: visible; /* For IE */
    padding: 0;
    border: none;
    border-top: medium double #333;
    color: #333;
    text-align: center;
}
hr.style-eight:after {
    content: "§";
    display: inline-block;
    position: relative;
    top: -0.7em;
    font-size: 1.5em;
    padding: 0 0.25em;
    background: #727272;
}

img.logo {
	box-shadow: 0 0 0px #7f8688;
    border-radius: 0px;
}

img.transparent {
    box-shadow: 0 0 0px #7f8688;
    border-radius: 0px;
}

.card-header 
{
    border-bottom:  0px !important;
}



#back2Top {
    width: 42px;
    line-height: 42px;
    overflow: hidden;
    z-index: 999;
    display: none;
    cursor: pointer;
    -moz-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
    position: fixed;
    bottom: 50px;
    right: 0;
        background-color: goldenrod;
    color: #fff;
    text-align: center;
    font-size: 26px;
    text-decoration: none;
        margin-right: 23px;
    border-radius: 20px;
}
#back2Top:hover {
    background-color: goldenrod;
    color: #fff;
}
.lead {
    font-size: 1.25rem;
    font-weight: 350 !important;
}


h1 {
  text-shadow: 2px 2px #000000 !important;
}

.header-homepage {
    text-shadow: 2px 2px #000000 !important;
}

li {
    font-size: 17px !important;
}




.form-container div, .form-container  span{
    font-family: Calibri, Candara, Segoe, 'Segoe UI', Optima, Arial, sans-serif;
}

.form-container ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #999;
}

.form-container :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #999;
   opacity:  1;
}

.form-container ::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #999;
   opacity:  1;
}

.form-container :-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #999;
}

.form-container :placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */
  color:  #999;
}

.oauth-buttons {
    text-align:center;
}
.row {
    text-align:center;
}
#login-form{
 min-width:375px;   
}
.login-container{
    width:400px;
    height:330px;
    display:inline-block;
    margin-top: -165px;
    top: 50%;
    left: 50%;
    position: absolute;
    margin-left: -200px;
}
.form-container .create-account:hover{
    opacity:.7;
}
.form-container .create-account{
    color:inherit;
    margin-top: 15px;
    display: inline-block;
    cursor:pointer;
    text-decoration:none;
}

.oauth-buttons .fa{
    cursor:pointer;
    margin-top:10px;
    color:inherit;
    width:30px;
    height:30px;
    text-align:center;
    line-height:30px;
    margin:5px;
    margin-top:15px;
}
.oauth-buttons .fa:hover{
    color:white;
}
.oauth-buttons .fa-google-plus:hover{
    background: #dd4b39;
}
 .oauth-buttons .fa-facebook:hover{
    background: #8b9dc3;
}

.oauth-buttons .fa-linkedin:hover{
    background: #0077b5;
}

.oauth-buttons .fa-twitter:hover{
    background: #55acee;
}

.form-container .req-input .input-status {
    display: inline-block;
    height: 40px;
    width: 40px;
    float: left;    
}
.form-container .input-status::before{
    content: " ";
    height:20px;
    width:20px;
    position:absolute;
    top:10px;
    left:10px;
    color:white;
    border-radius:50%;
    background:white;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    
}

.form-container .input-status::after{
    content: " ";
    height:10px;
    width:10px;
    position:absolute;
    top:15px;
    left:15px;
    color:white;
    border-radius:50%;
    background:#00BCD4;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.form-container .req-input{
    width:100%;
    float:left;
    position:relative;
    background:#00BCD4;
    height:40px;
    display:inline-block;
    border-radius:0px;
    margin:5px 0px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.form-container div .row .invalid:hover{
    background:#EF9A9A;
}

.form-container div .row .invalid{
    background:#E57373;
}

.form-container .invalid .input-status:before {
    width:20px;
    height:4px;
    top:19px;
    left:10px;
    background:white;/*#F44336;*/
    border-radius:0px;
     -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
    transform: rotate(45deg);
}

.form-container .invalid .input-status:after {
    width:20px;
    height:4px;
    background:white;
    border-radius:0px;
    top:19px;
    left:10px;
     -ms-transform: rotate(-45deg); /* IE 9 */
    -webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */
    transform: rotate(-45deg);
}

.form-container div .row  .valid:hover{
    background:#A5D6A7;
}

.form-container div .row .valid {
    background:#81C784;
    
}

.form-container .valid .input-status:after {
    border-radius:0px;
    width: 17px;
    height: 4px;
    background: white;
    top: 16px;
    left: 15px;
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.form-container .valid .input-status:before {
    border-radius:0px;
    width: 11px;
    height: 4px;
    background:white;
    top: 19px;
    left: 10px;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.form-container .input-container{
    padding:0px 20px;
}

 .form-container .row-input{
    padding:0px 5px;
}

.form-container .req-input.input-password{
    margin-bottom:0px;
}
.form-container .req-input.confirm-password{
    margin-top:0px;
}

.form-container {
    margin:20px;
    padding:20px;
    border-radius:0px;
    background:#B3E5FC;
    color:#00838F;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.form-container .form-title{
    font-size:25px;
    color:inherit;
    text-align:center;
    margin-bottom:10px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.form-container .submit-row{
    padding:0px 0px;
}

.form-container .btn.submit-form{
    margin-top:15px;
    padding:12px;
    background:#00BCD4;
    color:white;
    border-radius:0px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.form-container .btn.submit-form:focus{
    outline:0px;
    color:white;
}

.form-container .btn.submit-form:hover{
    background:#00cde5;
    color:white;
}

.form-container .tooltip.top .tooltip-arrow {
    border-top-color:#00BCD4 !important;
}

.form-container .tooltip.top.tooltip-invalid .tooltip-arrow {
    border-top-color:#E57373 !important;
}

.form-container .tooltip.top.tooltip-invalid .tooltip-inner::before{
    background:#E57373;
}
.form-container .tooltip.top.tooltip-invalid .tooltip-inner{
    background:#FFEBEE !important;
    color:#E57373;
}

.form-container .tooltip.top.tooltip-valid .tooltip-arrow {
    border-top-color:#81C784 !important;
}

.form-container .tooltip.top.tooltip-valid .tooltip-inner::before{
    background:#81C784;
}
.form-container .tooltip.top.tooltip-valid .tooltip-inner{
    background:#E8F5E9 !important;
    color:#81C784;
}

.form-container .tooltip.top .tooltip-inner::before{
    content:" ";
    width:100%;
    height:6px;
    background:#00BCD4;
    position:absolute;
    bottom:5px;
    right:0px;
}
.form-container .tooltip.top .tooltip-inner{
    border:0px solid #00BCD4;
    background:#E0F7FA !important;
    color:#00ACC1;
    font-weight:bold;
    font-size:13px;
    border-radius:0px;
    padding:10px 15px;
}
.form-container .tooltip {
    max-width:150px;
    opacity:1 !important;
}

.form-container .message-box{
    width:100%;
    height:auto;
}

.form-container textarea:focus,.form-container textarea:hover{
    background:#fff;
    outline:none;
    border:0px;
}

.form-container .req-input textarea {
    max-width:calc(100% - 50px);
    width: 100%;
    height: 80px;
    border: 0px;
    color: #777;
    padding: 10px 9px 0px 9px;
    float:left;
    
}
.form-container input[type=text]:focus, .form-container input[type=password]:focus, .form-container input[type=email]:focus, .form-container input[type=tel]:focus, .form-container select{
    background:#fff;
    color:#777;
    border-left:0px;
    outline:none;
}

.form-container input[type=text]:hover,.form-container input[type=password]:hover,.form-container input[type=email]:hover,.form-container input[type=tel]:hover, .form-container select{
    background:#fff;
}

.form-container input[type=text], .form-container input[type=password], .form-container input[type=email],input[type=tel], form-container select{
    width:calc(100% - 50px);
    float:left;
    border-radius:0px;
    border:0px solid #ddd;
    padding:0px 9px;
    height:40px;
    line-height:40px;
    color:#777;
    background:#fff;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}







#notfound {
  position: relative;
  height: 100vh;
}

#notfound .notfound {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.notfound {
  max-width: 410px;
  width: 100%;
  text-align: center;
}

.notfound .notfound-404 {
  height: 280px;
  position: relative;
  z-index: -1;
}

.notfound .notfound-404 h1 {
  font-family: 'Montserrat', sans-serif;
  font-size: 230px;
  margin: 0px;
  font-weight: 900;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
  
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-size: cover;
  background-position: center;
}


.notfound h2 {
  font-family: 'Montserrat', sans-serif;
  color: #000;
  font-size: 24px;
  font-weight: 700;
  text-transform: uppercase;
  margin-top: 0;
}

.notfound p {
  font-family: 'Montserrat', sans-serif;
  color: #000;
  font-size: 14px;
  font-weight: 400;
  margin-bottom: 20px;
  margin-top: 0px;
}

.notfound a {
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  text-decoration: none;
  text-transform: uppercase;
  background:goldenrod;
  display: inline-block;
  padding: 15px 30px;
  border-radius: 40px;
  color: #fff;
  font-weight: 700;
  -webkit-box-shadow: 0px 4px 15px -5px #0046d5;
          box-shadow: 0px 4px 15px -5px #0046d5;
}


@media only screen and (max-width: 767px) {
    .notfound .notfound-404 {
      height: 142px;
    }
    .notfound .notfound-404 h1 {
      font-size: 112px;
    }
}

@media only screen and (max-width: 1200px) {
    .navbar-dark .navbar-nav .nav-link{
         font-size: 15px;
     }

}
@media only screen and (max-width: 992px) {
    .navbar-dark .navbar-nav .nav-link{
         font-size: 11px;
         padding-left: 0px;
     }

}




.foot a{
 color: goldenrod;
 text-decoration: none;
}

.card-header .collapsee a {
    color: black !important;

 text-decoration: none !important;
}


.collapse-card a:hover {
    color: black !important;
    }
    
    
    
.banner img{
    padding: 3px;
}
.banner{
    text-align: center;
    padding: 10px 0;
}
@media only screen and (min-width: 1400px){
    footer{
        position: relative;
    }
    .banner{
        position: absolute;
        right: 50%;
        top:40px;
        transform: translateX(680px)
    }
}