/****************** Font-Faces ***********************/
@font-face {
    font-family: 'interstateregular';
    src: url('../fonts/interstate-regularcondensed/interstate-regularcondensed-webfont.eot');
    src: url('../fonts/interstate-regularcondensed/interstate-regularcondensed-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/interstate-regularcondensed/interstate-regularcondensed-webfont.woff') format('woff'),
         url('../fonts/interstate-regularcondensed/interstate-regularcondensed-webfont.ttf') format('truetype'),
         url('../fonts/interstate-regularcondensed/interstate-regularcondensed-webfont.svg#interstateregular') format('svg');
    font-weight:normal;
    font-style:normal;
}

@font-face {
    font-family: 'interstateboldcondensed';
    src: url('../fonts/interstate_boldcondensed/interstate_boldcondensed-webfont.eot');
    src: url('../fonts/interstate_boldcondensed/interstate_boldcondensed-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/interstate_boldcondensed/interstate_boldcondensed-webfont.woff') format('woff'),
         url('../fonts/interstate_boldcondensed/interstate_boldcondensed-webfont.ttf') format('truetype'),
         url('../fonts/interstate_boldcondensed/interstate_boldcondensed-webfont.svg#interstateboldcondensed') format('svg');
    font-weight:normal;
    font-style:normal;
}

@font-face {
    font-family: 'interstatelightcondensed';
    src: url('../fonts/interstate_lightcondensed/interstate_light_cond-webfont.eot');
    src: url('../fonts/interstate_lightcondensed/interstate_light_cond-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/interstate_lightcondensed/interstate_light_cond-webfont.woff') format('woff'),
         url('../fonts/interstate_lightcondensed/interstate_light_cond-webfont.ttf') format('truetype'),
         url('../fonts/interstate_lightcondensed/interstate_light_cond-webfont.svg#interstateregular') format('svg');
    font-weight:normal;
    font-style:normal;

}

