<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>Tarin Fitness</title>
        <!--CSS SECTION START-->
        <link href="style.css" rel="stylesheet" type="text/css">
        <!--CSS SECTION END-->
    </head>
    <body>
        <!-- body content start here -->
        <header class="header">
            <div class="container">
                <div class="row">
                    <div class="col-md-12 text-center">
                        <a href="#" class="logo"><img src="images/logo.png" class="img-responsive" alt="Logo" /></a>
                    </div>
                    <div class="clearfix"></div>
                    <div class="col-md-12">
                        <div class="full_width navCtrl">
                            <nav class="navbar navbar-default">
                                <div class="container-fluid">
                                    <!-- Brand and toggle get grouped for better mobile display -->
                                    <div class="navbar-header">
                                        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                                        <span class="sr-only">Toggle navigation</span>
                                        <span class="icon-bar"></span>
                                        <span class="icon-bar"></span>
                                        <span class="icon-bar"></span>
                                        </button>
                                    </div>
                                    <!-- Collect the nav links, forms, and other content for toggling -->
                                    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                                        <ul class="nav navbar-nav">
                                            <li class="active"><a href="#">HOME <span class="sr-only">(current)</span></a></li>
                                            <li><a href="#">ABOUT US</a></li>
                                            <li><a href="#">Activities</a></li>
                                            <li><a href="#">gallery</a></li>
                                            <li><a href="#">book</a></li>
                                            <li><a href="#">news</a></li>
                                            <li><a href="#">Events</a></li>
                                            <li><a href="#">Contact us</a></li>
                                        </ul>
                                    </div>
                                    <!-- /.navbar-collapse -->
                                </div>
                                <!-- /.container-fluid -->
                            </nav>
                        </div>
                    </div>
                </div>
            </div>
        </header>
        <div class="full_width">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="full_width carouselCtrl">
                            <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                                <!-- Indicators -->
                                <ol class="carousel-indicators">
                                    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                                    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                                    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
                                    <li data-target="#carousel-example-generic" data-slide-to="3"></li>
                                </ol>
                                <!-- Wrapper for slides -->
                                <div class="carousel-inner" role="listbox">
                                    <div class="item active">
                                        <img src="images/banner.png" class="img-responsive" alt="Img1" />
                                        <div class="carousel-caption">
                                        </div>
                                    </div>
                                    <div class="item">
                                        <img src="images/banner.png" class="img-responsive" alt="Img2" />
                                        <div class="carousel-caption">
                                        </div>
                                    </div>
                                    <div class="item">
                                        <img src="images/banner.png" class="img-responsive" alt="Img3" />
                                        <div class="carousel-caption">
                                        </div>
                                    </div>
                                    <div class="item">
                                        <img src="images/banner.png" class="img-responsive" alt="Img4" />
                                        <div class="carousel-caption">
                                        </div>
                                    </div>
                                </div>
                                <!-- Controls -->
                                <!--<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                                    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                                    <span class="sr-only">Previous</span>
                                    </a>
                                    <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                                    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                                    <span class="sr-only">Next</span>
                                    </a>-->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="full_width gamesCtrl">
            <div class="container">
                <div class="row">
                    <div class="col-md-2 col-xs-12 gamesThumb">
                        <img class="img-responsive" src="images/games1.png" alt="Water Game">
                    </div>
                    <div class="col-md-2 col-xs-12 gamesThumb">
                        <img class="img-responsive" src="images/games2.png" alt="Kids Games">
                    </div>
                    <div class="col-md-2 col-xs-12 gamesThumb">
                        <img class="img-responsive" src="images/games3.png" alt="Outdoor Swimming Pool">
                    </div>
                    <div class="col-md-2 col-xs-12 gamesThumb">
                        <img class="img-responsive" src="images/games4.png" alt="Entertainment">
                    </div>
                    <div class="col-md-2 col-xs-12 gamesThumb">
                        <img class="img-responsive" src="images/games5.png" alt="Restaurant">
                    </div>
                    <div class="col-md-2 col-xs-12 gamesThumb">
                        <img class="img-responsive" src="images/games6.png" alt="Gifts  Shop">
                    </div>
                </div>
            </div>
        </div>
        <div class="full_width txtCtrl">
            <div class="container">
                <div class="row">
                    <div class="col-md-8">
                        <span class="heading">Welcome</span>
                        <div class="inner">
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed imperdiet vitae sapien et luctus. Suspendisse pellentesque, felis id varius sagittis, enim urna imperdiet nibh, sed pellentesque erat magna eu lectus. Fusce ut lacinia dolor. Cras interdum et erat in varius. In sed laoreet ligula, nec porttitor purus. Praesent faucibus ac orci sed faucibus. Mauris nec pulvinar dolor. Phasellus ut euismod velit, et laoreet dui. Nulla vitae sem vehicula, venenatis ex non, finibus diam.Fusce ut lacinia dolor. Cras interdum et erat in varius. In sed laoreet ligula, nec porttitor purus. Praesent faucibus ac orci sed faucibus. Mauris nec pulvinar dolor. Phasellus ut euismod velit, et laoreet dui. Nulla vitae sem vehicula, venenatis ex non, finibus diam.Fusce ut lacinia dolor. Phasellus ut euismod velit, et laoreet dui. Nulla vitae sem vehicula, venenatis ex non, finibus diam.</p>
                            <br />
                            <p>Aenean euismod odio in erat ornare, id interdum leo aliquam. Integer vestibulum nunc nec arcu ornare, at lacinia lorem convallis. Integer pulvinar, risus non condimentum mattis, enim magna luctus augue, sit amet auctor est lectus a erat. Curabitur diam purus, eget,Fusce ut lacinia dolor. Cras interdum et erat in varius. In sed laoreet ligula, nec porttitor purus. Phasellus ut euismod velit, et laoreet dui. Nulla vitae sem vehicula, venenatis ex non, finibus diam. bibendum tincidune igula ersem vehicula, venenatis ex non, finibus <a href="#-1" class="link">Read More</a></p>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <span class="heading">Plan Visit</span>
                        <div class="inner">
                            <ul class="accord">
                                <li>
                                    <a href="#-1"><span class="up-arrow move"></span>Admissions</a>
                                    <div class="openAccord">
                                        <ul>
                                            <li>Adults: Normal Rate 25,000 IQD 
                                                Kids 15,000 IQD 
                                            </li>
                                            <li>Family package deals/discounts:
                                                Group Rates: (4 people, 5% discount),
                                                (6 people, 10% discount), (8 people,
                                                15% discount),(10 or more people,
                                                205 discount)
                                            </li>
                                        </ul>
                                    </div>
                                </li>
                                <li>
                                    <a href="#-1"><span class="up-arrow move"></span>Cabana Rentals - Free</a>
                                    <div class="openAccord allwayshow" style="display:none;">
                                        <ul>
                                            <li>Adults: Normal Rate 25,000 IQD 
                                                Kids 15,000 IQD 
                                            </li>
                                            <li>Family package deals/discounts:
                                                Group Rates: (4 people, 5% discount),
                                                (6 people, 10% discount), (8 people,
                                                15% discount),(10 or more people,
                                                205 discount)
                                            </li>
                                        </ul>
                                    </div>
                                </li>
                                <li>
                                    <a href="#-1"><span class="up-arrow move"></span>Locker Rentals - Free</a>
                                    <div class="openAccord" style="display:none;">
                                        <ul>
                                            <li>Adults: Normal Rate 25,000 IQD 
                                                Kids 15,000 IQD 
                                            </li>
                                            <li>Family package deals/discounts:
                                                Group Rates: (4 people, 5% discount),
                                                (6 people, 10% discount), (8 people,
                                                15% discount),(10 or more people,
                                                205 discount)
                                            </li>
                                        </ul>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="full_width events">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="col-md-4 col-sm-4 col-xs-12">
                            <span class="heading_footer">Events</span>
                            <div class="heading_footer_txt">
                                <p><strong>Lorem Ipsum</strong></p>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br /> Ut gravida arcu velit, vel mollis augue cursus eget.</p>
                                <a href="#-1" class="link2">Read More</a>
                            </div>
                            <div class="heading_footer_txt">
                                <p><strong>Lorem Ipsum</strong></p>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br /> Ut gravida arcu velit, vel mollis augue cursus eget.</p>
                                <a href="#-1" class="link2">Read More</a>
                            </div>
                        </div>
                        <div class="col-md-4 col-sm-4 col-xs-12">
                            <span class="heading_footer">News</span>
                            <div class="heading_footer_txt">
                                <img src="images/cal1.png" class="img-responsive calCtrl" alt="Lorem Ipsum"/>
                                <div class="col-md-8 nopadding pull-left col-sm-8">
                                    <p><strong>Lorem Ipsum</strong></p>
                                    <p>Lorem ipsum dolor sit amet, consectetur<br />
                                        adipiscing elit.
                                    </p>
                                    <a href="#-1" class="link2">Read More</a>
                                </div>
                            </div>
                            <div class="heading_footer_txt">
                                <img src="images/cal2.png" class="img-responsive calCtrl" alt="Lorem Ipsum" />
                                <div class="col-md-8 nopadding col-sm-8 pull-left">
                                    <p><strong>Lorem Ipsum</strong></p>
                                    <p>Lorem ipsum dolor sit amet, consectetur<br />
                                        adipiscing elit.
                                    </p>
                                    <a href="#-1" class="link2">Read More</a>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4 col-sm-4 col-xs-12">
                            <span class="heading_footer">Gallery</span>
                            <div class="clearfix"></div>
                            <div class="heading_footer_txt">
                                <ul class="list-inline">
                                    <li><a href="#-1"><img src="images/gallery1.jpg" class="img-responsive" alt="Gallery Img 1" /></a></li>
                                    <li><a href="#-1"><img src="images/gallery2.jpg" class="img-responsive" alt="Gallery Img 1" /></a></li>
                                    <li><a href="#-1"><img src="images/gallery5.jpg" class="img-responsive" alt="Gallery Img 2" /></a></li>
                                    <li><a href="#-1"><img src="images/gallery4.jpg" class="img-responsive" alt="Gallery Img 2" /></a></li>
                                    <li><a href="#-1"><img src="images/gallery3.jpg" class="img-responsive" alt="Gallery Img 2" /></a></li>
                                    <li><a href="#-1"><img src="images/gallery6.jpg" class="img-responsive" alt="Gallery Img 5" /></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <footer class="full_width footer">
            <div class="container">
                <div class="row">
                    <div class="col-md-5 col-xs-12 col-sm-6 pull-left text-left">
                        <small>Copyright @2012. All Rights Reserved</small>
                    </div>
                    <div class="col-md-3 pull-right col-xs-12 col-sm-6">
                        <ul class="list-inline commonUl">
                            <li><a href="#-1" title="Home">Home</a></li>
                            <li><a href="#-1" title="About Us">About us</a></li>
                            <li><a href="#-1" title="Gallery">Gallery</a></li>
                            <li><a href="#-1" title="Contact Us">Contact us</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </footer>
        <!-- body content end here -->
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
        <script type="text/javascript">window.jQuery || document.write('<script src="js/jquery-1.11.1.min.js"><\/script>')</script>
        <script src="js/jquery.bxslider.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
        <script src="js/custom.js"></script>
    </body>
