/* # Google Web Font
-------------------------------------*/
@import url(https://fonts.googleapis.com/css?family=Open+Sans);
@import url(https://fonts.googleapis.com/css?family=Averia+Gruesa+Libre);
@import url(https://fonts.googleapis.com/css?family=Belgrano);
@import url(https://fonts.googleapis.com/css?family=Righteous);
@import url(https://fonts.googleapis.com/css?family=Roboto+Slab);
@import url(https://fonts.googleapis.com/css?family=Bad+Script);

body {
  font: normal 100% 'Open Sans', Helvetica, Arial, '繝偵Λ繧ｮ繝手ｧ偵ざ Pro W3','Hiragino Kaku Gothic Pro','�ｼｭ�ｼｳ �ｼｰ繧ｴ繧ｷ繝�繧ｯ', sans-serif;
}
  
h2, h3, h4, h5, h6, p, li, #header-left {
/*  font-family: 'Open Sans', sans-serif; */
  font-weight: 400; }

h1 {
	font-family : Belgrano;
  font-weight: 400;
 }
 
/* # SCHEME
example: #e90000, #0095e2, #ff4100, #9EC408, #333
-------------------------------------*/
a {
	color: #555;
}


.top-logo {
	padding:6px 6px 6px 6px; 
background: rgba(66,66,66,0.3); 	
	box-shadow: 5px 5px 5px	 rgba(0,0,0,0.55);
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    margin-bottom: 10px;
    
}

/* # BORDER
-------------------------------------*/
#border {
  background-color: #AF0006; }

/* # CUSTOM STYLE
/* # PUT YOUR CUSTOM STYLE BELOW
-------------------------------------*/

/* for mix device*/
  #product-container.ipad-landscape.mix #device {
    background: url(../images/devices/ipad-landscape@2x.png) no-repeat center top; }
    #product-container.ipad-landscape.mix #device-2nd {
    background: url(../images/devices/iphone-white-portrait@2x.png);
    width: 200px;
    padding: 60px 0 0 0;
    display: block; }
    #product-container.ipad-landscape.mix #device-2nd #screen-2nd {
      height: 240px;
      width: 172px;
      margin-left: 15px; }
      
  /* for mix device*/
  
  /** facebook feed */
.fb iframe[style]{width:90% !important; height:350px !important;}

.icon.square {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
}
  .icon.transparent {
    background-color: transparent;
    color: #999999 }
      
 .promo-play {
font-size: 60px;
text-align: center;
z-index: 20;
position: relative;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 25px;
padding-right: 25px;
vertical-align: middle;
float: left;
}

.promo-play-text
{
vertical-align:middle;
font-size: 24px;
padding-right: 10px;
}

.related-app {
	vertical-align: middle;
	margin-bottom: 5px;
	margin-top: 15px
	}

.related-app img{
 	width: 60px;
 	height: 60px;	
 	float: left; 
 	margin-right: 20px;
}

.related-app p{
	overflow: hidden;
}
.related-app span {
	font-family: Roboto Slab; 
	color: white; 
}

.related-app span:nth-of-type(1) {
	font-weight: bold; 
	font-size: 28px;
}

.related-app span:nth-of-type(2) {
	font-size: 18px;
	white-space: nowrap;
}

.app-link {
	float:right;
}

.app-link img{
	width: 120px; 
	height: 30px; 
	margin-top: 15px; 
	margin-right: 5px;
}


@media only screen and (max-width: 767px) {
  #product-container #device
 {
    display: none !important; }
 #product-container #device-2nd 
 {
  position: relative;
  margin-left: 93px;
 }
	
	.promo-play {
	background: rgba(0,0,0,0.55);
	left: 20%;      
	top: 200px;
	color: #FFFFFF;
	}
}
	
@media screen and (min-width: 768px) {
	 .promo-play {
	background: rgba(1,1,1,0.45);
	left: 35%;
	top: 300px;
	color: #FFFFFF;
	box-shadow: 6px 6px 3px #888888;
	}
	
	.related-app span {
	line-height: 60px;
	}
	
}

.blink {
    animation: blink 3s steps(10, start) infinite;
}
@keyframes blink {
    to {
        visibility: hidden;
    }
}

#lang {
	color: white;
	text-align:right;
	margin-top: 0px;
	margin-bottom: 80px;
	width:100%;
	vertical-align: top;
	float: right;
	margin-right: 0px;
}
#lang a {
	color : white;
}

.main-feature h4 {
	font-weight:bold; 
}



.helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.fact_box
{
	background-color: rgba(136,136,136,0.5);
}


.fact_box p
{
	color: white;
	font-weight: bold;
	padding-top: 10px;
	padding-left: 20px;
	padding-right: 20px;
}
