@font-face {
  font-family: "ArmAllegro";
  src: url("/fonts/ArmAllegro.ttf") format("truetype");
}

@font-face {
  font-family: "ArTarumianHeghnar";
  src: url("/fonts/ArTarumianHeghnar.ttf") format("truetype");
}

@font-face {
  font-family: "Lobster";
  src: url("/fonts/Lobster.ttf") format("truetype");
}

body,
html {
  height: 100%;
  width: 100%;
}

body {
  background-image: url("/img/background.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.container-fluid {
  padding: 0 5vw;
}

header {
  /*height: 15vw;*/
  padding: 1vw 0;
}

header div {
  height: 100%;
}

header #logo {
  padding: 0.6vw 0.3vw;
  margin-top: 1vw;
  height: 10vw;
  width: 10vw;
  border-radius: 50%;
  background-color: #fff;
}

header #logo1 {
  padding: 1vw 0.4vw;
  height: 9.2vw;
  width: 9.2vw;
  border-radius: 50%;
  background-color: #927;
}

header #logo2 {
  padding: 0;
  height: 8.2vw;
  width: 8.2vw;
  border-radius: 50%;
  background: url("/img/logo.jpg") center center no-repeat;
  background-size: cover;
  -webkit-transform: rotate(-20deg);
          transform: rotate(-20deg);
}

header #title {
  color: #09f;
  font-family: "ArmAllegro", Verdana, Tahoma;
  font-weight: bold;
}

header #social {
  /*margin-top: 2vw;*/
  padding: 0.5vw 1.5vw;
  opacity: 0.8;
  /* Style all font awesome icons */
  /* Add a hover effect if you want */
}

header #social .row {
  height: auto;
  padding: 0 2vw;
}

header #social .row a {
  padding: 0 1vw;
}

header #social .row span {
  padding: 0;
  font-size: 1.5vw;
  font-weight: bold;
  font-family: sans-serif;
  margin-top: 0.5vw;
}

header #social .row p {
  font-weight: bold;
}

header #social .fa,
header #social .fab {
  margin: 0.5vw auto;
  text-align: center;
  text-decoration: none;
  border-radius: 50%;
  color: white;
}

header .circle {
  position: absolute;
}

header #circle1 {
  background-color: #fc2;
  width: 8vw;
  height: 8vw;
  border-radius: 50%;
  top: 5vw;
  left: 20vw;
  padding: 0.25vw 0.25vw;
}

header #circle1 .image {
  width: 7.5vw;
  height: 7.5vw;
  border-radius: 50%;
  background: url("/img/circle1.jpg") center center no-repeat;
  background-size: cover;
  -webkit-transform: rotate(-20deg);
          transform: rotate(-20deg);
}

header #circle2 {
  background-color: #fff;
  width: 8vw;
  height: 8vw;
  border-radius: 50%;
  top: 11vw;
  left: 14vw;
  padding: 0.7vw 0.7vw;
}

header #circle2 .image {
  width: 7vw;
  height: 7vw;
  border-radius: 50%;
  background: url("/img/circle2.jpg") center center no-repeat;
  background-size: cover;
  -webkit-transform: rotate(-20deg);
          transform: rotate(-20deg);
}

header #circle3 {
  background-color: #fff;
  width: 9vw;
  height: 9vw;
  border-radius: 50%;
  top: 10vw;
  left: 6vw;
  padding: 0.7vw 0.7vw;
}

header #circle3 .image {
  width: 8vw;
  height: 8vw;
  border-radius: 50%;
  background: url("/img/circle3.jpg") center center no-repeat;
  background-size: cover;
  -webkit-transform: rotate(10deg);
          transform: rotate(10deg);
}

header #circle4 {
  background-color: #fff;
  width: 6vw;
  height: 6vw;
  border-radius: 50%;
  top: 8vw;
  left: 1vw;
  padding: 0.5vw 0.1vw;
}

