/*CSS Styles*/
@viewport {
  width: extend-to-zoom;
  zoom: 1.0;
}

@-ms-viewport {
  width: extend-to-zoom;
  zoom: 1.0;
}

/*======================== VARIABLES ==========================*/
/* line 11, main-styles.scss */
/* line 19, styles.scss */
body {
  font-family: 'Roboto', helvetica, sans-serif, arial;
  margin: 0;
  padding: 0;
  background: #efefef;
  display: inline;
}

/* line 18, main-styles.scss */
/* line 28, styles.scss */
p {
  font-weight: 100;
  font-size: 1.2em;
  line-height: 1.2;
}

/* line 21, main-styles.scss */
/* line 33, styles.scss */
a {
  color: #ffffff;
  text-decoration: none;
}

/*-------------- HTML 5 DEFAULT ----------------*/
/* line 36, main-styles.scss */
/* line 49, styles.scss */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
  display: block;
}

/*-------------- END OF DEFAULT ---------------*/

/*======================== HEADER ==========================*/
.header-container{
    background: url('images/background.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    display: table;
    height: 100vh;
    text-align: center;
    width: 100%;
    z-index: -1;
}

/*NAVIGATION*/
/* line 56, main-styles.scss */
/* line 74, styles.scss */



nav ul {
  list-style: none outside none;
  display: none;
}

/* line 60, main-styles.scss */
/* line 80, styles.scss */
.container nav li {
  width: 60px;
  float: left;
  margin: 1.5em 1em 0;
  font-size: 0.8em;
}

/* line 66, main-styles.scss */
/* line 88, styles.scss */
nav li span {
  display: block;
  margin: 0.5em 0.8em 0;
  padding: 0;
}

  #main-icons > ul.open {
    background: #000000;
    margin: 0;
    padding: 0;
  }

  #main-icons > ul > li > a {
    background: none;
    border-right: 0;
    border-radius: 0;
    padding: 18px 25px 18px 25px;
    display: block;
  }

  /* line 564, main-styles.scss */
  /* line 758, styles.scss */
  #main-icons > ul > li:hover > a,
  #main-icons > ul > li.active > a {
    background-color: #ff0000;
    color: #ffffff;
    border-radius: 0;
  }


#intro-icons #menu-button:before, #main-icons #menu-button:before {
    border-top: 8px solid #d3eced;
    content: "";
    display: block;
    height: 20px;
    position: absolute;
    right: 50px;
    top: 50px;
    width: 40px;
}
#intro-icons #menu-button:after, #main-icons #menu-button:after {
    border-bottom: 8px solid #d3eced;
    border-top: 8px solid #d3eced;
    content: "";
    display: block;
    height: 20px;
    position: absolute;
    right: 50px;
    top: 50px;
    width: 40px;
}
/*-------------- MAIN CONTENT ------------*/
/* line 123, main-styles.scss */
/* line 170, styles.scss */
section {
  color: #999;
  clear: both;
}

/* line 129, main-styles.scss */
/* line 178, styles.scss */
section h2,
section p,
footer h2,
footer p {
  margin: 0 0 0.75em 0;
}

/* line 134, main-styles.scss */
/* line 185, styles.scss */
h1,
h2,
h3 {
  font-weight: 100;
}

h2{
 color: red;
 font-size: 2em;
}

h3{
  font-size: 1.5em;
  font-weight: bold;
}

ul {
  padding: 0 20px;
}

.clear{
  clear: both;
}

.logo {
  display: block;
  margin: 1em;
  float: left;
}

/* line 242, main-styles.scss */
/* line 328, styles.scss */
.container {
  margin: auto;
  padding: 40px 0 10px;
  text-align: center;
  max-width: 980px;
  clear: both;
}

.container .intro-text {
    width: 80%;
    border: 1px solid;
    color: #ffffff;
    margin: 100px auto;
    font-weight: bold;
    padding: 100px 0;
}

.intro-text h1 {
    font-weight: bold;
    font-size: 5em;
    margin: 0;
}

.cont-wrap {
    padding: 0 20px;
    text-align: center;
}

.col-3 {
  width: 33.3333333%;
  float:left;
}


.col-2 li,
.col-3 li {
    font-size: 1.2em;
    font-weight: 100;
    line-height: 1.2;
    margin: 0 0 16px;
}
/*------------------ MISSION -----------------*/

