/* ------------------------------ */
/* ------------------------------ */
/* HEADER */
.Header {
   position: fixed;
   display: block;
   width: 100%;
   height: 91px;
   background-color: #2a2a2a;
   border-top: 10px solid #00a6fb;
   z-index: 100;
}

.Header .center {
   position: relative;
   display: block;
   width: 100%;
   height: 80px;
   padding: 0px 25px;
   margin: auto;
}

.Header .name {
   display: block;
   width: auto;
   height: 80px;
   padding: 23px 0px;
   color: #fff;
   font-size: 30px;
   font-weight: 600;
   line-height: 1;
   float: left;
}

.Header .name.x,
.Header .name:hover {
   cursor: pointer;
   color: #00a6fb;
}

.Header .nav {
   position: fixed;
   display: none;
   top: 0px;
   right: 0px;
   width: 302px;
   height: 100%;
   padding: 15px;
   background-color: #2a2a2a;
   border-right: 10px solid #00a6fb;
   border-left: 1px solid #4a4a4a;
}

.Header .link {
   position: relative;
   display: block;
   width: 100%;
   height: 50px;
   padding: 15px;
   background-color: #2a2a2a;
   border: 1px solid #3a3a3a;
   border-radius: 5px;
   color: #fff;
   font-size: 15px;
   font-weight: 400;
   line-height: 1;
   margin-bottom: 15px;
}

.Header .link::after {
   content: '\00BB';
   position: absolute;
   top: 11px;
   right: 20px;
   font-size: 20px;
}

.Header .link.x,
.Header .link:hover {
   cursor: pointer;
   background-color: #00a6fb;
   border: 1px solid #00a6fb;
   color: #000;
}

.Header #menuBtn {
   display: block;
   width: 40px;
   height: 40px;
   margin: 15px 0px;
   margin-left: 10px;
   float: right;
}


/* --------------------------- */
/* --------------------------- */
/* LAYOUT */
.Content {
   position: absolute;
   display: block;
   top: 91px;
   left: calc(0px);
   width: calc(100%);
   min-height: calc(100vh - 182px);
   padding: 50px 25px;
   overflow: auto;
}


/* --------------------------- */
/* --------------------------- */
/* INTRO */
.Intro {
   position: relative;
   display: block;
   top: 0px;
   width: 100%;
   height: auto;
   overflow: visible;
   background-color: #222;
   border: 1px solid #222;
   border-radius: 25px;
   margin-top: 50px;
   margin-bottom: 50px;
}

.Intro .header {
   display: none;
}

.Intro .header img {
   width: auto;
   height: 50px;
}

.Intro .image {
   position: absolute;
   display: block;
   top: -50px;
   left: calc(50% - 100px);
   width: 200px;
   height: 250px;
   padding: 0px;
   overflow: hidden;
   background-color: #00a6fb;
   border-radius: 5px;
}

.Intro .info {
   display: block;
   width: 100%;
   height: auto;
   padding: 25px;
   color: #aaa;
   font-size: 20px;
   font-weight: 400;
   text-align: center;
   line-height: 1.5;
   margin-top: 200px;
}


/* --------------------------- */
/* --------------------------- */
/* SERVICES */
.Services {
   display: block;
   width: 100%;
   height: auto;
   overflow: visible;
   margin-bottom: 50px;
}

.Services .service {
   position: relative;
   display: block;
   top: 0px;
   left: 0px;
   width: 100%;
   height: auto;
   overflow: visible;
   background-color: #222;
   border: 1px solid #222;
   border-radius: 50px;
   margin-bottom: 25px;
}

.Services .image {
   position: absolute;
   display: block;
   top: -15px;
   left: calc(50% - 125px);
   width: 250px;
   height: 250px;
   padding: 25px;
   background-color: #2a2a2a;
   border-radius: 25px;
   transform: rotate(5deg);
}

.Services .info {
   position: relative;
   display: block;
   top: 115px;
   left: 0px;
   width: 100%;
   height: auto;
   overflow: auto;
   padding: 25px;
}

.Services .name {
   position: absolute;
   display: block;
   top: 150px;
   left: calc(50% - 150px);
   width: 300px;
   height: 50px;
   padding: 15px;
   background-color: #00a6fb;
   border-radius: 5px;
   color: #fff;
   font-size: 18px;
   font-weight: 800;
   text-align: center;
}

.Services .description {
   display: block;
   width: 100%;
   height: 200px;
   color: #aaa;
   font-size: 18px;
   font-weight: 400;
   text-align: center;
   margin-top: 200px;
}


