﻿@import url('https://fonts.googleapis.com/css2?family=Dosis:wght@200..800&display=swap');


.dosis-title {
  font-family: "Dosis", serif;
  font-size:50px;
  color:#302B3A;
  font-weight:700;
}


.dosis-title span{
  font-family: "Dosis", serif;
  font-size:55px;
  color:#960974;
  font-weight:800;
}


.dosis-text {
  font-family: "Dosis", serif;
  font-size:15px;
  color:#302B3A;
  font-weight:500;
}


.login-in
{
	font-size:14px;
	border:1px #CCCCCC solid;
	border-radius:20px;
	padding:35px 10px 25px 10px;
    margin-top:40px;
    position:relative;
}
.login-name
{
	font-size:14px;
    position:absolute;
    border:1px #CCCCCC solid;
    padding:5px 15px;
    top: -15px;
    left: 20px;
    border-radius: 50px;
    background-color: #ffffff;
    text-transform:capitalize;
}


.login-in a
{
	/*color:#6d6e71;*/
}

.signin-margin
{    text-align: justify;
	margin-top:10px;
}


.underline a
{
    border-bottom: 1px #980875 solid;
}
.underline2 
{
	text-align:center;
	margin:10px 0;
	color:#980875;
}

.login-in .form-group {
    margin-bottom: 15px;
}


.login-in .form-control {
    display: block;
    width: 100%;
    height: 50px;
    padding: 6px 10px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #6d6e71;
    margin-bottom:5px;
    background-color: #fbfbfb;
    background-image: none;
    border: 1px solid #dedede;
    border-radius: 5px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.login-in .form-control::-webkit-input-placeholder { /* Edge */
    color: #6d6e71;
}

.login-in .form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #6d6e71;
}

.login-in .form-control::placeholder {
    color: #6d6e71;
}




.bg1
{
	background-image: url(../images/bg1.png), url(../images/bg2.png);
    background-position:left 20px, right bottom;
    background-repeat: no-repeat;
    overflow:hidden;
    background-size:23%,10%;
}


.bg2
{
	background-image: url(../images/bg1.png), url(../images/bg2.png);
    background-position:left 20px, right bottom;
    background-repeat: no-repeat;
    overflow:hidden;
    background-size:28%,15%;
}


/*
 CSS for the main interaction
*/
.tabset > input[type="radio"] {
  position: absolute;
  left: -200vw;
}

.tabset .tab-panel {
  display: none;
}

.tabset > input:first-child:checked ~ .tab-panels > .tab-panel:first-child,
.tabset > input:nth-child(3):checked ~ .tab-panels > .tab-panel:nth-child(2),
.tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3),
.tabset > input:nth-child(7):checked ~ .tab-panels > .tab-panel:nth-child(4),
.tabset > input:nth-child(9):checked ~ .tab-panels > .tab-panel:nth-child(5),
.tabset > input:nth-child(11):checked ~ .tab-panels > .tab-panel:nth-child(6) {
  display: block;
}


.tabset > label {
  position: relative;
  display: inline-block;
  padding: 10px 35px;
  border-bottom: 0;
  width:225px;
  cursor: pointer;
  font-weight: 600;
  border-radius:8px;
  color: #980875;
  text-transform:capitalize;
  font-size:18px;  
  margin: 0 -15px;
  font-weight:600;
  background-color: #fff;
  box-shadow:1px 1px 14px 0px #00000052;
  border:1px #CCCCCC solid;
}

.tabset > label:hover,
.tabset > input:focus + label,
.tabset > input:checked + label {
    color: #ffffff;
    background-color: #980875;
  border:1px #980875 solid;
}


.tabset > input:checked + label {

}

.tab-panel {
  padding: 30px 0;
}

/*
 Demo purposes only
*/


.tabset {
  max-width: 100%;
  margin-top: 30px;
  text-align:center;
}    


















