/*
 * Copyright - 2016 DDTR Inc.
 */
@CHARSET "ISO-8859-1";

/******************************************************************************
 * Division holding the banner. 
 ******************************************************************************/
#banner {
  background-image: url("../images/board-1226675_1920.jpg");
  background-position: center;
  
  min-height: 200px;
  
  margin-top: 50px;
  
  color: white;
}

/******************************************************************************
 * ID of the text that holds the company name
 ******************************************************************************/
header h2 {
  color: #E60021;

  font-size: 2em;
  font-weight: bold;

  /* For IE 9 */
  filter: progid:DXImageTransform.Microsoft.Shadow(color=white,direction=225,strength=3);

  text-shadow: -1px 1px white;

  margin-top: 35px;
}

/******************************************************************************
 * Define screen size for different medias
 ******************************************************************************/
@media screen and (max-width: 480px) {
	
	header h3 {
	   font-size: 1.5em;
	}
	
	header h2 {
	 font-size: 1.6em;
	}
}

@media screen and (max-width: 768px) {
  ul.no-margin-sm {
     margin: 0;
  }
}

/******************************************************************************
 * Bold style for company name in text
 ******************************************************************************/
.cie {
  font-weight: bold;
}

/******************************************************************************
 * Configure sticky menu bar
 ******************************************************************************/
nav {
	z-index: 1;
}

.navbar {
	margin-bottom: 0px;
	border-radius: 0px;
}

.navbar-brand {
	padding: 5px 30px 5px 5px;
}

.navbar-right {
	margin-right: 0;
}

/******************************************************************************
 * Jumbotron extra parameters
 ******************************************************************************/
.jumbotron {
	padding-left: 1em;
	padding-right: 1em;
}

/*******************************************************************************
 * Footer Default Style
 ******************************************************************************/
footer
{
  text-align: center;
  font-size: small;
  color: white;
  background-color: black;
}

/*******************************************************************************
 * Color classes
 ******************************************************************************/
.bg-darksection {
	background-color: lightgray;
}

.bg-integration {
	background-color: #af1805;
}

.txt-white {
	color: white;
}

/*******************************************************************************
 * Style for description text
 ******************************************************************************/
.big-description {
	font-size: 1.3em;
}

/*******************************************************************************
 * Section configuration
 ******************************************************************************/
.section-box {
	padding-top: 2em;
	padding-bottom: 2em;
}

#mission {
	color: yellow;
	background-image: url("../images/monitor.jpg");
	background-size: cover;
	background-position: -80%;
}


/*******************************************************************************
 * Address table style
 ******************************************************************************/
table.address th {
	vertical-align: top;
	padding-right: 1em;
}

table {
	margin-top: 2em;
}

/*******************************************************************************
 * Style for JavaScript driven links
 ******************************************************************************/
.jslink {
	cursor: pointer;
}

/*******************************************************************************
 * Image for representing cloud computing in the service section.
 ******************************************************************************/
 
img#cloud {
	width: 60%;
}

/*******************************************************************************
 * Rotation effect
 ******************************************************************************/
@-webkit-keyframes rotate360 {
  from {
    -webkit-transform: rotate(0deg);
    width: 5%;
  }
  to {-webkit-transform: rotate(360deg);}
}

@keyframes rotate360 {
  from {
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    width: 5%;
  }
  to {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg);
  }
}

.eff-rot360 {
  animation: rotate360 1.5s;
}

/*******************************************************************************
 * Growing text
 ******************************************************************************/
@-webkit-keyframes growingText {
  from {font-size: 5%;}
  to {font-size: 100%;}
} 

@keyframes growingText {
	from {font-size: 5%;}
	to {}
} 

.growing-text {
	animation: growingText 1s linear;
}

@-webkit-keyframes growingText2 {
  0% {font-size: 0%;}
  50% {font-size: 5%;}
  100% {}
} 

@keyframes growingText2 {
  0% {font-size: 0%;}
  50% {font-size: 5%;}
  100% {}
} 

.growing-text2 {
  animation: growingText2 1s linear;
}