@charset "UTF-8";
/* CSS Document */

*,
*:after,
*:before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

body,
body * {
    position: absolute;
    vertical-align: baseline;
    border: 0 none;
    outline: 0;
    padding: 0;
    margin: 0;
    cursor: pointer;
}

#main_wrapper {
    position: absolute;
    display: block;
    width: 970px;
    height: 250px;
    overflow: hidden;
    background-color: #2E234B;
    opacity: 0;
}

#frame {
    position: absolute;
    display: block;
    width: 970px;
    height: 250px;
    border: 1px solid #555555;
    z-index: 5;
}

.active#main_wrapper {
    opacity: 1;
}

#searchField {
    left: 335px;
    position: absolute;
    display: block;
    width: 300px;
    height: 250px;
}

#animateOutline {
    left: 23px;
    top: 92px;
    width: 254px;
}

.cls-100 {
    transform: translate(1px, 1px);
    box-sizing: border-box;
    stroke-width: 2;
    stroke: #eeeeee;
    fill: transparent;
    animation: dash 1s linear;
    animation-fill-mode: forwards;
}

#searchMask {
    top: 107px;
    position: absolute;
    display: block;
    width: 970px;
    height: 50px;
}

#copyFrame1,
#copyFrame2 {
    position: absolute;
    display: block;
    width: 970px;
    height: 250px;
}

#searchCopy {
    left: 38px;
    position: absolute;
    display: block;
    width: 218px;
    height: 37px;
}

#symbol {
    position: absolute;
    display: block;
    top: 54px;
    left: 16px;
    width: 201.6px;
    height: 25.1px;
}

#logo_name {
    position: absolute;
    display: block;
    background: url('img/logo.svg') no-repeat;
    background-size: 970px 250px;
    width: 970px;
    height: 250px;
}

#mask11 {
    position: absolute;
    display: block;
    top: 98px;
    width: 970px;
    height: 36px;
    overflow: hidden;
}

#copy11 {
    top: 1px;
    left: 98px;
    position: absolute;
    display: block;
	background: url('img/copy1.svg') no-repeat -98px -99px;
	background-size: 970px 250px;
	width: 80px;
	height: 34px;
}

#copy12 {
    top: 1px;
    left: 190px;
    position: absolute;
    display: block;
    background: url('img/copy1.svg') no-repeat -190px -99px;
    background-size: 970px 250px;
    width: 86px;
    height: 26px;
}

#copy13 {
    top: 1px;
    left: 287px;
    position: absolute;
    display: block;
	background: url('img/copy1.svg') no-repeat -287px -98px;
	background-size: 970px 250px;
	width: 60px;
	height: 26px;
}

#copy14 {
    top: 7px;
    left: 357px;
    position: absolute;
    display: block;
	background: url('img/copy1.svg') no-repeat -357px -105px;
	background-size: 970px 250px;
	width: 74px;
	height: 28px;
}
#copy15 {
    left: 441px;
    position: absolute;
    display: block;
	background: url('img/copy1.svg') no-repeat -441px -98px;
	background-size: 970px 250px;
	width: 182px;
	height: 26px;
}
#copy16 {
    top: 2px;
    left: 634px;
    position: absolute;
    display: block;
	background: url('img/copy1.svg') no-repeat -634px -100px;
	background-size: 970px 250px;
	width: 134px;
	height: 26px;
}
#copy17 {
    left: 779px;
    position: absolute;
    display: block;
	background: url('img/copy1.svg') no-repeat -779px -98px;
	background-size: 970px 250px;
	width: 94px;
	height: 34px;
}


/*////////////////////////////////copy 2///////////////////////////////////////////*/

#mask21 {
    position: absolute;
    display: block;
    top: 97px;
    width: 970px;
    height: 38px;
    overflow: hidden;
}
#copy21 {
    top: 2px;
    left: 153px;
    position: absolute;
    display: block;
	background: url('img/copy2.svg') no-repeat -153px -99px;
	background-size: 970px 250px;
	width: 86px;
	height: 26px;
}

#copy22 {
    top: 1px;
    left: 249px;
    position: absolute;
    display: block;
	background: url('img/copy2.svg') no-repeat -249px -98px;
	background-size: 970px 250px;
	width: 62px;
	height: 28px;
}

#copy23 {
    left: 320px;
    position: absolute;
    display: block;
	background: url('img/copy2.svg') no-repeat -320px -97px;
	background-size: 970px 250px;
	width: 116px;
	height: 28px;
}

#copy24 {
    top: 1px;
    left: 449px;
    position: absolute;
    display: block;
	background: url('img/copy2.svg') no-repeat -449px -98px;
	background-size: 970px 250px;
	width: 112px;
	height: 36px;
}
#copy25 {
    top: 1px;
    left: 574px;
    position: absolute;
    display: block;
	background: url('img/copy2.svg') no-repeat -574px -98px;
	background-size: 970px 250px;
	width: 158px;
	height: 28px;
}
#copy26 {
    left: 744px;
    position: absolute;
    display: block;
	background: url('img/copy2.svg') no-repeat -744px -97px;
	background-size: 970px 250px;
	width: 74px;
	height: 28px;
}


