/*  

Theme Name:    Coming Soon
Theme URI:     http://templatic.com/
Description:   Developed by Bhavesh Radadiya.
Version:       1
Author:        R.Bhavesh
Author URI:    http://templatic.com/

*/

/*             IMPORTANT NOTE!
               If you wish to make custom changes to your theme, DO NOT EDIT THIS FILE. Instead, use the custom.css template
               to define custom styles. This way, you will still be able to take advantage of future upgrades to the theme
               without worrying about overwriting your style changes.
*/

/* reset css */
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,font,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{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:1}
ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
:focus{outline:0}
ins{text-decoration:none}
del{text-decoration:line-through} 
table{border-collapse:collapse;border-spacing:0}

html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

/* body ------------------------------ */
html, body { margin:0; padding:0; font:18px 'Raleway', sans-serif; height: 100%; position: relative; background:rgba(0, 0, 0, 0) url(images/flat-bg.jpg) repeat-x scroll left top / cover ; background-attachment: fixed; color:#555;  }
body::after {
    background: rgba(241, 241, 241, 0.2);
    bottom: 0;
    content: "";
    height: 100%;
    left: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 65%;
    z-index: 0;
}
body::before {
    background: rgba(255, 255, 255, 0.1);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
}
a { text-decoration:none; color:#0a82d8; }
a:hover { text-decoration:none; color:#000; }


/* text formating ------------------------------ */
p { margin:0; padding:0px 0 15px 0; line-height:26px; font-size: 18px; color:#333; }
p em { line-height:20px; } 
code { line-height:18px; }

ul { margin:0 0 12px 0; padding:0;}
ul li { margin:0 0 8px 14px; padding:0; list-style:disc; line-height:22px;   }

ol { margin:0 0 0 20px; padding:0 0 10px 5px; list-style-type:decimal;  line-height:18px; }
ol li ol { margin:8px 0 5px 18px; padding:0; }
ol li { margin:0 0 5px 25px; padding:0; list-style:decimal; }

dl,hr,ol,ul,pre,table,address,fieldset { margin:0; padding:0; }

blockquote { margin:0; padding:0 0 25px 35px; height:100%; overflow:hidden; background:url(images/quote.png) no-repeat left top; font:18px 'Raleway', sans-serif; }

/* headings ----- */
h2, h3, h4, h5, h6 { margin:30px 0 0px 0; padding:0; line-height:normal; font-weight:normal; font-family:'Raleway', sans-serif;; 	 }

h1 { font-size:36px; }
h2 { font-size:18px; }
h3 { font-size:16px; }
h4 { font-size:24px; }
h5 { font-size:18px; }
h6 { font-size:18px; }


#wrapper { width:100%; display: inline-block; position:relative; padding:0; }
#sidebar {
    display: inline-block;
    float: left;
    margin-top: -6px;
    padding-top: 7%;
    position: fixed;
    text-align: right;
    width: 35%;
    z-index: 99;
}
#sidebar > a {
    margin-right: -150px;
}
#content {
    display: inline-block;
    float: right;
    padding: 7% 160px 0 260px;
    position: relative;
    vertical-align: top;
    width: 65%;
    z-index: 999;
}

/* content ------------------*/
#content .logo { margin-bottom:15px; font-size:36px; font-weight:bold;  }
#content .logo a{
	color:#33b5e5;
}
#content .logo a:hover{
	color: #30b2e0;
}
#content .logo p { font-size:12px; }
#content p.description { margin:0; padding:0;}

#content p.highlight { margin:18px 0 0 0; color:#df5c25; font-size:16px; font-weight:bold; }

.btn{
	display: inline-block;
	width: auto;
}
.btn a {
    background-color: #33B5E5;
    border-radius: 29px;
    color: #fff;
    display: inline-block;
    font-size: 17px;
    font-weight: bold;
    padding: 15px 25px;
}
.btn a:hover{
	background: #30b2e0;
	color: #fff;
}

#sidebar p.copy {
    color: #000;
    font-size: 14px;
    line-height: normal;
    margin: 20px -130px 0 0;
    padding: 0;
}
#sidebar p.designby {
    color: #000;
    font-size: 14px;
    margin: 5px -110px 0 0;
    padding: 0;
}
#sidebar p.designby a { color:#333; text-decoration:none; }
#sidebar p.designby a:hover { color:#000; text-decoration:none; }



#content ul li {
    font-size: 16px;
    line-height: 28px;
    list-style: outside none none;
    margin-left: 0;
    padding-left: 30px;
    position: relative;
}
#content ul li::after {
    content: "\f061";
    font-family: FontAwesome;
    left: 0;
    position: absolute;
    top: 0;
    width: 30px;
}


.subscribe { width:400px; height:42px; clear:both; background:url(images/subscribe_bg.png) no-repeat left 2px;  }
.subscribe .submit { background:url(images/b_go.png) no-repeat left top; width:60px; height:45px; border:none; cursor:pointer; float:right; }
.subscribe .submit:hover { background-position:0 -45px; }
.subscribe .textfield { background:#fff; padding:8px; margin:4px 0 0 18px; width:300px; font:16px 'Raleway', sans-serif; color:#777; border:none; }
.subscribe .textfield:focus { color:#444;  }

/* clearfix ----- */
.clear { clear:both; display:block; overflow:hidden; visibility:hidden; width:0; height:0 }
.clearfix:after { clear:both; content:' '; display:block; font-size:0; line-height:0; visibility:hidden; width:0; height:0; }
.clearfix { display:inline-block }
* html .clearfix { height:1% }
.clearfix { display:block; }



@media screen and (max-width: 1500px){
/*	html, body{
		height:inherit;
	}
	body::after{
		height: inherit;
		top: 0;
		bottom: 0;
	}*/
}

@media screen and (max-width: 1200px){

}

@media screen and (max-width: 1024px){
	#content {
	    padding: 10% 30px 0 90px;
	}
	#sidebar{
		width: 20%;
	}
	body::after{
		width: 80%;
	}
}

@media screen and (max-width: 767px){
	#sidebar{
		width: 100%;
		text-align: center;
		position: inherit;
	}
	#sidebar > a {
	    margin-right: 0;
	}
	#sidebar p.copy{
		margin: 20px 0 0;
	}
	#sidebar p.designby{
		margin: 5px 0 0;
	}
	#content {
	    background: rgba(255, 255, 255, 0.6) none repeat scroll 0 0;
	    float: left;
	    margin-top: 20px;
	    padding: 50px;
	    width: 100%;
	}
	body::before{
		background:rgba(255, 255, 255, 0.4); 
	}
	body::after{
		content: none;
	}
	body{
		height: auto;
	}
}

@media screen and (max-width: 480px){
	#content{
		padding: 20px;
	}
}