@import url("../fonts/flaticon.css");


#banner-box{

	margin-top: 4em;
}

#drone-container{

	position: fixed;
	left: -500px;
	top: 5em;
	z-index: 99999;
}

#drone-gif{

	width: 270px;
	height: 111px;
}

/* Desktop */
/*
	@media screen and (min-width: 737px) {
	}
*/


/* Tablet */

	@media screen and (min-width: 737px) and (max-width: 1200px) {

		#drone-container{
			top: -2em;
		}

		#drone-gif{

		    width: 250px;
		    height: 102px;
		}
	}


/* Mobile */

	@media screen and (max-width: 736px) {

		#drone-container{
	left: -760px;
			
			top: -1em;
		}

		#drone-gif{

		    width: 230px;
		    height: 94px;
		}

	}


.drone-animation{

  animation: droneFlyIn, droneHover, droneFlyOut;
  animation-duration: 4000ms, 2000ms, 3000ms;
  animation-delay: 4000ms, 8000ms, 12000ms; /* first delay is so laptops can load, second is = to 1st delay + 1st duartion */
  animation-timing-function: linear, ease-in-out, linear;
  animation-iteration-count: 1, 2, 1;
  transform-origin: 50% 50%;

/*
@-moz-
@-webkit-
@-o-
@-ms-
*/

  @-moz-animation: droneFlyIn, droneHover, droneFlyOut;
  @-moz-animation-duration: 4000ms, 2000ms, 3000ms;
  @-moz-animation-delay: 4000ms, 8000ms, 12000ms; /* first delay is so laptops can load, second is = to 1st delay + 1st duartion */
  @-moz-animation-timing-function: linear, ease-in-out, linear;
  @-moz-animation-iteration-count: 1, 2, 1;
  @-moz-transform-origin: 50% 50%;

  @-webkit-animation: droneFlyIn, droneHover, droneFlyOut;
  @-webkit-animation-duration: 4000ms, 2000ms, 3000ms;
  @-webkit-animation-delay: 4000ms, 8000ms, 12000ms; /* first delay is so laptops can load, second is = to 1st delay + 1st duartion */
  @-webkit-animation-timing-function: linear, ease-in-out, linear;
  @-webkit-animation-iteration-count: 1, 2, 1;
  @-webkit-transform-origin: 50% 50%;

  @-o-animation: droneFlyIn, droneHover, droneFlyOut;
  @-o-animation-duration: 4000ms, 2000ms, 3000ms;
  @-o-animation-delay: 4000ms, 8000ms, 12000ms; /* first delay is so laptops can load, second is = to 1st delay + 1st duartion */
  @-o-animation-timing-function: linear, ease-in-out, linear;
  @-o-animation-iteration-count: 1, 2, 1;
  @-o-transform-origin: 50% 50%;

  @-ms-animation: droneFlyIn, droneHover, droneFlyOut;
  @-ms-animation-duration: 4000ms, 2000ms, 3000ms;
  @-ms-animation-delay: 4000ms, 8000ms, 12000ms; /* first delay is so laptops can load, second is = to 1st delay + 1st duartion */
  @-ms-animation-timing-function: linear, ease-in-out, linear;
  @-ms-animation-iteration-count: 1, 2, 1;
  @-ms-transform-origin: 50% 50%;



}

@keyframes droneFlyIn{
  0% {
    transform:  translate(0px,0px)  rotate(5deg) ;
  }
  39% {
    transform:  translate(761px,0px)  rotate(4deg) ;
  }
  54% {
    transform:  translate(870px,0px)  rotate(-3deg) ;
  }
  61% {
    transform:  translate(875px,0px)  rotate(-2deg) ;
  }
  66% {
    transform:  translate(874px,0px)  rotate(-1deg) ;
  }
  76% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  88% {
    transform:  translate(874px,0px)  rotate(2deg) ;
  }
  100% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
}

@keyframes droneHover{
  0% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  24% {
    transform:  translate(875px,0px)  rotate(-.3deg) ;
  }
  39% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  62% {
    transform:  translate(873px,0px)  rotate(.4deg) ;
  }
  77% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  89% {
    transform:  translate(874px,0px)  rotate(.2deg) ;
  }
  100% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
}