header #circle4 .back {
  background-color: #f82;
  width: 5.5vw;
  height: 5.5vw;
  border-radius: 50%;
  padding: 0.5vw 0.1vw;
}

header #circle4 .back .image {
  width: 5vw;
  height: 5vw;
  border-radius: 50%;
  background: url("/img/circle4.jpg") center center no-repeat;
  background-size: cover;
  -webkit-transform: rotate(10deg);
          transform: rotate(10deg);
}

header #circle5 {
  width: 6vw;
  height: 6vw;
  top: 5vw;
  left: 15vw;
  -webkit-transform: rotate(10deg);
          transform: rotate(10deg);
}

header #circle5 .image {
  width: 6vw;
  height: 6vw;
  background: url("/img/circle5.jpg") center center no-repeat;
  background-size: cover;
}

header #circle6 {
  background-color: #fff;
  width: 5vw;
  height: 5vw;
  border-radius: 50%;
  top: 0.5vw;
  left: 15vw;
  padding: 0.35vw 0.35vw;
}

header #circle6 .image {
  width: 4.5vw;
  height: 4.5vw;
  border-radius: 50%;
  background: url("/img/circle6.jpg") center center no-repeat;
  background-size: cover;
  -webkit-transform: rotate(20deg);
          transform: rotate(20deg);
}

nav {
  min-height: 5%;
}

.navbar {
  padding: 0;
  margin-bottom: 2vh;
}

#navbar div {
  line-height: 1;
}

#navbar input {
  font-size: 0.8vw;
  padding: 0.5vw 0.5vw;
  border-radius: 0.25vw;
}

#navbar button {
  font-size: 0.8vw;
  padding: 0.5vw 0;
  border-radius: 0.25vw;
}

#navbar .dropdown {
  padding: 1px;
}

#navbar .dropdown .dropdown-menu {
  min-width: auto;
  margin: 0;
}

#navbar .dropdown .dropdown-menu a {
  color: white;
  font-size: 0.8vw;
}

section {
  min-height: 65%;
}

section div {
  height: 100%;
}

section article {
  height: 100%;
}

section article .row {
  margin-top: 2vh;
}

section article #first {
  background-color: #def;
  padding: 1vw;
  border-radius: 0.5vw;
}

section article #first #calculator {
  height: 28vw;
  border: 1px solid #0cc;
  border-radius: 1vh;
  overflow-y: scroll;
  font-size: 1vw;
}

section article #first #calculator #hotel option:not(:first-child):not(.Yerevan) {
  display: none;
}

section article #first #calculator #checkTour {
  margin: auto;
}

section article #first #calculator #tours {
  display: none;
}

section article #first #calculator .form-check-input {
  position: relative;
  float: left;
  height: 2vh;
}

section article #first #calculator span {
  border: 1px solid black;
}

section article #first #calculator hr {
  height: 1px;
  background-color: #0cc;
  border: none;
}

section article #first #calculator input[type="date"] {
  padding: 0;
  font-size: .9vw;
}

section article #first #calculator [type="date"]::-webkit-inner-spin-button {
  display: none;
}

section article #first #description {
  height: 28vw;
  border: 1px solid #0cc;
  border-radius: 1vh;
  overflow-y: scroll;
}

section article #first #description h5 {
  text-align: center;
  font-style: italic;
  font-weight: bold;
}

section article #first #description p {
  font-style: italic;
  font-weight: bold;
  font-size: 1vw;
}

section article #first #carouselExampleIndicators {
  height: 28vw;
  border-radius: 10px;
}

section article #first #carouselExampleIndicators img {
  height: 100%;
}

section article #first .carousel-inner {
  border-radius: 1vh;
  overflow: hidden;
}

section article #first #items {
  margin-top: 5vh;
  padding-top: 1vh;
  text-align: center;
  border: 1px solid black;
  border-radius: 1vw;
}

section article #first #items .container-fluid {
  padding: 0;
}