/*////////////////////////////////copy 3///////////////////////////////////////////*/
#mask31 {
    position: absolute;
    display: block;
    top: 17px;
    width: 970px;
    height: 16px;
    overflow: hidden;
}

#mask32 {
    position: absolute;
    display: block;
    top: 158px;
    width: 970px;
    height: 44px;
    overflow: hidden;
}

#mask33 {
    position: absolute;
    display: block;
    top: 202px;
    width: 970px;
    height: 34px;
    overflow: hidden;
}

#copy30 {
    top: 161px;
    left: 54px;
    position: absolute;
    display: block;
	background: url('img/copy3.svg') no-repeat -16px -161px;
	background-size: 970px 250px;
	width: 262px;
	height: 74px;
    transform: skew(-30deg);
}

#copy31 {
    left: 16px;
    position: absolute;
    display: block;
	background: url('img/copy3.svg') no-repeat -16px -17px;
	background-size: 970px 250px;
	width: 56px;
	height: 16px;
}

#copy32 {
    left: 287px;
    position: absolute;
    display: block;
    background: url('img/copy3.svg') no-repeat -287px -158px;
    background-size: 970px 250px;
    width: 174px;
    height: 44px;
}

#copy33 {
    left: 286px;
    position: absolute;
    display: block;
    background: url('img/copy3.svg') no-repeat -286px -202px;
    background-size: 970px 250px;
    width: 266px;
    height: 34px;
}

#arrowMask {
    position: absolute;
    display: block;
    top: 18px;
    left: 84px;
    width: 970px;
    height: 16px;
    overflow: hidden;
}

#arrow {
    top: 4px;
    position: absolute;
    display: block;
	background: url('img/copy3.svg') no-repeat -84px -21px;
	background-size: 970px 250px;
	width: 12px;
	height: 8px;
}

/*////////////////////////////////copy 4///////////////////////////////////////////*/
#mask40 {
    position: absolute;
    display: block;
    top: 152px;
    width: 970px;
    height: 30px;
    overflow: hidden;
}

#mask41 {
    position: absolute;
    display: block;
    top: 14px;
    width: 970px;
    height: 28px;
    overflow: hidden;
}

#mask42 {
    position: absolute;
    display: block;
    top: 14px;
    width: 970px;
    height: 38px;
    overflow: hidden;
}

#mask43 {
    position: absolute;
    display: block;
    top: 52px;
    width: 970px;
    height: 38px;
    overflow: hidden;
}

#mask44 {
    position: absolute;
    display: block;
    top: 52px;
    width: 970px;
    height: 30px;
    overflow: hidden;
}

#copy40 {
    position: absolute;
    display: block;
    background: url('img/copy4.svg') no-repeat 0px -152px;
    background-size: 970px 250px;
    width: 970px;
    height: 30px;
}

#copy41 {
    left: 289px;
    position: absolute;
    display: block;
    background: url('img/copy4.svg') no-repeat -289px -14px;
    background-size: 970px 250px;
    width: 164px;
    height: 28px;
}

#copy42 {
    left: 466px;
    position: absolute;
    display: block;
    background: url('img/copy4.svg') no-repeat -466px -14px;
    background-size: 970px 250px;
    width: 152px;
    height: 38px;
}

#copy43 {
    left: 288px;
    position: absolute;
    display: block;
    background: url('img/copy4.svg') no-repeat -288px -52px;
    background-size: 970px 250px;
    width: 116px;
    height: 38px;
}

#copy44 {
    left: 416px;
    position: absolute;
    display: block;
    background: url('img/copy4.svg') no-repeat -416px -52px;
    background-size: 970px 250px;
    width: 76px;
    height: 30px;
}

/*///////////////////////////////////////////////////////////////////////////////////////*/

#ticker1 {
    width: 970px;
    height: 31px;
    bottom: 0px;
    background-color: #eeeeee;
}

.ticker1 {
    top: 0px;
    right: 0;
    background: url('img/ticker1.svg') repeat-x;
    background-size: 160px 30px;
    width: 2088px;
    height: 30px;
}

.ticker2 {
    top: 6px;
    background: url('img/ticker2.svg') repeat-x;
    background-size: 162px 19px;
    width: 2000px;
    height: 19px;
}

#ticker2 {
    width: 1000px;
    height: 31px;
    bottom: 0px;
    background-color: #2E234B;
    transform: skewX(-30deg);
}

#ticker21 {
    right: 10px;
}

#white_plane {
    position: absolute;
    display: block;
    width: 970px;
    height: 250px;
    background-color: #fff;
}

#skewedMask {
    left: -80px;
    position: absolute;
    display: block;
    width: 1130px;
    height: 250px;
    background-color: #eeeeee;
    transform: skew(30deg);
    overflow: hidden;
}

/*////////////////////////////////////////////////////// CTA //////////////////////////////////////////////////////////////*/

#CTA {
    position: absolute;
    display: block;
    left: 782px;
    top: 140px;
    width: 150px;
    height: 50px;
}