@charset "utf-8";
/*!
 * Copyright (C) 2016 Media.net Advertising FZ-LLC
 * All Rights Reserved
 */
/* CSS Document */
/*==================================Index=======================================*/
/*
1. Global Settings
2. Common CSS
3. Mobile navigation tab
4. Firstblock 
5. contentBlock/ThirdBlock
6. AboutSkenzo
7. ApplyNow
8. Footer
9. 1st slider animation
10. 2nd slider animation
11. bxSlider slider css
12. Privacy Policy
13. Responsive
    -1st slider animation mobile
    -2nd slider animation mobile
14. css3 effects
15. Null Images
*/

/*=================================================================================================================================
                                            	1. Global Settings
=================================================================================================================================*/
@import url('https://fonts.googleapis.com/css?family=Lato:400,700|Open+Sans:300,400,400i|Raleway:100,400,500,600&display=swap');
.sprite {background: url(../images/sprite.png) left top no-repeat; -webkit-font-smoothing: subpixel-antialiased}
.sprite {background: url(../images/sprite.png) left top no-repeat;}
.sprite2 {background: url(../images/sprite2.png) left top no-repeat; width: 605px; height: 600px}
.tSprite {background: url(../images/tSprite.png) left top no-repeat}
*{margin:0; padding:0; -webkit-font-smoothing: subpixel-antialiased}
a {text-decoration:none; outline:none}
a img {border:none}
.clear {clear:both; overflow:hidden; line-height:0; font-size:0; height:0}
.clearfix:after{visibility:hidden;display:block;font-size:0;content:" ";clear: both;height:0}
* html .clearfix{zoom:1}
*:first-child+html /**/ix{zoom:1}
ul, li {list-style:none}
.flt {float:left}
.frt {float:right}
.centeralign {margin:0 auto}
header,hgroup,nav,footer,section,aside,article{display:block}
:focus{outline:0; border:0}
input[type=submit]:focus, input[type=submit]:active{outline:0}
input {border:none; outline:none}
.block{display:block !important}
.none {display: none !important}
.stopScroll{overflow:hidden}
::-moz-selection{color:#fff;text-shadow:none;background:#915e8a}
::selection{color:#fff;text-shadow:none;background:#915e8a}
.posReln {position: relative}

/*@import url('http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,300');
@import url('http://fonts.googleapis.com/css?family=Lato:400,700');
@import url('http://fonts.googleapis.com/css?family=Raleway:400,500,600,100');*/
/*@import  "url(http://fonts.googleapis.com/css?family=Lato:400,700)";*/
/*=================================================================================================================================
 														2. Common CSS
=================================================================================================================================*/
body {font-family: 'Raleway', sans-serif; background:#fff; color:#7696a8; font-size:18px}


header {width:100%; top:0; left:0; z-index:100; transition:all 250ms linear, height 150ms linear; position: fixed}

.headerIn {padding:48px 0; transition:all 150ms linear; max-width:1210px; margin:0 auto}
.headerIn .logo {float:left}
.headerIn h1 a { position:relative; display:block;	float:left; height: 36px}
.headerIn h1 img {width:196px; transition:all 150ms linear}
.headerIn nav {float:right}
.headerIn nav ul {float:right}
.headerIn nav li {position:relative; float:left; font-family:arial; padding:11px 0 0 40px}
.headerIn nav li a {color:#fff; font-family: 'Open Sans', sans-serif; font-size: 14px; transition:font-size 250ms ease,padding 250ms ease, line-height 250ms ease,margin 250ms ease,
	background-color 500ms ease, border-color 250ms ease,color 250ms ease}
header .sLogo2 {display: none}
.headerfixed .sLogo2 {display: block}
.headerfixed .sLogo1 {display: none}
.headerfixed {position:fixed; top: 0; left:0; width: 100%; z-index: 998; _margin-left:0; animation-duration: 1s; animation-fill-mode: both;
    animation-name: growTop; background:rgba(255, 255, 255, 0.8); background:#ffffff\9; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); position: fixed;
    z-index: 9999; box-shadow: 0 2px 3px #ccc}
#fPages .headerfixed {background:#fff !important} 
.headerfixed .headerIn .logo {padding-bottom: 15px}
.headerIn nav li a:hover {color: #f0612d }
.headerfixed .headerIn {padding: 15px 0 0 !important}
.headerfixed.cust-index .headerIn{padding: 53px 0 0 !important}
.headerfixed .headerIn nav li {padding: 5px 0 0 40px}
.headerfixed .headerIn nav li a {color:#000; transition:font-size 250ms ease,padding 250ms ease, line-height 250ms ease,margin 250ms ease,
	background-color 500ms ease, border-color 250ms ease,color 250ms ease}
.headerfixed .headerIn nav li a:hover {color: #e23f04 }
.headerIn nav li .logIco {background-position: 0 -3675px; padding-left:28px }
.headerIn nav li .sigIco {background-position: 0 -3792px; padding-left:22px }
.headerfixed .headerIn nav li .logIco {background-position: 0 -3909px; padding-left:28px }
.headerfixed .headerIn nav li .sigIco {background-position: 0 -4025px; padding-left:22px }
.mBtn {display:none}
.headerIn {position: relative}
.mBtn {position: absolute; right: 0; margin: 0}

#nav-toggle {display: none; height: 30px}
.mobNav{background:#fff; position: fixed; width:230px; right: -105%; padding: 64px 0 0 ;  z-index: 2; top:0;
  height: 100%; box-shadow:-3px 0 4px -4px #000; color: #e23f04; transition: width 1s linear, height 1s linear; z-index: 1  }
.mobNav a {display: block; color: #000; text-align: right; padding: 15px 25px 15px 0; 
  border-top: 1px solid #cdced0; transition-duration: 1s; transition-timing-function: linear; font-family: 'Open Sans', sans-serif; font-size: 14px; transition:font-size 250ms ease,padding 250ms ease, line-height 250ms ease,margin 250ms ease,
  background-color 500ms ease, border-color 250ms ease,color 250ms ease}
.mobNav a:hover {color: #e23f04}
 #scrollUp { background-image: url(../images/scroll.png); bottom: 20px;right: 20px; width: 57px; height: 54px; z-index: 999}

#menu_overlay {background: #000 none repeat scroll 0 0;  height: 100%; left: 0; opacity: 0.5; position: fixed; top: 0; width: 100%; 
  z-index: 99;}
.mobNav {display: none;}
.ovrblockWrap{display:none}

.ovrblock{display:none}
.ovrnone{display:none}
 /*=================================================================================================================================
                            2.1.Custom Header Banner
=================================================================================================================================*/
.cust-index{z-index:1000}
#main-ben{border-bottom-left-radius:6px;border-bottom-right-radius:6px;background-color:#e23f04;position:absolute;top:0;width:675px;right:0;font-size:17px;line-height:34px;color:#ffffff;height:40px;display:block;text-align:center}
#main-ben svg{position:absolute;bottom:0;left:-20px}
#main-ben .ben-txt br{display:none}
#main-ben .ben-txt span{font-size:28px;font-weight:600}
 /*=================================================================================================================================
                            3.Mobile navigation tab
=================================================================================================================================*/
.headerIn #nav-toggle { cursor: pointer; z-index: 2; position: absolute; right: 12px; top: 38px; height:14px; width: 30px}
.headerfixed .headerIn #nav-toggle {top: 31px}
#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {cursor: pointer; border-radius: 1px; height: 5px; 
  width: 30px;  background: #e23f04 ;  position: absolute;  display: block;  content: ''}
#nav-toggle span:before {top: -9px}
#nav-toggle span:after {bottom: -9px}
#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after {transition: all 500ms ease-in-out}
#nav-toggle.active span {background-color: transparent}
#nav-toggle.active span:before, #nav-toggle.active span:after {top: 0}
#nav-toggle.active span:before {transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); 
-o-transform: rotate(45deg); -ms-transform: rotate(45deg)}
#nav-toggle.active span:after {transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg);
-o-transform: rotate(-45deg); -ms-transform: rotate(-45deg)}
/*=================================================================================================================================
 														4. Firstblock  
=================================================================================================================================*/
.firstBlock {background:#fff url(../images/bg1.jpg) center top no-repeat; background-size: cover; height: 927px; width: 100%}
.firstBlockInn {width: 1210px; margin: 0 auto; padding-top:20%; text-align: center}
.firstBlockInn h2 {font-family: 'Raleway', sans-serif; font-size:50px; font-weight: 500; text-transform: uppercase; color: #fff;
 padding-bottom: 7px}
.firstBlockInn p {font-size:30px; font-family: 'Open Sans', sans-serif; color: #bddff1; padding-bottom: 30px; font-weight: lighter}
.firstBlockInn .btnWrap {width: 390px; margin: 0 auto}
.firstBlockInn .btns {width: 162px; height: 54px; background: #e23f04; color: #fff; font-family: 'Lato', sans-serif; font-weight: bold;
 font-size: 16px; border-radius:4px; -moz-border-radius:4px;  -webkit-border-radius:4px; -o-border-radius:4px; -ms-border-radius:4px;
  margin: 0 15px; display: inline-block; line-height: 54px}
.firstBlockInn .btns:hover, .form .subBtn:hover, .logBtn input:hover {background-color: #be3b13; -webkit-transition: background-color 500ms linear; 
  -moz-transition: background-color 500ms linear; -o-transition: background-color 500ms linear; -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear}
    .firstBlockInn .btns:active, .form .subBtn:active, .logBtn input:active {background: #f77546}
/*=================================================================================================================================
 														5. contentBlock/ThirdBlock
=================================================================================================================================*/
.contentBlock {width: 100%; border-top: 1px solid #abd2e1;
background: #e5f6fd;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U1ZjZmZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE4JSIgc3RvcC1jb2xvcj0iI2U1ZjZmZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjM3JSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  #e5f6fd 0%, #e5f6fd 18%, #ffffff 37%, #ffffff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e5f6fd), color-stop(18%,#e5f6fd), color-stop(37%,#ffffff), color-stop(100%,#ffffff));
background: -webkit-linear-gradient(top,  #e5f6fd 0%,#e5f6fd 18%,#ffffff 37%,#ffffff 100%);
background: -o-linear-gradient(top,  #e5f6fd 0%,#e5f6fd 18%,#ffffff 37%,#ffffff 100%);
background: -ms-linear-gradient(top,  #e5f6fd 0%,#e5f6fd 18%,#ffffff 37%,#ffffff 100%);
background: linear-gradient(to bottom,  #e5f6fd 0%,#e5f6fd 18%,#ffffff 37%,#ffffff 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5f6fd', endColorstr='#ffffff',GradientType=0 )}
.contentBlockInn {width: 1210px; margin: 0 auto; padding:52px 0 65px}
.padTop {padding-top:0 }
.rwPad {padding-top: 88px}
.contentBlockInn .dpHolders {padding-bottom: 30px; border-bottom: 1px solid #cdced0; *overflow: hidden}
.dpHolders .dpText {padding-top:35px; width: 44%}
.dpHolders .dppadTop {padding-top: 230px}
.dpText h2 {font-size:39px; font-weight:500; text-transform: uppercase; color: #000; padding-bottom:45px}
.dpText p {color: #7696a8; line-height:30px; width: 94%}
.dpHolders .dpImg {width:605px; *height:600px; *overflow: hidden}
.dpHolders .dpImg img {width: 100%}
.contentBlockInn .features {padding-top:50px}
.features h2 {font-size:30px; font-weight: 500; text-transform: uppercase; color: #000; text-align: center; padding-bottom: 70px}
.featureListings {list-style: none}
.featureListings li {width: 320px; float: left; padding-left: 125px; padding-bottom:50px; text-align: center}
.featureListings .first {padding-left: 0 !important}
.featureListings .imgWrap {text-align: center; padding-bottom:40px}
.featureListings h3 {font-size: 18px; color: #000; font-weight: 600; padding-bottom: 20px}
.featureListings p {line-height:30px}
.dpHolders .dpImg .pad {padding-top:85px }
.imgWrap div {width: 94px; height: 94px; margin:0 auto}
.imgIco1 {background-position: 0 0}
.imgIco2 {background-position: 0 -194px}
.imgIco3 {background-position: 0 -388px}
.imgIco4 {background-position: 0 -582px}
.imgIco5 {background-position: 0 -776px}
.imgIco6 {background-position: 0 -970px}
.imgIco7 {background-position: 0 -1164px}
.imgIco8 {background-position: 0 -1358px}
.imgIco9 {background-position: 0 -1552px}
.imgIco10 {background-position: 0 -1746px}
.imgIco11 {background-position: 0 -1940px}
.imgIco12 {background-position: 0 -2134px}
.imgIco13 {background-position: 0 -2328px}
.imgIco14 {background-position: 0 -2475px}
.imgIco15 {background-position: 0 -2622px}
.demo1 {overflow: hidden !important}
.tpSlide2 {background-position: 0 0}
.tpSlide3 {background-position: 0 -850px}
.gSlide2 {background-position: 0 -1700px}
.gSlide3 {background-position: 0 -2550px}
/*=================================================================================================================================
 														6. AboutSkenzo
=================================================================================================================================*/
.abthead {padding-top:68px; font-size:39px; font-weight:500; text-transform: uppercase; color: #000;
 padding-bottom: 25px}
.aboutWrap {padding-bottom: 50px}
.aboutWrap .leftBox {width: 720px}
.leftBox p {padding-bottom: 40px; line-height: 30px}
.leftBox a {text-decoration: underline; color: #7696a8}
.leftBox a:hover {text-decoration: none}
.leftBox .quote {padding-bottom: 40px; font-family: 'Open Sans', sans-serif; color: #000; font-style: italic; font-size: 21px;
 line-height: 29px; overflow: hidden}
.quote .qimgWrap {float: left; width: 76px; background-position: 0 -2768px; height: 76px } 
.quote .quoteTxt {padding-top: 15px; width:625px }
.aboutWrap .rightBox {width: 400px; padding-left: 90px}
.rightBox .aboutListing li {padding-top:40px; overflow: hidden}
.aboutListing .first {padding-top: 0 !important}
.aboutListing .iconWrap {width: 48px}
.aboutListing .iconWrap div {width: 48px; height:47px }
.aboutListing .txtWrap {width: 335px}
.aboutListing .txtWrap h3 {color: #000; font-size: 18px; font-weight: 600; padding-bottom: 10px }
.aboutListing .txtWrap p {line-height: 30px; padding-bottom: 10px }
.aboutListing .txtWrap a {color: #d63b0b; cursor: pointer; word-wrap:break-word}
.aboutListing .txtWrap a:hover {text-decoration:underline}
/*=================================================================================================================================
 														7. ApplyNow
=================================================================================================================================*/
.formBlock {background:#3b2d4e; width: 100%; position:relative}
.loaderOverlay {width:100%; height:100%; position:absolute; background:rgba(0, 0, 0, 0.4); z-index:999; *background:#ccc; _background:#ccc;}
.loader {height: 15px; position: absolute; text-align: center; top: 50%; width: 100%; z-index: 9991;}
.formBlockInn {width: 1210px; margin: 0 auto; padding: 50px 0}
.formBlockInn h2 {font-size:39px; text-transform: uppercase; color: #fff; padding-bottom: 25px; font-weight: 700; 
  text-align: center; padding-top: 60px}
.formBlockInn h3 {font-family: 'Open Sans', sans-serif; font-size:30px; color: #a87bea; padding-bottom:45px; font-weight: 300; text-align: center}
#successMessage, #errorMessage, .success, .error {font-family: 'Open Sans', sans-serif; font-size:30px; text-align:center}
#successMessage, .success { color: green; font-size:25px;}
#errorMessage, .error {color: red}
.formBlockInn .form {width: 663px; margin: 0 auto}
.form input, .form textarea {border:1px solid #78629a; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; -o-border-radius:4px; 
	-ms-border-radius:4px; padding: 12px 14px; line-height: 20px; height: 20px; color: #9889af; font-size: 14px; 
	font-family: 'Open Sans', sans-serif; background: none; position: relative}
.form textarea {height:70px; resize: none}
.form select {border:1px solid #78629a; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; -o-border-radius:4px; 
	-ms-border-radius:4px; padding: 12px 10px; line-height: 20px; height:46px; *height:28px; *padding: 0; color: #9889af; font-size: 14px; width: 197px;
	font-family: 'Open Sans', sans-serif; background: #3b2d4e}
.form li {margin-bottom:33px; float: left; width: 100%}
.g-recaptcha div {margin:0 auto}
.form .bInput {width: 631px}
.form .sInput {width: 283px}
.form .xsInput {width: 167px}
.form .bInputW {width: 661px}
.form .TextArHeight {height: 95px}
.form .sInputW {width: 313px}
.form .xsInputW {width: 197px}
.form .margR {margin-right: 35px}
.form .fb {background: url(../images/sprite.png) 12px -3039px no-repeat; padding: 12px 14px 12px 42px; width: 255px; text-transform: capitalize}
.form .in {background: url(../images/sprite.png) 12px -3159px no-repeat; padding: 12px 14px 12px 42px; width: 255px}
/*.form .captchaWrap {width: 433px; margin: 0 auto}*/
.form .captcha {width: 199px; height: 46px; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; -o-border-radius:4px; 
	-ms-border-radius:4px; background: #fff; text-align: center}
.form .subBtn {width: 433px; background: #e23f04; color: #fff; font-family: 'Lato', sans-serif; font-weight: bold; font-size: 16px; border:0 none; height: 46px; 
padding: 0; text-align: center; line-height: 46px; margin: 0 auto; display: block; cursor: pointer; -webkit-appearance:none}
.redoutline{border:1px solid #f44 !important}
.greenoutline {border:1px solid #0bd206 !important}
.error span {background: #f6484b; color: #fff; padding: 5px 10px; font-size: 12px; display: block; border-radius:2px;-moz-border-radius:2px;
	-webkit-border-radius:2px; -o-border-radius:2px;-ms-border-radius:2px}
.error {bottom: 0; *bottom: 2px; right: 0; padding-top: 5px; position: absolute; z-index:999}
.TextArHeight .error {*bottom: -1px}
.txtareaWrapp .error {top: 65px !important; left: 95% !important}
.urlWrapp .error {left: 95% !important}
.captchaError .error {left:27% !important}
.customDropdown_select {border:none; background-color:none; padding:6px 0 7px; margin:0; width:100%;
  height:31px}
.customDropdown_select_mini {padding:7px 0}
.customDropdown.error {border-color:#a41615}
.customDropdown.error select {color:#a41615}
.customDropdown_select option {padding:4px 5px; background:#3b2d4e ; color:#9889af}
.customDropdown {display:inline-block;position:relative;vertical-align:middle;width:100%}
.customDropdown select {}
.customDropdown_select {-webkit-appearance:none;-moz-appearance:none;appearance:none}
.customDropdown:after,.customDropdown:before {content:"";position:absolute;pointer-events:none}
.customDropdown:after {background:url(../images/arrow.png) 0 5px no-repeat; height:12px; margin-top:-.5em; right:2px;
  top:50%;width:30px}
.customDropdown:before {bottom:0;right:0;top:0;width:30px}
.EieLabel, .FieLabel, .LieLabel, .CHieLabel, .COieLabel, .AieLabel, .SieLabel, .ZieLabel, .MieLabel, .PieLabel, .FBieLabel, .LIieLabel, .DieLabel  {/*display: none;*/ color: #9889af; font-size: 14px; line-height: 46px;
  position: absolute; left: 0; top: 0; padding-left: 14px }
.fbb .FBieLabel, .lkn .LIieLabel {padding-left: 42px }
.captchaWrap {width: 304px !important; height:77px !important; border-radius:3px; margin:0 auto}
.g-recaptcha {border-radius: 3px !important;}
.g-recaptcha div {height: 76px !important}
/*=================================================================================================================================
 														8. Footer
=================================================================================================================================*/
footer {background:#252525; width: 100%; padding: 60px 0 50px}
.footerInn {width: 1210px; margin: 0 auto}
.copyR {color: #a6a3a3; width:215px; font-weight: 100; line-height: 28px}
.fLinks {/*width: 394px;*/ color: #484848; line-height: 28px}
.fLinks a {color: #fff; padding: 0 25px; font-weight: 100; transition-duration: 250ms; transition-timing-function: linear}
.fLinks a:hover {color: #e23f04 }
.socialLinks a {margin-left:20px; float: left; width: 28px; height: 28px}
.socialLinks a:hover {opacity:0.7}
.googleF {background-position: 0 -3291px}
.facebookF {background-position: 0 -3419px}
.linkedinF {background-position: 0 -3547px}

/*=================================================================================================================================
 														9. 1st slider animation
=================================================================================================================================*/
#slideWrapper{position:relative; width:100%; height:600px; margin:0 auto}
.bb{position:absolute; width:100%; height: 399px}

.one{/*background: url(../images/img1.png) 0 0 no-repeat;*/background-position: 0 0; 
  background-size: 100% !important; bottom:0; right:0;
    animation-duration: 1s,2s;
    animation-delay: 0s, 1s;
    animation-name: fromTop, fromTop2;
    animation-fill-mode: forwards;
    -webkit-animation-duration: 1s,2s;
    -webkit-animation-delay: 0s, 1s;
    -webkit-animation-name: fromTop, fromTop2;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-duration: 1s,2s;
    -moz-animation-delay: 0s, 1s;
    -moz-animation-name: fromTop, fromTop2;
    -moz-animation-fill-mode: forwards;
    -ms-animation-duration: 1s,2s;
    -ms-animation-delay: 0s, 1s;
    -ms-animation-name: fromTop, fromTop2;
    -ms-animation-fill-mode: forwards;
    -o-animation-duration: 1s,2s;
    -o-animation-delay: 0s, 1s;
    -o-animation-name: fromTop, fromTop2;
    -o-animation-fill-mode: forwards;
}
.two{/*background: url(../images/img2.png) 0 0 no-repeat;*//*background-position: 0 -649px;*/
 background-size: 100% !important; background-position: 0 -535px;
    right:0;
    bottom:0;
    }
.three{/*background: url(../images/img3.png) 0 0 no-repeat;*//*background-position: 0 -1297px;*/ 
  background-position: 0 -1069px; background-size: 100% !important;
    bottom:0; right:0;
    animation-duration: 1s,1s;
    animation-delay: 0s, 1s;
    animation-name: fromBtm,fromBtm2;
    animation-fill-mode: forwards;
    -webkit-animation-duration: 1s,1s;
    -webkit-animation-delay: 0s, 1s;
    -webkit-animation-name: fromBtm,fromBtm2;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-duration: 1s,1s;
    -moz-animation-delay: 0s, 1s;
    -moz-animation-name: fromBtm,fromBtm2;
    -moz-animation-fill-mode: forwards;
    -ms-animation-duration: 1s,1s;
    -ms-animation-delay: 0s, 1s;
    -ms-animation-name: fromBtm,fromBtm2;
    -ms-animation-fill-mode: forwards;
    -o-animation-duration: 1s,1s;
    -o-animation-delay: 0s, 1s;
    -o-animation-name: fromBtm,fromBtm2;
    -o-animation-fill-mode: forwards;
}
.four{/*background: url(../images/img4.png) 0 0 no-repeat;*/ background-position: 0 -3953px;
    left:-100px;
    top:22%;
    animation-name: fromLeft;
    animation-duration: 3s;
    animation-timing-function: ease;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-delay: 0;
    animation-play-state: running;
    animation-fill-mode: forwards;

    -webkit-animation-name: fromLeft;
    -webkit-animation-duration: 3s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;

    -moz-animation-name: fromLeft;
    -moz-animation-duration: 3s;
    -moz-animation-timing-function: ease;
    -moz-animation-iteration-count: 1;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;

    -ms-animation-name: fromLeft;
    -ms-animation-duration: 3s;
    -ms-animation-timing-function: ease;
    -ms-animation-iteration-count: 1;
    -ms-animation-direction: normal;
    -ms-animation-delay: 0;
    -ms-animation-play-state: running;
    -ms-animation-fill-mode: forwards;

    -o-animation-name: fromLeft;
    -o-animation-duration: 3s;
    -o-animation-timing-function: ease;
    -o-animation-iteration-count: 1;
    -o-animation-direction: normal;
    -o-animation-delay: 0;
    -o-animation-play-state: running;
    -o-animation-fill-mode: forwards;
}
.five{/*background: url(../images/slImg1.png) 0 0 no-repeat;*/ background-position: 0 -2413px; width: 63px; height: 173px; position: absolute;
    right:-100px;
    top:14%;
    animation-name: fromRight;
    animation-duration: 3s;
    animation-timing-function: ease;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-delay: 0;
    animation-play-state: running;
    animation-fill-mode: forwards;

    -webkit-animation-name: fromRight;
    -webkit-animation-duration: 3s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;

    -moz-animation-name: fromRight;
    -moz-animation-duration: 3s;
    -moz-animation-timing-function: ease;
    -moz-animation-iteration-count: 1;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;

    -ms-animation-name: fromRight;
    -ms-animation-duration: 3s;
    -ms-animation-timing-function: ease;
    -ms-animation-iteration-count: 1;
    -ms-animation-direction: normal;
    -ms-animation-delay: 0;
    -ms-animation-play-state: running;
    -ms-animation-fill-mode: forwards;

    -o-animation-name: fromRight;
    -o-animation-duration: 3s;
    -o-animation-timing-function: ease;
    -o-animation-iteration-count: 1;
    -o-animation-direction: normal;
    -o-animation-delay: 0;
    -o-animation-play-state: running;
    -o-animation-fill-mode: forwards;
}
.six{/*background: url(../images/slImg2.png) 0 0 no-repeat;*/ background-position: 0 -2833px; width: 186px; height: 126px; position: absolute;
    top:-100px;
    left:37%;
    animation-name: fromTopN;
    animation-duration: 3s;
    animation-timing-function: ease;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-delay: 0;
    animation-play-state: running;
    animation-fill-mode: forwards;

    -webkit-animation-name: fromTopN;
    -webkit-animation-duration: 3s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;

    -moz-animation-name: fromTopN;
    -moz-animation-duration: 3s;
    -moz-animation-timing-function: ease;
    -moz-animation-iteration-count: 1;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;

    -ms-animation-name: fromTopN;
    -ms-animation-duration: 3s;
    -ms-animation-timing-function: ease;
    -ms-animation-iteration-count: 1;
    -ms-animation-direction: normal;
    -ms-animation-delay: 0;
    -ms-animation-play-state: running;
    -ms-animation-fill-mode: forwards;

    -o-animation-name: fromTopN;
    -o-animation-duration: 3s;
    -o-animation-timing-function: ease;
    -o-animation-iteration-count: 1;
    -o-animation-direction: normal;
    -o-animation-delay: 0;
    -o-animation-play-state: running;
    -o-animation-fill-mode: forwards;
}
.seven{/*background: url(../images/slImg5.png) 0 0 no-repeat;*/ background-position: 0 -3209px; width: 40px; height: 136px; position: absolute;
    left:-100px;
    bottom:13%;
    animation-name: fromLeftN;
    animation-duration: 3s;
    animation-timing-function: ease;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-delay: 0;
    animation-play-state: running;
    animation-fill-mode: forwards;

    -webkit-animation-name: fromLeftN;
    -webkit-animation-duration: 3s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;

    -moz-animation-name: fromLeftN;
    -moz-animation-duration: 3s;
    -moz-animation-timing-function: ease;
    -moz-animation-iteration-count: 1;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;

    -ms-animation-name: fromLeftN;
    -ms-animation-duration: 3s;
    -ms-animation-timing-function: ease;
    -ms-animation-iteration-count: 1;
    -ms-animation-direction: normal;
    -ms-animation-delay: 0;
    -ms-animation-play-state: running;
    -ms-animation-fill-mode: forwards;

    -o-animation-name: fromLeftN;
    -o-animation-duration: 3s;
    -o-animation-timing-function: ease;
    -o-animation-iteration-count: 1;
    -o-animation-direction: normal;
    -o-animation-delay: 0;
    -o-animation-play-state: running;
    -o-animation-fill-mode: forwards;
}
.eight{/*background: url(../images/slImg4.png) 0 0 no-repeat;*/ background-position: 0 -3595px; width: 156px; height: 107px; position: absolute;
    bottom:-100px;
    left:12%;
    animation-name: fromBtmN;
    animation-duration: 3s;
    animation-timing-function: ease;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-delay: 0;
    animation-play-state: running;
    animation-fill-mode: forwards;

    -webkit-animation-name: fromBtmN;
    -webkit-animation-duration: 3s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;

    -moz-animation-name: fromBtmN;
    -moz-animation-duration: 3s;
    -moz-animation-timing-function: ease;
    -moz-animation-iteration-count: 1;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;

    -ms-animation-name: fromBtmN;
    -ms-animation-duration: 3s;
    -ms-animation-timing-function: ease;
    -ms-animation-iteration-count: 1;
    -ms-animation-direction: normal;
    -ms-animation-delay: 0;
    -ms-animation-play-state: running;
    -ms-animation-fill-mode: forwards;

    -o-animation-name: fromBtmN;
    -o-animation-duration: 3s;
    -o-animation-timing-function: ease;
    -o-animation-iteration-count: 1;
    -o-animation-direction: normal;
    -o-animation-delay: 0;
    -o-animation-play-state: running;
    -o-animation-fill-mode: forwards;
}
@-webkit-keyframes fromTopp
  { 
        0% { opacity: 0; top: -100px}
      100% { opacity: 1; top:  20%} 
  }
@-moz-keyframes fromTopp
  { 
        0% { opacity: 0; top: -100px}
      100% { opacity: 1; top:  20%} 
  }
@-ms-keyframes fromTopp
  { 
        0% { opacity: 0; top: -100px}
      100% { opacity: 1; top:  20%} 
  }
@-o-keyframes fromTopp
  { 
        0% { opacity: 0; top: -100px}
      100% { opacity: 1; top:  20%} 
  }
@keyframes fromTopp
  { 
        0% { opacity: 0; top: -100px}
      100% { opacity: 1; top:  20%} 
  }

@-webkit-keyframes fromTopp2
  { 
        0% { top:  20%}
      100% { top:  2%} 
  }
@-moz-keyframes fromTopp2
  { 
        0% { top:  20%}
      100% { top:  2%} 
  }
@-ms-keyframes fromTopp2
  { 
        0% { top:  20%}
      100% { top:  2%} 
  }
@-o-keyframes fromTopp2
  { 
        0% { top:  20%}
      100% { top:  2%} 
  }  
@keyframes fromTopp2
  { 
        0% { top:  20%}
      100% { top:  2%} 
  }
/*one*/
@-webkit-keyframes fromTop
  { 
        0% { opacity: 0; bottom: 0}
      100% { opacity: 1; bottom:  0} 
  }
@-moz-keyframes fromTop
  { 
        0% { opacity: 0; bottom: 0}
      100% { opacity: 1; bottom:  0} 
  }
@-ms-keyframes fromTop
  { 
        0% { opacity: 0; bottom: 0}
      100% { opacity: 1; bottom:  0} 
  }
@-o-keyframes fromTop
  { 
        0% { opacity: 0; bottom: 0}
      100% { opacity: 1; bottom:  0} 
  }
@keyframes fromTop
  { 
        0% { opacity: 0; bottom: 0}
      100% { opacity: 1; bottom:  0} 
  }

@-webkit-keyframes fromTop2
  { 
        0% { bottom:  0}
      100% { bottom:  2.5%} 
  }
@-moz-keyframes fromTop2
  { 
        0% { bottom:  0}
      100% { bottom:  2.5%} 
  }
@-ms-keyframes fromTop2
  { 
        0% { bottom:  0}
      100% { bottom:  2.5%} 
  }
@-o-keyframes fromTop2
  { 
        0% { bottom:  0}
      100% { bottom:  2.5%} 
  } 
@keyframes fromTop2
  { 
        0% { bottom:  0}
      100% { bottom:  2.5%} 
  } 

@-webkit-keyframes fromLeft
  { 
        0% { opacity: 0; left: -100px}
        50% { opacity: 0; left: -100px}
        70% { opacity: 0; left: -100px}
        100% { opacity: 1; left:  0%} 
  }
@-moz-keyframes fromLeft
  { 
        0% { opacity: 0; left: -100px}
        50% { opacity: 0; left: -100px}
        70% { opacity: 0; left: -100px}
        100% { opacity: 1; left:  0%} 
  }
@-ms-keyframes fromLeft
  { 
        0% { opacity: 0; left: -100px}
        50% { opacity: 0; left: -100px}
        70% { opacity: 0; left: -100px}
        100% { opacity: 1; left:  0%} 
  }
@-o-keyframes fromLeft
  { 
        0% { opacity: 0; left: -100px}
        50% { opacity: 0; left: -100px}
        70% { opacity: 0; left: -100px}
        100% { opacity: 1; left:  0%} 
  }
@keyframes fromLeft
  { 
        0% { opacity: 0; left: -100px}
        50% { opacity: 0; left: -100px}
        70% { opacity: 0; left: -100px}
        100% { opacity: 1; left:  0%} 
  }
@-webkit-keyframes fromLeft2
  { 
        0% { left:  36%}
      100% { left:  0} 
  }
@-moz-keyframes fromLeft2
  { 
        0% { left:  36%}
      100% { left:  0} 
  }
@-ms-keyframes fromLeft2
  { 
        0% { left:  36%}
      100% { left:  0} 
  }
@-o-keyframes fromLeft2
  { 
        0% { left:  36%}
      100% { left:  0} 
  }  
@keyframes fromLeft2
  { 
        0% { left:  36%}
      100% { left:  0} 
  }

  /*three*/
@-webkit-keyframes fromBtm
  { 
        0% { opacity: 0; bottom:0}
      100% { opacity: 1; bottom:0} 
  }
@-moz-keyframes fromBtm
  { 
        0% { opacity: 0; bottom:0}
      100% { opacity: 1; bottom:0} 
  }
@-ms-keyframes fromBtm
  { 
        0% { opacity: 0; bottom:0}
      100% { opacity: 1; bottom:0} 
  }
@-o-keyframes fromBtm
  { 
        0% { opacity: 0; bottom:0}
      100% { opacity: 1; bottom:0} 
  }
@keyframes fromBtm
  { 
        0% { opacity: 0; bottom:0}
      100% { opacity: 1; bottom:0} 
  }
@-webkit-keyframes fromBtm2
  { 
        0% { bottom:0}
      100% { bottom:-3%} 
  }
@-moz-keyframes fromBtm2
  { 
        0% { bottom:0}
      100% { bottom:-3%} 
  }
@-ms-keyframes fromBtm2
  { 
        0% { bottom:0}
      100% { bottom:-3%} 
  }
@-o-keyframes fromBtm2
  { 
        0% { bottom:0}
      100% { bottom:-3%} 
  }
@keyframes fromBtm2
  { 
        0% { bottom:0}
      100% { bottom:-3%} 
  }

/*five*/
@-webkit-keyframes fromRight
  { 
        0% { opacity: 0; right: -100px}
        50% { opacity: 0; right: -100px}
        60% { opacity: 0; right: -100px}
        100% { opacity: 1; right:  22%} 
  }
@-moz-keyframes fromRight
  { 
        0% { opacity: 0; right: -100px}
        50% { opacity: 0; right: -100px}
        60% { opacity: 0; right: -100px}
        100% { opacity: 1; right:  22%} 
  }
@-ms-keyframes fromRight
  { 
        0% { opacity: 0; right: -100px}
        50% { opacity: 0; right: -100px}
        60% { opacity: 0; right: -100px}
        100% { opacity: 1; right:  22%} 
  }
@-o-keyframes fromRight
  { 
        0% { opacity: 0; right: -100px}
        50% { opacity: 0; right: -100px}
        60% { opacity: 0; right: -100px}
        100% { opacity: 1; right:  22%} 
  }
  @keyframes fromRight
  { 
        0% { opacity: 0; right: -100px}
        50% { opacity: 0; right: -100px}
        60% { opacity: 0; right: -100px}
        100% { opacity: 1; right:  22%} 
  }
@-webkit-keyframes fromRight2
  { 
        0% { right:  22%}
      100% { right:  5%} 
  }
@-moz-keyframes fromRight2
  { 
        0% { right:  22%}
      100% { right:  5%} 
  }
@-ms-keyframes fromRight2
  { 
        0% { right:  22%}
      100% { right:  5%} 
  }
@-o-keyframes fromRight2
  { 
        0% { right:  22%}
      100% { right:  5%} 
  }
@keyframes fromRight2
  { 
        0% { right:  22%}
      100% { right:  5%} 
  }
  /*six*/
@-webkit-keyframes fromTopN
  { 
        0% { opacity: 0; top: -100px}
        50% { opacity: 0; top: -100px}
        60% { opacity: 0; top: -100px}
        100% { opacity: 1; top:  13%}
  }
@-moz-keyframes fromTopN
  { 
        0% { opacity: 0; top: -100px}
        50% { opacity: 0; top: -100px}
        60% { opacity: 0; top: -100px}
        100% { opacity: 1; top:  13%}
  }
@-ms-keyframes fromTopN
  { 
        0% { opacity: 0; top: -100px}
        50% { opacity: 0; top: -100px}
        60% { opacity: 0; top: -100px}
        100% { opacity: 1; top:  13%}
  }
@-o-keyframes fromTopN
  { 
        0% { opacity: 0; top: -100px}
        50% { opacity: 0; top: -100px}
        60% { opacity: 0; top: -100px}
        100% { opacity: 1; top:  13%}
  }
@keyframes fromTopN
  { 
        0% { opacity: 0; top: -100px}
        50% { opacity: 0; top: -100px}
        60% { opacity: 0; top: -100px}
        100% { opacity: 1; top:  13%}
  }
@-webkit-keyframes fromTopN2
  { 
         0% { top:  13%}
      100% { top:  0%} 
  }
@-moz-keyframes fromTopN2
  { 
         0% { top:  13%}
      100% { top:  0%} 
  }
@-ms-keyframes fromTopN2
  { 
         0% { top:  13%}
      100% { top:  0%} 
  }
@-o-keyframes fromTopN2
  { 
         0% { top:  13%}
      100% { top:  0%} 
  }
@keyframes fromTopN2
  { 
         0% { top:  13%}
      100% { top:  0%} 
  } 
  /*seven*/
@-webkit-keyframes fromLeftN
  { 
        0% { opacity: 0; left: -100px}
        50% { opacity: 0; left: -100px}
        60% { opacity: 0; left: -100px}
        100% { opacity: 1; left:  7%}
  }
@-moz-keyframes fromLeftN
  { 
        0% { opacity: 0; left: -100px}
        50% { opacity: 0; left: -100px}
        60% { opacity: 0; left: -100px}
        100% { opacity: 1; left:  7%}
  }
@-ms-keyframes fromLeftN
  { 
        0% { opacity: 0; left: -100px}
        50% { opacity: 0; left: -100px}
        60% { opacity: 0; left: -100px}
        100% { opacity: 1; left:  7%}
  }
@-o-keyframes fromLeftN
  { 
        0% { opacity: 0; left: -100px}
        50% { opacity: 0; left: -100px}
        60% { opacity: 0; left: -100px}
        100% { opacity: 1; left:  7%}
  }
@keyframes fromLeftN
  { 
        0% { opacity: 0; left: -100px}
        50% { opacity: 0; left: -100px}
        60% { opacity: 0; left: -100px}
        100% { opacity: 1; left:  7%}
  }
@-webkit-keyframes fromLeftN2
  { 
        0% { left:  7%}
      100% { left:  0} 
  }
@-moz-keyframes fromLeftN2
  { 
        0% { left:  7%}
      100% { left:  0} 
  }
@-ms-keyframes fromLeftN2
  { 
        0% { left:  7%}
      100% { left:  0} 
  }
@-o-keyframes fromLeftN2
  { 
        0% { left:  7%}
      100% { left:  0} 
  }
@keyframes fromLeftN2
  { 
        0% { left:  7%}
      100% { left:  0} 
  }
  /*eight*/
@-webkit-keyframes fromBtmN
  { 
    0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        60% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  7%}
  }
@-moz-keyframes fromBtmN
  { 
    0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        60% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  7%}
  }
@-ms-keyframes fromBtmN
  { 
    0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        60% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  7%}
  }
@-o-keyframes fromBtmN
  { 
    0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        60% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  7%}
  }
@keyframes fromBtmN
  { 
    0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        60% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  7%}
  }
@-webkit-keyframes fromBtmN2
  { 
        0% { bottom:7%}
      100% { bottom:0} 
  }
@-moz-keyframes fromBtmN2
  { 
        0% { bottom:7%}
      100% { bottom:0} 
  }
@-ms-keyframes fromBtmN2
  { 
        0% { bottom:7%}
      100% { bottom:0} 
  }
@-o-keyframes fromBtmN2
  { 
        0% { bottom:7%}
      100% { bottom:0} 
  }
@keyframes fromBtmN2
  { 
        0% { bottom:7%}
      100% { bottom:0} 
  }

/*=================================================================================================================================
                            10. 2nd slider animation
=================================================================================================================================*/
#slideWrapper2{position:relative; width:630px; height:600px; margin:0 auto}
.gSprite {background: url(../images/gSprite.png) left top no-repeat}
.globe{/*background: url(../images/globe.png) center center no-repeat;*/ background-position: center 0; right:0; bottom:20%; position:absolute; width:630px; height: 356px}
.bull {/*background: url(../images/bullete.png) 0 0 no-repeat;*/background-position: 0 -2432px; width: 24px; height: 24px; position: absolute}
.bul1 {top:28%; left:36%}
.bul2 {top:41%; left:44%}
.bul3 {top:50%; left:46%}
.bul4 {top:41%; right:32%}
.server{/*background: url(../images/server.png) 0 0 no-repeat;*/background-position: 0 -605px; width: 244px; height: 195px; position: absolute;
    left:-100px;
    bottom:16%;
    animation-name: fromLeftg;
    animation-duration: 4s;
    animation-timing-function: ease;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-delay: 0;
    animation-play-state: running;
    animation-fill-mode: forwards;

    -webkit-animation-name: fromLeftg;
    -webkit-animation-duration: 4s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;

    -moz-animation-name: fromLeftg;
    -moz-animation-duration: 4s;
    -moz-animation-timing-function: ease;
    -moz-animation-iteration-count: 1;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;

    -ms-animation-name: fromLeftg;
    -ms-animation-duration: 4s;
    -ms-animation-timing-function: ease;
    -ms-animation-iteration-count: 1;
    -ms-animation-direction: normal;
    -ms-animation-delay: 0;
    -ms-animation-play-state: running;
    -ms-animation-fill-mode: forwards;

    -o-animation-name: fromLeftg;
    -o-animation-duration: 4s;
    -o-animation-timing-function: ease;
    -o-animation-iteration-count: 1;
    -o-animation-direction: normal;
    -o-animation-delay: 0;
    -o-animation-play-state: running;
    -o-animation-fill-mode: forwards;
}   
.computer {/*background: url(../images/computer.png) 0 0 no-repeat;*/background-position: 0 -1049px; width: 290px; height: 196px; position: absolute;
    bottom:-100px;
    right:3%;
    animation-name: fromBtmg;
    animation-duration: 4s;
    animation-timing-function: ease;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-delay: 0;
    animation-play-state: running;
    animation-fill-mode: forwards;

    -webkit-animation-name: fromBtmg;
    -webkit-animation-duration: 4s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;

    -moz-animation-name: fromBtmg;
    -moz-animation-duration: 4s;
    -moz-animation-timing-function: ease;
    -moz-animation-iteration-count: 1;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;

    -ms-animation-name: fromBtmg;
    -ms-animation-duration: 4s;
    -ms-animation-timing-function: ease;
    -ms-animation-iteration-count: 1;
    -ms-animation-direction: normal;
    -ms-animation-delay: 0;
    -ms-animation-play-state: running;
    -ms-animation-fill-mode: forwards;

    -o-animation-name: fromBtmg;
    -o-animation-duration: 4s;
    -o-animation-timing-function: ease;
    -o-animation-iteration-count: 1;
    -o-animation-direction: normal;
    -o-animation-delay: 0;
    -o-animation-play-state: running;
    -o-animation-fill-mode: forwards;
}
.globeLht {/*background: url(../images/globeLht.png) 0 0 no-repeat;*/background-position: 0 -1495px; width: 96px; height: 195px; position: absolute; top:25%; left:7%}
.globeRht {/*background: url(../images/globeRht.png) 0 0 no-repeat;*/background-position: 0 -1941px; width: 222px; height: 241px; position: absolute; top:18%; right:-4%}


/*fade in*/
@-webkit-keyframes fadeIn { from { opacity:0} to { opacity:1} }
@-moz-keyframes fadeIn { from { opacity:0} to { opacity:1} }
@-ms-keyframes fadeIn { from { opacity:0} to { opacity:1} }
@-o-keyframes fadeIn { from { opacity:0} to { opacity:1} }
@keyframes fadeIn { from { opacity:0} to { opacity:1} }

.fade-in {
  opacity:0;  /* make things invisible upon start */
  -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
  -moz-animation:fadeIn ease-in 1;
  -ms-animation:fadeIn ease-in 1;
  -o-animation:fadeIn ease-in 1;
  animation:fadeIn ease-in 1;

  -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
  -moz-animation-fill-mode:forwards;
  -ms-animation-fill-mode:forwards;
  -o-animation-fill-mode:forwards;
  animation-fill-mode:forwards;

  -webkit-animation-duration:1s;
  -moz-animation-duration:1s;
  -ms-animation-duration:1s;
  -o-animation-duration:1s;
  animation-duration:1s;
}

.fade-in.globe {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-ms-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
.fade-in.bul1 {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-ms-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}

.fade-in.bul2 {
-webkit-animation-delay: 1.2s;
-moz-animation-delay:1.2s;
-ms-animation-delay: 1.2s;
-o-animation-delay: 1.2s;
animation-delay: 1.2s;
}

.fade-in.bul3 {
-webkit-animation-delay: 1.6s;
-moz-animation-delay: 1.6s;
-ms-animation-delay: 1.6s;
-o-animation-delay: 1.6s;
animation-delay: 1.6s;
}
.fade-in.bul4 {
-webkit-animation-delay: 2s;
-moz-animation-delay: 2s;
-ms-animation-delay: 2s;
-o-animation-delay: 2s;
animation-delay: 2s;
}
.fade-in.globeLht, .fade-in.globeRht {
-webkit-animation-delay: 4.5s;
-moz-animation-delay: 4.5s;
-ms-animation-delay: 4.5s;
-o-animation-delay: 4.5s;
animation-delay: 4.5s;
}
/*fade in end*/


 /*server*/
@-webkit-keyframes fromLeftg
{ 
  0% { opacity: 0; left: -100px}
  50% { opacity: 0; left: -100px}
  70% { opacity: 0; left: -100px}
  100% { opacity: 1; left:  6%}
}
@-moz-keyframes fromLeftg
{ 
  0% { opacity: 0; left: -100px}
  50% { opacity: 0; left: -100px}
  70% { opacity: 0; left: -100px}
  100% { opacity: 1; left:  6%}
}
@-ms-keyframes fromLeftg
{ 
  0% { opacity: 0; left: -100px}
  50% { opacity: 0; left: -100px}
  70% { opacity: 0; left: -100px}
  100% { opacity: 1; left:  6%}
}
@-o-keyframes fromLeftg
{ 
  0% { opacity: 0; left: -100px}
  50% { opacity: 0; left: -100px}
  70% { opacity: 0; left: -100px}
  100% { opacity: 1; left:  6%}
}
@keyframes fromLeftg
{ 
  0% { opacity: 0; left: -100px}
  50% { opacity: 0; left: -100px}
  70% { opacity: 0; left: -100px}
  100% { opacity: 1; left:  6%}
}
@-webkit-keyframes fromLeftg2
{ 
  0% { left:  6%}
  100% { left:  0} 
}
@-moz-keyframes fromLeftg2
{ 
  0% { left:  6%}
  100% { left:  0} 
}
@-ms-keyframes fromLeftg2
{ 
  0% { left:  6%}
  100% { left:  0} 
}
@-o-keyframes fromLeftg2
{ 
  0% { left:  6%}
  100% { left:  0} 
}
@keyframes fromLeftg2
{ 
  0% { left:  6%}
  100% { left:  0} 
}
/*server*/

  /*computer*/
@-webkit-keyframes fromBtmg
  { 
        0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        70% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  16%} 
  }
@-moz-keyframes fromBtmg
  { 
        0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        70% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  16%} 
  }
@-ms-keyframes fromBtmg
  { 
        0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        70% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  16%} 
  }
@-o-keyframes fromBtmg
  { 
        0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        70% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  16%} 
  }
@keyframes fromBtmg
  { 
        0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        70% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  16%} 
  }
@-webkit-keyframes fromBtmg2
  { 
        0% { bottom:16%}
      100% { bottom:0} 
  }
@-moz-keyframes fromBtmg2
  { 
        0% { bottom:16%}
      100% { bottom:0} 
  }
@-ms-keyframes fromBtmg2
  { 
        0% { bottom:16%}
      100% { bottom:0} 
  }
@-o-keyframes fromBtmg2
  { 
        0% { bottom:16%}
      100% { bottom:0} 
  }
@keyframes fromBtmg2
  { 
        0% { bottom:16%}
      100% { bottom:0} 
  }

  /*computer*/


/*=================================================================================================================================
                            11. bxSlider slider css
=================================================================================================================================*/
.bx-wrapper {position: relative;margin: 0 0 40px 0;*zoom: 1}
.bx-wrapper img {max-width: 100%;display: block}
.bx-wrapper .bx-viewport {-webkit-transform: translatez(0);-moz-transform: translatez(0);-ms-transform: translatez(0);-o-transform: translatez(0);transform: translatez(0)}
.bx-wrapper .bx-pager,.bx-wrapper .bx-controls-auto {position: absolute;bottom: -18px; left: 50%; margin-left: -20px}
.bx-wrapper .bx-pager .bx-pager-item,.bx-wrapper .bx-controls-auto .bx-controls-auto-item {display: inline-block;*zoom: 1;*display: inline}
.bx-wrapper .bx-pager.bx-default-pager a {background: #ccc;text-indent: -9999px; display: block; width: 10px;height: 10px;margin: 0 5px;outline: 0; -moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px}
.bx-wrapper .bx-pager.bx-default-pager a:hover,.bx-wrapper .bx-pager.bx-default-pager a.active {background: #8c8c8c}
.bx-controls-direction {display: none}
.bx-wrapper .bx-controls-direction a.disabled {display: none}
.bx-wrapper .bx-controls-direction a:hover {background-color: #057fbf; -moz-transition: background-color .25s linear;-o-transition: background-color .25s linear;-webkit-transition: background-color .25s linear;transition: background-color .25s linear;-moz-transition: opacity .25s linear;-o-transition: opacity .25s linear;-webkit-transition: opacity .25s linear;transition: opacity .25s linear;opacity: .8; -moz-opacity: .8;filter: alpha(opacity=80)}

/*=================================================================================================================================
                            12. Privacy Policy
=================================================================================================================================*/
.firstBlockEx {background:#fff url(../images/bg1.jpg) center top no-repeat; background-size: cover; 
  background-attachment:fixed}
.privacyPolicyBox {width: 1210px; margin: 0 auto; padding-top:160px; text-align: justify;}
.privacyPolicyBox h2 {color: #fff; font-size: 39px; font-weight: 500; padding-bottom: 20px; text-transform: uppercase}
.privacyPolicyBox p {color: #e2f2fa; line-height: 30px; padding-bottom: 20px}
.privacyPolicyBox a {color: #d63b0b}
.privacyPolicyBox a:hover {text-decoration: underline}
.privacyPolicyBox h3 {color: #fff; font-size: 25px; font-weight: 500; padding-bottom: 20px; text-transform: uppercase; padding-top: 10px}
.privacyPolicyBox li {color: #e2f2fa; list-style: none; overflow: hidden; padding-bottom: 20px; line-height: 30px}
.privacyPolicyBox li .num {float: left; width: 30px; text-align:center}
.privacyPolicyBox li .txt {float: left; width: 90%}
/*=================================================================================================================================
                            12. 404 Error
=================================================================================================================================*/

.errorbox {width: 1210px; margin: 0 auto; padding-top:20%; text-align: center;}
.errorLogo {width:197px; float:none !important; margin: 0 auto}
.errorbox h3 {color: #fff; font-size: 20px; font-weight: 500; padding-bottom: 20px}
.errorbox a {color: #e23f04}
.errorbox a:hover {text-decoration: underline;}
.errorbox div {color: #fff; font-size: 50px; padding-bottom: 20px}
.errorbox span {color: #e23f04; font-weight: bold; font-family: "Open Sans",sans-serif; font-size: 110px}

/*=================================================================================================================================
                            13. Login Page
=================================================================================================================================*/
.loginBox {width: 1210px; margin: 0 auto; padding-top:200px; text-align: center; position: relative; /*min-height: 600px*/}
.loginBox h2 {color: #fff; font-size: 39px; font-weight: 500; padding-bottom: 20px; text-transform: uppercase}
.loginBox p {color: #e2f2fa; line-height: 26px; padding-bottom: 20px}
.loginWrapper {width: 260px; margin: 0 auto; background:rgba(255, 255, 255, 0.2); padding: 20px }
.uid input, .pass input {padding: 10px 10px; line-height: 20px; height: 20px; color: #888; font-size: 14px; 
  font-family: 'Open Sans', sans-serif; background: #fff; position: relative; display: block; width: 240px;
margin-bottom:20px; border: 1px solid #fff}
.remember {overflow: hidden; padding-bottom: 20px}
.remember label {font-size: 12px; color: #fff; float: left; padding-left: 5px}
.remember input {float: left; margin-top: 2px}
.logBtn input {width: 100%; height: 40px; background: #e23f04; color: #fff; font-family: 'Lato', sans-serif; font-weight: bold; font-size: 16px; border:0 none; height: 46px; 
padding: 0; text-align: center; line-height: 40px; margin: 0 auto; display: block; cursor: pointer; -webkit-appearance:none}
.fixHeight {height: 100% !important}
.LogieLabel {color: #9889af; font-size: 14px; line-height: 40px; position: absolute; left: 0; top: 0; 
  padding-left: 14px}
.remember label {display: block !important}
.logBody {background:#252525 }
.loginBox a.fPass {text-align: center; color: #ccc; text-decoration: underline; font-size: 15px; padding-top: 15px; display: inline-block; transition-duration: 250ms; transition-timing-function: linear}
.loginBox a:hover.fPass {text-decoration: none; color: #e23f04}
.loginBox h1 {padding-bottom: 10px}
.pass, .uid {position: relative;}
/*=================================================================================================================================
 														14. Responsive
=================================================================================================================================*/
@media only screen and (max-width:1230px) {
    .headerOut, .firstBlockInn, .contentBlockInn, .formBlockInn, .footerInn, .privacyPolicyBox {width: 95%; margin: 0 auto;}
    .headerIn {width: 100%}
    .featureListings li {width: 30%; padding-left: 5%; min-height: 300px}
    .aboutWrap .leftBox {width: 60%}
    .quote .quoteTxt {width: 80%}
    .aboutWrap .rightBox {width: 35%; padding-left: 5%}
    .aboutListing .txtWrap {width: 80%}
    .firstBlockInn {padding-top:22%}
    .loginBox {width: 100%; padding-top:10%}
     .errorbox {width: 96%}
}
@media only screen and (max-width:1175px) {
.dpHolders .dppadTop {padding-top: 115px}
}
@media only screen and (max-width:1158px) {
.dpHolders .dpText {width: 31%}
}
@media only screen and (max-width:1024px) {
.dpHolders .dppadTop {padding-top: 130px}
/*Custom Header Banner Start*/
#main-ben{width:650px}
/*Custom Header Banner End*/
}
@media only screen and (max-width:950px) { 
 .ovrblockWrap{display:block}
  .contentBlockInn .features {padding-top:50px}
  .formBlockInn {padding: 50px 0}  
  #nav-toggle {display: block; cursor: pointer}
  .mobNav {display: block;}
  .menu_overlay {display: none;}
  nav ul {display: none}
  nav {padding-top: 34px}
  /*Custom Header Banner Start*/
  .headerfixed .headerIn{padding: 15px 0 0 !important}
  .headerfixed.cust-index .headerIn{padding: 15px 0 0 !important}
  #main-ben{position:fixed;width:95%;top:initial;bottom:0;right:2.5%;border-bottom-left-radius:0;border-bottom-right-radius:0;border-top-left-radius:6px;border-top-right-radius:6px;height:98px;padding:17px 0;box-sizing:border-box;line-height:30px}
  #main-ben.inactive{pointer-events:none}
  #main-ben.inactive:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5)}
  #main-ben svg{top:-37px;right:0;bottom:initial;left:initial;width:60px;height:auto;display:block}
  #main-ben .ben-txt br{display:block}
  .cust-bdy #scrollUp{bottom:145px}
  .cust-bdy footer{padding-bottom:120px}
  /*Custom Header Banner End*/
  .abthead {padding-top: 0}
  .contentBlock {padding-top: 64px}
  .headerIn {padding-top: 15px; position: relative}
  .headerIn .logo {float: none; width: 197px; margin: 0 auto}
}
@media only screen and (max-width:940px) {
.dpHolders .dpText {padding-top: 50px}
.dpHolders .dpText {width: 100%; float: none; text-align: center;}
.dpHolders .dpImg {float: none; margin: 0 auto}
.featureListings li {min-height: 330px}
.headerIn {padding-top: 24px}
}
@media only screen and (max-width:810px) {
	.copyR {width: 100%; text-align: center; padding-bottom: 25px; float: none}
	.fLinks {margin: 0 auto; float: none; padding-bottom: 25px; text-align: center;}
	.socialLinks {width: 174px; margin: 0 auto; float: none}  
}
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
  .dpText h2, .errorbox{padding-top: 40px}
  .firstBlockInn {padding-top: 40%}
}
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)  {
  #scrollUp {background-size: 40px 40px; bottom: 10px; height: 40px; right: 10px; width: 40px}
}
/*iphone6+*/
@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px) 
and (orientation : landscape) {
  .firstBlockInn {padding-top: 15%}
  .firstBlockInn h2 {font-size: 40px}
  .firstBlockInn p {font-size: 25px}
  .firstBlock {height: 414px}
  .dpText h2 {padding-top:30px }
  #scrollUp {background-size: 40px 40px; bottom: 10px; height: 40px; right: 10px; width: 40px}
}
@media only screen and (max-width:770px) {
  .dpText h2, .dpText p {text-align: center}
  .mobNav a {padding: 10px 25px 10px 0}
  .dpHolders .dpText {padding-top: 38px}
}
@media only screen and (max-width:750px) {
	.aboutListing .txtWrap {width: 75%}
}
@media only screen and (max-width:698px) {
	.formBlockInn .form {width: 100%}
	.form .bInputW {width: 100%; text-align: center}
	.form .bInput {width: 95%; padding:12px 2%; margin: 0 auto}
	.form .sInputW {width: 48%}
	.form .sInput {width: 95%; padding:12px 2%}
	.form .margR {margin-right: 5%}
	.form .marRR {margin-right: 35px}
	.form .xsInputW {width:30%}
	.form .xsInputWW {width: 197px}
	.form .xsInput {width: 95%; padding:12px 2%}
	.form .xxsInput {width: 167px; padding:12px 15px}
	.form select {width: 100%; padding:12px 3%}
	.form .fb, .form .in {width: 81%; padding: 12px 2% 12px 16%}
  .quote .quoteTxt {width:72%}
}
@media only screen and (max-width:650px) {
	.dpHolders .dpText  {width: 100%; float: none}
  .dpHolders .dpImg {width: 300px; float: none}
	.dpHolders .dpText {padding-bottom: 20px}
  .loginBox h2 {font-size:25px}
  .loginBox p {padding-bottom:10px; font-size: 16px }
  .firstBlockInn h2 {font-size: 38px}
  .firstBlockInn p {font-size: 26px}  
  .dpText h2, .abthead, .privacyPolicyBox h2 {font-size: 32px}
  .dpText p, .leftBox p, .privacyPolicyBox p, .privacyPolicyBox li .txt {font-size: 16px}
  .leftBox .quote {font-size:19px;}
  .privacyPolicyBox h3 {font-size: 20px}
  .featureListings li {min-height: 355px}
  .errorbox {padding-top: 200px}
.errorbox h3 {font-size: 16px; padding-bottom: 10px}
.errorbox div {font-size: 40px}
.errorbox span {font-size: 80px}
/*====================1st slider animation mobile==================*/
#slideWrapper{height:300px}
.sprite2 {height: 300px; width: 300px; background-size: 100%}
.gSlide2 {background-position: 0 -845px}
.gSlide3 {background-position: 0 -1265px}
.bb {height:200px}
.two {background-position: 0 -264px}
.three {background-position: 0 -529px}
.four {background-size:100%; top:16%; background-position: 0 -1579px}
.five {background-size:550% auto; top:16%; background-position: 0 -1132px}
.six {background-size:160% auto; left: 43%; background-position: 0 -1146px}
.seven {background-size:900% auto; bottom:-9%; background-position: 0 -1577px}
.eight {background-size:300% auto; left:10%; background-position: 0 -2290px}
/*five*/
@-webkit-keyframes fromRight
  { 
        0% { opacity: 0; right: -100px}
        50% { opacity: 0; right: -100px}
        60% { opacity: 0; right: -100px}
        100% { opacity: 1; right:  10%} 
  }
@-moz-keyframes fromRight
  { 
        0% { opacity: 0; right: -100px}
        50% { opacity: 0; right: -100px}
        60% { opacity: 0; right: -100px}
        100% { opacity: 1; right:  10%} 
  }
@-ms-keyframes fromRight
  { 
        0% { opacity: 0; right: -100px}
        50% { opacity: 0; right: -100px}
        60% { opacity: 0; right: -100px}
        100% { opacity: 1; right:  10%} 
  }
@-o-keyframes fromRight
  { 
        0% { opacity: 0; right: -100px}
        50% { opacity: 0; right: -100px}
        60% { opacity: 0; right: -100px}
        100% { opacity: 1; right:  10%} 
  }
@keyframes fromRight
  { 
        0% { opacity: 0; right: -100px}
        50% { opacity: 0; right: -100px}
        60% { opacity: 0; right: -100px}
        100% { opacity: 1; right:  10%} 
  }
@-webkit-keyframes fromRight2
  { 
        0% { right:  10%}
      100% { right:  5%} 
  }
@-moz-keyframes fromRight2
  { 
        0% { right:  10%}
      100% { right:  5%}
  }
@-ms-keyframes fromRight2
  { 
        0% { right:  10%}
      100% { right:  5%} 
  }
@-o-keyframes fromRight2
  { 
        0% { right:  10%}
      100% { right:  5%} 
  }
@keyframes fromRight2
  { 
        0% { right:  10%}
      100% { right:  5%} 
  }
/*six*/
@-webkit-keyframes fromTopN
  { 
        0% { opacity: 0; top: -100px}
        50% { opacity: 0; top: -100px}
        60% { opacity: 0; top: -100px}
        100% { opacity: 1; top:  18%}
  }
@-moz-keyframes fromTopN
  { 
        0% { opacity: 0; top: -100px}
        50% { opacity: 0; top: -100px}
        60% { opacity: 0; top: -100px}
        100% { opacity: 1; top:  18%}
  }
@-ms-keyframes fromTopN
  { 
        0% { opacity: 0; top: -100px}
        50% { opacity: 0; top: -100px}
        60% { opacity: 0; top: -100px}
        100% { opacity: 1; top:  18%}
  }
@-o-keyframes fromTopN
  { 
        0% { opacity: 0; top: -100px}
        50% { opacity: 0; top: -100px}
        60% { opacity: 0; top: -100px}
        100% { opacity: 1; top:  18%}
  }
@keyframes fromTopN
  { 
        0% { opacity: 0; top: -100px}
        50% { opacity: 0; top: -100px}
        60% { opacity: 0; top: -100px}
        100% { opacity: 1; top:  18%}
  }
@-webkit-keyframes fromTopN2
  { 
         0% { top:  18%}
      100% { top:  0%}
  }
@-moz-keyframes fromTopN2
  { 
         0% { top:  18%}
      100% { top:  0%} 
  }
@-ms-keyframes fromTopN2
  { 
         0% { top:  18%}
      100% { top:  0%} 
  }
@-o-keyframes fromTopN2
  { 
         0% { top:  18%}
      100% { top:  0%}
  }
@keyframes fromTopN2
  { 
         0% { top:  18%}
      100% { top:  0%} 
  } 
/*eight*/
@-webkit-keyframes fromBtmN
  { 
    0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        60% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  -10%}
  }
@-moz-keyframes fromBtmN
  { 
    0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        60% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  -10%}
  }
@-ms-keyframes fromBtmN
  { 
    0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        60% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  -10%}
  }
@-o-keyframes fromBtmN
  { 
    0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        60% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  -10%}
  }
@keyframes fromBtmN
  { 
    0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        60% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  -10%}
  }
@-webkit-keyframes fromBtmN2
  { 
        0% { bottom:-10%}
      100% { bottom:-10%} 
  }
@-moz-keyframes fromBtmN2
  { 
        0% { bottom:-10%}
      100% { bottom:-10%} 
  }
@-ms-keyframes fromBtmN2
  { 
        0% { bottom:-10%}
      100% { bottom:-10%} 
  }
@-o-keyframes fromBtmN2
  { 
        0% { bottom:-10%}
      100% { bottom:-10%} 
  }
@keyframes fromBtmN2
  { 
        0% { bottom:-10%}
      100% { bottom:-10%} 
  }
/*====================2nd slider animation==============================*/
#slideWrapper2{position:relative; width:300px; height:200px; margin:0 auto}
.tpSlide3 {background-position: 0 -422px}
.globe{right:26%; bottom:-25%; width:156px; height:178px; background-size: cover}
.bull { width:13px; height:13px; background-position: -100px -2432px}
.bul1 {top:46%; left:34%}
.bul2 {top:65%; left:41%}
.bul3 {top:81%; left:44%}
.bul4 {top:68%; right:34%}
.server{width: 122px; height: 97px; background-size: cover; bottom: -32%; background-position: 29px -225px}   
.computer {width: 145px; height: 98px; background-size: cover; right:3%; background-position: 0 -467px}
.globeLht {width: 48px; height:97px; top:44%; left:5%; background-size:330% auto; 
  background-position:0 -725px}
.globeRht {width: 111px; height: 120px; top:34%; right:-2%; background-size:120% auto; 
  background-position:0 -790px }
 /*server*/
@-webkit-keyframes fromLeftg
{ 
  0% { opacity: 0; left: -100px}
  50% { opacity: 0; left: -100px}
  70% { opacity: 0; left: -100px}
  100% { opacity: 1; left:  3%}
}
@-moz-keyframes fromLeftg
{ 
  0% { opacity: 0; left: -100px}
  50% { opacity: 0; left: -100px}
  70% { opacity: 0; left: -100px}
  100% { opacity: 1; left:  3%}
}
@-ms-keyframes fromLeftg
{ 
  0% { opacity: 0; left: -100px}
  50% { opacity: 0; left: -100px}
  70% { opacity: 0; left: -100px}
  100% { opacity: 1; left:  3%}
}
@-o-keyframes fromLeftg
{ 
  0% { opacity: 0; left: -100px}
  50% { opacity: 0; left: -100px}
  70% { opacity: 0; left: -100px}
  100% { opacity: 1; left:  3%}
}
@keyframes fromLeftg
{ 
  0% { opacity: 0; left: -100px}
  50% { opacity: 0; left: -100px}
  70% { opacity: 0; left: -100px}
  100% { opacity: 1; left:  3%}
}
@-webkit-keyframes fromLeftg2
{ 
  0% { left:  3%}
  100% { left:  0} 
}
@-moz-keyframes fromLeftg2
{ 
  0% { left:  3%}
  100% { left:  0} 
}
@-ms-keyframes fromLeftg2
{ 
  0% { left:  3%}
  100% { left:  0} 
}
@-o-keyframes fromLeftg2
{ 
  0% { left:  3%}
  100% { left:  0} 
}
@keyframes fromLeftg2
{ 
  0% { left:  3%}
  100% { left:  0} 
}
/*server*/
/*computer*/
@-webkit-keyframes fromBtmg
  { 
        0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        70% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  -33%} 
  }
@-moz-keyframes fromBtmg
  { 
        0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        70% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  -33%} 
  }
@-ms-keyframes fromBtmg
  { 
        0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        70% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  -33%} 
  }
@-o-keyframes fromBtmg
  { 
        0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        70% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  -33%} 
  }
@keyframes fromBtmg
  { 
        0% { opacity: 0; bottom: -100px}
        50% { opacity: 0; bottom: -100px}
        70% { opacity: 0; bottom: -100px}
        100% { opacity: 1; bottom:  -33%} 
  }
@-webkit-keyframes fromBtmg2
  { 
        0% { bottom:-33%}
      100% { bottom:0} 
  }
@-moz-keyframes fromBtmg2
  { 
        0% { bottom:-33%}
      100% { bottom:0} 
  }
@-ms-keyframes fromBtmg2
  { 
        0% { bottom:-33%}
      100% { bottom:0} 
  }
@-o-keyframes fromBtmg2
  { 
        0% { bottom:-33%}
      100% { bottom:0} 
  }
@keyframes fromBtmg2
  { 
        0% { bottom:-33%}
      100% { bottom:0} 
  }
/*computer*/

}
@media only screen and (max-width:600px) {
	.aboutListing .txtWrap {width: 70%}
  .featureListings li {min-height: 380px}
}
@media only screen and (max-width:550px) {
	.featureListings li {width: 100%; padding-left: 0; min-height: 0}
	.aboutWrap .leftBox {width: 100%; float: none}
	.aboutWrap .rightBox {width: 100%; float: none;; padding-left: 0}
	.aboutListing .txtWrap {width: 86%}
  .featureListings .imgWrap {padding-bottom: 20px}
  .quote .quoteTxt {width: 80%}
  .customDropdown:after {right:-7px}
  .form .fb, .form .in {width: 79%; padding: 12px 2% 12px 18%}
}
@media only screen and (max-width:480px) {
  /*Custom Header Banner Start*/
  .cust-bdy footer{padding-bottom:100px}
  /*Custom Header Banner End*/
	.form .sInputW, .form .xsInputW {width: 100%; text-align: center}
	.form .fb, .form .in {width: 85%; padding: 12px 2% 12px 12%}
	.form .mobPadB {margin-bottom:33px}
	.form .captcha {width: 100%; margin-right: 0; margin-bottom: 33px}
	.form .xxsInput {width: 95%; padding:12px 2%}
	.form .subBtn {width: 100%}
	.form .captchaWrap {width: 100%}
  .firstBlockInn h2 {font-size: 30px}
  .firstBlockInn p {font-size: 20px}
  .firstBlock {height: 736px}
  .firstBlockInn {padding-top: 45%}
  
  .firstBlockInn h2 {font-size: 25px}
  .firstBlockInn p {font-size: 18px}
  .firstBlockInn .btns {width: 130px; height: 40px; line-height: 40px}
  .firstBlock {height: 480px}
  .firstBlockInn {padding-top: 163px}
  .contentBlockInn {text-align: center}
  .dpText h2 {font-size: 28px; padding-bottom: 20px}
  .dpText p {font-size: 16px; line-height: 25px; width: 95%; margin: 0 auto}
  .featureListings li {min-height: 0; padding-bottom:40px }
  .featureListings .imgWrap {padding-bottom: 20px}
  .featureListings h3 {padding-bottom:10px}
  .featureListings p {line-height:25px}
  .contentBlockInn {padding-top: 10px}
  .abthead {font-size: 28px; padding-bottom: 20px}
  .leftBox p {line-height: 25px; width: 95%; margin: 0 auto; font-size: 16px}
  .quote .qimgWrap {float: none; margin: 0 auto}
  .quote .quoteTxt {float: none; width: 95%; font-size:17px; line-height:26px; margin: 0 auto}
  .txtWrap {text-align: left}
  .aboutListing .txtWrap p {line-height: 25px; font-size: 16px}
  .aboutWrap {padding-bottom: 0}
  .formBlockInn .form {width: 95%}
  footer {padding: 20px 0}
  .copyR, .fLinks {padding-bottom: 15px}
  .fLinks span {display: none}
  .fLinks a {padding-bottom: 5px}
  .formBlockInn h2 {font-size: 28px; padding-top: 30px}
  .formBlockInn h3 {font-size: 20px}
  #scrollTopBtn {width: 40px; height: 40px; background-size:38px auto; bottom: 10px; right: 10px; 
    background: url(../images/BacktotopMob.png) 0 0 no-repeat}
  #scrollUp {width: 40px; height: 40px; background-size:40px 40px; bottom: 10px; right: 10px}
  .headerIn .logo {width: 197px; margin: 0 auto; float: none}
   .privacyPolicyBox p, .privacyPolicyBox li {line-height: 25px; font-size: 16px}
  .form .fb, .form .in { padding: 12px 2% 12px 10%; width: 87%}  
  .error {right: 1px}
  .dpHolders .dpText {padding-top: 10px}
.errorbox h3 {font-size: 15px}
.errorbox div {font-size: 30px}
.errorbox span {font-size: 60px}
} 
@media only screen and (max-width:432px) {
 .fLinks {width: 100%; text-align: center; color: #252525 }
 .form .fb, .form .in { padding: 12px 2% 12px 12%; width: 85%}  
}
@media only screen and (max-width:420px) {
	.firstBlockInn .btnWrap {width: 100%}
	.firstBlockInn .btns {margin-bottom: 10px}  
}    
@media only screen and (max-width:410px) {	
	.fLinks a {display: block}
  .form .fb, .form .in { padding: 12px 2% 12px 13%; width: 84%}  
}      
@media only screen and (max-width:380px) {
	.aboutListing .txtWrap {width: 82%}
  .headerIn h1 img {width: 170px; margin-top: 2px}
  .form .fb, .form .in { padding: 12px 2% 12px 16%; width: 81%} 
  .g-recaptcha iframe, .g-recaptcha div {width: 280px !important;}
  .g-recaptcha iframe .rc-anchor-light {width:278px !important }
  .rc-anchor-normal .rc-anchor-content {width: 185px !important}
  .captchaWrap {width: 282px !important; height:78px !important; margin:0 auto}
}
/*================================================================================================================
                                    14. css3 effects
==================================================================================================================*/
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}


.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}



@-webkit-keyframes flip {
  0% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  0% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  -ms-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-10deg);
    transform: perspective(400px) rotateX(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
}

@keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    -ms-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-10deg);
    -ms-transform: perspective(400px) rotateX(-10deg);
    transform: perspective(400px) rotateX(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    -ms-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
    transform: perspective(400px) rotateY(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateY(10deg);
    transform: perspective(400px) rotateY(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
}

@keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    -ms-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
    -ms-transform: perspective(400px) rotateY(-10deg);
    transform: perspective(400px) rotateY(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateY(10deg);
    -ms-transform: perspective(400px) rotateY(10deg);
    transform: perspective(400px) rotateY(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    -ms-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

/************************************************************************************************************************************************
**************************************************************************************************************************************************/
/*null images*/
.null1 {background:url(../images/bg1.jpg)}
.null2 {background:url(../images/bg2.jpg)}
.null3 {background:url(../images/bg3.jpg)}
.null4 {background:url(../images/bg4.jpg)}
.null5 {background:url(../images/tpSlide.png)}
.null6 {background:url(../images/tpSlide2.png)}
.null7 {background:url(../images/tpSlide3.png)}
.null8 {background:url(../images/gSlide.png)}
.null9 {background:url(../images/gSlide2.png)}
.null10 {background:url(../images/gSlide3.png)}


/*=================css for IE 10/11===============*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
/* IE10+ specific styles go here */  
.customDropdown:after {background-image:none}
   
#slideWrapper {display:none}
/*#slideWrapper2 {display:none}*/
.firstImgTp {background: url(../images/tpSlide.png) 0 0 no-repeat; width:605px; height:600px}
/*.firstImg {background: url(../images/gSlide.png) 0 0 no-repeat; width:605px; height:600px}*/

}



/*=================css fade BG for Login Page===============*/
#container {
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
}

@keyframes backgroundchangeFadeInOut {
  0% {
  opacity:1;
  }
  17% {
  opacity:0;
  }
  25% {
  opacity:0;
  }
  100% {
  opacity:1;
  }
}

@-webkit-keyframes backgroundchangeFadeInOut {
  0% {
  opacity:1;
  }
  17% {
  opacity:0;
  }
  25% {
  opacity:0;
  }
  100% {
  opacity:1;
  }
}

.shotsBg {width: 100%; height: 100%; position: fixed; background-size:cover;
animation-name: backgroundchangeFadeInOut;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
animation-duration: 20s;

-webkit-animation-name: backgroundchangeFadeInOut;
-webkit-animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: infinite;
-webkit-animation-duration: 20s;

-moz-animation-name: backgroundchangeFadeInOut;
-moz-animation-timing-function: ease-in-out;
-moz-animation-iteration-count: infinite;
-moz-animation-duration: 20s;

-ms-animation-name: backgroundchangeFadeInOut;
-ms-animation-timing-function: ease-in-out;
-ms-animation-iteration-count: infinite;
-ms-animation-duration: 20s;

-o-animation-name: backgroundchangeFadeInOut;
-o-animation-timing-function: ease-in-out;
-o-animation-iteration-count: infinite;
-o-animation-duration: 20s;
}
.shotsBg1 {background-image: url(../images/bg4.jpg);
animation-delay: 12s;
-webkit-animation-delay: 12s;
-moz-animation-delay: 12s;
-ms-animation-delay: 12s;
-o-animation-delay: 12s;
}

.shotsBg2 {background-image: url(../images/bg3.jpg);
animation-delay: 8s;
-webkit-animation-delay: 8s;
-moz-animation-delay: 8s;
-ms-animation-delay: 8s;
-o-animation-delay: 8s;
}

.shotsBg3 {background-image: url(../images/bg2.jpg);
animation-delay: 4s;
-webkit-animation-delay: 4s;
-moz-animation-delay: 4s;
-ms-animation-delay: 4s;
-o-animation-delay: 4s;
}

.shotsBg4 {background-image: url(../images/bg1.jpg);
animation-delay: 0s;
-webkit-animation-delay: 0s;
-moz-animation-delay: 0s;
-ms-animation-delay: 0s;
-o-animation-delay: 0s;
}