.mission .col-3 {
    background: url('images/background.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    display: table;
    min-height: 220px;
    height: 30vh;
    text-align: center;
    z-index: -1;
}


.mission .mission-cont {
  background: red;
  color: #ffffff;
  padding: 0;
}

/*------------------ VISON -----------------*/
.col-2 {
  width: 50%;
  float:left;
}

.our-values .col-2 {
    background: url('images/background.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    display: table;
    height: 490px;
    z-index: -1;
}

.values-cont {
  background: red;
  color: #ffffff;
  padding: 140px 100px;
  text-align: center;
}

.aim-cont {
  height: 390px;
  background: #000000;
  color: #ffffff;
  padding: 25px;
}

/*------------------ OUR SERVICES -----------------*/

.our-servies {
    border: 1px solid #cccccc;
    margin: 30px;
}

.content-wrap {
    border: 1px solid #cccccc;
    float: left;
    margin: 0 48px;
    padding: 0 45px;
}

.content-wrap .col-2 {
  width: 38%;
  padding: 0 45px;
}
/*------------------ OUR TEAM -----------------*/

.tj_gallery {
    margin: 0;
    padding: 0;
}

.tj_gallery > li {
    float: left;
    width: 50%;
    list-style: outside none none;
}

.capty-caption {
    background: #ff0000;
    color: #ffffff;
    padding: 25px;
    opacity: .7 !important;
}

.capty-caption > p {
    font-size: 12px;
}

.capty-tile {
  width: 100% !important;
}

.fix {
    height: 300px;
    width: auto;
}


.form-wrap {
    border: 1px solid #cccccc;
    display: inline-block;
    margin: 0 auto 40px;
    max-width: 80%;
    padding: 30px;
}

.form-wrap a {
    background: none repeat scroll 0 0 red;
    border: medium none;
    color: #ffffff;
    cursor: pointer;
    font-family: inherit;
    font-size: 18px;
    font-weight: lighter;
    padding: 15px;
}

.form-wrap form {
  width: 100%;
  float: left;
  margin: 0 30px 0 0;
}
/*------------------ FOOTER -----------------*/
/* line 318, main-styles.scss */
/* line 435, styles.scss */
footer {
  width: 100%;
  color: #999999;
  padding: 1em 0;
  height: 50px;
}

/* line 324, main-styles.scss */
/* line 443, styles.scss */
footer .container {
  border-top: 1px solid #CCCCCC;
  width: 100%;
}


/****************  MEDIA QUERIES  *********************/
/*----------------  1920  ---------------*/
@media screen and (max-width: 1920px) {
  /* line 374, main-styles.scss */
  /* line 516, styles.scss */
  .intro-text {
    margin: auto;
    width: 60%;
  }

  /* line 378, main-styles.scss */
  /* line 522, styles.scss */
  #intro .logo {
    width: 40%;
  }
}
/*----------------  1280 ---------------*/
@media screen and (max-width: 1280px) {
  /* line 385, main-styles.scss */
  /* line 529, styles.scss */
  .intro-text {
    margin: auto;
    width: 55%;
  }

  /* line 389, main-styles.scss */
  /* line 535, styles.scss */
  #intro .logo {
    width: 60%;
  }
}
/*----------------  980 ---------------*/
@media screen and (max-width: 980px) {

  .tj_gallery > li {
    float: left;
    width: 50%;
    list-style: outside none none;
  }

  /* line 397, main-styles.scss */
  /* line 543, styles.scss */
  .container,
  .about-skills {
    margin: auto;
    text-align: center;
    width: 100%;
  }

  /* line 402, main-styles.scss */
  /* line 550, styles.scss */
  .intro-text {
    margin: auto;
    width: 64%;
  }

  /* line 406, main-styles.scss */
  /* line 556, styles.scss */
  #imenu-button {
    display: none;
  }

  /* line 409, main-styles.scss */
  /* line 561, styles.scss */
  #intro .logo {
    width: 60%;
  }

  .content-wrap {
    padding: 0 45px;
  }
  .content-wrap .col-2 {
    width: 100%;
    padding: 0;
  }
}
/*----------------  768  ---------------*/
@media screen and (max-width: 768px) {

  .mission .col-3,
  .vision .col-3,
  .our-values .col-2,
  .our-services .col-2 {
    width: 100%;
  }

  /* line 447, main-styles.scss */
  /* line 611, styles.scss */
  #intro {
    background: none repeat scroll 0 0 #00b6ab;
    border-bottom: 3px solid #ffbb56;
    color: white;
    margin-top: 0px;
    text-align: center;
    padding: 6em 0 0;
  }

  /* line 455, main-styles.scss */
  /* line 621, styles.scss */
  .intro-text {
    margin: 1em auto;
    width: 90%;
  }

  /* line 459, main-styles.scss */
  /* line 627, styles.scss */
  #intro .logo {
    width: 95%;
  }

  /* line 462, main-styles.scss */
  /* line 632, styles.scss */
  #intro-icons {
    background: none repeat scroll 0 0 #dedede;
    margin-top: 0;
    position: absolute;
    top: 0;
    width: 100%;
  }

  /* line 469, main-styles.scss */
  /* line 641, styles.scss */
  #intro-icons ul li {
    margin: 2em 1em 1em;
  }

  /* line 472, main-styles.scss */
  /* line 646, styles.scss */
  #intro-icons ul {
    background: none repeat scroll 0 0 #dedede;
    list-style: outside none none;
    margin: 1em auto;
    padding: 0;
    width: 100%;
  }

  /* line 479, main-styles.scss */
  /* line 655, styles.scss */
  #intro-icons > ul > li > a {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-right: 0 none;
    padding: 18px 25px;
  }
}