section article #first #items .item a {
  display: block;
  height: 10vw;
  color: #842;
  border: 0.4vw solid #ccc;
  border-radius: 50%;
  font-size: 1.4vw;
  font-weight: bold;
  text-decoration: none;
  text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;
  line-height: 9.2vw;
  vertical-align: middle;
  text-align: center;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

section article #first #items .item h5 {
  color: #09f;
  font-weight: bold;
}

section article #first #items .item a:hover {
  color: #a84;
  border: 0;
  font-size: 1.6vw;
  line-height: 10vw;
}

section article #first #content {
  margin-top: 5vh;
  padding-top: 5vh;
  text-align: center;
  border: 1px solid black;
  border-radius: 1vw;
}

section article #first #content .container-fluid {
  padding: 0;
}

section article #first #content table {
  margin: 1vw;
  border: 1px solid black;
}

section article #first #content table tr {
  border: 1px solid black;
}

section article #first #content table tr td {
  border: 1px solid black;
  padding: 1vw;
  font-size: 1vw;
  font-weight: bold;
}

section article #first #content ul li {
  font-size: 1.2vw;
  font-weight: bold;
}

section article #first #aghveran {
  margin-top: 5vh;
  padding-top: 5vh;
  text-align: center;
  border: 1px solid black;
  border-radius: 1vw;
}

section article #first #aghveran .container-fluid {
  padding: 0;
}

section article #first #aghveran .hotel {
  height: 15vw;
}

section article #first #aghveran .hotel a {
  display: block;
  height: 12vw;
  color: #842;
  border: 0.5vw solid #ccc;
  border-radius: 50%;
  font-size: 1.75vw;
  font-weight: bold;
  text-decoration: none;
  text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;
  line-height: 11vw;
  vertical-align: middle;
  text-align: center;
}

section article #first #aghveran .hotel a:hover {
  color: #a84;
  border: 0;
  font-size: 2vw;
  line-height: 12vw;
}

section article #first #aghveran #hotel1 a {
  background: url("/img/hotels/aghveran/arturs/arturs1.jpg") center center no-repeat;
  background-size: cover;
}

section article #first #aghveran #hotel2 a {
  background: url("/img/hotels/aghveran/park/park1.jpg") center center no-repeat;
  background-size: cover;
}

section article #first #aghveran #hotel3 a {
  background: url("/img/hotels/aghveran/best/best1.jpg") center center no-repeat;
  background-size: cover;
}

section article #first #aghveran #hotel4 a {
  background: url("/img/hotels/aghveran/cristal/cristal1.jpg") center center no-repeat;
  background-size: cover;
}

section article #first #aghveran #hotel5 a {
  background: url("/img/hotels/aghveran/ararat/ararat1.jpg") center center no-repeat;
  background-size: cover;
}

section article #first #aghveran #hotel6 a {
  background: url("/img/hotels/aghveran/arturs/arturs2.jpg") center center no-repeat;
  background-size: cover;
}

section article #first #aghveran #hotel7 a {
  background: url("/img/hotels/aghveran/arturs/arturs3.jpg") center center no-repeat;
  background-size: cover;
}

section article #first #aghveran #hotel8 a {
  background: url("/img/hotels/aghveran/arturs/arturs4.jpg") center center no-repeat;
  background-size: cover;
}

section article #first #arturs {
  margin-top: 5vh;
  padding-top: 5vh;
  text-align: center;
  border: 1px solid black;
  border-radius: 1vw;
}

section article #first #arturs .container-fluid {
  padding: 0;
}

section article #first #arturs table {
  margin: 1vw;
  border: 1px solid black;
}

section article #first #arturs table tr {
  border: 1px solid black;
}

section article #first #arturs table tr td {
  border: 1px solid black;
  padding: 1vw;
  font-size: 1vw;
  font-weight: bold;
}

section article #first #arturs ul li {
  font-size: 1.2vw;
  font-weight: bold;
}

section article #second {
  position: relative;
  height: 50vw;
}

section article #second .service {
  position: absolute;
  height: 16vw;
  width: 16vw;
  border-radius: 50%;
  padding: 0;
}

