/* -- Homepage ---*/
body {
    color: white;
    background: linear-gradient(#0063A4 60%, #2076AE);
    font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif; 
    margin-bottom: 0px;
}

section {
    width: 60%;
}

.home {
    margin: 75px auto 85px;
}

h1 {
    font-weight: 900;
}
h6, label {
    font-size: 18px;
    line-height: 1.6;

}

#lifetime{
   color: #707070; 
}

.lifetime-explanation{
    margin: 30px 0 20px ;
}

.cselect { 
    position: relative;
}
.cselect::after { 
    content: "\0025BE";
    font-size: 1.8rem;
    position: absolute; 
    top: -4px;
    right: 10px;
    color: #707070;
}

button, .link-button {
    background-color: #0063A4;
    color: white;
    border: #fff 2px solid;
    border-radius: 5px;
    font-size: 20px;
}

.create-secret-btn{
    padding: 3px 100px 5px;
}

button:hover, .link-button:hover {
    color: #0063A4;
    text-decoration: none;
    background-color: #fff;
    opacity: .9;
}

.fade-link:link:not(.btn),
.fade-link:visited:not(.btn) {
  color: inherit;
  text-decoration: none;
  background-color: transparent;
  border-radius: 0;
  padding: 0;
  
  -webkit-transition: all 200ms ease-out 0s;
  transition: all 0.20s ease-out 0s;
}

.fade-link:hover:not(.btn),
.fade-link:active:not(.btn) {
  color: inherit;
  text-decoration: none;
  opacity: 0.7;
  background-color: transparent;
}


/* -- Monds touched it! ---*/
.product-secretshare .text-danger {
    color: orange !important
}

.product-secretshare .modal-dialog {
    color: #495057
}

.product-secretshare button#btnModalDelete svg {
    margin-bottom: 4px
}

/* -- Link Created Page ---*/
.sub {
    /*height: 100vh;*/
}

.sub section {
    margin: 75px auto 200px;
}

.copy-btn  {
    padding: 3px 60px 5px;
}
.btns-section{
    margin-top: 100px;
}
.regular-btn {
    padding: 3px 20px 5px; 
}

.viewSecret {
    margin-top:35px;
}



/* -- Mobile style ---*/
@media (max-width:1200px) {
    section {
        width: 70%; 
    }
    .home {
        margin: 50px auto 80px;
    }
    .sub section {
        margin-top: 50px;
    } 
}
@media (max-width:992px) {
    section {
        width: 80%;
    }
    h6, label {
        font-size: 16px;    
    }
    .viewSecret {
        margin-top:32px;
    }
}
@media (max-width:767px) {
    section {
        width: 100%;
    }
    .lifetime-explanation{
        margin: 16px 0;
    }
    .viewSecret {
        margin-top:20px;
    }
}
@media (max-width:567px) {
    .home {
        margin: 30px auto 50px;
    }
    .sub section {
        margin-top: 30px;
    } 
    h6, label {
        line-height: normal;  
    }
    .btn-section{
        margin-top: 70px;
    }
    footer {
        font-size:14px;
    }
}
@media (max-width:376px) {
    small {
        font-size: 13px;
    }
    button {    
        font-size: 18px;
    }
    .regular-btn {
        padding: 3px 15px 5px;
    }
   
}
@media (max-width:320px) {
    h6, label {
        font-size: 14px;    
    }
    small {
        font-size:11px;
    }
    footer {
        font-size:11px;
    }
    button {    
        font-size: 16px;
    }
    .create-secret-btn {    
        padding: 3px 80px 5px;
    }
    .regular-btn {
        padding: 3px 8px 5px;
    }
    .logo {
        width: 100%;
    }
}