@keyframes droneFlyOut{
  0% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  5% {
    transform:  translate(1000px,0px)  rotate(6deg) ;
  }
  30% {
    transform:  translate(1550px,-100px)  rotate(5deg) ;
  }
  100% {
    transform:  translate(3000px,-400px)  rotate(4deg) ;
  }
}


/*
@-moz-
@-webkit-
@-o-
@-ms-

*/


@-moz-keyframes droneFlyIn{
  0% {
    transform:  translate(0px,0px)  rotate(5deg) ;
  }
  39% {
    transform:  translate(761px,0px)  rotate(4deg) ;
  }
  54% {
    transform:  translate(870px,0px)  rotate(-3deg) ;
  }
  61% {
    transform:  translate(875px,0px)  rotate(-2deg) ;
  }
  66% {
    transform:  translate(874px,0px)  rotate(-1deg) ;
  }
  76% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  88% {
    transform:  translate(874px,0px)  rotate(2deg) ;
  }
  100% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
}

@-moz-keyframes droneHover{
  0% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  24% {
    transform:  translate(875px,0px)  rotate(-.3deg) ;
  }
  39% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  62% {
    transform:  translate(873px,0px)  rotate(.4deg) ;
  }
  77% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  89% {
    transform:  translate(874px,0px)  rotate(.2deg) ;
  }
  100% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
}

@-moz-keyframes droneFlyOut{
  0% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  5% {
    transform:  translate(1000px,0px)  rotate(6deg) ;
  }
  30% {
    transform:  translate(1550px,-100px)  rotate(5deg) ;
  }
  100% {
    transform:  translate(3000px,-400px)  rotate(4deg) ;
  }
}




@-webkit-keyframes droneFlyIn{
  0% {
    transform:  translate(0px,0px)  rotate(5deg) ;
  }
  39% {
    transform:  translate(761px,0px)  rotate(4deg) ;
  }
  54% {
    transform:  translate(870px,0px)  rotate(-3deg) ;
  }
  61% {
    transform:  translate(875px,0px)  rotate(-2deg) ;
  }
  66% {
    transform:  translate(874px,0px)  rotate(-1deg) ;
  }
  76% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  88% {
    transform:  translate(874px,0px)  rotate(2deg) ;
  }
  100% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
}

@-webkit-keyframes droneHover{
  0% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  24% {
    transform:  translate(875px,0px)  rotate(-.3deg) ;
  }
  39% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  62% {
    transform:  translate(873px,0px)  rotate(.4deg) ;
  }
  77% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  89% {
    transform:  translate(874px,0px)  rotate(.2deg) ;
  }
  100% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
}

@-webkit-keyframes droneFlyOut{
  0% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  5% {
    transform:  translate(1000px,0px)  rotate(6deg) ;
  }
  30% {
    transform:  translate(1550px,-100px)  rotate(5deg) ;
  }
  100% {
    transform:  translate(3000px,-400px)  rotate(4deg) ;
  }
}





@-o-keyframes droneFlyIn{
  0% {
    transform:  translate(0px,0px)  rotate(5deg) ;
  }
  39% {
    transform:  translate(761px,0px)  rotate(4deg) ;
  }
  54% {
    transform:  translate(870px,0px)  rotate(-3deg) ;
  }
  61% {
    transform:  translate(875px,0px)  rotate(-2deg) ;
  }
  66% {
    transform:  translate(874px,0px)  rotate(-1deg) ;
  }
  76% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  88% {
    transform:  translate(874px,0px)  rotate(2deg) ;
  }
  100% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
}

@-o-keyframes droneHover{
  0% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  24% {
    transform:  translate(875px,0px)  rotate(-.3deg) ;
  }
  39% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  62% {
    transform:  translate(873px,0px)  rotate(.4deg) ;
  }
  77% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  89% {
    transform:  translate(874px,0px)  rotate(.2deg) ;
  }
  100% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
}

