/* ====================================================================================================
  BASIC ELEMENTS
==================================================================================================== */

@import url("../basic/reset.css");

@import url("../basic/simplegrid.css");

@import url("../basic/basic.css");


/* ==============================
  LAYOUT HOME
============================== */

@import url("header.css");

@import url("menu-dropdown.css");

@import url("banner-home.css");

@import url("slider.css");

@import url("poster.css");

@import url("projects.css");

@import url("quote-text.css");

@import url("cards.css");

@import url("call-to-action.css");

@import url("text-icons.css");

@import url("footer.css");


/* ==============================
  LAYOUT INSIDE PAGES
============================== */

@import url("page-header.css");

@import url("text-block.css");

@import url("google-map.css");

@import url("timeline.css");


/* ==============================
  JQUERY SCRIPTS
============================== */

@import url("../js-scripts/slidebars.css");

@import url("../js-scripts/flexslider.css");

@import url("../js-scripts/fancybox.css");

@import url("../js-scripts/inline-popup.css");



/* ====================================================================================================
  THEME FONT
==================================================================================================== */

/* ==============================
  BODY
============================== */

/* Roboto */
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,600,700');

/* Raleway */
@import url('https://fonts.googleapis.com/css?family=Raleway:300,400,600,700');

/* body */
body {
	margin: 0px;
	padding: 0px;
	background: #fff;
	font-family: 'Roboto', Helvetica, Arial, sans-serif;
	font-size: 16px;
	color: #000;

	width: 100%;
	overflow-x: hidden; /* Stops horizontal scrolling. */
}



/* ====================================================================================================
  THEME COLOR
==================================================================================================== */

/* ==============================
  BACKGROUND PRIMARY
============================== */
.bg_primary,
.button_large.primary,
.button_medium.primary,
.button_small.primary,
.button_link.primary,
.menu_dropdown nav ul ul li a:hover,
.menu_dropdown .active,
.sidebar_nav .closebtn
{
	background: #115eb0; /* IMPORTANT! CHANGE COLOR */
}

/* Affects the following elements: bg_primary - button_large - button_small - menu_dropdown hover - dropdown submenu hover - dropdown active - sidebar_nav close button */

/* ==============================
  BACKGROUND SECONDARY
============================== */
.bg_secondary,
.button_large.secondary,
.button_medium.secondary,
.button_small.secondary,
.button_link.secondary
{
	background: #23983b; /* IMPORTANT! CHANGE COLOR */
}

/* icons fill */
.icons {
	fill: #23983b; /* IMPORTANT! CHANGE COLOR */
}


/* Affects the following elements: bg_secondary - button_large - button_small */

/* ==============================
  BACKGROUND TERTIARY
============================== */
.bg_tertiary,
.button_large.tertiary,
.button_medium.tertiary,
.button_small.tertiary,
.button_link.tertiary
{
	background: #c69c6d; /* IMPORTANT! CHANGE COLOR */
}

/* Affects the following elements: bg_tertiary - button_large - button_small */





/* ====================================================================================================
  TEXT COLOR
==================================================================================================== */

/* ==============================
  TEXT PRIMARY
============================== */
.text_primary,
a.link_primary
{
	color: #115eb0; /* IMPORTANT! CHANGE COLOR */
}

/* Affects the following elements: text - link */

/* ==============================
  TEXT SECONDARY
============================== */
.text_secondary,
a.link_secondary
{
	color: #23983b; /* IMPORTANT! CHANGE COLOR */
}

/* Affects the following elements: text - link */

/* ==============================
  TEXT TERTIARY
============================== */
.text_tertiary,
a.link_tertiary
{
	color: #c69c6d; /* IMPORTANT! CHANGE COLOR */
}

/* Affects the following elements: text - link */

/* ==============================
  LINK COLOR
============================== */

/* link */
a.link_primary:link, /* primary */
a.link_secondary:link, /* secondary */
a.link_tertiary:link /* tertiary */
{
	text-decoration: none;
}

/* link:hover */
a.link_primary:hover, /* primary */
a.link_secondary:hover, /* secondary */
a.link_tertiary:hover /* tertiary */
{
	text-decoration: underline;
}





/* ====================================================================================================
  BUTTONS
==================================================================================================== */

/* ==============================
  BUTTONS LARGE
============================== */

/* button_large */
.button_large.secondary { /* secondary */
	color: #fff;
}

.button_large.tertiary { /* tertiary */
	color: #fff;
}

/* button_large :hover */
.button_large.primary:hover, /* primary */
.button_large.secondary:hover, /* secondary */
.button_large.tertiary:hover /* tertiary */
{
	background: rgba(0, 0, 0, .7);
	text-decoration: none;
	color: #fff;
}

/* ==============================
  BUTTONS LARGE INVERT
============================== */

/* button_medium white_invert */
.button_large.primary_invert {
	background: transparent;
	border: 1px solid #115eb0;
	color: #115eb0;
}
.button_large.primary_invert:hover {
	background: #115eb0;
	border: 1px solid #115eb0;
	color: #fff;
	text-decoration: none;
}



