﻿/*#Homepage#*/

.leftSide .mainBodyMask
{
    padding-left:0px;
    padding-right:0px;
}
.DropDownMenu
{
    margin:0px 14px 0px 15px;
}
/*#Homepage/LeftNav#*/
.leftNav
{
	position:absolute;
	top:40%;
	left:-100px;
	width:38px;
	opacity:0;
	text-align:left;
	padding:0px 0px 1px 0px;
	margin:0px 0px 0px 0px;
	z-index:201;
	
}
.leftNav li
{
	display:block;
	padding:0px 0px 0px 0px;
	text-decoration:none;
	position:relative;
	height:90px;

}
.leftNav li:first-child a,
.leftNav li:first-child .imageAlt span
{
	border-radius:0px 10px 10px 0px;
}
.leftNav .last a,
.leftNav .last .imageAlt span
{
	border-radius:0px 10px 10px 0px;
}
.leftNav li .imageAlt
{
	z-index:2;
	width:37px;
	height:90px;
	background-color:#373737;
	color:#373737;
	cursor:pointer;
    border-radius: 0 10px 10px 0;
}

.leftNav li:first-child .imageAlt span
{
	border-top:none;
}
.leftNav li .imageAlt span
{
	background-image:url(/Images/Homepage/LeftMenuProducts.png);
	background-size:33px 346px;
	border-top:solid 1px #CECECE;
	margin:0px !important;
	width:37px !important;
	background-color:#373737;
}
.leftNav li .imageAlt:hover span
{
	background-color:#222222;
}

.leftNav li .imageAlt:hover span:hover
{
	background-color:#000000;
}
.leftNav li .mobile span
{
	background-position: 1px -83px;
}
.leftNav li .imageAlt.first span {
    background-image:url(/Images/Resized/Half/Homepage/firstLogoSide.png);
	background-size:auto;
    background-position:center
}
.leftNav li .u span
{
	background-position: 1px -264px;
}
.leftNav li:hover .imageAlt
{
	border-radius:0px 10px 10px 0;
    background-color:#000000;
}



/*#Homepage/Content/Page1/scroller#*/

.scroller
{
    border-radius:10px;
    border:solid 8px #F3F1F1;
    box-shadow: 0px 0px 7px rgba(0,0,0,0.4);
    height: 88px;
    margin: 0px;
    padding-top: 27px;
    background-position: 15px -4px;
    float:none;
    clear:both;
    display:inline-block;
    background-color:#FFFFFF;
    position:relative;
}
.scroller .buttons
{
    cursor: pointer;
    position:absolute;
    height: 22px;
    margin: 11px 0 0;
    padding: 25px 0 0 25px;
    width: 25px;
    background-image:url(/Images/Resized/Half/Homepage/Arrows.png);
    background-size:111px 103px;
	background-repeat:no-repeat;
	background-position: -2px -3px;
	left:-30px;
	top:27px;
}
.scroller .buttons.back:hover
{
    background-position:-2px -53px;
}
.scroller .buttons.forward
{
    background-position: -57px -3px;
    right:-30px;
    left:auto;
}
.scroller .buttons.forward:hover
{
    background-position: -57px -53px;
}


.scroller .scrollable
{
    height:74px;
	width:534px;
	background-image:none;
	padding:0px;
	position:relative;
	overflow:hidden;
	margin:0px 10px 0px 10px;
}

.scroller .scrollable .items
{
	width:20000em;
	position:absolute;
}
.scroller .scrollable .items li
{
	height:74px !important;
	width:174px;
	margin:0px;
	background-image:none;
	padding:0px 0px 0px 93px;
	position:relative;
	float:left;
	display: inline-block;
	overflow:hidden;
}
.scroller .scrollable .items li img
{
	max-width:80px;
	max-height:60px;
	position:absolute;
	left:10px;
	top:0px;
}
.scroller .scrollable .items li p
{
    margin:0px;
    text-align:left;
    padding:0px 10px 0px 10px;
}
.scroller .scrollable .items li a
{
	position:absolute;
	left:113px;
	bottom:2px;
}