@-o-keyframes droneFlyOut{
  0% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  5% {
    transform:  translate(1000px,0px)  rotate(6deg) ;
  }
  30% {
    transform:  translate(1550px,-100px)  rotate(5deg) ;
  }
  100% {
    transform:  translate(3000px,-400px)  rotate(4deg) ;
  }
}





@-ms-keyframes droneFlyIn{
  0% {
    transform:  translate(0px,0px)  rotate(5deg) ;
  }
  39% {
    transform:  translate(761px,0px)  rotate(4deg) ;
  }
  54% {
    transform:  translate(870px,0px)  rotate(-3deg) ;
  }
  61% {
    transform:  translate(875px,0px)  rotate(-2deg) ;
  }
  66% {
    transform:  translate(874px,0px)  rotate(-1deg) ;
  }
  76% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  88% {
    transform:  translate(874px,0px)  rotate(2deg) ;
  }
  100% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
}

@-ms-keyframes droneHover{
  0% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  24% {
    transform:  translate(875px,0px)  rotate(-.3deg) ;
  }
  39% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  62% {
    transform:  translate(873px,0px)  rotate(.4deg) ;
  }
  77% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  89% {
    transform:  translate(874px,0px)  rotate(.2deg) ;
  }
  100% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
}

@-ms-keyframes droneFlyOut{
  0% {
    transform:  translate(874px,0px)  rotate(0deg) ;
  }
  5% {
    transform:  translate(1000px,0px)  rotate(6deg) ;
  }
  30% {
    transform:  translate(1550px,-100px)  rotate(5deg) ;
  }
  100% {
    transform:  translate(3000px,-400px)  rotate(4deg) ;
  }
}




/*
	end drone GIF
*/



/*Desktop*/
@media screen and (min-width: 737px) {
    #logo a{
        width:21em;
    }
    #logo h1:after{
        border-left: solid 10.5em transparent;
	border-right: solid 10.5em transparent;
    }
}

#banner-wrapper, #main-wrapper {
    overflow: initial;
}
header.major h2::before{
    position:relative;
    top:-10px;
    color:#A5A0A0;
}
#slider:before {

	opacity: 0.5;
}

.slide object {
  width: 1440px;
  height: 800px;
}


.slide object{
  -ms-zoom: 0.28;
  -moz-transform: scale(0.28);
  -moz-transform-origin: 0 0;
  -o-transform: scale(0.28);
  -o-transform-origin: 0 0;
  -webkit-transform: scale(0.28);
  -webkit-transform-origin: 0 0;
}

@media screen and (min-width: 737px) and (max-width: 1200px) {
    .homepage{
        min-width: 100%;
    }
    .container {
        width:100%;
        width: calc(100% - 1em);
    }
  #banner-box #box2{
    width: 400px;
  }
  #banner-box #box1{
    height:150px;
  }
  .static-slider{
    height:150px;
    background-size: contain;
  }
  #box1 .static-slider{
    left: -2em;
  }
  #box3 .static-slider{
    left: 2em;
  }
  #box1 .static-slider .viewer{
    left: 80px;
  }
  #box3 .static-slider .viewer{
    left: 7px;
  }
  .static-slider .viewer .reel{
    height: 120px;
  }
    #slider{
        width: 400px;
        height: 210px;
    }
  #slider .viewer{
    width: 290px;
  }
  #slider object{
    width: 1050px;
    height: 590px;
  }
    .button.big{
        font-size: 1.25em;
    }
}
@media screen and (max-width: 737px){
    .slide object{
      -ms-zoom: 0.16;
      -moz-transform: scale(0.16);
      -moz-transform-origin: 0 0;
      -o-transform: scale(0.16);
      -o-transform-origin: 0 0;
      -webkit-transform: scale(0.16);
      -webkit-transform-origin: 0 0;
    }
}

@media screen and (min-width: 737px) and (max-width: 980px) {
    #logo a{
        width:16.5em;
    }
        #logo h1:after{
            border-left: solid 8.3em transparent;
            border-right: solid 8.3em transparent;
            bottom: -1.95em;
        }
        #logo a span{
            font-size: 1.5em;
        }
    #nav li{
        margin: 0 0 0 0.8em;
    }
}
/*Footer*/
#icons{
    text-align:center;
}
#icons li{
    display:block;
}
#icons img{
    max-width:70px;
    padding:5px;
}
ul.style3 li a:after {
    top:32px;
    bottom:auto;
}
@media screen and (min-width: 737px) {
    #copyright{
        text-align:right;
    }
    #copyright span {
	   margin: 3em 10em 0 0;

    }
}
#sidebar h4{
    font-size: 1.4em;
}
.box-style h3{
    line-height:1.5em;
}