section article #second .service a {
  display: block;
  width: 15vw;
  height: 15vw;
  color: #842;
  border: 0.2vw solid #ccc;
  border-radius: 50%;
  font-size: 1.75vw;
  font-weight: bold;
  text-decoration: none;
  text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;
  line-height: 15vw;
  vertical-align: middle;
  text-align: center;
  -webkit-transform: rotate(-5deg);
          transform: rotate(-5deg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

section article #second .service a:hover {
  color: #a84;
  border: 0;
  -webkit-transform: rotate(5deg);
          transform: rotate(5deg);
}

section article #second #service1 {
  top: 0vw;
  left: 0vw;
}

section article #second #service2 {
  top: 30vw;
  left: 10vw;
}

section article #second #service3 {
  top: 10vw;
  left: 30vw;
}

section article #second #service4 {
  top: 30vw;
  left: 50vw;
}

section article #second #service5 {
  top: 5vw;
  left: 68vw;
}

section article::-webkit-scrollbar {
  display: none;
}

section .row aside,
section .row aside a {
  padding: 1px;
  color: white;
}

footer {
  /*height: 30vh;*/
  /* Style all font awesome icons */
  /* Add a hover effect if you want */
}

footer .row {
  padding-top: 1vh;
}

footer * {
  color: #ccc;
  font-size: 1vw;
}

footer a {
  color: #aaa;
  text-decoration: none;
}

footer a:hover {
  color: #ccc;
  text-decoration: none;
}

footer ul {
  margin: 0;
}

footer span,
footer p {
  font-size: 1vw;
}

footer .fa,
footer .fab {
  line-height: 2vw;
  margin: 0.5vw auto;
  font-size: 1vw;
  width: 2vw;
  height: 2vw;
  text-align: center;
  text-decoration: none;
  border-radius: 50%;
  color: white;
}

nav button,
footer h6 {
  text-transform: uppercase;
}

.nopadding {
  padding: 0;
}

