﻿

/*No Scroll Bar*/
::-webkit-scrollbar {
     display: none;
}

.fontLight{
	/*font-family: 'Roboto Condensed', sans-serif;*/
	font-family: 'Open Sans', sans-serif;

	font-weight:100;
}

.fontRegular{
	/*font-family: 'Roboto Condensed', sans-serif;*/
	font-family: 'Open Sans', sans-serif;

	font-weight: 300;
}

.txtJustify{	
	text-align:justify !important;
}
.txtOrange{
	color:#fc9400;
}
.txtGrey{
	color:#494949;
}
.bgOrange{
	background:#fc9400;	
}
.bgGrey{
	background:#494949;
}
.bgLightGrey{
	background:#a4a4a4;
}
.bgBlack{
	background:#000;
}

/*******/

.oneEM{
	font-size:1em;
	line-height:normal;
}
.oneHalfEM{
	font-size:1.5em;
	line-height:1.3em;
}


.twoEM{
	font-size:2em;
	line-height:normal;
}
.twoHalfEM{
	font-size:2.5em;
	line-height:normal;
}

.threeEM{
	font-size:3em;
	line-height:normal;
}

.squareBG{
	background-image:url('../umb-images/download.png');
	background-repeat:repeat;
	background-position:center center;
	width:auto;
	height:auto;
}
.squareBGwhite{
	background-image:url('../umb-images/cross-white.png');
	background-repeat:repeat;
	background-position:center center;
	width:auto;
	height:auto;
}


.squareBG2{
	background-image:url('../umb-images/download2.png');
	background-repeat:repeat;
	width:auto;
	height:auto;
}

.imgBox {
	width:100%;
	height:auto;
	display:block;
	margin:0;
	padding:0;
	box-shadow: 0 0.25rem 1.5rem rgba(73,73,73,0.35);
}


/*******/

.mainBannerWeb{
	width:100%;
	height:100vh;
	min-height:100%;
	display:block;
	overflow:hidden;
	margin:0;
	padding:0;
	position:relative;
	
}

.webBanner{
	width:100%;
	height:100%;
	background-image:url('../umb-images/main-banner-web.png');
	background-position:bottom center;
	background-size: cover;
	background-repeat:no-repeat;
	position:relative;
		
	animation: breathe 35s infinite;
}

.mainBannerMob{
	width:100%;
	height:85vh;
	min-height:100%;
	display:block;
	background:black;
	overflow:hidden;
	margin:0;
	padding:0;
}

.mobBanner{
	width:100%;
	height:100%;
	background-image:url('../umb-images/main-banner-mob.png');
	background-position:center center;
	background-size: cover;
	background-repeat:no-repeat;
	position:relative;
		
	animation: breathe 35s infinite;
}


/********/
@-webkit-keyframes breathe {
  0% {    
    transform: scale(1.0);
    -ms-transform: scale(1.0);/* IE 9 */
    -webkit-transform: scale(1.0);/* Safari and Chrome */
    -o-transform: scale(1.0);/* Opera */
    -moz-transform: scale(1.0);/* Firefox */
  }
  50% {
    transform: scale(1.5);
	-ms-transform: scale(1.5);/* IE 9 */
    -webkit-transform: scale(1.5);/* Safari and Chrome */
    -o-transform: scale(1.5);/* Opera */
    -moz-transform: scale(1.5);/* Firefox */
  }
  100% {
    transform: scale(1.0);
    -ms-transform: scale(1.0);/* IE 9 */
    -webkit-transform: scale(1.0);/* Safari and Chrome */
    -o-transform: scale(1.0);/* Opera */
    -moz-transform: scale(1.0);/* Firefox */
  }
}

/*******/

.zoom{
	animation: zoomIn 25s ease-in;
}