/* ==============================
  BUTTONS MEDIUM
============================== */

/* button_medium */
.button_medium.secondary { /* secondary */
	color: #fff;
}

.button_medium.tertiary { /* tertiary */
	color: #fff;
}

/* button_medium :hover */
.button_medium.primary:hover, /* primary */
.button_medium.secondary:hover, /* secondary */
.button_medium.tertiary:hover /* tertiary */
{
	background: rgba(0, 0, 0, .7);
	text-decoration: none;
	color: #fff;
}

/* ==============================
  BUTTONS MEDIUM INVERT
============================== */

/* button_medium white_invert */
.button_medium.primary_invert {
	background: transparent;
	border: 1px solid #115eb0;
	color: #115eb0;
}
.button_medium.primary_invert:hover {
	background: #115eb0;
	border: 1px solid #115eb0;
	color: #fff;
	text-decoration: none;
}



/* ==============================
  BUTTONS SMALL
============================== */

/* button_small */
.button_small.secondary { /* secondary */
	color: #fff;
}

.button_small.tertiary { /* tertiary */
	color: #fff;
}

/* button_small :hover */
.button_small.primary:hover, /* primary */
.button_small.secondary:hover, /* secondary */
.button_small.tertiary:hover /* tertiary */
{
	background: rgba(0, 0, 0, .7);
	text-decoration: none;
	color: #fff;
}



/* ==============================
  BUTTONS LINK
============================== */

/* button_link */
.button_link.secondary { /* secondary */
	color: #fff;
}

.button_link.tertiary { /* tertiary */
	color: #fff;
}

/* button_link :hover */
.button_link.primary:hover, /* primary */
.button_link.secondary:hover, /* secondary */
.button_link.tertiary:hover /* tertiary */
{
	background: rgba(0, 0, 0, .7);
	text-decoration: none;
	color: #fff;
}





/* ====================================================================================================
  CUSTOM ELEMENTS
==================================================================================================== */

/* ==============================
  CONTENT PAGE
============================== */

/* content_page */
.content_page {
	margin: 0;
}

/* ==============================
  HEADINGS
============================== */

/* headings */
h1, h2, h3, h4, h5, h6 {
	font-family: 'Raleway', Helvetica, Arial, sans-serif;
	font-weight: normal;
	line-height: normal;
}



/* ==============================
  TEXT (headings, text and links)
============================== */

/* container_title_page */
.container_title_page {
	padding: 0 20px 40px 20px;
}

/* H1 title_page*/
.title_page {
	padding: 0 0 15px 0;
	font-size: 32px;
}


/* H2 subtitle_page */
.subtitle_page {
	padding: 15px 0 0 0;
	font-size: 22px;
}

/* title_line_color */
.title_line_color {
	width: 100px;
	height: 3px;
}

/* title_line_color left */
.title_line_color.left {
	float: left;
}

/* title_line_color center */
.title_line_color.center {
	margin: auto;
}

/* title_line_color right */
.title_line_color.right {
	float: right;
}


/* ==============================
  ANIMATE HOVER
============================== */
/* Wobble Horizontal */
@-webkit-keyframes hvr-wobble-horizontal {
  16.65% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }
  33.3% {
    -webkit-transform: translateX(-6px);
    transform: translateX(-6px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes hvr-wobble-horizontal {
  16.65% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }
  33.3% {
    -webkit-transform: translateX(-6px);
    transform: translateX(-6px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.hvr-wobble-horizontal {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.hvr-wobble-horizontal:hover, .hvr-wobble-horizontal:focus, .hvr-wobble-horizontal:active {
  -webkit-animation-name: hvr-wobble-horizontal;
  animation-name: hvr-wobble-horizontal;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}


/* ====================================================================================================
  MEDIA QUERIES
==================================================================================================== */



/* # TABLET
==================================================================================================== */
@media handheld, only screen and (max-width: 959px) {

/* ==============================
  CONTENT PAGE
============================== */

/* content_page */
.content_page {
	margin: 80px 0 0 0;
}

/* ==============================
  TEXT (headings, text and links)
============================== */

/* h1 */
.title_page {
	font-size: 30px;
}

/* h2 */
.subtitle_page {
	font-size: 20px;
}



}
/* # END TABLET
==================================================================================================== */


/* # SMARTPHONE
==================================================================================================== */
@media handheld, only screen and (max-width: 639px) {

/* ==============================
  CONTENT PAGE
============================== */

/* content_page */
.content_page {
	margin: 50px 0 0 0;
}

/* ==============================
  TEXT (headings, text and links)
============================== */

/* container_title_page */
.container_title_page {
	padding: 0 20px 20px 20px;
}

/* h1 */
.title_page {
	font-size: 28px;
}

/* h2 */
.subtitle_page {
	padding: 15px 0 10px 0;
	font-size: 18px;
	line-height: 1.5;
}



}
/* # END SMARTPHONE
==================================================================================================== */