/*    Contact us   */
#details{
    max-width: 100%;
}
#service-form p{
    margin-top: 2em;
    margin-bottom:0.5em;
}
.clear::after {
    content: '';
    display: block;
    clear: both;
    height: 1px;
}
/* Form */

	form {
		margin: 0 0 1.75em 0;
		margin-top: 0;
	}

		form:after {
			content: '';
			display: block;
			clear: both;
			height: 1px;
		}

		form .field {
			position: relative;
			float: left;
			margin: 0 0 1.375em 0;
			vertical-align: top;
			width: 100%;
		}

		form .half {
			width: calc(50% + 0.6875em) !important;
			padding-left: 1.375em;
		}

		form .half.first {
			width: calc(50% - 0.6875em) !important;
			padding-left: 0;
		}

		form :last-child {
			margin-bottom: 0;
		}

		form .half:nth-last-child(2) {
			margin-bottom: 0;
		}

		form .actions {
			position: relative;
			clear: both;
			margin-bottom: 0 !important;
		}

		@media screen and (max-width: 980px) {

			form .half {
				width: 100% !important;
				padding-left: 0;
			}

			form .half.first {
				width: 100% !important;
				padding-left: 0;
			}

			form .half:nth-last-child(2) {
				margin: 0 0 1.1375em 0;
			}

		}

	label {
		display: block;
		font-size: 0.9em;
		font-weight: 900;
		margin: .5em 0 .75em 0;
	}

	input[type="text"],
	input[type="password"],
	input[type="email"],
	select,
	textarea {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		border-radius: 5px;
		border: none;
		border: solid 1px;
		color: inherit;
		display: block;
		outline: 0;
		padding: 0 1em;
		text-decoration: none;
		width: 100%;
	}

		input[type="text"]:invalid,
		input[type="password"]:invalid,
		input[type="email"]:invalid,
		select:invalid,
		textarea:invalid {
			box-shadow: none;
		}


.required {
    position: relative;
}