/* ------------------------------ */
/* ------------------------------ */
/* TEAM */
.Team {
   display: block;
   width: 100%;
   height: auto;
   overflow: visible;
   margin-bottom: 50px;
}

.Team .member {
   position: relative;
   display: block;
   width: 100%;
   height: auto;
   overflow: visible;
   background-color: #222;
   border: 1px solid #222;
   border-radius: 50px;
   margin-bottom: 25px;
}

.Team .image {
   position: absolute;
   display: block;
   top: -15px;
   left: calc(50% - 125px);
   width: 250px;
   height: 250px;
   padding: 15px;
   background-color: #2a2a2a;
   border-radius: 25px;
   transform: rotate(5deg);
}

.Team .borders {
   display: block;
   width: 220px;
   height: 220px;
   overflow: hidden;
   border-radius: 25px;
}

.Team .info {
   position: relative;
   display: block;
   bottom: 75px;
   width: calc(100% - 0px);
   height: auto;
   overflow: visible;
   padding: 25px;
   color: #fff;
   font-size: 20px;
   font-weight: 400;
   text-align: left;
   line-height: 1.5;
   margin-top: 350px;
}

.Team .name {
   position: absolute;
   display: block;
   top: 0px;
   left: 25px;
   width: calc(100% - 50px);
   height: 50px;
   padding: 10px;
   background-color: #00a6fb;
   border-radius: 5px;
   color: #fff;
   font-size: 18px;
   font-weight: 800;
   text-align: center;
}

.Team .position {
   position: absolute;
   display: block;
   top: 75px;
   left: 0px;
   width: 100%;
   height: 50px;
   color: #aaa;
   font-size: 18px;
   font-weight: 400;
   text-align: center;
}


/* --------------------------- */
/* --------------------------- */
/* CONTACT */
.Contact {
   display: block;
   width: 100%;
   min-height: 500px;
   overflow: visible;
   padding: 15px;
   background-color: #222;
   border-radius: 25px;
   margin-bottom: 100px;
}

.Contact .map {
   position: relative;
   display: block;
   top: -50px;
   left: 0px;
   width: calc(100%);
   height: 400px;
   overflow: visible;
   padding: 15px;
   background-color: #2a2a2a;
   border-radius: 25px;
   transform: rotate(0deg);
}

.Contact .borders {
   display: block;
   width: 100%;
   height: 100%;
   overflow: hidden;
   border-radius: 25px;
}

.Contact .info {
   display: block;
   width: 100%;
   height: auto;
   overflow: visible;
   padding: 15px;
   background-color: #222;
   border-radius: 25px;
   margin-top: -50px;
}

.Contact .method {
   display: block;
   width: 100%;
   height: 50px;
   padding: 10px;
   color: #fff;
   font-size: 30px;
   font-weight: 400;
   line-height: 1;
   text-align: center;
   margin-bottom: 10px;
}

.Contact .value {
   display: block;
   width: 100%;
   height: 70px;
   padding: 25px;
   background-color: #2a2a2a;
   border-radius: 25px;
   color: #fff;
   font-size: 20px;
   font-weight: 800;
   line-height: 1;
   text-align: center;
   margin-bottom: 25px;
}

.Contact .value.long {
   position: relative;
   top: 100px;
   height: 200px;
   font-size: 20px;
   line-height: 1.5;
   margin-top: -100px;
}


/* ------------------------------ */
/* ------------------------------ */
/* FOOTER */
.Footer {
   position: fixed;
   display: block;
   bottom: 0px;
   left: 0px;
   width: 100%;
   height: 91px;
   background-color: #2a2a2a;
   border-bottom: 10px solid #4a4a4a;
   margin-top: 0px;
}

.Footer .center {
   position: relative;
   display: block;
   width: 100%;
   height: 80px;
   padding: 0px 25px;
   margin: auto;
}

.Footer .name {
   display: block;
   width: auto;
   height: 80px;
   padding: 23px 0px;
   color: #4a4a4a;
   font-size: 30px;
   font-weight: 600;
   line-height: 1;
   float: right;
}

.Footer .name.x,
.Footer .name:hover {
   cursor: pointer;
   color: #fff;
}

.Footer .nav {
   display: block;
   width: auto;
   height: 80px;
   padding: 32px 0px;
   color: #aaa;
   font-size: 15px;
   font-weight: 200;
   line-height: 1;
   text-align: left;
   float: left;
}

.Footer .copyright {
   display: inline-block;
   width: auto;
   height: 15px;
   overflow: visible;
   color: #aaa;
   font-size: 15px;
   font-weight: 400;
   line-height: 1;
}


/* --------------------------- */
/* --------------------------- */
/* GLOBALS */
.DESKTOP {
   display: none;
}