/* montserrat-regular - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/montserrat-v15-latin/montserrat-v15-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-regular.svg#Montserrat') format('svg'); /* Legacy iOS */
	}

/* montserrat-600 - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/montserrat-v15-latin/montserrat-v15-latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-600.woff') format('woff'), /* Modern Browsers */
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-600.svg#Montserrat') format('svg'); /* Legacy iOS */
	}

/* montserrat-700 - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/montserrat-v15-latin/montserrat-v15-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-700.woff') format('woff'), /* Modern Browsers */
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/montserrat-v15-latin/montserrat-v15-latin-700.svg#Montserrat') format('svg'); /* Legacy iOS */
	}





	html,body {
		height: 100%;
		width: 100%;
		margin:0;
		padding:0;
		background: rgb(137,153,175);
		font-family:'Montserrat', sans-serif;
		font-weight:400;
		font-size:2.5vh;
		color:#13335e;
		line-height:130%;
		}
	body {
		background: rgb(137,153,175);
		background: -moz-linear-gradient(180deg, rgba(255,255,255,1) 50%, rgba(137,153,175,1) 100%);
		background: -webkit-linear-gradient(180deg, rgba(255,255,255,1) 50%, rgba(137,153,175,1) 100%);
		background: linear-gradient(180deg, rgba(255,255,255,1) 50%, rgba(137,153,175,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#8999af",GradientType=1);
		background-repeat:no-repeat;
		  overflow-x: hidden;
		}
	h1 {
		font-size:2.7vh;
		font-family:'Montserrat'; sans-serif;
		font-weight:700;
		/*font-style:italic;*/
		color:#13335e;
		letter-spacing:-0.05vh;
		margin:0;
		padding:0;
		margin-top:-0.75vh
		}
	h2 {
		font-size:2.5vh;
		font-family:'Montserrat'; sans-serif;
		font-weight:400;
		color:#13335e;
		text-transform:uppercase;
		margin:0 0 1vw 0;
		}
	h3 {
		text-align:center;
		}
	a, a:visited {
		color:rgba(19,51,95,1);
		text-decoration:none;
		}
	a:hover {
		color:rgba(19,51,95,0.7);
		}
	.column-wrapper {
		width:100%;
		height:auto;
		display:block;
		float:left;
		text-align:center;
		float:left;
		}
	.left-column {
		width:47.5%;
		float:left;
		text-align:right;
		padding-right:2.5%;
		}
	.right-column {
		width:47.5%;
		float:left;
		text-align:left;
		padding-left:2.5%;
		}
	span.button-flag {
		position:relative;
		height:2.4vh;
		width:3.84vh;
		margin:0 1vh 0 0;
		display:inline-block;
		background-repeat:no-repeat;
		background-size:contain;
		margin-top:-0.5vh;
		}
	.bf-en {background-image:url('flag-en.svg');}
	.bf-cn {background-image:url('flag-cn.svg');}
	.bf-de {background-image:url('flag-de.svg');}
	.c-button a {
		display:inline-block;
		margin:2rem 0;
		background:#173f73;
		padding:1rem 2rem;
		color:#FFF;
		transition: all 0.2s;
		}
	.c-button:hover a {
		display:inline-block;
		margin:2rem 0;
		background:#13335e;
		padding:1rem 2rem;
		color:#FFF;
		}		
	.small {
		padding-top:3rem;
		font-size:70%;
		display:block;
		line-height:110%;
		display:block;
		}
	.small p {margin:0 0 0.5rem 0;}
	.wrapper {
		width: 50%;
		left:50%;
		margin-left:25%;
		text-align:center;
		}
	.wrapper:after {
		content: "";
		display: block;
		padding-bottom: 100%;
		}
	.background-lines {
		position:absolute;
		top:60vh;
		left:0;
		width:100vw;
		height:100vh;
		background-image:url('background-lines.png');
		background-repeat:no-repeat;
		background-size:contain;
		z-index:-100;
		}
	.center-circle {
		background-color: #FFF;
		width: 60%;
		height: auto;
		padding-top:60%;
		margin-left:5%;
		margin-top:-10.5%;
		border-radius: 50%;
		-webkit-box-shadow: 8px 12px 12px 0 rgba(19,51,94,0.25);
		box-shadow: 8px 12px 12px 0 rgba(19,51,94,0.25);
		overflow:visible;
		}
	.center-circle:before {
		position:absolute;
		content:' ';
		background-color:transparent;
		width: 68%;
		height: auto;
		padding-top:68%;
		margin-left:-36%;
		margin-top:-65.5%;
		border-radius: 50%;
		border:1.5vh solid #cad1db
		}
	.center-logo {
		position:absolute;
		top:0;
		left:50%;
		margin-left:-12.0%;
		margin-top:0%;
		display:block;
		width:40.0vh;
		height:40.0vh;
		background-image:url('bluwego-logo.gif');
		background-repeat:no-repeat;
		background-size:contain;
		z-index:1000;
		}
	.mask {
		position:absolute;
		top:0;
		width:50%;
		height:35%;
		background:#FFF;
		z-index:500;
		-webkit-box-shadow: 0px 75px 75px 0 rgba(255,255,255,1);
		box-shadow: 0px 75px 75px 0 rgba(255,255,255,1);
		z-index:500;
		}		
	.rotmenucontainer {
		width:90vh;
		height:90vh;
		margin-left:20%;
		-webkit-transform: translateZ(0);
		-moz-transform: translateZ(0);
		-ms-transform: translateZ(0);
		-o-transform: translateZ(0);
		transform: translateZ(0);
		-webkit-backface-visibility: hidden;
		-moz-backface-visibility: hidden;
		-ms-backface-visibility: hidden;
		backface-visibility: hidden;
		-webkit-perspective: 1000;
		-moz-perspective: 1000;
		-ms-perspective: 1000;
		perspective: 1000;
		overflow: visible;
		}
	.allrotate {
		width: 100%;
		height: 100%;
		position: relative;
		margin:-80% 0 0 -15.5%; 
		}
	.service {
		display: block;
		top: 50%;
		left: 50%;
		margin: -10vh;
		text-decoration: none;
		}
	.service1,.service2,.service3,.service4,.service5,.service6 {
		background-color: white;
		border-radius: 50%;
		border: 1.5vh solid #cad1db;
		text-align: center;
		text-transform: uppercase;
		position: absolute;
		width: 16vh;
		height: 16vh;
		}
	.service p {
		color: #13335e;
		margin-top:6.0vh;
		font-size:1.5vh;
		font-family:'Montserrat', sans-serif;
		font-weight:600;
		letter-spacing:0.05vh;
		line-height:90%;
		}
	.counterrotate {
		width: 100%;
		height: 100%;
		position: absolute;
		display: table; 
		}
	.service1 {transform: translate(250%);}
	.service2 {transform: rotate(60deg) translate(250%) rotate(300deg);}
	.service3 {transform: rotate(120deg) translate(250%) rotate(240deg);}
	.service4 {transform: translate(-250%);}
	.service5 {transform: rotate(240deg) translate(250%) rotate(120deg);}
	.service6 {transform: rotate(300deg) translate(250%) rotate(60deg);}

	@-webkit-keyframes spin {
		from {-webkit-transform: rotate(0deg);}
		to {-webkit-transform: rotate(-360deg);}
		}
	@-webkit-keyframes spinback {
		from {-webkit-transform: rotate(0deg);}
		to {-webkit-transform: rotate(360deg);}
		}
	@keyframes spinback {
		from {transform: rotate(0deg);}
		to {transform: rotate(360deg);}
		}
	@keyframes spin {
		from {transform: rotate(0deg);}
		to {transform: rotate(-360deg);}
		}
	.allrotate {
		-webkit-animation-name: spin;
		-webkit-animation-iteration-count: infinite;
		-webkit-animation-timing-function: linear;
		-webkit-animation-duration: 45s;
		animation-name: spin;
		animation-iteration-count: infinite;
		animation-timing-function: linear;
		animation-duration: 45s;
		}
	.counterrotate {
		-webkit-animation-name: spinback;
		-webkit-animation-iteration-count: infinite;
		-webkit-animation-timing-function: linear;
		-webkit-animation-duration: 45s;
		animation-name: spinback;
		animation-iteration-count: infinite;
		animation-timing-function: linear;
		animation-duration: 45s;
		}


	@media (orientation:portrait) {
		html,body {
			font-size:3vw;
			}
		h1 {
			font-size:2.7vw;
			}
		h2 {
			font-size:3vw;
			}
		span.button-flag {
			height:2.7vw;
			width:4.32vw;
			margin:0 1vw 0 0;
			}
		.mask {
			width:50%;
			height:20%;
			}
		.center-circle {
			/*margin-left:-10%;*/
			}
		.center-circle:before {
			border:1.5vw solid #cad1db
			}
		.center-logo {
			width:40.0vw;
			height:40.0vw;
			margin-left:-22vw;
			}
		.rotmenucontainer {
			width:90vw;
			height:90vw;
			margin-left:-10%;
			}
		.service {
			margin: -10vw;
			text-decoration: none;
			border:1.5vw solid #cad1db
			}
		.service1,.service2,.service3,.service4,.service5,.service6 {
			width: 16vw;
			height: 16vw;
			}
		.service p {
			margin-top:5.5vw;
			font-size:2.0vw;
			letter-spacing:0.05vw
			}		
		}