.leftSide
{
    height:500%;
}

.mainBodyMaskWrapper,
.mainBodyMask
{
    position:static !important;
    height:100%;
    min-height:0px;
}
.page
{
    height:20%;
    position:relative;
    overflow:hidden;
    background-color:#FFFFFF;
}

.BottomColor
{
    position:absolute;
    height:20%;
    width:100%;
    bottom:0px;
    left:0px;
    z-index:2;
    text-align:center;
}

.BottomColor div
{
    z-index:1000;
    position:absolute;
    bottom:10px;
    left:0px;
    width:100%;
    text-align:center;
    display:none;
}
.BottomColor div a
{
    background-image:url(/Images/Resized/Half/Homepage/DownDoubleArrow.png);
    width:24px;
    height:25px;
    display:inline-block;
    background-size:100% 100%;

    display:none;
}

.corporate .BottomColor
{
    background-color:#ED7824;
}
.scrollerContainer
{
    position:absolute;
    bottom:9%;
    z-index:10;
    width:100%;
    text-align:center;
}

/* Airplane animation */


.EngagingContainer
{
    text-align:center;
    width:100%;
    display:block;
    position:absolute;
    top:15%;
}
.Engaging
{
    height: 240px;
    width: 600px;
    margin:0px;
    padding:0px;
    z-index:2;
    max-width:90%;
    color:#FFFFFF;
}
.Engaging span
{   
    background-image: url(/Images/Resized/Half/Homepage/Cloud.png);
    background-position:center top;
    background-repeat:no-repeat;
    background-size:100% auto;
}
.Airplane
{
    background-image:url(/Images/Homepage/Airplane.png);
    background-repeat:no-repeat;
    display:inline-block;
    width:49px;
    height:26px;
    position:absolute;
    z-index:1;
    right:-50px;
    top:47%;
    -webkit-transform: rotate(5deg);
    -moz-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    -o-transform: rotate(5deg);
    transform: rotate(5deg);
    -webkit-animation: flyingAirplain 8s 1 linear 1s;
    -moz-animation: flyingAirplain 8s 1 linear 1s;
    -ms-animation: flyingAirplain 8s 1 linear 1s;
    -o-animation: flyingAirplain 8s 1 linear 1s;
    animation: flyingAirplain 8s 1 linear 1s;
}
.Globe
{
    background-image:url(/Images/Resized/Half/Homepage/Globe.png);
    background-repeat:no-repeat;
    display:inline-block;
    background-size:100% 100%;
    width:728px;
    height:728px;
    position:absolute;
    z-index:1;
    right:-30%;
    top:50%;
	 -webkit-animation: spin 280s infinite linear;
     -moz-animation: spin 280s infinite linear;
      -ms-animation: spin 280s infinite linear;
       -o-animation: spin 280s infinite linear;
          animation: spin 280s infinite linear;
}
.City
{
    background-image:url(/Images/Resized/Half/Homepage/City.png);
    background-repeat:no-repeat;
    background-position:right bottom;
    background-size:100% auto;
    max-width:100%;
    display:none;
    width:407px;
    height:108px;
    position:absolute;
    z-index:1;
    right:-2%;
    bottom:51%;
}


.page h2,
.page h3
{
    margin:0px;
    padding:0px;
}


.mobile .BottomColor
{
    background-color:#07b8e2;
}
.first .BottomColor
{
    background-color:#2a2d33;
}

a.como_btn_container,
a.first_btn_container {
   display:block;
   top:260px;
   left:80px;
   position:absolute;
   width:309px;
   height:84px;
   background-image:url(/Images/Resized/Half/Homepage/creat_my_app.jpg);
   background-position: top center;
   border-radius: 2px;
}
a.first_btn_container {
   top:360px;
   left:80px;
   background-color:#ffb612;
   background-image:url(/Images/Resized/Half/Homepage/go_first.png);
   z-index:11;
}

a.como_btn_container:hover,
a.first_btn_container:hover {
    background-position-y:84px;
}

.page .LogoContainer
{
    position:absolute;
    top:175px;
    left:80px;
    z-index:12;
}