/*----------------  640  ---------------*/
@media screen and (max-width: 640px) {

  .tj_gallery > li {
    float: left;
    width: 100%;
    list-style: outside none none;
  }
}

/*----------------  320  ---------------*/
@media screen and (max-width: 320px) {

  /* line 488, main-styles.scss */
  /* line 664, styles.scss */
  #intro {
    background: none repeat scroll 0 0 #00b6ab;
    margin-top: 50px;
  }

  /* line 492, main-styles.scss */
  /* line 670, styles.scss */
  #intro-icons {
    background: none repeat scroll 0 0 #dedede;
    float: left;
    margin: -549px auto 4em;
    position: absolute;
    text-align: center;
    width: 100%;
  }

  /* line 500, main-styles.scss */
  /* line 680, styles.scss */
  .intro-text {
    margin: auto;
    width: 90%;
  }

  /* line 504, main-styles.scss */
  /* line 686, styles.scss */
  #intro .logo {
    width: 100%;
  }

  /* line 507, main-styles.scss */
  /* line 691, styles.scss */
  #intro-icons ul {
    background: none repeat scroll 0 0 #dedede;
    list-style: outside none none;
    margin: 1em auto;
    padding: 0;
    width: 100%;
  }

  /* line 514, main-styles.scss */
  /* line 700, styles.scss */
  #intro-icons > ul > li > a {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-right: 0 none;
    padding: 18px 25px;
  }
}


  #intro-icons,
  #main-icons {
    height: 62px;
  }

  /* line 533, main-styles.scss */
  /* line 715, styles.scss */
  #intro-icons > ul {
    display: none;
  }

  /* line 537, main-styles.scss */
  /* line 721, styles.scss */
  #intro-icons > ul.open,
  #main-icons > ul.open {
    display: block;
    position: relative;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    margin-top: 120px;
  }

  /* line 542, main-styles.scss */
  /* line 728, styles.scss */
  #intro-icons.align-right > ul,
  #main-icons.align-right > ul {
    float: none;
  }

  /* line 546, main-styles.scss */
  /* line 734, styles.scss */
  #intro-icons.align-center > ul,
  #main-icons.align-center > ul {
    text-align: left;
  }

  /* line 550, main-styles.scss */
  /* line 740, styles.scss */
  #intro-icons > ul > li,
  #intro-icons.align-right > ul > li {
    float: none;
    display: inline;
    text-align: center;
    margin: 0;
  }

  /* line 556, main-styles.scss */
  /* line 748, styles.scss */
  #intro-icons > ul > li > a {
    padding: 18px 25px 18px 25px;
    border-right: 0;
    border-radius: 0;
  }

  /* line 564, main-styles.scss */
  /* line 758, styles.scss */
  #intro-icons > ul > li:hover > a,
  #intro-icons > ul > li.active > a,
  #main-icons > ul > li:hover > a,
  #main-icons > ul > li.active > a {
    background-color: #ff0000;
    color: #ffffff;
    border-radius: 0;
  }

  /* line 570, main-styles.scss */
  /* line 766, styles.scss */
  #intro-icons #menu-button,
  #main-icons #menu-button {
    display: block;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    color: #d3eced;
    padding: 18px 25px 18px 25px;
    text-transform: uppercase;
    letter-spacing: 1px;
    background: url("images/bg.png");
    cursor: pointer;
  }

  /* line 584, main-styles.scss */
  /* line 781, styles.scss */
  #intro-icons ul ul li,
  #main-icons ul ul li {
    width: 100%;
  }

  /* line 588, main-styles.scss */
  /* line 787, styles.scss */
  #intro-icons ul ul li a,
  #main-icons ul ul li a {
    width: 100%;
    box-shadow: none;
    padding-left: 35px;
  }

  /* line 594, main-styles.scss */
  /* line 795, styles.scss */
  #intro-icons ul ul ul li a,
  #main-icons ul ul ul li a {
    padding-left: 45px;
  }

  /* line 600, main-styles.scss */
  /* line 803, styles.scss */
  #intro-icons ul ul li:first-child > a,
  #intro-icons ul ul li:last-child > a,
  #main-icons ul ul li:first-child > a,
  #main-icons ul ul li:last-child > a {
    border-radius: 0;
  }

  /* line 604, main-styles.scss */
  /* line 809, styles.scss */
  #intro-icons #menu-button::after,
  #main-icons #menu-button::after {
    display: block;
    content: '';
    position: absolute;
    height: 8px;
    width: 50px;
    border-top: 8px solid #d3eced;
    border-bottom: 8px solid #d3eced;
    right: 50px;
    top: 80px;
  }

  /* line 616, main-styles.scss */
  /* line 823, styles.scss */
  #intro-icons #menu-button::before,
  #main-icons #menu-button::before {
    display: block;
    content: '';
    position: absolute;
    height: 20px;
    width: 50px;
    border-top: 8px solid #d3eced;
    right: 50px;
    top: 65px;
  }

  /* line 629, main-styles.scss */
  /* line 838, styles.scss */
  #intro-icons > ul > li.has-sub > a::after,
  #intro-icons ul ul li.has-sub > a::after,
  #main-icons > ul > li.has-sub > a::after,
  #main-icons ul ul li.has-sub > a::after {
    display: none;
  }