</html>





html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {	margin: 0;	padding: 0;	border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
ol, ul {list-style: none;}
blockquote, q {quotes: none; }
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table { border-collapse: collapse;	border-spacing: 0;}
a:focus{outline:0px;}
a:hover,a:focus{text-decoration:none;}
img {vertical-align: middle !important;}

body{ margin:0; padding:0; line-height:24px; font-family: 'Georgia'; font-weight:400; background:url(../images/body_bg.jpg) no-repeat 0 0 #1289a7; }
p{ font-size: 14px; line-height:24px; }
h1{font-size: 36px; }
h2{font-size: 30px; }
h3{font-size: 24px; }
h4{font-size: 18px; }
h5{font-size: 14px; }
h6{font-size: 12px; }

/* page css start here */
.header { width:100%; float:left; display:block; /*min-height:567px;*/ height:auto; background:url(../images/banner_bg.jpg) repeat-x 0 0; }
@font-face {
font-family: 'Georgia';
src: url('fonts/Georgia.eot?#iefix') format('embedded-opentype'),url('fonts/Georgia.woff') format('woff'), url('fonts/Georgia.ttf')format('truetype'), url('fonts/Georgia.svg#Georgia') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Vani';
src: url('fonts/Vani.eot?#iefix') format('embedded-opentype'),url('fonts/Vani.woff') format('woff'), url('fonts/Vani.ttf')format('truetype'), url('fonts/Vani.svg#Vani') format('svg');
font-weight: normal;
font-style: normal;
}
.header { width:100%; display:block; float:left; height:auto; }
.logo { display:inline-block; margin:7px auto; text-align:center; cursor:pointer; }
.full_width { display:block; width:100%; float:left; } 
.navCtrl { display:block; }
.navbar-default { background: -moz-linear-gradient(90deg, #f49d00 0%, #fbd931 100%);/* FF3.6+ */background: -webkit-gradient(linear, 90deg, color-stop(0%, #f49d00), color-stop(100%, #fbd931));/* Chrome,Safari4+ */background: -webkit-linear-gradient(90deg, #f49d00 0%, #fbd931 100%);/* Chrome10+,Safari5.1+ */background: -o-linear-gradient(90deg, #f49d00 0%, #fbd931 100%);/* Opera 11.10+ */background: -ms-linear-gradient(90deg, #f49d00 0%, #fbd931 100%);/* IE10+ */filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f49d00', endColorstr='#fbd931', GradientType='0'); /* for IE */background: linear-gradient(0deg, #f49d00 0%, #fbd931 100%);/* W3C */box-shadow:4px 6px 10px rgba(0, 0, 0, 0.8); -moz-box-shadow:4px 6px 10px rgba(0, 0, 0, 0.8); -webkit-box-shadow:4px 6px 10px rgba(0, 0, 0, 0.8); -ms-box-shadow:4px 6px 10px rgba(0, 0, 0, 0.8); -o-box-shadow:4px 6px 10px rgba(0, 0, 0, 0.8);height:62px; border:0;}
.navbar-nav > li > a {color: #694700 !important;font-family: georgia;font-size: 18.4px;font-weight: 400;padding-bottom: 15px;padding-top: 15px;text-transform: uppercase;text-shadow:2px 1px 0 rgba(255, 255, 255, 0.5);-moz-text-shadow:2px 1px 0 rgba(255, 255, 255, 0.5);-webkit-text-shadow:2px 1px 0 rgba(255, 255, 255, 0.5);-ms-text-shadow:2px 1px 0 rgba(255, 255, 255, 0.5);-o-text-shadow:2px 1px 0 rgba(255, 255, 255, 0.5);line-height:35px;}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {background-color: transparent;color: #000;}
.navbar-nav {display: inline-block;text-align: center;width: 100%;}
.navbar-nav > li {display: inline-block;float: none;position:relative;}
.navbar-nav > li:after { position:absolute; background:url(../images/border-right.png) 0 0 no-repeat; width:2px; height:100%; content:''; right:0; top:10px; }
.navbar-nav > li:last-child:after { display:none; }
.navbar-nav > li > a { position:relative; padding:15px 27px; }
.carouselCtrl { margin:5px 0;}
.navbar-nav > li > a:las:after { display:none; }
.carousel-indicators li { background-color:#242527; border:0; }
.carousel-indicators .active { background-color:#fff; }
.carousel-indicators {bottom: -10px;}
.gamesCtrl { display:block; width:100%; margin:15px 0; }
.gamesThumb > h1 { font-size:11px; font-weight:bold; color:#ffffff; line-height:14px; }
.gamesThumb { position:relative; }
.heading {background: url("../images/heading_bg.png") no-repeat scroll -3px 1px rgba(0, 0, 0, 0);border-bottom: 1px solid #c59e27;color: #694700 !important;display: block;float: left;font-size: 19px;height: 46px;line-height: 50px;padding: 3px 0 0 20px;position: relative;width: 100%;}
.txtCtrl { margin:20px 0px; font-size:12px; color:#fff; font-family:Arial, Helvetica, sans-serif; }
.txtCtrl .inner { padding:33px 0; display:inline-block; font-family:Arial, Helvetica, sans-serif; }
.txtCtrl .inner p { font-size:12px; font-weight:400; line-height:20px; color:#ffffff; }
.link { color:#fbd931; text-decoration:underline; font-weight:bold; }
.link:hover { color:#fbd931; text-decoration:none; font-weight:bold; }
ul.accord { margin:0; padding:0; }
ul.accord > li { margin:0; padding:5px 0px; list-style-type:none; border-top:1px solid #00556a; display:inline-block; width:100%; }
ul.accord > li > a { margin:0; padding:0 0 0 15px; display:block; float:left; width:100%; color:#fff; text-decoration:none; position:relative; font-weight:bold; }
.openAccord { float: left; margin-left: 20px; }
.openAccord li {padding-left: 10px;position: relative;}
.openAccord li:before {color: #fff;content: "-";display: block;height: 5px;left: -3px;position: absolute;top: 0;width: 5px;}
.up-arrow { background: url("../images/play_bullet.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0); content: ""; height: 8px; left: 0; position: absolute; top: 8px; width: 5px; }
.down-arrow { background: url("../images/down_bullet.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0); content: ""; height: 5px; left: 0; position: absolute; top: 8px; width: 8px; }
.events { background-color:#002247; padding:24px 0px; }
.heading_footer { color:#f7a90b; font-size:20px; font-family:vani; padding-bottom:5px; border-bottom:1px solid #000d1a; display:block; }
.heading_footer_txt { font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#ffffff; padding:10px 0; display:block; float:left; }
.heading_footer_txt p { font-size:12px; }
.heading_footer_txt strong { font-size:12px; font-weight:bold; color:#ffffff; }
.link2 { color:#ffffff; text-decoration:underline; font-weight:bold; display:block; }
.link2:hover { color:#ffffff; text-decoration:none; font-weight:bold; }
.calCtrl { margin-right:20px; display:inline-block; float:left; }
.nopadding { padding:0; }
.footer { background-color:#1289a7; font-size:12px; color:#fff; font-family:Arial, Helvetica, sans-serif; padding:11px 0px; }
.commonUl > li > a { color:#fff; }
.navbar-nav > li > a { font-size:14px; }