@media only screen and (min-width: 320px) and (max-width: 575px) {
  header #logo {
    height: 15vw;
    width: 15vw;
  }

  header #logo1 {
    height: 14.2vw;
    width: 14.2vw;
  }

  header #logo2 {
    height: 13.2vw;
    width: 13.2vw;
  }

  header #circle1 {
    width: 12vw;
    height: 12vw;
    top: 7.5vw;
    left: 30vw;
  }

  header #circle1 .image {
    width: 11.5vw;
    height: 11.5vw;
  }

  header #circle2 {
    width: 12vw;
    height: 12vw;
    top: 16.5vw;
    left: 21vw;
  }

  header #circle2 .image {
    width: 11vw;
    height: 11vw;
  }

  header #circle3 {
    width: 13.5vw;
    height: 13.5vw;
    top: 15vw;
    left: 9vw;
  }

  header #circle3 .image {
    width: 12.5vw;
    height: 12.5vw;
  }

  header #circle4 {
    width: 9vw;
    height: 9vw;
    top: 12vw;
    left: 1.5vw;
  }

  header #circle4 .back {
    width: 8.5vw;
    height: 8.5vw;
  }

  header #circle4 .back .image {
    width: 8vw;
    height: 8vw;
  }

  header #circle5 {
    width: 9vw;
    height: 9vw;
    top: 7.5vw;
    left: 21.5vw;
  }

  header #circle5 .image {
    width: 9vw;
    height: 9vw;
  }

  header #circle6 {
    width: 7.5vw;
    height: 7.5vw;
    top: 0.75vw;
    left: 22.5vw;
  }

  header #circle6 .image {
    width: 7vw;
    height: 7vw;
  }

  #title {
    font-size: 12vw;
  }

  #social .row p {
    font-size: 4.5vw;
    margin: 0.5vw 0;
  }

  #social .fa,
  #social .fab {
    line-height: 8vw;
    font-size: 4vw;
    width: 8vw;
    height: 8vw;
  }

  #navbar .dropdown .dropdown-menu a {
    font-size: 3vw;
  }

  #navbar input {
    font-size: 3vw;
  }

  #navbar button {
    font-size: 3vw;
    border-radius: 1vw;
  }

  #navbar img {
    width: 10vw;
  }

  .btn-group {
    display: block;
  }

  #languages a {
    font-size: 3vw;
  }

  section article #first #calculator,
  section article #first #description,
  section article #first #carouselExampleIndicators {
    height: 56vw;
  }

  section article #first #calculator p,
  section article #first #calculator input,
  section article #first #calculator input[type="date"],
  section article #first #calculator label,
  section article #first #calculator select,
  section article #first #calculator option,
  section article #first #calculator span,
  section article #first #description p,
  section article #first #description input,
  section article #first #description input[type="date"],
  section article #first #description label,
  section article #first #description select,
  section article #first #description option,
  section article #first #description span,
  section article #first #carouselExampleIndicators p,
  section article #first #carouselExampleIndicators input,
  section article #first #carouselExampleIndicators input[type="date"],
  section article #first #carouselExampleIndicators label,
  section article #first #carouselExampleIndicators select,
  section article #first #carouselExampleIndicators option,
  section article #first #carouselExampleIndicators span {
    font-size: 3vw;
    height: 6vw;
  }

  section article #first #calculator .form-check-input,
  section article #first #description .form-check-input,
  section article #first #carouselExampleIndicators .form-check-input {
    height: 4vw;
  }

  section article #first #items .item a {
    height: 30vw;
    border-width: 1vw;
  }

  section article #first #items .item h5 {
    font-size: 5vw;
  }

  section article #second {
    height: 60vw;
  }

  section article #second .service {
    width: 24vw;
    height: 24vw;
  }

  section article #second .service a {
    width: 22vw;
    height: 22vw;
    font-size: 3vw;
    line-height: 22vw;
  }

  footer h6,
  footer p,
  footer span,
  footer a {
    font-size: 3vw;
  }

  footer .fa,
  footer .fab {
    line-height: 5vw;
    font-size: 2.5vw;
    width: 5vw;
    height: 5vw;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  header #logo {
    height: 15vw;
    width: 15vw;
  }

  header #logo1 {
    height: 14.2vw;
    width: 14.2vw;
  }

  header #logo2 {
    height: 13.2vw;
    width: 13.2vw;
  }

  header #circle1 {
    width: 12vw;
    height: 12vw;
    top: 7.5vw;
    left: 30vw;
  }

  header #circle1 .image {
    width: 11.5vw;
    height: 11.5vw;
  }

  header #circle2 {
    width: 12vw;
    height: 12vw;
    top: 16.5vw;
    left: 21vw;
  }

  header #circle2 .image {
    width: 11vw;
    height: 11vw;
  }

  header #circle3 {
    width: 13.5vw;
    height: 13.5vw;
    top: 15vw;
    left: 9vw;
  }

  header #circle3 .image {
    width: 12.5vw;
    height: 12.5vw;
  }

  header #circle4 {
    width: 9vw;
    height: 9vw;
    top: 12vw;
    left: 1.5vw;
  }

  header #circle4 .back {
    width: 8.5vw;
    height: 8.5vw;
  }

  header #circle4 .back .image {
    width: 8vw;
    height: 8vw;
  }

  header #circle5 {
    width: 9vw;
    height: 9vw;
    top: 7.5vw;
    left: 21.5vw;
  }

  header #circle5 .image {
    width: 9vw;
    height: 9vw;
  }

  header #circle6 {
    width: 7.5vw;
    height: 7.5vw;
    top: 0.75vw;
    left: 22.5vw;
  }

  header #circle6 .image {
    width: 7vw;
    height: 7vw;
  }

  #title {
    font-size: 12vw;
  }

  #social .row p {
    font-size: 4.5vw;
    margin: 0.5vw 0;
  }

  #social .fa,
  #social .fab {
    line-height: 8vw;
    font-size: 4vw;
    width: 8vw;
    height: 8vw;
  }

  #navbar .dropdown .dropdown-menu a {
    font-size: 3vw;
  }

  #navbar input {
    font-size: 3vw;
  }

  #navbar button {
    font-size: 3vw;
    border-radius: 1vw;
  }

  #navbar img {
    width: 10vw;
  }

  #navbar #languages {
    font-size: 1vw;
  }

  .btn-group {
    display: block;
  }

  #languages a {
    font-size: 3vw;
  }

  section article #first #calculator,
  section article #first #description,
  section article #first #carouselExampleIndicators {
    height: 56vw;
  }

  section article #first #calculator p,
  section article #first #calculator input,
  section article #first #calculator input[type="date"],
  section article #first #calculator label,
  section article #first #calculator select,
  section article #first #calculator option,
  section article #first #calculator span,
  section article #first #description p,
  section article #first #description input,
  section article #first #description input[type="date"],
  section article #first #description label,
  section article #first #description select,
  section article #first #description option,
  section article #first #description span,
  section article #first #carouselExampleIndicators p,
  section article #first #carouselExampleIndicators input,
  section article #first #carouselExampleIndicators input[type="date"],
  section article #first #carouselExampleIndicators label,
  section article #first #carouselExampleIndicators select,
  section article #first #carouselExampleIndicators option,
  section article #first #carouselExampleIndicators span {
    font-size: 3vw;
    height: 6vw;
  }

  section article #first #calculator .form-check-input,
  section article #first #description .form-check-input,
  section article #first #carouselExampleIndicators .form-check-input {
    height: 4vw;
  }

  section article #first #items .item a {
    height: 30vw;
    border-width: 1vw;
  }

  section article #first #items .item h5 {
    font-size: 5vw;
  }

  section article #second {
    height: 60vw;
  }

  section article #second .service {
    width: 24vw;
    height: 24vw;
  }

  section article #second .service a {
    width: 22vw;
    height: 22vw;
    font-size: 3vw;
    line-height: 22vw;
  }

  footer h6,
  footer p,
  footer span,
  footer a {
    font-size: 3vw;
  }

  footer .fa,
  footer .fab {
    line-height: 5vw;
    font-size: 2.5vw;
    width: 5vw;
    height: 5vw;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  #title {
    font-size: 9vw;
  }

  #social .row p {
    font-size: 1.4vw;
    margin: 0.6vw 0;
  }

  #social .fa,
  #social .fab {
    line-height: 3vw;
    font-size: 1.5vw;
    width: 3vw;
    height: 3vw;
  }

  #navbar .dropdown .dropdown-menu a {
    font-size: 1.2vw;
  }

  #navbar input {
    font-size: 1.2vw;
  }

  #navbar button {
    font-size: 1.2vw;
    border-radius: 0.6vw;
  }

  #navbar img {
    width: 10vw;
  }

  #navbar #languages a {
    font-size: 1.2vw;
  }

  section article #second {
    height: 60vw;
  }

  section article #second .service {
    width: 20vw;
    height: 20vw;
  }

  section article #second .service a {
    width: 18vw;
    height: 18vw;
    font-size: 2.5vw;
    line-height: 18vw;
  }
}

@media only screen and (min-width: 992px) {
  #title {
    font-size: 9vw;
  }

  #social .row p {
    font-size: 1.4vw;
    margin: 0.6vw 0;
  }

  #social .fa,
  #social .fab {
    line-height: 3vw;
    font-size: 1.5vw;
    width: 3vw;
    height: 3vw;
  }

  #navbar .dropdown .dropdown-menu a {
    font-size: 1vw;
  }

  #navbar input {
    font-size: 1vw;
  }

  #navbar button {
    font-size: 1vw;
    border-radius: 0.5vw;
  }

  #navbar img {
    width: 10vw;
  }

  #navbar #languages a {
    font-size: 1vw;
  }
}