.page .LogoContainer a span
{
    background-size:100% auto;
}
.page.mobile .LogoContainer a
{
    width:224px;
    height:62px; 
}
.page .LogoContainer .como_main_logo {
    background-image:url(/Images/Resized/Half/Homepage/como_main_logo.png);
    width:200px;
    height:47px;
}

.page.first .LogoContainer a
{
    width: 112px;
    height: 64px;
    color:white;
}
.page.first .LogoContainer a span {
    background-image:url(/Images/Resized/Half/Homepage/MainLogosFirst.png);
    background-position:top left !important;
    background-size:auto;
}

.page h2
{
    color: #868686;
    font-family: MuseoSansRounded-300;
    font-size: 18px;
    line-height: 23px;
    text-align: left;
    width: 342px;
    position:absolute;
    left:80px;
    top:250px;
    font-weight:normal;
    z-index:12;
    max-width:80%;
}
.page.first h2{
    color:#2a2d33;
    width:370px;
}

.page.u .LogoContainer
{
    position:absolute;
    left:0px;
    top:290px;
    width:100%;
    text-align: center;
}
.page.u .LogoContainer a
{
    width:301px;
    height:413px;
    max-width:80%;
}
.page.u .LogoContainer a span
{
    background-image:url(/Images/Homepage/MainLogoU.png);
    background-position:center top;
    background-repeat:no-repeat;
    background-size:100% auto;
}

.page .MainImage
{
    position:absolute;
    display:inline-block;
    z-index:10;
    right:0px;
    max-width:80%;
    background-size:100% auto;
    background-position:center bottom;
    background-repeat:no-repeat;
}

.page.mobile .MainImage
{
    background-image:url(/Images/Resized/Half/Homepage/MainComo.png);
    width:556px;
    height:471px;
}
.page.first .MainImage
{
    background-image:url(/Images/Resized/Half/Homepage/First-hand-half.png);
    width:440px;
    height:432px;
}

.page.u h2
{
    color:#B3B3B3;
    font-family: 'MuseoSansRounded-500';
    font-size: 30px;
    line-height: 54px;
    text-align: center;
    position:absolute;
    left:0px;
    width:100%;
    max-width:100%;
    text-align:center;
    top:140px;
}
.page.u h3
{
    color:#B3B3B3;
    font-family: 'MuseoSansRounded-100';
    font-size: 20px;
    line-height: 36px;
    text-align: center;
    position:absolute;
    left:0px;
    width:100%;
    text-align:center;
    top:190px;
}

.page.u p
{
    color: #868686;
    font-family: 'MuseoSansRounded-300';
    font-size: 15px;
    line-height: 19px;
    padding: 0;
    text-align: center;
    position:absolute;
    left:0px;
    width:100%;
    text-align:center;
    top:230px;
    margin:0px;
}



