/*------------------------------------------------------------------
[Table of contents]
1. Reset
2. Global
3. Button
4. Header
5. Main Container
6. Connect Container
-------------------------------------------------------------------*/
/* =================reset css starts here================= */
* { margin:0; padding:0; }
h1, h2, h3, h4, h5, h6, p, ul, li, body, html, form, fieldset { margin:0; padding:0; outline:none; border:0 }
form, fieldset { width:100% }
img { border:0; }
a { text-decoration:none; border:0; outline:0; }
.clear { clear:both; width:auto !important }
ul { list-style:none; }
a:focus, input:focus, textarea:focus, *:focus { outline:0 !important; box-shadow:none !important; }
.nobg { background:transparent !important; }
/* =================reset css ends here================= */
/* =================global css starts here================= */
html, body{height:100%;}
body { font-size:13px; line-height:22px; font-weight:400; font-family:'Montserrat Alternates';  color:#666; background: #fff;  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; padding-left:400px; }
.container { width:100%; max-width:1200px; }
a, input, button { text-decoration:none; color: inherit; outline:none; transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; -webkit-transition: all 0.3s ease-in; -ms-transition: all 0.3s ease-in; }
a img { border: 0px none; }
a{color:#00bcd4;}
a:hover { outline: none; color:#000; text-decoration: none; }
a:active { outline: none; text-decoration: none; }
a:focus { outline: none; outline-offset: 0px; text-decoration: none; color:inherit; }
::-webkit-input-placeholder{color:#999 !important; opacity: 1;}
::-moz-placeholder{color:#999 !important; opacity: 1;}
:-moz-placeholder{color:#999 !important; opacity: 1;}
:-ms-input-placeholder{color:#999 !important; opacity: 1;}
img { max-width: 100%; }
h1, h2, h3, h4, h5, h6 { margin:0px; padding:0px; margin-bottom:10px; line-height:100%; font-weight:700; font-family: 'Montserrat Alternates'; }
h1 { font-size: 60px;}
h2 { font-size: 40px;}
h3 { font-size: 30px;}
h4 { font-size: 24px; }
h5 { font-size: 20px; }
h6 { font-size: 17px; }
p { margin:0px; padding:0px; margin-bottom:15px; }
b { font-weight:600; }
strong { font-weight:700; }
p:last-child { margin-bottom:0; }
.large-para { font-size:24px; line-height:34px; color:#666; font-weight:600; margin-bottom:25px !important }
.mar-40 { margin-bottom:40px !important; }
.mar-30 { margin-bottom:30px !important; }
.no-mar { margin:0 !important; }
.os-animation{opacity: 0;}
.os-animation.animated{opacity: 1;}
/* =================global css ends here================= */
/* =================button css starts here================= */
.btn, .btn:focus, .btn:active { font-weight: 400 !important; padding: 12px 25px; font-size: 16px; line-height:100%; box-shadow:none; display: inline-block; vertical-align: top; box-shadow: 0 1px 0px rgba(0,0,0,0.15) !important;  font-weight:400; font-family: 'Montserrat Alternates'; text-transform:lowercase;}
.btn-default { color: #fff; background-color:#625d85; border:0; }
.btn-default:hover, .btn-default:focus, .btn-default:active { color: #fff; background-color:#625d85; box-shadow: 0 3px 3px rgba(0,0,0,0.15) !important; }
.btn-blank { color: #625d85; background-color:transparent; border:0; box-shadow:none !important;}
.btn-blank:hover, .btn-blank:focus, .btn-blank:active { color: #625d85; background-color:transparent; box-shadow:none !important; }
.btn.btn-lg { padding:18px 40px !important; }
.btn + .btn { margin-left:10px; }
/* =================button css ends here================= */
/* =================Header starts here================= */
header{width:400px;float:left;height:100%;position:fixed;left:0;top:0;bottom:0;z-index:99;background: #625d85; box-shadow: 2px 0 3px 0 rgba(0, 0, 0, 0.15); text-align:center; color:#fff;}
header h1{  margin:0; }
header h2{color:#fff;  margin:0;}
.header-upper{width:100%; display:inline-block; vertical-align:top; padding:25px;}
.header-upper span{display:block; text-transform:uppercase; letter-spacing:5px; color:rgba(0,0,0,0.5); font-size:10px; font-weight:700;}
header a, .connect-container a{color:#fff;}
/* =================Header ends here================= */
/* =================Main container starts here================= */
.main-container { width:100%; float:left; height:100%; color:#666; }
.content-container { width:100%; height:100%; text-align:center; display:inline-block; vertical-align:top; padding:50px 40px; position:relative; overflow:hidden;  display:table; }
.main-content{display:table-cell; vertical-align:middle;}
.clock-box{border-bottom: solid 1px rgba(0,0,0,0.06); display: inline-block;width: 100%;overflow: hidden;} 
.clock-box > div{display:inline-block; width:100%; vertical-align:top;}
 .clock span{ margin:0; line-height:100%; font-size:100px; line-height:100%; display:inline-block; padding:20px; width:25%; float:left;color:#625d85; }
.clock b{font-weight:700 !important; display:block; text-align:right; text-transform:uppercase; letter-spacing:5px; color:#666; font-size:10px; line-height:12px; }
.contact-box{width:100%; display:inline-block; margin:0 auto; max-width:600px; padding-top:20px;}
/* =================Main container end here================= */
/* =================Connect container start here================= */
.connect-container{padding:0 35px;position: fixed;left:0;bottom:0px;width: 400px;float:left;text-align:center;color:rgba(0,0,0,0.5);z-index: 9999; background:#625d85;}
.connect-container h3{color:#fff;}
.social-links{width:100%; display:inline-block; vertical-align:top; margin-bottom:20px;}
.social-links li{display:inline-block;}
.social-links a{display:inline-block; width:32px; height:32px; border:solid 1px #fff; margin:3px; line-height:32px; text-align:center; border-radius:50%; position:relative; font-size:13px; color:#fff; box-shadow:0 2px 5px rgba(0,0,0,0.1);}
.social-links a:hover{color:#4c476e; background:#fff; }
.social-links a:before{content:''; width:0; height:0; float:left; border-radius:50%; border:solid 1px #fff; position:absolute; left:50%; top:50%; transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; -ms-transition: all 0.2s ease-in; opacity:0;}
.social-links a:hover:before{width:36px; height:36px; left:-3px; top:-3px; opacity:1;}
.subscribe-form{width:100%; max-width:400px; display:inline-block; vertical-align:top;overflow:hidden; padding:0; margin:0 0 20px 0;position:relative;}
.subscribe-form input[type=email]{width:100%; padding:5px 15px; background:transparent; border:0; box-shadow:none; height:44px; box-shadow:0 2px 5px rgba(0,0,0,0.1);background:#fff; border-radius:4px; padding-right:110px;   }
.subscribe-form input[type=submit]{position:absolute; top:0; right:0; width:100px; background:#f00; text-align:center; border:0; height:44px; background:#4c476e; color:#fff;  border-radius:0 4px 4px 0; }
#mc_embed_signup div.mce_inline_error, .response{font-size:11px; line-height:15px;}
 .copyright{display:block; padding:10px 0 !important; border-top:solid 1px rgba(255,255,255,0.06);}
/* =================Connect container end here================= */

@media only screen and (max-width: 1200px) {
	 .clock span{ font-size:70px;}
}
/* ============================= */
/* ! Layout for ipad lanscape */
/* ============================= */
@media only screen and (max-width: 1050px) {
body{padding-left:340px;}
header, .connect-container{width:340px;}
}
/*============================= 
! Layout for ipad portrait  
============================= */
@media screen and (max-width: 992px) {
body{padding:0;}
header{width:100%;position:relative;height: auto;padding: 30px 0;}
.main-container{height:auto;}
.content-container{padding:80px 15px;}
.connect-container{width:100%; position:relative; padding:40px 15px 0;}
h1 { font-size: 40px;}
h2 { font-size: 30px;}
h3 { font-size: 26px;}
h4 { font-size: 22px; }
h5 { font-size: 18px; }
h6 { font-size: 16px; }
 .clock span{ font-size:50px;}
}


/* ============================= */
/* ! Layout for mobile(lanscape) version   */
/* ============================= */
@media screen and (max-width: 767px) {
	body{font-size:12px;}
.content-container{padding:50px 0px;}
 .clock span{ font-size:30px;}
 .clock b{font-size:8px; letter-spacing:1px;}
}


/* ============================= */
/* ! Layout for mobile(portrait) version   */
/* ============================= */

@media screen and (max-width: 479px) {
	.btn + .btn { margin-left:0px; margin-top:10px; }

}