/* CSS Document */
body{
	height:100%;
}
nav{
	justify-content: space-between;
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	padding-top: .5rem;
	padding-bottom: .5rem;
	min-height:60px;
}
nav .logo{ 
	height:30px;
	margin-left: .5rem;
}
menu{
	margin-top:0px;
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1030;
	display: flex;
	flex-wrap: wrap;
	padding-left: 0;
	margin-bottom: 0;
	list-style: none;
	box-shadow: 0 -.125rem .25rem rgba(0,0,0,.075);
	border-top: 1px solid #dee2e6;
}
menu div{
	padding-right: 1rem !important;
	padding-left: 1rem !important;
	flex-grow: 1;
	text-align: center;
	padding-top:0.5rem;
	padding-bottom:0.5rem;
	font-size: .875em;
	font-weight: bolder ;
}
main{
	overflow: auto !important;
}
main .tab-content{
	padding-top: 1rem;
	padding-bottom: 1rem;
}

#snackbar{
	position: fixed;
	top:0px;
	right:0px;
}

@media (min-width: 768px){
	menu {
	  	display: flex !important;
	  	position:inherit;
	  	right:inherit;
		bottom: inherit;
		left: inherit;
		z-index: inherit;
		box-shadow: none;
		border-top:none;
	}
}

.input_1{width:48%;display:inline-block;}
.input_2{width:48%;display:inline-block;float:right}


.rounded-4 {
  border-radius: 1rem !important;
}

.profile {
  position: relative;
  border-radius: 5vw;
  margin-top: 1vw;
  max-width: 40rem;
}
.profile .profile-img {
  height: 80vw;
  max-height: 45rem;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
.profile .dots-1 {
  position: absolute;
  width: 3vw;
  right: 1.5vw;
  top: 4vw;
}
.profile .dots-1 svg {
  fill: #fff;
}
.profile .dots-2 {
  position: absolute;
  width: 3vw;
  right: -4vw;
  top: 6.05vw;
}
.profile .dots-2 svg {
  fill: var(--bg-color-highlight1);
}
.profile .dots-3 {
  position: absolute;
  width: 3vw;
  left: 1.5vw;
  bottom: 6.05vw;
}
.profile .dots-3 svg {
  fill: #fff;
}
.profile .dots-4 {
  position: absolute;
  width: 3vw;
  left: -4vw;
  bottom: 4vw;
}
.profile .dots-4 svg {
  fill: var(--bg-color-highlight1);
}

@media (min-width: 576px) {
  .profile {
    width: 65vw;
  }
  .profile .dots-1 {
    width: 3vw;
    right: 1.5vw;
  }
  .profile .dots-2 {
    width: 3vw;
    right: -4vw;
  }
  .profile .dots-3 {
    width: 3vw;
    left: 1.5vw;
  }
  .profile .dots-4 {
    width: 3vw;
    left: -4vw;
  }
}
@media (min-width: 768px) {
  .profile {
    width: 55vw;
  }
  .profile .dots-1 {
    width: 3vw;
    right: 1.5vw;
  }
  .profile .dots-2 {
    width: 3vw;
    right: -4vw;
  }
  .profile .dots-3 {
    width: 3vw;
    left: 1.5vw;
  }
  .profile .dots-4 {
    width: 3vw;
    left: -4vw;
  }
}
@media (min-width: 992px) {
  .profile {
    width: 40vw;
  }
  .profile .dots-1 {
    width: 1.5vw;
    right: 0.75vw;
  }
  .profile .dots-2 {
    width: 1.5vw;
    right: -2vw;
  }
  .profile .dots-3 {
    width: 1.5vw;
    left: 0.75vw;
  }
  .profile .dots-4 {
    width: 1.5vw;
    left: -2vw;
  }
}
@media (min-width: 1200px) {
  .profile {
    width: 33vw;
  }
  .profile .dots-1 {
    width: 1.5vw;
    right: 0.75vw;
  }
  .profile .dots-2 {
    width: 1.5vw;
    right: -2vw;
  }
  .profile .dots-3 {
    width: 1.5vw;
    left: 0.75vw;
  }
  .profile .dots-4 {
    width: 1.5vw;
    left: -2vw;
  }
}