@media only screen and (min-width: 120px)
{
    .page
    {
        height:100%;
        min-height:440px;
    }
    .page h2,
    .page .LogoContainer,
    a.como_btn_container,
    a.first_btn_container,
    .page.mobile .LogoContainer,
    .page.first .LogoContainer
    {
        left:20px;
        right:auto;
    }
    .page h2
    {
        font-size:14px;
        line-height:18px;
    }
    .Airplane
    {
        display:none;
    }
    .BottomColor
    {
        height:18%;
    }
    .mainBodyMaskWrapper
    {
        overflow:visible;
    }
    .mainBodyMask
    {
        width:100%;
        overflow:visible;
    }
    .leftNav
    {
        display:none;
    }
    .leftSide
    {
        height:100%;
    }
    
    .page.corporate
    {
        height: -moz-calc(100% - 121px);
        height: -webkit-calc(100% - 121px);
        height: -o-calc(100% - 121px);
        height: calc(100% - 121px);
    }
    
    .page.u
    {
        height: -moz-calc(100% - 56px);
        height: -webkit-calc(100% - 56px);
        height: -o-calc(100% - 56px);
        height: calc(100% - 56px);
    }
    
    .scroller .scrollable
    {
        width:240px;
    }
    .scroller .scrollable .items li
    {
        width:160px;
    }
    .Globe
    {
        display:inline-block;
        top:32%;
        right:-30%;
        width:300px;
        height:300px;
    }
    .page.corporate .BottomColor {
        height: 35%;
     }
    .BottomColor div a
    {
        width:12px;
        height:12.5px;
        background-image:url(/Images/Resized/Quarter/Homepage/DownDoubleArrow.png);
    }
    .EngagingContainer
    {
        top:5%;
    }
    .footer
    {
        position:static;
        position:relative;
    } 
    .BottomColor div
    {
        display:block;
        bottom:3px;
    }

    .page.mobile .LogoContainer
    {
        top:30px;

    }
    .page.first .LogoContainer
    {
        top:25px;

    }
    .page.mobile h2
    {
        top:90px;
        color:#2a2d33;
    }
    .page.mobile .MainImage
    {
        background-image:url(/Images/Resized/Quarter/Homepage/MainComo.png);
        bottom:0%;
        height:190px;
        width:224px;
    }
     a.como_btn_container {
        top:160px;
        width: 290px;
    }

    .page.first h2
    {
        top:110px;
    }
    a.first_btn_container {
        top:165px;
        width: 290px;
    }
    .page.first .MainImage {
        background-image: url(/Images/Resized/Quarter/Homepage/First-hand-small.png);
        bottom:0%;
        height:190px;
        width:194px;

    }

    .page.u h2
    {
        font-size:15px;
        line-height:34px;
        top:20px;
        color:#B3B3B3;
    }
    .page.u h3
    {
        color:#B3B3B3;
        font-family: 'MuseoSansRounded-100';
        font-size:12px;
        line-height:28px;
        top:55px;
    }
    .page.u p
    {
        font-size:20px;
        line-height:24px;
        top:90px;
    }
    .page.u .LogoContainer
    {
        top:120px;
    }
    .page.u .LogoContainer a
    {
        width:200px;
    }
    
    .scroller .buttons
    {
        background-image:url(/Images/Resized/half/Homepage/Arrows.png);
    }
    
    .Engaging span
    {   
        background-image: url(/Images/Resized/Quarter/Homepage/Cloud.png);
    }
    .Globe
    {
        background-image:url(/Images/Resized/Quarter/Homepage/Globe.png);
    }
    .City
    {
        background-image:url(/Images/Resized/Quarter/Homepage/City.png);
    }
}


@media
only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 120px),
only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 120px),
only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 120px),
only screen and (        min-device-pixel-ratio: 2)      and (min-width: 120px),
only screen and (                min-resolution: 192dpi) and (min-width: 120px),
only screen and (                min-resolution: 2dppx)  and (min-width: 120px)
{ 
    .scroller .buttons
    {
        background-image:url(/Images/Homepage/Arrows.png);
    }
    .BottomColor div a
    {
        background-image:url(/Images/Resized/Half/Homepage/DownDoubleArrow.png);
    }

    .Engaging span
    {   
        background-image: url(/Images/Resized/Half/Homepage/Cloud.png);
    }
    .Globe
    {
        background-image:url(/Images/Resized/Half/Homepage/Globe.png);
    }
    .City
    {
        background-image:url(/Images/Resized/Half/Homepage/City.png);
    }

    .page h2,
    .page .LogoContainer,
    a.como_btn_container,
    a.first_btn_container,
    .page.mobile .LogoContainer,
    .page.first .LogoContainer
    {
        left:20px;
        right:auto;
    }

    .page.mobile .MainImage
    {
        background-image:url(/Images/Resized/Quarter/Homepage/MainComo.png);
    }
    .page.first .MainImage
    {
        background-image: url(/Images/Resized/Quarter/Homepage/First-hand-small.png);
    }
}


