@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap');

.circular-menu {
position: fixed;
bottom: 1em;
right: 1em;
}

.circular-menu .floating-btn {
display: block;
width: 3.5em;
height: 3.5em;
border-radius: 50%;
background-color: hsl(4, 98%, 60%);
box-shadow: 0 2px 5px 0 hsla(0, 0%, 0%, .26);  
color: hsl(0, 0%, 100%);
text-align: center;
line-height: 3.9;
cursor: pointer;
outline: 0;
}

.circular-menu.active .floating-btn {
box-shadow: inset 0 0 3px hsla(0, 0%, 0%, .3);
}

.circular-menu .floating-btn:active {
box-shadow: 0 4px 8px 0 hsla(0, 0%, 0%, .4);
}

.circular-menu .floating-btn i {
font-size: 1.3em;
transition: transform .2s;  
}

.circular-menu.active .floating-btn i {
transform: rotate(-45deg);
}

.circular-menu:after {
display: block;
content: ' ';
width: 3.5em;
height: 3.5em;
border-radius: 50%;
position: absolute;
top: 0;
right: 0;
z-index: -2;
background-color: hsl(4, 98%, 60%);
transition: all .3s ease;
}

.circular-menu.active:after {
transform: scale3d(5.5, 5.5, 1);
transition-timing-function: cubic-bezier(.68, 1.55, .265, 1);
}

.circular-menu .items-wrapper {
padding: 0;
margin: 0;
}

.circular-menu .menu-item {
position: absolute;
top: .2em;
right: .2em;
z-index: -1;
display: block;
text-decoration: none;
color: hsl(0, 0%, 100%);
font-size: 1em;
width: 3em;
height: 3em;
border-radius: 50%;
text-align: center;
line-height: 3;
background-color: hsla(0,0%,0%,.1);
/*transition: transform .3s ease, background .2s ease;*/
}

.circular-menu .menu-item:hover {
background-color: hsla(0,0%,0%,.3);
}