.required::after {
    content: '*';
    position: absolute;
    margin-top: 1.25em;
    right: 0.2em;
    bottom: 0em;
    font-size: 1.8em;
    color: #64a2d0;
}

	.select-wrapper {
		text-decoration: none;
		display: block;
		position: relative;
	}

		.select-wrapper:before {
			-moz-osx-font-smoothing: grayscale;
			-webkit-font-smoothing: antialiased;
			font-family: FontAwesome;
			font-style: normal;
			font-weight: normal;
			text-transform: none !important;
		}

		.select-wrapper:before {
			content: '\f078';
			display: block;
			height: 2.75em;
			line-height: 2.75em;
			pointer-events: none;
			position: absolute;
			right: 0;
			text-align: center;
			top: 0;
			width: 2.75em;
		}

		.select-wrapper select::-ms-expand {
			display: none;
		}

	input[type="text"],
	input[type="password"],
	input[type="email"],
	select {
		height: 2.75em;
	}

	textarea {
		padding: 0.75em 1em;
	}

	input[type="checkbox"],
	input[type="radio"] {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		display: block;
		float: left;
		margin-right: -2em;
		opacity: 0;
		width: 1em;
		z-index: -1;
	}

		input[type="checkbox"] + label,
		input[type="radio"] + label {
			text-decoration: none;
			cursor: pointer;
			display: inline-block;
			font-size: 1em;
			font-weight: 300;
			padding-left: 2.4em;
			padding-right: 0.75em;
			position: relative;
			padding-top: 0.2em;
		}

			input[type="checkbox"] + label:before,
			input[type="radio"] + label:before {
				-moz-osx-font-smoothing: grayscale;
				-webkit-font-smoothing: antialiased;
				font-family: FontAwesome;
				font-style: normal;
				font-weight: normal;
				text-transform: none !important;
			}

			input[type="checkbox"] + label:before,
			input[type="radio"] + label:before {
				border: solid 1px;
				content: '';
				display: inline-block;
				height: 1.65em;
				left: 0;
				line-height: 1.58125em;
				position: absolute;
				text-align: center;
				top: 0;
				width: 1.65em;
			}

		input[type="checkbox"]:checked + label:before,
		input[type="radio"]:checked + label:before {
			content: '\f00c';
		}

	input[type="radio"] + label:before {
		border-radius: 100%;
	}

	::-webkit-input-placeholder {
		opacity: 1.0;
	}

	:-moz-placeholder {
		opacity: 1.0;
	}

	::-moz-placeholder {
		opacity: 1.0;
	}

	:-ms-input-placeholder {
		opacity: 1.0;
	}

	.formerize-placeholder {
		opacity: 1.0;
	}

	label {
		color: #404040;
	}

	input[type="text"],
	input[type="password"],
	input[type="email"],
	select,
	textarea {
		background: rgba(144, 144, 144, 0.075);
		border-color: #dbdbdb;
                font-family: 'Source Sans Pro', sans-serif;
                font-size: 11pt;
	}

		input[type="text"]:focus,
		input[type="password"]:focus,
		input[type="email"]:focus,
		select:focus,
		textarea:focus {
			border-color: #53bed5;
			box-shadow: 0 0 0 1px #53bed5;
		}

	.select-wrapper:before {
		color: #dbdbdb;
	}

	input[type="checkbox"] + label,
	input[type="radio"] + label {
		color: #404040;
padding-bottom: .5em;
	}

		input[type="checkbox"] + label:before,
		input[type="radio"] + label:before {
			background: rgba(144, 144, 144, 0.075);
			border-color: #dbdbdb;
		}

	input[type="checkbox"]:checked + label:before,
	input[type="radio"]:checked + label:before {
		background-color: #404040;
		color: #ffffff;
		border-color: #404040;
	}

	input[type="checkbox"]:focus + label:before,
	input[type="radio"]:focus + label:before {
		border-color: #53bed5;
		box-shadow: 0 0 0 1px #53bed5;
	}

	::-webkit-input-placeholder {
		color: #aaaaaa !important;
	}

	:-moz-placeholder {
		color: #aaaaaa !important;
	}

	::-moz-placeholder {
		color: #aaaaaa !important;
	}

	:-ms-input-placeholder {
		color: #aaaaaa !important;
	}

	.formerize-placeholder {
		color: #aaaaaa !important;
	}
        form .button {
		margin-right: 1em;
	}
        
        /* Buttons */

	input.button {
		-moz-transition: background-color 0.25s ease-in-out;
		-webkit-transition: background-color 0.25s ease-in-out;
		-ms-transition: background-color 0.25s ease-in-out;
		transition: background-color 0.25s ease-in-out;
		position: relative;
		display: inline-block;
		margin-top: 1em;
		padding: 0em 1em 0 1em;
		background: #6295b6;
		color: #fff !important;
		border-radius: 4px;
		border: 0;
		font-size: 1em;
		border-radius: 5px;
		line-height: 2.3em;
		text-decoration: none;
		font-weight: 700;
		text-align: center;
		cursor: pointer;
	}

		input.button.icon:before {
			display: inline-block;
			position: relative;
			top: -0.15em;
			padding-right: 0.50em;
			font-size: 0.85em;
		}

		input.button:hover {
			background: #7da7c2;
		}

		input.button:active {
			background: #2a61c8;
		}

		input.button.alt {
			background: #292C31;
		}

			input.button.alt:hover {
				background: #393C41;
			}

			input.button.alt:active {
				background: #191C21;
			}

		input.button.big {
			padding: 0.50em 1.5em;
		}
/*    Rates      */
ul.default{
	list-style:  initial;
	padding-left: 20px;
        margin-bottom: 5px;
}
ul.default li{
	margin-top:5px;
}
#packages .hidden{
    display: none;
}
#packages div.inline{
    line-height: 1.75em;
    margin-bottom: 1.75em;
}