@-webkit-keyframes zoomIn {
  0% {    
    transform: scale(1.0);
    -ms-transform: scale(1.0);/* IE 9 */
    -webkit-transform: scale(1.0);/* Safari and Chrome */
    -o-transform: scale(1.0);/* Opera */
    -moz-transform: scale(1.0);/* Firefox */
  }
  100% {
    transform: scale(1.5);
	-ms-transform: scale(1.5);/* IE 9 */
    -webkit-transform: scale(1.5);/* Safari and Chrome */
    -o-transform: scale(1.5);/* Opera */
    -moz-transform: scale(1.5);/* Firefox */
  }  
}

/*******/

.captionWeb{
	position: absolute;
	top:80%;
	width:100%;
	z-index:2;
}
.captionMob{
	position: absolute;
	top:80%;
	width:100%;
	z-index:2;
}

/*******/
.down-arrow{
	width:100%;
	position: absolute;
	height:auto;
	bottom:24px;
	z-index:25;
}

/* [BOUNCE WITH "GRAVITY"] */
@keyframes gbounce { 
  0% { transform: translateY(0); }
  30% { transform: translateY(-15px); }
  50% { transform: translateY(0); }
  100% { transform: translateY(0); }
}
.gbounce {
  animation: gbounce 2s;
  animation-timing-function: ease;
  animation-iteration-count: infinite;
}

/*******/

.font14{
	font-size:14px !important;
	line-height:normal;
}
.font16{
	font-size:16px !important;
	line-height:normal;
}
.font18{
	font-size:18px !important;
	line-height:normal;
}
.font20{
	font-size:20px !important;
	line-height:normal;
}



/*BOX SHADOWS*/

.card-shadow-1 {
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  transition: all 0.3s cubic-bezier(.25,.8,.25,1);
}
.card-no-shadow-1 {
  box-shadow: none;
  transition: all 0.3s cubic-bezier(.25,.8,.25,1);
}

.card-shadow-1:hover, .card-no-shadow-1:hover {
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}

.card-shadow-2 {
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}

.card-shadow-3 {
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}

.card-shadow-4 {
  box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}

.card-shadow-5 {
  box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
}

.gradient{
	background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(209,209,209,1) 100%);
}

.txtLinkGrey,.txtLinkGrey:active{
	color:#494949;
	text-decoration:none;
	cursor:default;
}
.txtLinkGrey:hover,
.txtWhiteLink:hover{
	color:#fc9400;
	text-decoration:none;
}

.txtLinkWhite,.txtWhiteLink{
	color:#fff;
	text-decoration:none;
}
.txtLinkWhite:hover{
	color:#fc9400;
	text-decoration: none;
	cursor:default;
}

.txtLinkWork{
	color:#494949;
	text-decoration:none;
}

.txtLinkWork:hover{
	color:#494949;
	text-decoration: none;
}

.serviceBox{
	width:100%;
	height: auto;
	display:block;
	color:white;
	background:#fc9400;
}
.serviceBoxWhite{
	width:100%;
	height: auto;
	display:block;
	color:#fc9400;
	background:white;
}

.serviceBoxBlack{
	width:100%;
	height: auto;
	display:block;
	color:#fc9400;
	background:black;
}

.serviceBox:hover{
	color:#fc9400 !important;
	background:white !important;
	cursor:pointer;
}
.serviceBoxWhite:hover{
	color:white  !important;
	background:#fc9400 !important;
	cursor:pointer;
}
.serviceBoxBlack:hover{
	color:black !important;
	background:#fc9400 !important;
	cursor:pointer;
}

/****/

.blinkOrange{
    animation:blinkOrangeTxt 1.2s infinite;
}
@keyframes blinkOrangeTxt {
    0%{color: #fc9400;}
    25%{color: #fc9400;}
    50%{color: transparent;}
    75%{color:transparent;}
    100%{color: #fc9400;}
}

.blinkWhite{
    animation:blinkWhiteTxt 1.2s infinite;
}
@keyframes blinkWhiteTxt {
    0%{color: #fff;}
    25%{color: #fff;}
    50%{color: transparent;}
    75%{color:transparent;}
    100%{color: #fff;}
}

/*******/

.divider{
	width:100%;
	height:1px;
	background:white;
	display:block;
	margin:0;
	padding:0;
}