@media only screen and (min-width: 480px)
{
    .page {
        min-height:1px;
    }
    .scrollerContainer
    {
        display:none;
    }
    .Globe
    {
        display:none;
    }
    .Engaging
    {
        width:280px;
        height:120px;
    }
    .BottomColor
    {
        height:15%;
    }
    .City
    {
        display:inline-block;
        width:250px;
        bottom:10%;
    }
    .page.corporate .BottomColor
    {
        height:14%;
    }
    
    .page.mobile .LogoContainer,
    .page.first .LogoContainer,
    .page h2,
    .page .LogoContainer,
    a.como_btn_container,
    a.first_btn_container
    {
        left:60px;
    }
     a.como_btn_container {
       top:160px;
       width:309px;
     }
     a.first_btn_container {
        top:175px;
        width:309px;
    }
    .page.mobile .MainImage
    {
        background-image:url(/Images/Resized/Quarter/Homepage/MainComo.png);
        width:236px;
        height:200px;
    }
    .page.first .MainImage
    {
        background-image: url(/Images/Resized/Quarter/Homepage/First-hand-small.png);
        height:280px;
        width:275px;
    }

    .page.u .LogoContainer
    {
        top:120px;
    }
    .page.u .LogoContainer a
    {
        width:200px;
    }
    
    .Engaging span
    {   
        background-image: url(/Images/Resized/Quarter/Homepage/Cloud.png);
    }
    .Globe
    {
        background-image:url(/Images/Resized/Quarter/Homepage/Globe.png);
    }
    .City
    {
        background-image:url(/Images/Resized/Quarter/Homepage/City.png);
    }
}


@media
only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 480px),
only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 480px),
only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 480px),
only screen and (        min-device-pixel-ratio: 2)      and (min-width: 480px),
only screen and (                min-resolution: 192dpi) and (min-width: 480px),
only screen and (                min-resolution: 2dppx)  and (min-width: 480px)
{ 
    .Engaging span
    {   
        background-image: url(/Images/Resized/Half/Homepage/Cloud.png);
    }
    .Globe
    {
        background-image:url(/Images/Resized/Half/Homepage/Globe.png);
    }
    .City
    {
        background-image:url(/Images/Resized/Half/Homepage/City.png);
    }

    .page.mobile .LogoContainer,
    .page.first .LogoContainer,
    .page h2,
    .page .LogoContainer,
    a.como_btn_container,
    a.first_btn_container
    {
        left:60px;
    }
    .page.mobile .MainImage
    {
        background-image:url(/Images/Resized/Quarter/Homepage/MainComo.png);
    }
    .page.first .MainImage
    {
         background-image: url(/Images/Resized/Quarter/Homepage/First-hand-small.png);
        height:280px;
        width:275px;
    }
}

@media only screen and (min-width: 600px)
{
    .scrollerContainer
    {
        display:block;
        bottom:8%;
    }
    .scroller .scrollable
    {
        width:267px;
    }
    .scroller .scrollable .items li
    {
        width:174px;
    }

    .page.mobile .LogoContainer,
    .page.first .LogoContainer,
    .page h2,
    .page .LogoContainer,
    a.como_btn_container,
    a.first_btn_container
    {
        left:80px;
    }
    .page h2
    {
        font-size:18px;
        line-height:23px;
    }
    .page.mobile .LogoContainer a
    {
        width:233px;
        height:63px;
    }
     .page.mobile .LogoContainer
    {
        top:110px;
    }
    .page.mobile h2
    {
        top:180px;
        color:#2a2d33;
    }
    .page.mobile .MainImage
    {
        background-image:url(/Images/Resized/Quarter/Homepage/MainComo.png);
        width:236px;
        height:200px;
    }
    a.como_btn_container {
        top: 255px;
        margin-top:5px;
    }

    .page.first .MainImage
    {
        background-image: url(/Images/Resized/Quarter/Homepage/First-hand-small.png);
        width:280px;
        height:275px;
    }
    .page.first .LogoContainer
    {
        top:30px;
    }
    .page.first h2
    {
        top:120px;
        width: 309px;
}
    a.first_btn_container {
        top: 200px;
    }

    .page.u h2
    {
        color:#B3B3B3;
        font-size:30px;
        line-height:54px;
        top: 110px;
    }
    .page.u h3
    {
        color:#B3B3B3;
        font-family: 'MuseoSansRounded-100';
        font-size:20px;
        line-height: 26px;
        top: 170px;
    }
    .page.u p
    {
        font-size:15px;
        line-height:19px;
        top:230px;
    }
    .page.u .LogoContainer
    {
      top: 170px;
    }
    .page.u .LogoContainer a
    {
        width:413px;
    }

    .Engaging span
    {   
        background-image: url(/Images/Resized/Half/Homepage/Cloud.png);
    }
    .Globe
    {
        background-image:url(/Images/Resized/Half/Homepage/Globe.png);
    }
    .City
    {
        background-image:url(/Images/Resized/Half/Homepage/City.png);
    }
}

