
/*--------------------------------------------------------------------------------------
Theme Name: COMING SOON ULTIMATE
Theme URI: http://devitfamily.com
Author URI: http://devitfamily.com
Description: 100% Responsive, Highly Customizable, SEO Friendly Coming Soon template using Twitter Bootstrap Latest, Search Engine Friendly.
Author: BDEXPERT
Version: 1.0
----------------------------------------------------------------------------------------
    1. BASE CSS
    2. MAIN AREA
        2.1 MAINMENU AREA
        2.2 WELCOME TEXT AREA
    3. ABOUT AREA
    4. SERVICE AREA
    5. GALLERY AREA
    6. FOOTER AREA
    7. CONTACT AREA
----------------------------------------------------------------------------------------*/


/*--------------------
    1. BASE CSS
----------------------*/

@import url('https://fonts.googleapis.com/css?family=PT+Sans+Narrow:400,700|Josefin+Sans:400,700');
.alignleft { float: left; margin-right: 15px; }
.alignright { float: right; margin-left: 15px; }
.aligncenter { display: block; margin: 0 auto 15px; }
a { color: #000000; -webkit-transition: 0.3s; transition: 0.3s; }
a:focus, a:hover { color: #000000; outline: 0 solid; text-decoration: none; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button:focus { outline: 0; }
img { max-width: 100%; height: auto; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 15px; font-weight: 700; font-family: 'PT Sans Narrow', sans-serif; letter-spacing: 2px; }
html, body { height: 100% }
body { /*font-family: 'Roboto', sans-serif;
font-family: 'PT Sans Narrow', sans-serif;*/
font-family: 'Josefin Sans', sans-serif; font-size: 16px; line-height: 1.5em; font-weight: 400; color: #555555; }
a:hover, a:focus { text-decoration: none; outline: 0; }
.fix { overflow: hidden; }
.relative { position: relative; overflow: hidden; }
.absulute { position: absolute; }
.v-center { position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.social-bookmark li { display: inline; }
.social-bookmark li a { display: inline-block; width: 35px; height: 35px; text-align: center; font-size: 18px; padding-top: 5px; }
.inline li { display: inline; }
.inline-block li { display: inline-block; padding: 5px 15px; }
.navbar-toggle { border: 2px solid #00aff0; border-radius: 0; }
.navbar-toggle .icon-bar { background: #00aff0 none repeat scroll 0 0; }


/* Remove Chrome Input Field's Unwanted Yellow Background Color */

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus {
 -webkit-box-shadow: 0 0 0px 1000px white inset !important;
}
.area-title { display: inline-block; margin-bottom: 20px; position: relative; width: 100%; }
.area-title::after { background: #D9464D none repeat scroll 0 0; content: ""; height: 5px; left: 0; position: absolute; top: 24px; width: 100%; }
.area-title h2 { color: #000000; font-size: 50px; letter-spacing: 5px; line-height: 1; margin-bottom: 40px; padding: 0 10px; position: relative; text-transform: uppercase; z-index: 9; background: #fff; display: inline-block; }
.area-title.title-inverse { float: right; text-align: right; }
.title-box { box-shadow: 0 0 0 10px #D9464D; height: 80%; left: 0; position: absolute; top: -10px; width: 16%; z-index: 1; }
.area-title.title-inverse .title-box { left: auto; right: 0; }
.section-padding { padding: 100px 0; }
.padding-top { padding-top: 100px; }
.padding-bottom { padding-bottom: 100px; }
.padding-100-70 { padding-top: 100px; padding-bottom: 70px; }
.padding-100-50 { padding-top: 100px; padding-bottom: 50px; }
.gray-bg { background: #EFEFEF; }
.dark-bg { background: #000000; color: #ffffff; }
.dark-bg .area-title h2 { color: #ffffff; }
a.readmore { background: #333 none repeat scroll 0 0; color: #ffffff; display: inline-block; letter-spacing: 2px; margin-top: 20px; min-width: 160px; padding: 10px 30px; text-align: center; }
a.readmore:hover { background: #000000 none repeat scroll 0 0; color: #ffffff; }
/*--------------------------
    2. MAIN AREA
---------------------------*/

.main-area { height: 100%; position: relative; width: 100%; overflow: hidden; }
.main-area-bg { background: rgba(0, 0, 0, 0) url("img/background/default_3.jpg") no-repeat scroll center center / cover; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
.main-area-bg::before { border: 10px solid #fff; content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 1; }
.main-area-bg::after { background: #000; content: ""; height: 100%; left: 0; opacity: 0.5; position: absolute; top: 0; width: 100%; }
.transparent-layer .main-area-bg::after { background: #000 url('img/pattarn.png'); }
/*-----------------------------------
    2.2 WELCOME TEXT AREA
-------------------------------------*/

.welcome-text-area { color: #ffffff; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; position: relative; z-index: 2; }
.welcome-text h3, .welcome-text h1 { font-size: 30px; letter-spacing: 6px; text-transform: uppercase; }
.welcome-text h1 { font-size: 30px; line-height: 1; color: #D9464D; }
.home-button { margin-top: 60px; }
.home-button a {    background: #fff none repeat scroll 0 0;
    color: #000;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0px;
    margin: 0 10px;
    padding: 10px 10px 10px 10px;
    text-transform: capitalize;
    min-width: 120px;
    display: inline-block;
    
}
.home-button a:hover { background: #000000; color: #ffffff; }
.subscriber-form form { border-bottom: 2px solid; height: 44px; margin: 0 auto 40px; position: relative; width: 50%; background: rgba(255, 255, 255, 0.2); }
.subscriber-form form input { background: transparent none repeat scroll 0 0; border: 0 none; font-size: 18px; height: 100%; left: 0; padding: 10px; position: absolute; top: 0; width: 100%; }
.subscriber-form form input:focus { outline: 0; }
 .subscriber-form input::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #ffffff;
}
 .subscriber-form input::-moz-placeholder {
    /* Firefox 19+ */
    color: #ffffff;
}
 .subscriber-form input:-moz-placeholder {
    /* Firefox 18- */
    color: #ffffff;
}
.subscriber-form form button { background: #fff none repeat scroll 0 0; border: 0 none; color: #000; font-weight: 700; height: 100%; letter-spacing: 2px; position: absolute; right: 0; text-transform: capitalize; top: 0; -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; width: 30%; }
.subscriber-form form button:hover { background: #000000 none repeat scroll 0 0; color: #ffffff; }
.subscriber-form label { color: #fff; left: 0; margin: 0; position: absolute; text-align: center; top: -25px; width: 100%; }
.subscriber-form label.valid { top: 10px; }
.clock-countdown { bottom: 0; left: 0; margin: 0 auto 30px; position: relative; right: 0; top: 0; max-width: 460px; }
.clock-countdown .text { position: relative; width: 100%; font-weight: normal; letter-spacing: 0; margin-top: 0.5em; display: block; text-transform: uppercase; color: #fff; text-align: center; }
.clock-countdown .block:last-child .digit:after { display: none; }
.clock-countdown .days-counter { display: inline-block; position: relative; text-align: center; width: 100%; top: 0; bottom: 0; margin-top: -100px; }
.clock-countdown .days-counter .digit { color: #fff; font-size: 155px; font-weight: 700; letter-spacing: 5px; line-height: 1; }
.clock-countdown .days-counter .txt { font-size: 24px; font-weight: bold; letter-spacing: 2px; position: absolute; right: auto; text-transform: uppercase; top: 1.4em; width: auto; }
.clock-countdown .hour-counter { color: #fff; font-family: "PT Sans Narrow", sans-serif; font-size: 24px; font-weight: 700; position: relative; text-align: center; width: 100%; letter-spacing: 2px; word-spacing: 8px; }
.clock-countdown .hour-counter .normal { font-weight: 100; }
.clock-countdown .hour-counter:after, .clock-countdown .hour-counter:before { position: absolute; content: ''; border-bottom: 1px solid #fff; height: 1px; bottom: 10px; }
.clock-countdown .hour-counter:before { right: 0; left: 75%; }
.clock-countdown .hour-counter:after { left: 0; right: 75%; }
.clock-countdown .hour-counter .border:after, .clock-countdown .hour-counter .border:before { position: absolute; content: ''; border: 1px solid #fff; width: 20px; height: 125px; bottom: 10px; }
.clock-countdown .hour-counter .border:before { left: 0; right: auto; border-right: none; border-bottom: none; }
.clock-countdown .hour-counter .border:after { right: 0; left: auto; border-left: none; border-bottom: none; }
.social-book-mark, .information-contact { bottom: 20px; position: absolute; right: 20px; z-index: 9; }
.information-contact { right: auto; left: 20px; }
.social-book-mark li, .information-contact li, .single-contact ul li { display: inline-block; }
.social-book-mark li a, .information-contact li a, .single-contact ul li a { background: #fff none repeat scroll 0 0; color: #000; display: inline-block; height: 27px; padding-top: 3px; text-align: center; width: 30px; margin-left: 5px; }
.information-contact li a { margin-left: auto; margin-right: 5px; }
.single-contact ul li a { margin-left: auto; margin-right: 5px; }
.social-book-mark li a:hover, .information-contact li a:hover, .single-contact ul li a:hover { background: #D9464D none repeat scroll 0 0; color: #fff; }
/*-----------------------------
    3. ABOUT AREA
-------------------------------*/

.left-contact-content, .right-details-content { position: absolute; top: 0; left: -50%; width: 50%; background: #fff; z-index: 9; height: 100%; overflow-x: hidden; overflow-y: scroll; padding: 0 40px; -webkit-transition: 0.5s; transition: 0.5s; }
.right-details-content { left: auto; right: -50%; }
.left-contact-content.content-open { border-right: 1px solid #000; left: 0; }
.right-details-content.content-open { border-left: 1px solid #000; right: 0; }
.push-content-close { background: #D9464D none repeat scroll 0 0; color: #fff; cursor: pointer; font-size: 25px; height: 40px; padding-top: 5px; position: fixed; right: -40px; text-align: center; top: 10px; -webkit-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; width: 40px; }
.left-contact-content .push-content-close { left: -40px; right: auto; }
.right-details-content.content-open .push-content-close { right: 0; }
.left-contact-content.content-open .push-content-close { left: 0; }
/*-----------------------------------
    4. SERVICE AREA
------------------------------------*/

.service-area.padding-bottom, .gallery-area.padding-bottom { padding-bottom: 70px; }
.single-service { margin-bottom: 30px; }
.servive-icon { color: #000; font-size: 50px; margin-bottom: 10px; }
.single-service h3 { color: #000; font-family: "Josefin Sans", sans-serif; font-size: 18px; font-weight: 400; text-transform: uppercase; }
/*-----------------------------------
    5. GALLERY AREA
------------------------------------*/

.single-gallery { margin-bottom: 30px; overflow: hidden; position: relative; }
.gallery-thumb img { width: 100%; }
.gallery-view { -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0; color: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: calc(100% - 20px); -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; left: 10px; letter-spacing: 2px; opacity: 0; position: absolute; text-align: center; text-transform: capitalize; top: 10px; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; width: calc(100% - 20px); }
.gallery-view h3 { background: #D9464D none repeat scroll 0 0; display: inline-block; font-size: 18px; opacity: 0; padding: 2px 5px; -webkit-transform: translateY(-30px); transform: translateY(-30px); -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; }
.gallery-view p { font-weight: 700; opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; }
.single-gallery:hover .gallery-view { opacity: 1; }
.single-gallery:hover .gallery-view h3, .single-gallery:hover .gallery-view p { opacity: 1; -webkit-transform: translate(0px); transform: translate(0px); }
a.gallery-view:hover { color: #fff; cursor: url("img/cursor.gif") 20 20, auto; }
/*-------------------------------
    6. FOOTER AREA
-------------------------------*/

.footer-area { padding: 15px 0; }
.footer-area a { color: #fff; }
.footer-area .footer-copyright p { margin-bottom: 0; }
/*------------------------------
    7. CONTACT AREA
-------------------------------*/

.nicescroll-rails.nicescroll-rails-vr { width: 0; display: none !important; }
.contact-address-and-details h4 { text-transform: uppercase; color: #000; }
.contact-details .logo { border-bottom: 1px solid #dfdfdf; margin-bottom: 40px; }
.logo h3 { text-transform: uppercase; letter-spacing: 5px; color: #000; }
.single-contact { margin-bottom: 40px; min-height: 80px; }
.single-contact p { margin-bottom: 5px; }
.contact-hidding { text-align: center; padding: 10px; background: #000; color: #fff; margin-bottom: 50px; }
.form-control { border: 1px solid; border-radius: 0; color: #000; margin-bottom: 20px; max-height: 130px; min-height: 40px; font-size: 16px; }
.form-control:focus { border-color: #000; box-shadow: 0 0 0; }
.contact-form button { background: #333 none repeat scroll 0 0; border: 0 none; color: #fff; float: right; letter-spacing: 1px; padding: 10px 25px; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; }
.contact-form button i { margin-left: 10px; }
.contact-form button:hover { background: #D9464D none repeat scroll 0 0; }
/*==============================
    OTHERS VIESION
================================*/

.video-bg .main-area-bg { background: transparent; }
.move-perticle #demo-perticle { position: absolute; }
.fullscreen-perticle .main-area-bg { background: rgba(0, 0, 0, 0) url("img/background/default_5.jpg") no-repeat scroll center center / cover; }
.fullscreen-perticle #particles-js { position: absolute; width: 100%; height: 100%; left: 0; top: 0; }
.ripple-bg .main-area { background: rgba(0, 0, 0, 0) url("img/background/water_3.jpg") no-repeat scroll center center / cover; }
.ripple-bg .main-area-bg { background: transparent; }
.zoom-slider-bg .main-area-bg { background: transparent; }
.map-bg .main-area-bg { background: transparent; }
.map-bg .main-area-bg:after { opacity: .8; }
.solid-bg .main-area-bg { background: #00aff0; }
.winter-bg #winter-effect { position: absolute; }
.bubble-bg #bubble-bg { position: absolute; }
.bubble-perticle #bubble-perticle { position: absolute; }
.bubble-perticle #bubble-perticle .sketch { position: relative; z-index: 2; }
.bubble-perticle .subscriber-form form, .bubble-perticle .home-button { z-index: 9; position: relative; }
.rainbow-square #rainbow-square { position: absolute; }
#surface-shader { position: absolute; width: 100%; height: 100%; }
.cd-words-wrapper{
	text-align:center
}