@media all and (max-width: 800px) and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2 / 1) and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px) and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px) and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2 / 1) and (max-width: 1024px) and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px) and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px) and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px) and (-o-min-device-pixel-ratio: 2 / 1) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px) and (-o-min-device-pixel-ratio: 2 / 1) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2 / 1) and (max-width: 1024px) and (-o-min-device-pixel-ratio: 2 / 1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px) and (-o-min-device-pixel-ratio: 2 / 1) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px) and (-o-min-device-pixel-ratio: 2 / 1) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) and (-o-min-device-pixel-ratio: 2 / 1) and (max-width: 1024px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px) and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px) and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2 / 1) and (max-width: 1024px) and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px) and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px) and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px) and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px) and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2 / 1) and (max-width: 1024px) and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px) and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px) and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px) and (min-resolution: 2dppx) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px) and (min-resolution: 2dppx) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2 / 1) and (max-width: 1024px) and (min-resolution: 2dppx) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px) and (min-resolution: 2dppx) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px) and (min-resolution: 2dppx) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) and (min-resolution: 2dppx) and (max-width: 1024px) {
  /* line 639, main-styles.scss */
  /* line 844, styles.scss */
  header {
    padding: 0;
  }

  /* line 642, main-styles.scss */
  /* line 849, styles.scss */
  nav li span {
    display: inline;
  }

  /* line 645, main-styles.scss */
  /* line 854, styles.scss */
  #main-icons > ul {
    background: none repeat scroll 0 0 #000000;
    display: none;
    list-style: outside none none;
    margin: 0;
    padding: 0;
    width: 100%;
  }

  /* line 655, main-styles.scss */
  /* line 865, styles.scss */
  #main-icons > ul > li,
  #main-icons.align-right > ul > li {
    display: inline;
    float: none;
    margin: 0;
    text-align: center;
  }

  /* line 661, main-styles.scss */
  /* line 873, styles.scss */
  #main-icons > ul > li > a {
    background: none;
    border-right: 0;
    border-radius: 0;
    padding: 18px 25px 18px 25px;
    display: block;
  }

  .intro-text h1 {
    font-size: 2em;
  }

  /*============================= NEW STYLES ========================*/
  /* line 672, main-styles.scss */
  /* line 884, styles.scss */
  #intro-icons li span,
  #main-icons li span {
    margin: 1em 0;
    padding: 0;
    position: relative;
  }

  .content-wrap {
    padding: 0 30px;
  }
}
