@charset "utf-8";
/* CSS Document */

/*
Theme Name:Land'Some Landing Page
Theme URI: http://www.sociatic.com/
Description: A beutiful landing page built for businesses
Version: 1.0
Author: Kwame Boame
Author URI: http://www.sociatic.com
*/

@import "reset.css";


/*-----------------------BASIC STYLES-----------------------
------------------------------------------------------------*/

@font-face {
    font-family: 'Arial';
    src: url('../fonts/QlassikBold_TB-webfont.eot');
    src: url('../fonts/QlassikBold_TB-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/QlassikBold_TB-webfont.woff') format('woff'),
         url('../fonts/QlassikBold_TB-webfont.ttf') format('truetype'),
         url('../fonts/QlassikBold_TB-webfont.svg#QlassikBoldRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

.clear{
clear:both;	
}

p{
color:#fff;
font-size:14px;;
line-height:1.5em;
font-family:'Arial', Geneva, sans-serif;
}

a{
color:#231FF7;
text-decoration:underline;
font-style:none;
}

h1{font-size:34px; color:#000; font-family:'Arial',Arial, Helvetica, sans-serif;} 
h2{font-size:28px; color:#5B6063; font-family:'Arial',Arial, Helvetica, sans-serif;} 
h3{font-size:26px; color:#00B3FF; font-family:'Arial',Arial, Helvetica, sans-serif;} 
h4{font-size:22px; color:#00B3FF; font-family:'Arial',Arial, Helvetica, sans-serif;} 
h5{font-size:18px; color:#fff; font-family:'Arial',Arial, Helvetica, sans-serif;} 
h6{font-size:16px; color:#fff; font-family:'Arial',Arial, Helvetica, sans-serif;}

body{
background:#fff;
background-repeat:repeat;
font-family:Arial, Helvetica, sans-serif;
}

#container{
width:960px;
background:#fff;
margin:0 auto;
padding:0 20px;
box-shadow:0px 0px 5px #999;
}

/*------------------------HEADER STYLES------------------------------
---------------------------------------------------------------------*/

#header{
background:#3399ff;
height:156px;
}

#header_container{
width:960px;
margin:0 auto;
position:relative;
}

#logo{
position:absolute;
top:15px;
}

#callus{
float:right;
position:absolute;
right:0px;
top:30px;
}

#callus h1{
font-family:"Arial", Arial, Helvetica, sans-serif;
color:#fff;
font-size:30px;	
}

#welcome{
clear:both;
position:relative;
top:91px;
height:65px;
background:#fff;

margin:0 auto;
}

#welcometitle{
width:960px;
margin:0 auto;	
}

#welcome h1{
color:#00B3FF;
font-size:28px;
padding:20px 0;
text-shadow:0 1px #00B3FF;
text-align:center;
margin:0 auto;
overflow:visible;
}

#welcome span{
color:#00B3FF;	
text-shadow:0 1px #00B3FF;
}


/*---------------------Video Area Styles-----------------------
--------------------------------------------------------------*/

#introarea{
background:#fff ;
width:960px;
height:420px;
-moz-border-radius: 0 0 20px 20px;
-webkit-border-bottom-left-radius: 20px;
-webkit-border-bottom-right-radius:20px;
border-radius:0 0 20px 20px;
border-top:0px solid #fff;
}

#benefitsarea{
width:380px;
margin:10px 0 45px 40px;
float:left;	
}

#benefitsarea h2{
font-size:32px;	
}

#benefitlist{
margin-top:35px;
}

#benefitlist li{
font-family:"Arial", Arial, Helvetica, sans-serif;
background: url(../images/check1.png) no-repeat 0 4px;
float: left;
line-height: 1.7em;
padding-left: 40px;
margin: 0 20px 15px 0;
color:#00B3FF;
}

#benefitsarea p{
font-family:"Arial", Arial, Helvetica, sans-serif;
font-size:24px;	
color:#00B3FF;
}




#getstarted{
clear:both;
height:45px;
position:relative;
top:40px;
margin-left:40px;
}

#getstarted a{	
text-shadow: 0 1px 1px #fff;
background: url(../images/btn_gray.png) no-repeat;
font-size: 18px;
color: #00B3FF;
padding: 15px 64px;
text-decoration: none;
}

#vidarea{
background:#fff;
float:right;
color:#00B3FF;
width:400px;
margin:40px  65px 15px 0;	
}

#video{
clear:both;	
width:400px;
margin:0 auto !important;
visibility:visible;
}

#facebookshare{
float:right;
background:#fff;
border:0px solid #fff;
color:#00B3FF;
height:75px;
width:400px;
margin:0 15px 0 0;
-moz-border-radius: 10px;
-webkit-border-radius:10px;
-khtml-border-radius:10px;
border-radius: 10px;
padding:10px 10px 0 10px;
}




/*----------------------------------------Newsletter Styles-----------------------------------
-----------------------------------------------------------------------------------------------*/
#newsletterwrap {
font-family:"Arial", Arial, Helvetica, sans-serif;	
color: #A2A2A2;
clear:both;
padding:5px 0;
margin-top:0px;
border:0px solid #fff;
display:block;
background:#fff;
height:65px;
-webkit-box-shadow: #aaa 0px 0px 0px;
-moz-box-shadow: #fff 0px 0px 0px;
box-shadow: #fff 0px 0px 0px;
}

#newsletterinput{
width:250px;
border:0px solid #fff;
padding:5px;
margin-bottom:5px;	
color:#00B3FF;
font-size:14px;
-moz-box-shadow: inset 0 1px 3px rgba(0,0,0,.4);
-webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.4);
box-shadow: inset 0 1px 3px rgba(0,0,0,.24);	
}

#joinbtn{
width:70px;
background:#3399ff;
background-image: -moz-linear-gradient(top, #ffffff, #f5f5f5); /* FF3.6 */
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #ffffff),color-stop(1, #f5f5f5)); /* Saf4+, Chrome */
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f5f5f5'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f5f5f5')"; /* IE8+ */
border:1px solid #fff;
color:#777;
padding:5px;
-moz-border-radius:7px;
-webkit-border-radius:7px;	
border-radius:7px;
-webkit-box-shadow: 1px 1px 1px #777;
-moz-box-shadow: 1px 1px 1px #777;
box-shadow: 1px 1px 1px #777;
}

#joinbtn:hover{
background:#eee;
background-image: -moz-linear-gradient(top, #eeeeee, #ffffff); /* FF3.6 */
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #eeeeee),color-stop(1, #ffffff)); /* Saf4+, Chrome */
filter:  progid:DXImageTransform.Microsoft.lgradient(startColorstr='#eeeeee', endColorstr='#ffffff'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#ffffff')"; /* IE8+ */
cursor:pointer;
}


#newslettercontent img{
float: left;
margin: 5px 5px 0 -30px !important;
}

#newslettercontent h4{
color:#00B3FF;
text-shadow:0 1px #fff;
margin-top:0px;
font-size:24px;
}

#newstext{
width:740px;
float:left;	
}

#newstext p{
color:#000;
margin:10px 0;
font-size:.9em;
}

#newslettercontent{
margin:0 auto;
width:840px;
}

#newsletterform{
float:right !important;
margin:30px -20px 0 0;
}

/*-----------------------------------------Footer Styles--------------------------------------
----------------------------------------------------------------------------------------------*/

#footer{
clear:both;
margin:5px 0;
padding:5px 0;
font-size:12px;
}