/****************** Layout ***********************/
*								{margin:0;padding:0;-webkit-text-size-adjust:none;}
.clearfix:after					{content:"\0020";display:block;height:0;clear:both;overflow:hidden;visibility:hidden;}
body							{background:#262626;width:100%;max-width:640px;font-family:'interstateboldcondensed', Arial, sans-serif;font-size:12px;text-transform:uppercase;color:#fff;}
#wrap							{position:relative;max-width:640px;margin:0;opacity:0;}
#overlay						{position:fixed;display:none;width:100%;height:100%;background:url('../img/pattern.png');}
h1								{font-size:56px;line-height:52px;font-weight:normal;color:#fff;}
h2								{font-size:54px;line-height:50px;font-weight:normal;color:#7cd0d6;margin-bottom:5px;}
h3								{font-size:17px;line-height:15px;font-weight:normal;color:#fff;}
h4								{font-size:28px;font-weight:normal;color:#fff;}
img								{border:none;}
a								{color:#fff;}
#debug							{position:fixed;top:10px;right:10px;color:red;display:none;}	
#preloader						{position:fixed;top:0;left:0;right:0;bottom:0;background:#262626;z-index:99;max-width:640px;}
#status							{position:absolute;top:50%;left:50%;width:136px;height:116px;background:url('../img/hysaga-footer.png');margin:-58px 0 0 -78px;}


/****************** Home ***********************/
#home							{position:relative;overflow:hidden;width:640px;height:733px;}
#home img.hysaga				{position:absolute;top:20px;left:20px;z-index:9999;}
#home div.intro					{position:absolute;bottom:0;left:0;z-index:9999;width:100%;background:rgba(0,0,0,.5);}
#home div.intro div				{padding:30px;}

#social							{background:#939393;padding:30px 40px;overflow:hidden;}
#social ul						{overflow:hidden;}
#social li						{float:left;margin-left:40px;list-style:none;}
#social li:first-child			{margin-left:0;}
#social li div.like				{position:relative;top:10px;}
#social li span					{float:left;font-size:22px;line-height:43px;text-transform:uppercase;color:#000;margin-right:10px;}
#social li a					{float:left;width:43px;height:43px;background:url('../img/social-icons.png');text-indent:-999em;line-height:0;outline:none;margin-right:10px;}
#social li a.last				{margin-right:0;}
#social li a.facebook			{background-position:0 0;}
#social li a.twitter			{background-position:-43px 0;}
#social li a.facebook:hover		{background-position:0 -43px;}
#social li a.twitter:hover		{background-position:-43px -43px;}

#slider							{position:absolute;top:0;left:0;width:640px;height:733px;overflow:hidden;}
#slider	li						{position:relative;width:100%;-webkit-animation:none;-moz-animation:none;animation:none;-webkit-transform:translateZ(0);-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;}

@-webkit-keyframes zoom_bottom_left	{ 0% {-webkit-transform:scale(1) rotate(0);top:0;left:0;)}	100% {-webkit-transform:scale(1.5) rotate(2deg);} }
@-moz-keyframes zoom_bottom_left	{ 0% {-moz-transform:scale(1) rotate(0);top:0;left:0;}		100% {-moz-transform:scale(1.5) rotate(2deg);} }
@-ms-keyframes zoom_bottom_left		{ 0% {-ms-transform:scale(1) rotate(0);top:0;left:0;}		100% {-ms-transform: scale(1.5) rotate(2deg);} }
@-o-keyframes zoom_bottom_left		{ 0% {-o-transform:scale(1) rotate(0);top:0;left:0;}		100% {-o-transform: scale(1.5) rotate(2deg);} }
@keyframes zoom_bottom_left			{ 0% {transform:scale(1) rotate(0);top:0;left:0;}			100%{transform:scale(1.5) rotate(2deg);} }

@-webkit-keyframes zoom_right		{ 0% {-webkit-transform:scale(1);right:0;}		100% {-webkit-transform:scale(1.5);top:150px;left:-150px;} }
@-moz-keyframes zoom_right			{ 0% {-moz-transform:scale(1);right:0;}			100% {-moz-transform:scale(1.5);top:150px;left:-150px;} }
@-ms-keyframes zoom_right			{ 0% {-ms-transform:scale(1);right:0;}			100% {-ms-transform: scale(1.5);top:150px;left:-150px;} }
@-o-keyframes zoom_right			{ 0% {-o-transform:scale(1);right:0;}			100% {-o-transform: scale(1.5);top:150px;left:-150px;} }
@keyframes zoom_right				{ 0% {transform:scale(1);right:0;}				100% {transform:scale(1.5);top:150px;left:-150px;} }

@-webkit-keyframes zoom_center		{ 0% {-webkit-transform:scale(1);}				100% {-webkit-transform:scale(1.5);} }
@-moz-keyframes zoom_center			{ 0% {-moz-transform:scale(1);}					100% {-moz-transform:scale(1.5);} }
@-ms-keyframes zoom_center			{ 0% {-ms-transform:scale(1);}					100% {-ms-transform: scale(1.5);} }
@-o-keyframes zoom_center			{ 0% {-o-transform:scale(1);}					100% {-o-transform: scale(1.5);} }
@keyframes zoom_center				{ 0% {transform:scale(1);}						100% {transform:scale(1.5);} }

@-webkit-keyframes zoom_bottom_right{ 0% {-webkit-transform:scale(1);top:0;right:0;}100% {-webkit-transform:scale(1.5);top:150px;right:-150px;} }
@-moz-keyframes zoom_bottom_right	{ 0% {-moz-transform:scale(1);top:0;right:0;}	100% {-moz-transform:scale(1.5);top:150px;right:-150px;} }
@-ms-keyframes zoom_bottom_right	{ 0% {-ms-transform:scale(1);top:0;right:0;}	100% {-ms-transform: scale(1.5);top:150px;right:-150px;} }
@-o-keyframes zoom_bottom_right		{ 0% {-o-transform:scale(1);top:0;right:0;}		100% {-o-transform: scale(1.5);top:150px;right:-150px;} }
@keyframes zoom_bottom_right		{ 0% {transform:scale(1);top:0;right:0;}		100% {transform:scale(1.5);top:150px;right:-150px;} }

#slide1.animated				{-webkit-animation:zoom_bottom_left 6s linear;-moz-animation:zoom_bottom_left 6s linear;animation:zoom_bottom_left 6s linear;}
#slide2.animated				{-webkit-animation:zoom_bottom_left 6s linear;-moz-animation:zoom_bottom_left 6s linear;animation:zoom_bottom_left 6s linear;}
#slide3.animated				{-webkit-animation:zoom_center 6s linear;-moz-animation:zoom_center 6s linear;animation:zoom_center 6s linear;}
#slide4.animated				{-webkit-animation:zoom_center 6s linear;-moz-animation:zoom_center 6s linear;animation:zoom_center 6s linear;}
#slide5.animated				{-webkit-animation:zoom_bottom_left 6s linear;-moz-animation:zoom_bottom_left 6s linear;animation:zoom_bottom_left 6s linear;}
#slide6.animated				{-webkit-animation:zoom_center 6s linear;-moz-animation:zoom_center 6s linear;animation:zoom_center 6s linear;}


/****************** Main ***********************/

div.title a							{display:block;font-size:42px;line-height:140px;color:#979797;text-align:center;background:#262626;border-bottom:1px solid #979797;cursor:pointer;text-decoration:none;}
div.title a.on 						{color:#fff;background:#324353;border-color:1px solid #324353;}
div.panel							{display:none;background:url('../img/bg.png') no-repeat top right;border-bottom:1px solid #979797;padding:50px 0;}
iframe								{display:block;width:540px;margin:0 auto;}

#posters							{cursor:move;}
#posters div.list					{position:relative;max-width:640px;height:350px;overflow:hidden;}
#posters div.listinner				{position:absolute;width:2000px;height:350px;}
#posters div.list ul				{position:absolute;margin-left:50px;}
#posters div.list li				{float:left;width:510px;margin-right:20px;text-align:center;list-style:none;}
#posters div.list li img			{display:block;}
#posters div.list li a				{display:block;font-family:'interstateboldcondensed',Arial,sans-serif;font-size:38px;font-weight:normal;color:#fff;text-align:center;text-decoration:none;margin-top:25px;}

#cities div.panel					{text-align:center;}
#cities div.panel img				{margin-bottom:50px;}
#cities div.panel h4				{font-family:'interstateboldcondensed', Arial, sans-serif;font-size:38px;font-weight:normal;margin-bottom:50px;}
#cities div.panel ul				{margin-bottom:40px;}
#cities div.panel li				{font-family:'interstateboldcondensed', Arial, sans-serif;font-size:24px;font-weight:normal;list-style:none;}

#history img						{max-width:100%;}
#history div.panel					{padding:0;/*max-width:640px;*/margin:0 auto;}
#history div.header					{position:relative;height:250px;overflow:hidden;text-align:center;background:url('../img/history/header.jpg') no-repeat center;
/* fixed;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;*/}
#history div.header	div.top			{display:block;height:110px;padding:40px 0 0;margin:0;}
#history div.header	div.bottom		{display:block;height:77px;padding:13px 0 10px;background:rgba(0,0,0,.5);}
#history div.header	div.bottom img	{display:block;margin:0 auto;}
#history div.header	h3				{font-size:36px;line-height:28px;color:#00fff8;}
#history div.header	h4				{font-size:23px;}
#history ul.dates					{overflow:hidden;list-style:none;background:#324353;border-bottom:1px solid #fff;}
#history ul.dates li				{float:left;text-align:center;width:12.5%;}
#history ul.dates li a				{float:left;width:100%;font-family:'interstateboldcondensed', Arial, sans-serif;font-size:16px;line-height:32px;text-transform:uppercase;color:#94a2af;text-decoration:none;text-align:center;}
#history ul.dates li a:hover,
#history ul.dates li a.selected		{color:#fff;}
#history div.subtitle a				{display:block;font-size:42px;line-height:140px;color:#fff;text-align:center;background:#627384;border-bottom:1px solid #979797;cursor:pointer;text-decoration:none;}
#history div.subtitle a.on 			{color:#fff;background:#324353;border-color:1px solid #324353;}
#history div.subpanel				{display:none;background:url('../img/bg.png') no-repeat top right;border-bottom:1px solid #979797;padding:0;max-width:640px;margin:0 auto;}
#history div.subpanel h2			{font-family:'interstateboldcondensed',Arial,sans-serif;font-size:30px;line-height:30px;font-weight:normal;color:#fff;text-align:center;padding:25px 50px;margin-bottom:0;}
#history div.subpanel h3			{font-family:'interstatelightcondensed';font-size:40px;line-height:40px;font-weight:normal;color:#7cd0d6;margin-bottom:50px;}
#history div.subpanel div.txt		{padding:50px;}
#history #HYThx div.subpanel div.txt p{color:#fff;}
#history div.subpanel p				{font-family:'interstateregular';font-size:32px;line-height:36px;font-weight:normal;color:#a5a4a4;text-align:justify;text-transform:none;}
#history div.subpanel p.legend		{display:block;text-transform:uppercase;margin:25px 0 15px;}
#history div.subpanel a				{font-family:'interstateboldcondensed';font-size:33px;line-height:36px;font-weight:normal;color:#fff;text-decoration:none;text-transform:none;}
#history div.footer	p				{font-size:25px;line-height:30px;text-transform:uppercase;}

#interviews							{}
#interviews div.panel				{padding:0;}
#interviews div.list				{position:relative;width:640px;height:400px;overflow:hidden;}
#interviews div.listinner			{position:absolute;width:2000px;height:360px;cursor:move;}
#interviews div.list ul.items		{position:absolute;margin-left:50px;}
#interviews div.list ul.items li	{float:left;width:540px;margin-right:30px;list-style:none;height:300px;padding:50px 0;position:relative;}
#interviews div.mask				{position:absolute;top:55px;left:5px;width:490px;height:200px;background:rgba(0,0,0,0);z-index:9;}
#interviews ul.paging				{position:relative;bottom:20px;left:270px;display:none;}
#interviews ul.paging li			{float:left;margin:0 5px;list-style:none;}
#interviews ul.paging li a			{float:left;display:block;width:50px;height:5px;background:#000;margin:0 2px;text-indent:-9999px;line-height:0;z-index:9999;cursor:pointer;}
#interviews ul.paging li a.actif	{background:#fff;}
#interviews ul.paging li a:hover	{background:#fff;}


/****************** Footer ***********************/
#footer							{padding:50px 0;}
#footer div						{width:480px;margin:0 auto;text-align:center;}
#footer img						{margin-bottom:50px;}
#footer p						{font-size:20px;color:#979797;margin-bottom:30px;}
#footer a.desktop				{display:block;font-size:12px;color:#fff;}

@media screen and (orientation:landscape) {
	body						{width:100%;max-width:100%;}
	#wrap						{max-width:100%;}
	#preloader					{max-width:100%;}
	#home						{width:100%;}
	#slider						{width:100%;}
	#posters div.list			{max-width:100%;}
	#interviews div.list		{width:100%;}
}