/* 
--------------------------------------------------
------------------------------------------
----------------------------------
    DOMBOarcade style.css
----------------------------------
------------------------------------------
--------------------------------------------------
*/
/* === FONTS === */
@font-face {font-family: OpenSans; src: url("../fonts/OpenSans-Regular.ttf"); }
/* === RESET === */

.clear { clear: both;}
body{background-image: url("../images/backgrounds/body_background.png"); font-family: 'OpenSans';}

/* === HEADER === */

header{ width: auto; height: 300px; background-image: url("../images/backgrounds/header_background.png");}
#logo_nav { width: 1000px; height: 130px; margin: 0 auto; padding-bottom: 22px; padding-top: 10px; }
.logo { width: 380px; height: 120px; float: left;}
nav { width: 600px; max-height: 120px; float: left; padding: 5px 0 0 20px; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35); overflow: hidden;}
nav ul a li { float: left; display: inline; padding: 10px; color: white; font-weight: bold; -o-transition:.5s; -ms-transition:.5s; -moz-transition:.5s; -webkit-transition:.5s; transition:.5s;}
nav ul a li:hover { background-color: rgba(0,0,0,0.4); border-radius: 5px; color: black; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.35);}
#slider{ margin: 0 auto; width: 350px; height: 257px;}
#frame{ padding: 10px;position: relative; width: 350px; height: 257px; background-image: url("../images/elements/slider_frame.png"); background-repeat: no-repeat; background-size: 350px 250px;}
#slide{ overflow: hidden; width: 330px; height: 160px;}
.slider_image { width: 429px; height: 154px; }
.caption { color: black; font-size:20px; font-weight:bold; padding-top:5px;text-align: center; position: absolute; margin-top: -35px; background-color: rgba(255,255,255,0.7); width: 279px; height: 25px; overflow: hidden; }
.tips { width: 1000px; margin: 0 auto; position: relative;}
#navigation { position: absolute; top: 140px; left: 700px; background-image: url("../images/elements/navigation.png"); width: 200px; height: 100px;}
#featured_games { position: absolute; top: 160px; left: 100px; background-image: url("../images/elements/featured_games.png"); width: 200px; height: 100px;}
#category { position: absolute; top: 20px; left: 30px; background-image: url("../images/elements/category.png"); width: 200px; height: 100px;}
.text { margin: 75px 0 0 190px; width: 200px; font-weight: bold; font-size: 20px; color: black; text-shadow: 0 2px 2px rgba(255, 255, 255, 0.35);}
#choose_game { position: absolute;  left: 700px; top:20px; background-image: url("../images/elements/choose_game.png"); width: 300px; height: 150px;}
#you_play_good_game_flip { position: absolute; top: 20px; left: 30px; background-image: url("../images/elements/you_play_good_game_flip.png"); width: 300px; height: 150px;}
#you_play_good_game { position: absolute;  left: 700px; background-image: url("../images/elements/you_play_good_game.png"); width: 300px; height: 150px;}

/* === CONTENT === */
#content { width: 1000px; height: auto; margin: 0 auto; margin-top: 130px;}
.box { -moz-box-shadow: 5px 5px 2px #000;
-webkit-box-shadow: 5px 5px 2px #000;
box-shadow: 5px 5px 2px #000;-o-transition:.5s; -ms-transition:.5s; -moz-transition:.5s; -webkit-transition:.5s; transition:.5s;width: 130px; height: 100px; background-color: white; padding: 10px; border-radius: 5px; overflow: hidden; text-align: center;}
.box:hover { background-color: #7CCC17; }
.box_image { width: 100px; height: 88px; border-radius: 5px; }
.box_title { text-align: center; color: black; font-size: 13px; padding-top: 2px;}
#games li{ display: inline-block; padding: 7px;}
#games li a { text-decoration: none;}
#ads_box { width: 840px; height: 450px; border-radius: 10px; margin: 0 auto; padding: 30px;}
#progressbar {margin-bottom: 20px; }
#ads_box_left { width: 350px; height: auto; float: left;}
#ads_box_right { width: 350px; height: auto; float: right;}
.ads { width: 336px; height: 280px;}
#ads_box_bottom { width: 730px; height: 100px; margin: 0 auto; margin-top: 20px;}
#game_box { width: auto; height: auto; margin: 0 auto; padding-top: 30px; }
#game_swf { margin: 0 auto; text-align: center; position: relative;}
.game-ad-left { position: absolute; left: -180px; top: 0;}
.game-ad-right { position: absolute; right: -180px; top: 0;}
.ads_games_list { width: 340px; height: 284px; float: right; margin: 70px 0px 0 0;}
#game_info { width: 800px; margin: 0 auto; height: auto; padding: 10px;}
.game_info { width: 400px; height: auto; border-radius: 10px; text-align: center; vertical-align: middle; float: left; padding: 10px; color: #fff;}
.bold_italic { font-weight: bold; font-style: italic; padding: 5px;}
#similiar_game { width: 820px; height: 150px; margin: 0 auto; margin-top: 20px;}
/* === FOOTER === */

footer { width: 1000px; height: auto; margin: 0 auto; padding: 15px; border-top: 1px solid #AFAFAF	; margin-top: 30px; margin-bottom: 20px; }
.footer_right { float: left; padding: 20px; width: 580px;}
.friends { margin-bottom: 10px; }
.friends_link { color: white; padding-left: 10px; font-size: 14px;}
.friends_link:hover {-o-transition:.5s; -ms-transition:.5s; -moz-transition:.5s; -webkit-transition:.5s; transition:.5s; color: #CBCCCF; }
.copy_dev { text-align: center;}
.copyright { color: #fff; font-weight: bold; padding: 10px;}
.dev { font-weight: bold; font-style: italic; font-size: 12px;}
/* === jQuery css === */
.ui-progressbar {position: relative; text-align: center; width: 700px; margin: 0 auto;} 
.progress-label {position: absolute; text-align: center; width: 100%; top: 6px; font-weight: bold; text-shadow: 1px 1px 0 #fff; }
.pagination {clear: both; padding-top: 20px; text-align: center; }
.pagination a {color: #fff; font-size: 11px; font-weight: bold; height: 25px; padding: 4px 8px; text-decoration: none; margin:2px; }
.pagination a:hover, .pagination a:active {background-color: #7CCC17; -o-transition:.5s; -ms-transition:.5s; -moz-transition:.5s; -webkit-transition:.5s; transition:.5s; border-radius: 10px;}
.pagination span.current {background-color: rgba(0,0,0,0.4); color: #ffffff; font-size: 11px; font-weight: bold; height: 25px; padding: 4px 8px; text-decoration: none; margin:2px; } 
.pagination span.disabled {color: #DDDDDD; margin: 2px; padding: 2px 5px; font-size: 11px; }