body {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-variant: normal;
  font-weight: 400;
  line-height: 3;
}

* {
  Box-sizing: Border-box;
}

/* 
    Created on : 22-Jun-2015, 13:00:20
    Author     : probinson
    Based on    : https://codepen.io/schoenwaldnils/pen/JnIKA
*/
/*
    following functions from
    https://unindented.org/articles/trigonometry-in-sass/
*/
.circular-menu-container {
  margin-top: 20px;
  margin-bottom: 20px;
  max-width: none;
  width: auto;
      color: #111111;

}

.circular-menu {
  width: 600px;
  height: 600px;
  position: relative;
  left: 50%;
  margin: 0;
  margin-left: -300px;
  overflow: hidden;
  border-radius: 500px;
  border-radius: 50%;
  z-index: 1;
  list-style: none;
     box-shadow: 0px 0px 25px #0bb6fb;
}

.center-section {
  width: 360px;
  height: 360px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -180px;
  margin-left: -180px;
  padding: 55px;
  border-radius: 500px;
  border-radius: 50%;
  text-align: center;
   background-image: -webkit-linear-gradient(90deg, rgb(233, 243, 246) 0%, #edecf0 100%);
   
  box-shadow: inset 0px 0px 45px #1a5bbd61;
  display: none;
  z-index: 1;
}

.center-section.section-intro {
  display: block;
}

.circular-menu li:hover ~ .center-section.section-intro,
.touch .circular-menu li:focus ~ .center-section.section-intro {
  display: none;
}

.touch .circular-menu li:focus {
  outline: 0;
}

.circular-menu li div.label {
  position: absolute;
  width: 180px;
  height: 180px;
  z-index: 2;
}

.circular-menu li div.label p {
  text-align: center;
  max-width: 118.8px;
  margin: 0 auto;
  margin-top: 72px;
  color: #fff;
}

.circular-menu li span.arrow {
  position: absolute;
  width: 30px;
  height: 30px;
  display: block;
  transition: all 300ms ease-out;
  z-index: 2;
}

.circular-menu li .bg {
  width: 350px;
  height: 300px;
  position: absolute;
  transform-origin: 0 300px;
  margin-top: -300px;
  left: 50%;
  top: 50%;
  transition: all 300ms ease-out;
}

.circular-menu li {
  position: absolute;
  text-decoration: none;
  top: 50%;
  left: 50%;
  display: none;
}

.circular-menu li:nth-child(1) {
  display: block;
}

.circular-menu li:nth-child(1) .bg {
  transform: rotate(-70deg) skew(-50deg);
  background: #1982d5;
   /* background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); */
       /* background-image: -webkit-linear-gradient(90deg, rgba(10, 144, 208, 0.7) 0%, #1b9cd3 100%); */
   /* background-image: -ms-linear-gradient(90deg, #2caab3 0%, #1b9cd3 100%); */
    color: #fff;
}

.circular-menu li:nth-child(1):hover .bg,
.touch .circular-menu li:nth-child(1):focus .bg {
   background:#f8d606;
}

.circular-menu li:nth-child(1) span.arrow {
  transform: rotate(-45deg);
  margin: -225px 0 0 -15px;
	
  
}

.circular-menu li:nth-child(1):hover span.arrow,
.touch .circular-menu li:nth-child(1):focus span.arrow {
  background:#f8d606;
  margin: -195px 0 0 -15px;
}

.circular-menu li:nth-child(1) div.label {
  margin: -330px 0 0 -90px;
}

.circular-menu li:nth-child(1):hover div.center-section.section-1,
.touch .circular-menu li:nth-child(1):focus div.center-section.section-1 {
  display: block;
}








.circular-menu li:nth-child(11) {
  display: block;
}

.circular-menu li:nth-child(11) .bg {
  transform: rotate(-70deg) skew(-50deg);
  background: #1982d5;
   /* background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); */
       /* background-image: -webkit-linear-gradient(90deg, rgba(10, 144, 208, 0.7) 0%, #1b9cd3 100%); */
   /* background-image: -ms-linear-gradient(90deg, #2caab3 0%, #1b9cd3 100%); */
    color: #fff;
}

.circular-menu li:nth-child(11):hover .bg,
.touch .circular-menu li:nth-child(1):focus .bg {
    background-image: -webkit-linear-gradient(90deg, rgba(14, 163, 250, 0.7) 0%, #4c6671 100%);
}

.circular-menu li:nth-child(11) span.arrow {
  transform: rotate(-45deg);
  margin: -225px 0 0 -15px;
	
  
}

.circular-menu li:nth-child(11):hover span.arrow,
.touch .circular-menu li:nth-child(1):focus span.arrow {
  background:#f8d606;
  margin: -195px 0 0 -15px;
}

.circular-menu li:nth-child(11) div.label {
  margin: -330px 0 0 -90px;
}

.circular-menu li:nth-child(11):hover div.center-section.section-1,
.touch .circular-menu li:nth-child(1):focus div.center-section.section-1 {
  display: block;
}




.circular-menu li:nth-child(2) {
  display: block;
}

.circular-menu li:nth-child(2) .bg {
  transform: rotate(-30deg) skew(-50deg);
  background: #1982d5;
   /* background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); */
       /* background-image: -webkit-linear-gradient(90deg, rgba(10, 144, 208, 0.7) 0%, #1b9cd3 100%); */
   /* background-image: -ms-linear-gradient(90deg, #2caab3 0%, #1b9cd3 100%); */
   /* border-radius: 0px; */
  
}

.circular-menu li:nth-child(2):hover .bg,
.touch .circular-menu li:nth-child(2):focus .bg {
      background:#f8d606;
}

.circular-menu li:nth-child(2) span.arrow {
  transform: rotate(-5deg);
  margin: -175.869333055px 0 0 119.9853980342px;

}

.circular-menu li:nth-child(2):hover span.arrow,
.touch .circular-menu li:nth-child(2):focus span.arrow {
  background:#f8d606;
  margin: -152.8879997614px 0 0 100.7017697436px;
}

.circular-menu li:nth-child(2) div.label {
  margin: -273.8506663486px 0 0 64.2690263248px;
}

.circular-menu li:nth-child(2):hover div.center-section.section-2,
.touch .circular-menu li:nth-child(2):focus div.center-section.section-2 {
  display: block;
}

.circular-menu li:nth-child(3) {
  display: block;
}

.circular-menu li:nth-child(3) .bg {
  transform: rotate(10deg) skew(-50deg);

	
  background: #1982d5;
   /* background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); */
       /* background-image: -webkit-linear-gradient(90deg, rgba(10, 144, 208, 0.7) 0%, #1b9cd3 100%); */
   /* background-image: -ms-linear-gradient(90deg, #2caab3 0%, #1b9cd3 100%); */
    color: #fff;
	border-radius: 0px;
	
}

.circular-menu li:nth-child(3):hover .bg,
.touch .circular-menu li:nth-child(3):focus .bg {
     background:#f8d606;
}

.circular-menu li:nth-child(3) span.arrow {
  transform: rotate(35deg);
  margin: -51.4661173101px 0 0 191.8096281326px;

}

.circular-menu li:nth-child(3):hover span.arrow,
.touch .circular-menu li:nth-child(3):focus span.arrow {
  background:#f8d606;
  margin: -46.25667198px 0 0 162.2653955422px;
}

.circular-menu li:nth-child(3) div.label {
  margin: -131.6755626401px 0 0 146.3538607229px;
}

.circular-menu li:nth-child(3):hover div.center-section.section-3,
.touch .circular-menu li:nth-child(3):focus div.center-section.section-3 {
  display: block;
}




.circular-menu li:nth-child(4) {
  display: block;
}

.circular-menu li:nth-child(4) .bg {
  transform: rotate(50deg) skew(-50deg);
   background: #1982d5;
   /* background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); */
       /* background-image: -webkit-linear-gradient(90deg, rgba(10, 144, 208, 0.7) 0%, #1b9cd3 100%); */
   /* background-image: -ms-linear-gradient(90deg, #2caab3 0%, #1b9cd3 100%); */
    color: #fff;
	
}

.circular-menu li:nth-child(4):hover .bg,
.touch .circular-menu li:nth-child(4):focus .bg {
     background:#f8d606;
}

.circular-menu li:nth-child(4) span.arrow {
  transform: rotate(75deg);
  margin: 90px 0 0 166.8653347947px;

}

.circular-menu li:nth-child(4):hover span.arrow,
.touch .circular-menu li:nth-child(4):focus span.arrow {
  background:#f8d606;
  margin: 75px 0 0 140.8845726812px;
}

.circular-menu li:nth-child(4) div.label {
  margin: 30px 0 0 117.8460969083px;
}

.circular-menu li:nth-child(4):hover div.center-section.section-4,
.touch .circular-menu li:nth-child(4):focus div.center-section.section-4 {
  display: block;
}








.circular-menu li:nth-child(5) {
  display: block;
}

.circular-menu li:nth-child(5) .bg {
  transform: rotate(90deg) skew(-50deg);
   background: #1982d5;
   /* background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); */
       /* background-image: -webkit-linear-gradient(90deg, rgba(10, 144, 208, 0.7) 0%, #1b9cd3 100%); */
   /* background-image: -ms-linear-gradient(90deg, #2caab3 0%, #1b9cd3 100%); */
    color: #fff;

}

.circular-menu li:nth-child(5):hover .bg,
.touch .circular-menu li:nth-child(5):focus .bg {
     background:#f8d606;
}

.circular-menu li:nth-child(5) span.arrow {
  transform: rotate(115deg);
  margin: 182.335450365px 0 0 56.8242300984px;
 
}

.circular-menu li:nth-child(5):hover span.arrow,
.touch .circular-menu li:nth-child(5):focus span.arrow {
  background:#f8d606;
  margin: 154.1446717415px 0 0 46.5636257986px;
}

.circular-menu li:nth-child(5) div.label {
  margin: 135.5262289886px 0 0 -7.9151656019px;
}

.circular-menu li:nth-child(5):hover div.center-section.section-5,
.touch .circular-menu li:nth-child(5):focus div.center-section.section-5 {
  display: block;
}

.circular-menu li:nth-child(6) {
  display: block;
}

.circular-menu li:nth-child(6) .bg {
  transform: rotate(130deg) skew(-50deg);
     background: #1982d5;
   /* background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); */
       /* background-image: -webkit-linear-gradient(90deg, rgba(10, 144, 208, 0.7) 0%, #1b9cd3 100%); */
   /* background-image: -ms-linear-gradient(90deg, #2caab3 0%, #1b9cd3 100%); */
    color: #fff;
	

}

.circular-menu li:nth-child(6):hover .bg,
.touch .circular-menu li:nth-child(6):focus .bg {
      background:#f8d606;
}

.circular-menu li:nth-child(6) span.arrow {
  transform: rotate(155deg);
  margin: 182.335450365px 0 0 -86.8242300984px;
 
}

.circular-menu li:nth-child(6):hover span.arrow,
.touch .circular-menu li:nth-child(6):focus span.arrow {
   background:#f8d606;
  margin: 154.1446717415px 0 0 -76.5636257986px;
}

.circular-menu li:nth-child(6) div.label {
  margin: 135.5262289886px 0 0 -172.0848343982px;
}

.circular-menu li:nth-child(6):hover div.center-section.section-6,
.touch .circular-menu li:nth-child(6):focus div.center-section.section-6 {
  display: block;
}

.circular-menu li:nth-child(7) {
  display: block;
}

.circular-menu li:nth-child(7) .bg {
  transform: rotate(170deg) skew(-50deg);
      background: #1982d5;
   /* background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); */
       /* background-image: -webkit-linear-gradient(90deg, rgba(10, 144, 208, 0.7) 0%, #1b9cd3 100%); */
   /* background-image: -ms-linear-gradient(90deg, #2caab3 0%, #1b9cd3 100%); */
    color: #fff;
	

}

.circular-menu li:nth-child(7):hover .bg,
.touch .circular-menu li:nth-child(7):focus .bg {
    background:#f8d606;
}

.circular-menu li:nth-child(7) span.arrow {
  transform: rotate(195deg);
  margin: 90px 0 0 -196.8653347945px;

}

.circular-menu li:nth-child(7):hover span.arrow,
.touch .circular-menu li:nth-child(7):focus span.arrow {
   background:#f8d606;
  margin: 75px 0 0 -170.884572681px;
}

.circular-menu li:nth-child(7) div.label {
  margin: 30px 0 0 -297.846096908px;
}

.circular-menu li:nth-child(7):hover div.center-section.section-7,
.touch .circular-menu li:nth-child(7):focus div.center-section.section-7 {
  display: block;
}

.circular-menu li:nth-child(8) {
  display: block;
}

.circular-menu li:nth-child(8) .bg {
  transform: rotate(210deg) skew(-50deg);
      background: #1982d5;
   /* background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); */
       /* background-image: -webkit-linear-gradient(90deg, rgba(10, 144, 208, 0.7) 0%, #1b9cd3 100%); */
   /* background-image: -ms-linear-gradient(90deg, #2caab3 0%, #1b9cd3 100%); */
    color: #fff;
	
}

.circular-menu li:nth-child(8):hover .bg,
.touch .circular-menu li:nth-child(8):focus .bg {
     background:#f8d606;
}

.circular-menu li:nth-child(8) span.arrow {
  transform: rotate(235deg);
  margin: -51.4661173026px 0 0 -221.8096280805px;

}

.circular-menu li:nth-child(8):hover span.arrow,
.touch .circular-menu li:nth-child(8):focus span.arrow {
   background:#f8d606;
  margin: -46.2566719736px 0 0 -192.2653954975px;
}

.circular-menu li:nth-child(8) div.label {
  margin: -131.6755626315px 0 0 -326.3538606634px;
}

.circular-menu li:nth-child(8):hover div.center-section.section-8,
.touch .circular-menu li:nth-child(8):focus div.center-section.section-8 {
  display: block;
}

.circular-menu li:nth-child(9) {
  display: block;
}

.circular-menu li:nth-child(9) .bg {
  transform: rotate(250deg) skew(-50deg);
        background: #1982d5;
   /* background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); */
       /* background-image: -webkit-linear-gradient(90deg, rgba(10, 144, 208, 0.7) 0%, #1b9cd3 100%); */
   /* background-image: -ms-linear-gradient(90deg, #2caab3 0%, #1b9cd3 100%); */
    color: #fff;

}

.circular-menu li:nth-child(9):hover .bg,
.touch .circular-menu li:nth-child(9):focus .bg {
   background:#f8d606;
}

.circular-menu li:nth-child(9) span.arrow {
  transform: rotate(275deg);
  margin: -175.8693324509px 0 0 -149.985394581px;
 
}

.circular-menu li:nth-child(9):hover span.arrow,
.touch .circular-menu li:nth-child(9):focus span.arrow {
  background:#f8d606;
  margin: -152.8879992437px 0 0 -130.7017667837px;
}

.circular-menu li:nth-child(9) div.label {
  margin: -273.8506656582px 0 0 -244.2690223782px;
}

.circular-menu li:nth-child(9):hover div.center-section.section-9,
.touch .circular-menu li:nth-child(9):focus div.center-section.section-9 {
  display: block;
}


/* menu circular  servicios */


.circular-menu li:nth-child(10) {
  display: block;
}

.circular-menu li:nth-child(10) .bg {
  transform: rotate(250deg) skew(-50deg);
     background:#f8d606;
   /* background-image: -moz-linear-gradient(90deg, #2caab3 0%, #2c8cb3 100%); */
       /* background-image: -webkit-linear-gradient(90deg, rgba(10, 144, 208, 0.7) 0%, #1b9cd3 100%); */
   /* background-image: -ms-linear-gradient(90deg, #2caab3 0%, #1b9cd3 100%); */
    color: #fff;

}

.circular-menu li:nth-child(10):hover .bg,
.touch .circular-menu li:nth-child(10):focus .bg {
     background-image: -webkit-linear-gradient(90deg, rgba(14, 163, 250, 0.7) 0%, #4c6671 100%);
}

.circular-menu li:nth-child(10) span.arrow {
  transform: rotate(275deg);
  margin: -175.8693324509px 0 0 -149.985394581px;
 
}

.circular-menu li:nth-child(10):hover span.arrow,
.touch .circular-menu li:nth-child(10):focus span.arrow {
  background:#f8d606;
  margin: -152.8879992437px 0 0 -130.7017667837px;
}

.circular-menu li:nth-child(10) div.label {
  margin: -273.8506656582px 0 0 -244.2690223782px;
}

.circular-menu li:nth-child(10):hover div.center-section.section-10,
.touch .circular-menu li:nth-child(10):focus div.center-section.section-10 {
  display: block;
}


/* menu circular  servicios */


.animated {
  animation-duration: 0.75s;
  animation-fill-mode: both;
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translate3d(0, 50%, 0);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
.fadeInUp {
  animation-name: fadeInUp;
}