.circular-menu.active .menu-item {
transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.circular-menu.active .menu-item:nth-child(1) {
transform: translate3d(1em,-7em,0);
}

.circular-menu.active .menu-item:nth-child(2) {
transform: translate3d(-3.5em,-6.3em,0);
}

.circular-menu.active .menu-item:nth-child(3) {
transform: translate3d(-6.5em,-3.2em,0);
}

.circular-menu.active .menu-item:nth-child(4) {
transform: translate3d(-7em,1em,0);
}

/**
* The other theme for this menu
*/

.circular-menu.circular-menu-left {
right: auto; 
left: 1em;
}

.circular-menu.circular-menu-left .floating-btn {
background-color: hsl(217, 89%, 61%);
}

.circular-menu.circular-menu-left:after {
background-color: hsl(217, 89%, 61%);
}

.circular-menu.circular-menu-left.active .floating-btn i {
transform: rotate(90deg);
}

.circular-menu.circular-menu-left.active .menu-item:nth-child(1) {
transform: translate3d(-1em,-7em,0);
}

.circular-menu.circular-menu-left.active .menu-item:nth-child(2) {
transform: translate3d(3.5em,-6.3em,0);
}

.circular-menu.circular-menu-left.active .menu-item:nth-child(3) {
transform: translate3d(6.5em,-3.2em,0);
}

.circular-menu.circular-menu-left.active .menu-item:nth-child(4) {
transform: translate3d(7em,1em,0);
}

.forma{
  	border-radius: 5px;
	font-family: 'Nunito', sans-serif;
	background-color: white;
	display: none;
	position: sticky;
	left: 25%;
	max-width: 25%;
	margin: 0 auto;
	margin-top: 2.5%;
	margin-bottom: 2.5%;
	padding : 1%;
	padding-right : 2%;
	padding-left: 2%;
	text-align: center;
	margin-top: 1%;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.reklama{
  border-radius: 5px;
  font-family: 'Nunito', sans-serif;
  background-color: white;
  position: sticky;
  left: 25%;
  max-width: 50%;
  margin: 0 auto;
  padding : 1%;
  text-align: center;
  margin-top: 1%;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.nuotraukos{
  	border-radius: 5px;
  	max-width: 50%;
  	max-height: 85%;
	font-family: 'Nunito', sans-serif;
  	position: absolute;
  	margin: 0 auto;
  	padding : 1%;
  	text-align: center;
  	margin-top: 1%;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.capital_info{
  	border-radius: 5px;
	font-family: 'Nunito', sans-serif;
	background-color: white;
	position: sticky;
	left: 25%;
	max-width: 50%;
	margin: 0 auto;
	padding : 1%;
	text-align: center;
	margin-top: 1%;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.country_info{
  	border-radius: 5px;
	font-family: 'Nunito', sans-serif;
	background-color: white;
	position: sticky;
	left: 25%;
	max-width: 50%;
	margin: 0 auto;
	margin-bottom : 1%;
	padding : 1%;
	padding-right : 5%;
	padding-left: 5%;
	text-align: center;
	margin-top: 1%;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.miestai{
	border-radius: 5px;
	font-family: 'Nunito', sans-serif;
	background-color: white;
	position: sticky;
	left: 25%;
	max-width: 50%;
	margin: 0 auto;
	margin-bottom : 1%;
	padding : 1%;
	padding-right : 5%;
	padding-left: 5%;
	text-align: center;
	margin-top: 1%;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.faktai{
	border-radius: 5px;
	font-family: 'Nunito', sans-serif;
	background-color: white;
	position: sticky;
	left: 25%;
	max-width: 50%;
	margin: 0 auto;
	margin-bottom : 1%;
	padding : 1%;
	padding-right : 5%;
	padding-left: 5%;
	text-align: center;
	margin-top: 1%;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.komentarai{
	max-width: 60%;
	margin: 0 auto;
	padding : 1%;
	margin-top : 1%;
	background-color: white;
	border-radius: 2.5px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.pateikti{
	max-width: 60%;
	margin: 0 auto;
	padding : 1%;
	margin-top : 1%;
	background-color: white;
	border-radius: 2.5px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.button1 {
background-color: white;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
transition-duration: 0.4s;
cursor: pointer;
color: #dc3545; 
border: 2px solid #dc3545;
border-radius: 5px;
}

.button1:hover {
background-color: #dc3545;
color: white;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.button2 {
background-color: white;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
transition-duration: 0.4s;
cursor: pointer;
color: #fd7e14; 
border: 2px solid #fd7e14;
border-radius: 5px;
}

.button2:hover {
background-color: #fd7e14;
color: white;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.button3 {
background-color: white;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
transition-duration: 0.4s;
cursor: pointer;
color: #ffc107; 
border: 2px solid #ffc107;
border-radius: 5px;
}

.button3:hover {
background-color: #ffc107;
color: white;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.button4 {
background-color: white;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
transition-duration: 0.4s;
cursor: pointer;
color: #479f76; 
border: 2px solid #479f76;
border-radius: 5px;
}

.button4:hover {
background-color: #479f76;
color: white;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.button5 {
background-color: white;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
transition-duration: 0.4s;
cursor: pointer;
color: #198754; 
border: 2px solid #198754;
border-radius: 5px;
}

.button5:hover {
background-color: #198754;
color: white;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


.ad{
	text-align: center;
	display: none;
	max-width: 60%;
	margin: 0 auto;
	padding : 1%;
	/*background-color: white;*/
	border-style: solid;
	border-width: 1px;
	border-color: white;
  	border-radius: 2.5px;
}
#full-stars-example-two .rating-group {
	display: inline-flex;
}
#full-stars-example-two .rating__icon {
	pointer-events: none;
}
#full-stars-example-two .rating__input {
	position: absolute !important;
	left: -9999px !important;
}
#full-stars-example-two .rating__input--none {
	display: none;
}
#full-stars-example-two .rating__label {
	cursor: pointer;
	padding: 0 0.1em;
	font-size: 2rem;
}
#full-stars-example-two .rating__icon--star {
	color: orange;
}
#full-stars-example-two .rating__input:checked ~ .rating__label .rating__icon--star {
	color: #ddd;
}
#full-stars-example-two .rating-group:hover .rating__label .rating__icon--star {
	color: orange;
}
#full-stars-example-two .rating__input:hover ~ .rating__label .rating__icon--star {
	color: #ddd;
}
  

@media only screen and (max-width: 800px) {
  .country_info, .capital_info, .forma, .reklama, .miestai, .faktai{
    max-width: 80%;
	left: 10%;
  }
  .nuotraukos{
	max-width: 80%;
  }
  .komentarai{
	max-width: 80%;
  }
  .pateikti{
	max-width: 80% !important;
  }
}