/*
* Skeleton V1.1
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 8/17/2011
*/
/* Table of Content
==================================================
	#Reset & Basics
	#Basic Styles
	#Site Styles
	#Typography
	#Links
	#Lists
	#Images
	#Buttons
	#Tabs
	#Forms
	#Misc */


/* #Reset & Basics (Inspired by E. Meyers)
================================================== */
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{ border:0; font:inherit; font-size:100%; margin:0; padding:0; vertical-align:baseline;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{ display:block;}
body{ line-height:1;}
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; width:100%;}


/* #Basic Styles================================================== */
body{-webkit-font-smoothing:antialiased; -webkit-text-size-adjust:100%; background:#111 url(../img/bg.png) repeat;color:#444;font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;font-size:13px;}

/* #Typography================================================== */
h1,h2,h3,h4,h5,h6{font-weight:normal;}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{ font-weight:inherit;}

h1{ color:#969696; font-weight:700; font-size:18px; margin-bottom:15px;}
#back_in h2{ color:#fff; font-size:18px; font-weight:200; }

/* #Links================================================== */
a {color:#000000;text-decoration:none;  -webkit-transition: color 03s ease-in-out;-o-transition: color 0.3s ease-in-out;-moz-transition: color 0.3s ease-in-out;transition: color 0.3s ease-in-out;}
a:hover {color: #fff;}
/* #Lists
================================================== */
ul, ol{ margin-bottom:0;}
ul{ list-style:none outside;}
ol{ list-style:decimal;}
ol, ul.square, ul.circle, ul.disc{ margin-left:30px;}
ul.square{ list-style:square outside;}
ul.circle{ list-style:circle outside;}
ul.disc{ list-style:disc outside;}
ul ul, ul ol,ol ol, ol ul{ font-size:90%; margin:4px 0 5px 30px;}
ul ul li, ul ol li,ol ol li, ol ul li{ margin-bottom:6px;}
li{ line-height:18px; margin-bottom:12px;}
ul.large li{ line-height:21px;}
li p{ line-height:21px;}

iframe {
	width:100%;
	height:100%;
}

/* Tool Tips ====================================== */ 
.tip-twitter{ background-color:#000; border-radius:4px; color:#fff; max-width:200px; moz-border-radius:4px; opacity:0.8; padding:8px 8px; text-align:left; webkit-border-radius:4px; z-index:1000;}
.tip-twitter .tip-inner{ font:11px/14px Helvetica Neue,Helvetica,Arial,sans-serif;}
/*.tip-twitter .tip-arrow-top{ background:url(../img/tip-twitter_arrows.gif) no-repeat; height:5px; left:50%; margin-left:-5px; margin-top:-5px; top:0; width:9px;}
.tip-twitter .tip-arrow-right{ background:url(../img/tip-twitter_arrows.gif) no-repeat -9px 0; height:9px; left:100%; margin-left:0; margin-top:-4px; top:50%; width:5px;}
.tip-twitter .tip-arrow-bottom{ background:url(../img/tip-twitter_arrows.gif) no-repeat -18px 0; height:5px; left:50%; margin-left:-5px; margin-top:0; top:100%; width:9px;}
.tip-twitter .tip-arrow-left{ background:url(../img/tip-twitter_arrows.gif) no-repeat -27px 0; height:9px; left:0; margin-left:-5px; margin-top:-4px; top:50%; width:5px;}*/


/*
* Skeleton V1.1
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 8/17/2011
*/


/* Table of Contents
==================================================
    #Base 960 Grid
    #Tablet (Portrait)
    #Mobile (Portrait)
    #Mobile (Landscape)
    #Clearing */



/* #Base 960 Grid
================================================== */

    .container                                  { position: relative; width: 960px; margin: 0 auto; padding: 0; }
    .column, .columns                           { float: left; display: inline; margin-left: 10px; margin-right: 10px; }
    .row                                        { margin-bottom: 20px; }

    /* Nested Column Classes */
    .column.alpha, .columns.alpha               { margin-left: 0; }
    .column.omega, .columns.omega               { margin-right: 0; }

    /* Base Grid */
    .container .one.column                      { width: 40px;  }
    .container .two.columns                     { width: 100px; }
    .container .three.columns                   { width: 160px; }
    .container .four.columns                    { width: 240px; }
    .container .five.columns                    { width: 280px; }
    .container .six.columns                     { width: 340px; }
    .container .seven.columns                   { width: 400px; }
    .container .eight.columns                   { width: 460px; }
    .container .nine.columns                    { width: 520px; }
    .container .ten.columns                     { width: 580px; }
    .container .eleven.columns                  { width: 640px; }
    .container .twelve.columns                  { width: 700px; }
    .container .thirteen.columns                { width: 760px; }
    .container .fourteen.columns                { width: 820px; }
    .container .fifteen.columns                 { width: 880px; }
    .container .sixteen.columns                 { width: 940px; }

    .container .one-third.column                { width: 300px; }
    .container .two-thirds.column               { width: 620px; }

    /* Offsets */
    .container .offset-by-one                   { padding-left: 60px;  }
    .container .offset-by-two                   { padding-left: 120px; }
    .container .offset-by-three                 { padding-left: 180px; }
    .container .offset-by-four                  { padding-left: 240px; }
    .container .offset-by-five                  { padding-left: 300px; }
    .container .offset-by-six                   { padding-left: 360px; }
    .container .offset-by-seven                 { padding-left: 420px; }
    .container .offset-by-eight                 { padding-left: 480px; }
    .container .offset-by-nine                  { padding-left: 540px; }
    .container .offset-by-ten                   { padding-left: 600px; }
    .container .offset-by-eleven                { padding-left: 660px; }
    .container .offset-by-twelve                { padding-left: 720px; }
    .container .offset-by-thirteen              { padding-left: 780px; }
    .container .offset-by-fourteen              { padding-left: 840px; }
    .container .offset-by-fifteen               { padding-left: 900px; }



/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) /*and (max-width: 959px)*/ {
        .container                                  { width: 768px; }
        .container .column,
        .container .columns                         { margin-left: 10px; margin-right: 10px;  }
        .column.alpha, .columns.alpha               { margin-left: 0; margin-right: 10px; }
        .column.omega, .columns.omega               { margin-right: 0; margin-left: 10px; }

        .container .one.column                      { width: 28px; }
        .container .two.columns                     { width: 76px; }
        .container .three.columns                   { width: 124px; }
        .container .four.columns                    { width: 192px; }
        .container .five.columns                    { width: 220px; }
        .container .six.columns                     { width: 268px; }
        .container .seven.columns                   { width: 316px; }
        .container .eight.columns                   { width: 364px; }
        .container .nine.columns                    { width: 412px; }
        .container .ten.columns                     { width: 460px; }
        .container .eleven.columns                  { width: 508px; }
        .container .twelve.columns                  { width: 556px; }
        .container .thirteen.columns                { width: 604px; }
        .container .fourteen.columns                { width: 652px; }
        .container .fifteen.columns                 { width: 700px; }
        .container .sixteen.columns                 { width: 748px; }

        .container .one-third.column                { width: 236px; }
        .container .two-thirds.column               { width: 492px; }

        /* Offsets */
        .container .offset-by-one                   { padding-left: 48px; }
        .container .offset-by-two                   { padding-left: 96px; }
        .container .offset-by-three                 { padding-left: 144px; }
        .container .offset-by-four                  { padding-left: 192px; }
        .container .offset-by-five                  { padding-left: 240px; }
        .container .offset-by-six                   { padding-left: 288px; }
        .container .offset-by-seven                 { padding-left: 336px; }
        .container .offset-by-eight                 { padding-left: 348px; }
        .container .offset-by-nine                  { padding-left: 432px; }
        .container .offset-by-ten                   { padding-left: 480px; }
        .container .offset-by-eleven                { padding-left: 528px; }
        .container .offset-by-twelve                { padding-left: 576px; }
        .container .offset-by-thirteen              { padding-left: 624px; }
        .container .offset-by-fourteen              { padding-left: 672px; }
        .container .offset-by-fifteen               { padding-left: 720px; }
		
		
    }


/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {
        .container { width: 300px; }
        .columns, .column { margin: 0; }

        .container .one.column,
        .container .two.columns,
        .container .three.columns,
        .container .four.columns,
        .container .five.columns,
        .container .six.columns,
        .container .seven.columns,
        .container .eight.columns,
        .container .nine.columns,
        .container .ten.columns,
        .container .eleven.columns,
        .container .twelve.columns,
        .container .thirteen.columns,
        .container .fourteen.columns,
        .container .fifteen.columns,
        .container .sixteen.columns,
        .container .one-third.column,
        .container .two-thirds.column  { width: 300px; }

        /* Offsets */
        .container .offset-by-one,
        .container .offset-by-two,
        .container .offset-by-three,
        .container .offset-by-four,
        .container .offset-by-five,
        .container .offset-by-six,
        .container .offset-by-seven,
        .container .offset-by-eight,
        .container .offset-by-nine,
        .container .offset-by-ten,
        .container .offset-by-eleven,
        .container .offset-by-twelve,
        .container .offset-by-thirteen,
        .container .offset-by-fourteen,
        .container .offset-by-fifteen { padding-left: 0; }

/* Force table to not be like tables anymore */
		table, thead, tbody, th, td, tr { 
			display: block; 
		}
		
		/* Hide table headers (but not display: none;, for accessibility) */
		thead tr { 
			position: absolute;
			top: -9999px;
			left: -9999px;
		}
		
		tr { border: 1px solid #ccc; }
		
		td { 
			/* Behave  like a "row" */
			border: none;
			border-bottom: 1px solid #eee; 
			position: relative;
			padding-left: 70%; 
		}
		
		td:before { 
			/* Now like a table header */
			position: absolute;
			/* Top/left values mimic padding */
			top: 6px;
			left: 6px;
			width: 45%; 
			padding-right: 10px; 
			white-space: nowrap;
		}
		
		/*
		Label the data
		*/
		td:nth-of-type(1):before { content: "Room Type"; }
		td:nth-of-type(2):before { content: "Low from 23/03 to 31/05"; }
		td:nth-of-type(3):before { content: "Middle from 23/03 to 31/05"; }
		td:nth-of-type(4):before { content: "High from 23/03 to 31/05"; }

    }


/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {
        .container { width: 420px; }
        .columns, .column { margin: 0; }

        .container .one.column,
        .container .two.columns,
        .container .three.columns,
        .container .four.columns,
        .container .five.columns,
        .container .six.columns,
        .container .seven.columns,
        .container .eight.columns,
        .container .nine.columns,
        .container .ten.columns,
        .container .eleven.columns,
        .container .twelve.columns,
        .container .thirteen.columns,
        .container .fourteen.columns,
        .container .fifteen.columns,
        .container .sixteen.columns,
        .container .one-third.column,
        .container .two-thirds.column { width: 420px; }
    }


/* #Clearing
================================================== */

    /* Self Clearing Goodness */
    .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

    /* Use clearfix class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
    .clearfix:before,
    .clearfix:after,
    .row:before,
    .row:after {
      content: '\0020';
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0; }
    .row:after,
    .clearfix:after {
      clear: both; }
    .row,
    .clearfix {
      zoom: 1; }

    /* You can also use a <br class="clear" /> to clear columns */
    .clear {
      clear: both;
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0;
    }


 /*
Theme Name: Responsive Video site launch
Theme URI: http://www.ansonika.com/responsive_video_site_launch/
Description: Responsive Video site launch is created by <a href="http://www.ansonika.com">Ansonika</a>.
Version: 1.0.0
Author: Ansonika
Author URI: http://themeforest.net/user/Ansonika/

CSS STRUCTURE:

1. SITE STRUCTURE
2. MEDIA QUERIES

/*============================================================================================*/
/* 1. SITE STRUCTURE */
/*============================================================================================*/

/* #Site Header
================================================ */

.sixteen#logo{ text-align:center;/* background:url(../img/shadow_top.png) no-repeat center top*/; padding-top:25px;}
/*#logo a {background: url(../img/logo.png) no-repeat 0 0; display:block;  text-indent:-9999px; width:180px; height:31px; margin:auto; }*/
#video_container,#timer_container {background-color:#000; height:395px}
#back_in {background:#282828 url(../img/clock.png) no-repeat right center ; padding:20px 10px;}
#logo .ltq{max-width:39%;}
#logo .bh{max-width:31%;}
#logo .ltp{max-width:27%;}
#logo img {vertical-align: middle;}
/* Counter  ================================================================================= */
#defaultCountdown{}
.countdown_rtl{direction:rtl;}
.countdown_row{clear:both;padding:0;text-align:left;width:100%; }

.countdown_section{display:block;  border-bottom:1px solid #1f1f1f; padding: 12px 15px; }
.countdown_section:last-child{border-bottom:none;}
.countdown_amount{font-size:38px;font-weight:200; color:#898989; }
.count_titles{color:#373737;display:block;font-size:26px; float:right; width:70%; text-align:right; font-weight:200; margin-top:10px; }

#form_bg{background:url(../img/bg_form.png) no-repeat top left;height:36px;position:relative;width:342px; margin-left:12px; }
#form_bg input{background:none;border:none;color:#555;display:block;font-size:12px;left:3px;padding:7px;position:absolute;top:3px;width:230px;font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;}
.send_bt{background:url(../img/subscribe_bt.png) no-repeat top left;border:none;cursor:pointer;display:block;height:36px;left:259px;position:absolute;text-indent:-9999px;top:0px;width:82px;}
label.error{background:#ffffe0;border:1px solid #e6db55;color:#333;font-size:11px;line-height:16px;padding:4px 8px; text-align:center; display:none; position:absolute; top: 45px; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}
.success {font-weight:700;color:#acd373; height:26px; padding-top:10px; padding-left:12px}

/* #Site Footer
================================================ */
footer{ display:block; background:url(../img/shadow_video.png) no-repeat center top; padding: 0 0 25px 0;}

ul#follow{float:right;}
ul#follow li{float:left;margin-right:12px;}
ul#follow li a{display:block;height:36px;text-indent:-9999px;width:37px;}
ul#follow li a#tw{background:url(../img/sprite_social.png) no-repeat 0 0;}
ul#follow li a:hover#tw{background:url(../img/sprite_social.png) no-repeat 0 -42px;}
ul#follow li a#rss{background:url(../img/sprite_social.png) no-repeat -47px 0;}
ul#follow li a:hover#rss{background:url(../img/sprite_social.png) no-repeat -47px -42px;}
ul#follow li a#vimeo{background:url(../img/sprite_social.png) no-repeat -94px 0;}
ul#follow li a:hover#vimeo{background:url(../img/sprite_social.png) no-repeat -94px -42px;}
ul#follow li a#fb{background:url(../img/sprite_social.png) no-repeat -141px 0;}
ul#follow li a:hover#fb{background:url(../img/sprite_social.png) no-repeat -141px -42px;}
#copy {margin:10px 0;}
#copy{background: url(../img/line.png) no-repeat center top; color:#000000; padding:0; font-size:11px;}
ul#second_nav{ float:right }
ul#second_nav li{ float:left; margin-left:10px; }


/*============================================================================================*/
/* 2. MEDIA QUERIES */
/*============================================================================================*/
	
/* Smaller than standard 960 (devices and browsers) ========================================= */
@media only screen and (max-width: 959px) {}

/* Tablet Portrait size to standard 960 (devices and browsers) ================================== */
@media only screen and (min-width: 768px) and (max-width: 959px) {
/*#line_oblique_1{ background:url(../img/line_1.png) no-repeat center -100px;}*/
#video_container,#timer_container {height:315px}
footer{ display:block; background:url(../img/shadow_video_2.png) no-repeat center top; padding: 0 0 25px 0;}
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
/*.sixteen#logo{background:url(../img/shadow_top_2.png) no-repeat center top;}
#line_oblique_1{ background:url(../img/line_1.png) no-repeat center -150px;}*/
#video_container {height:270px}
#timer_container {height:315px}
footer{background:url(../img/shadow_video_3.png) no-repeat center top;padding: 0 0 15px 0;}
#form_bg{margin:auto; margin-bottom:50px;}
.success {font-weight:700;color:#acd373; height:26px; padding-top:10px; text-align:center; margin-bottom: 50px;}
ul#follow{float: none; margin-left:172px;}
#copy{margin-top:10px; }
#copy p.five.columns{ text-align:center; margin-bottom:10px;}
ul#second_nav{ float: none; margin:auto; display:block;  text-align:center; }
ul#second_nav li{  display:inline; float:none; margin: 0 5px;}
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
h1{ color:#969696; font-weight:500; font-size:16px; margin-bottom:15px;}
/*.sixteen#logo{background:url(../img/shadow_top_3.png) no-repeat center top;}
#line_oblique_1{ background:url(../img/line_1.png) no-repeat center -150px;}*/
#video_container {height:240px}
#timer_container {height:315px}

#form_bg{background:url(../img/bg_form_2.png) no-repeat top left;height:36px;position:relative;width:280px; margin:auto;}
#form_bg input{background:none;border:none;color:#555;display:block;font-size:12px;left:3px;padding:7px;position:absolute;top:3px;width:260px;font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;}
.send_bt{background:url(../img/subscribe_bt_2.png) no-repeat top left;border:none;cursor:pointer;display:block;height:30px;left:100px;position:absolute;text-indent:-9999px;top:78px;width:78px;}
.success {font-weight:700;color:#acd373; height:26px; padding-top:10px; text-align:center; margin-bottom: 0;}

footer{background:url(../img/shadow_video_4.png) no-repeat center top;padding: 0 0 15px 0;}

ul#follow{float: none; margin-left:112px;}
#copy p.five.columns{ text-align:center; margin:10px 0;}
ul#second_nav{ float: none; margin:auto; display:block;  text-align:center; }
ul#second_nav li{  display:inline; float:none; margin: 0 5px;}
ul#second_nav li:first-child{ display:none}
}