@media
only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 600px),
only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 600px),
only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 600px),
only screen and (        min-device-pixel-ratio: 2)      and (min-width: 600px),
only screen and (                min-resolution: 192dpi) and (min-width: 600px),
only screen and (                min-resolution: 2dppx)  and (min-width: 600px)
{ 
    
    

    .Engaging span
    {   
        background-image: url(/Images/Homepage/Cloud.png);
    }
    .Globe
    {
        background-image:url(/Images/Homepage/Globe.png);
    }
    .City
    {
        background-image:url(/Images/Homepage/City.png);
    }

    .page.mobile .LogoContainer,
    .page.first .LogoContainer,
    .page h2,
    .page .LogoContainer,
    a.como_btn_container,
    a.first_btn_container
    {
        left:80px;
    }
    .page.mobile .MainImage
    {
        background-image:url(/Images/Resized/Quarter/Homepage/MainComo.png);
    }
    .page.first .MainImage
    {
       background-image: url(/Images/Resized/Quarter/Homepage/First-hand-small.png);
    }
}


@media only screen and (min-width: 640px)
{
    .scroller .scrollable
    {
        width:534px;
    }
    .City
    {
        display:none;
    }
    .Globe
    {
        display:inline-block;
        width:728px;
        height:728px;
        top:45%;
    }
    .Engaging
    {
        width:600px;
        height:240px;
    }
    .Airplane
    {
        display:inline-block;
    }
    .BottomColor div a
    {
        width: 24px;
        height: 25px;
        background-image:url(/Images/Resized/Half/Homepage/DownDoubleArrow.png);
    }
    .BottomColor div 
    {
        bottom:10px;
    }
    .leftNav
    {
        display:inline-block;
    }
    .page.corporate .BottomColor
    {
        height:18%;
    }
    .EngagingContainer
    {
        top:10%;
    }  
    
    .page.mobile .LogoContainer
    {
        top:110px;
    }
    .page.mobile h2
    {
        top:180px;
    }
    a.como_btn_container {
        top:280px;
    }
    .page.mobile .MainImage
    {
        background-image:url(/Images/Resized/Quarter/Homepage/MainComo.png);
        width:236px;
        height:200px;
    }

    .page.first .LogoContainer
    {
        top:110px;
    }
    .page.first h2
    {
        top:210px;
        color:#2a2d33;
    }
    a.first_btn_container {
        top:290px;
    }
    .page.first .MainImage
    {
        background-image: url(/Images/Resized/Quarter/Homepage/First-hand-small.png);
        height: 280px;
        width: 275px;
    }  

    .page.u .LogoContainer a
    {
        width:320px;

    }

    .scroller .buttons
    {
        background-image:url(/Images/Resized/Half/Homepage/Arrows.png);
    }
}


@media
only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 640px),
only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 640px),
only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 640px),
only screen and (        min-device-pixel-ratio: 2)      and (min-width: 640px),
only screen and (                min-resolution: 192dpi) and (min-width: 640px),
only screen and (                min-resolution: 2dppx)  and (min-width: 640px)
{ 
    .scroller .buttons
    {
        background-image:url(/Images/Homepage/Arrows.png);
    }
    .BottomColor div a
    {
        background-image:url(/Images/Homepage/DownDoubleArrow.png);
    }
}

@media only screen and (min-width: 810px)
{
    .page.corporate
    {
        height: -moz-calc(100% - 95px);
        height: -webkit-calc(100% - 95px);
        height: -o-calc(100% - 95px);
        height: calc(100% - 95px);
    }
    .EngagingContainer
    {
        top:8%;
    }
    .page.mobile .MainImage
    {
        background-image:url(/Images/Resized/Half/Homepage/MainComo.png);
        width:450px;
        height:381px;
    }
    .page.first .MainImage {
        background-image: url(/Images/Resized/Half/Homepage/First-hand-half.png);
        width: 440px;
        height: 432px;
    }
   
}

@media only screen and (min-width: 1024px)
{
    .BottomColor div a
    {
        display:none;
    }

    .page.mobile .MainImage
    {
        width:450px;
        height:381px;
    }

    .page.first .MainImage
    {
        background-image:url(/Images/Resized/Half/Homepage/First-hand-half.png);
        width:440px;
        height:432px;
    }
    .page.first .LogoContainer
    {
        top:110px;
    }
    .page.first h2
    {
        top:210px;
        color:#2a2d33;
        width: 350px;
    }
    a.first_btn_container {
        top:290px;
    }
    
    .page.u .LogoContainer a
    {
        width:320px;
    }
}

@media only screen and (min-width: 1367px)
{
    .BottomColor div a
    {
        display:none;
    }

    .page.mobile .MainImage
    {
        width:556px;
        height:471px;
    }
    .page.first .MainImage
  {
        background-image: url(/Images/Resized/Half/Homepage/First-hand.png);
        height:535px;
        width:525px;
    }

}





@-webkit-keyframes spin
{
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(360deg); }
}
@-moz-keyframes spin
{
	from { -moz-transform: rotate(0deg); }
	to { -moz-transform: rotate(360deg); }
}
@-ms-keyframes spin
{
	from { -ms-transform: rotate(0deg); }
	to { -ms-transform: rotate(360deg); }
}
@-o-keyframes spin
{
	from { -o-transform: rotate(0deg); }
	to { -o-transform: rotate(360deg); }
}
@keyframes spin
{
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

@-webkit-keyframes flyingAirplain 
{
    0%    {right:-10%;top:48%;-webkit-transform: rotate(5deg);}
    30%   {right:30%;top:47%;-webkit-transform: rotate(15deg);}
    70%   {right:35%;top:47%;-webkit-transform: rotate(360deg);-webkit-transform: right bottom;-webkit-transform-origin:80% -600%;}
    100%  {right:110%;top:47%;-webkit-transform: rotate(370deg);}
}

@-moz-keyframes flyingAirplain 
{
    0%    {right:-10%;top:48%;-moz-transform: rotate(5deg);}
    30%   {right:30%;top:47%;-moz-transform: rotate(15deg);}
    70%   {right:35%;top:47%;-moz-transform: rotate(360deg);-moz-transform: right bottom;-moz-transform-origin:80% -600%;}
    100%  {right:110%;top:47%;-moz-transform: rotate(370deg);}
}

@-ms-keyframes flyingAirplain
{
    0%    {right:-10%;top:48%;-ms-transform: rotate(5deg);}
    30%   {right:30%;top:47%;-ms-transform: rotate(15deg);}
    70%   {right:35%;top:47%;-ms-transform: rotate(360deg);-ms-transform: right bottom;-ms-transform-origin:80% -600%;}
    100%  {right:110%;top:47%;-ms-transform: rotate(370deg);}
}

@-o-keyframes flyingAirplain
{
    0%    {right:-10%;top:48%;-o-transform: rotate(5deg);}
    30%   {right:30%;top:47%;-o-transform: rotate(15deg);}
    70%   {right:35%;top:47%;-o-transform: rotate(360deg);-o-transform: right bottom;-o-transform-origin:80% -600%;}
    100%  {right:110%;top:47%;-o-transform: rotate(370deg);}
}

@keyframes flyingAirplain
{
 
    30%   {right:30%;top:47%;transform: rotate(15deg);}
    70%   {right:35%;top:47%;transform: rotate(360deg);transform: right bottom;transform-origin:80% -600%;}
    100%  {right:110%;top:47%;transform: rotate(370deg);}
}
