html{height:100%;}
body{text-align: center; font-family: 'Lato', arial, sans-serif; margin: 0; color:#333; -webkit-font-smoothing: antialiased!important; font-smoothing: antialiased; height:100%;}

.clear{clear:both;}

@font-face {
    font-family: 'aleoregular';
    src: url('../type/Aleo-Regular-webfont.eot');
    src: url('../type/Aleo-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../type/Aleo-Regular-webfont.woff') format('woff'),
         url('../type/Aleo-Regular-webfont.ttf') format('truetype'),
         url('../type/Aleo-Regular-webfont.svg#aleoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


/*MEDIA*/
img, embed, object, video, iframe{max-width:100%; margin:0 0 2em 0;}	
img a{border:none !important;}

/*TYPE*/
p{clear:left; line-height: 1.6em; font-size: 1.1em;}
ul{clear:left; font-size: 1.1em; line-height: 1.6em;}
br.clear{clear:both;}
h1, h2, h3{margin:0; font-family: 'aleoregular', Georgia, serif; font-weight: normal;}
a{text-decoration: none; color:#2c89a0; }
a:hover{border-bottom:1px solid #2c89a0;}

a.button{float:left; margin:0; background:#ff6600; border:none; color:#fff; border-radius: 3px; font-size: 1.3em; padding:10px 25px; border-bottom:5px solid #aa4400; text-shadow: -1px 1px 0px rgba(0, 0, 0, 0.1);}
a.button.small{font-size: 0.9em;}
a.button:hover{background-color:#d45500; border-bottom:5px solid #aa4400;}
a.button:active{border:none; margin:5px 0 0 0; }

/*HOME PAGE*/

.full{width:100%; float:left;}
.container{width:80%; margin:0 auto; text-align: left;}
footer{width:100%; float:left; margin:0;}
footer p{font-size: 0.8em;}

nav{float:right; width:50%; margin:0;}
nav ul{list-style-type: none; margin:0; padding:0; float: right; font-size: 1em;}
nav ul li{float:left; margin-left:0.5em;}
nav ul li a{color:#b3b3b3; display: block; padding:0.7em 1em;}

nav ul li a:hover{color:#ff6600; border:none;}

section{float:left; width:100%; margin:0; padding:0; text-align: center; border-bottom:1px solid #e6e6e6;}

#mast{float:left; height:100%;}

#mast #testimonials{float:left; width:50%; height:100%;}
#mast #testimonials .item{float:left; width:100%; height:100%; background-size: cover;}

.testimonial{margin-top:25%;}
.testimonial p{text-shadow: 1px 1px 1px rgba(54, 54, 54, 0.6); color:#fff; margin-top:0;}
p.quote{width:50%; background: #fff; padding:20px 15px; display: block; margin:0 auto; border-radius: 3px; color:#4d4d4d; text-shadow:none;}
.testimonial img{background: url(../i/bg-speech.png) top center no-repeat; margin:0 0 1em 0; padding:2em 0 0 0;}

.abstract .testimonial{margin: 0 10% 0 0; text-align: center;}
.abstract .testimonial p.quote{width:85%; margin:0 auto 0 auto;}
.abstract .testimonial p{margin:0 auto; color:#4d4d4d; text-shadow: none;}

#owl-demo{height:100%;}
#venuebooker{background: url(../i/bg-venuebooker.jpg) center no-repeat;}
#hastings{background: url(../i/bg-hastings-2.jpg) center no-repeat;}
#rolltack{background: url(../i/bg-rolltack-3.jpg) center no-repeat;}

#mast #cta{float:right; width:50%; padding:0; position:relative; height:100%; text-align:left; color:#4d4d4d; background-color: #f9f9f9;}
#mast #cta .container{margin-top:1.5em;}
#mast #cta h1{float:left; font-weight: normal; font-size: 2.2em; margin:1em 0 1em 0;}
#cta .button{margin:10px 0 2em 0;}
#cta .button:active{margin-top: 15px;}
#cta img{margin-bottom: 0;}

ul#btmnav{width:100%; padding:0; list-style-type: none; float:left; border-top:1px solid #e6e6e6; background: #fff; font-size: 1em; position: absolute; bottom:0; margin:0;}
#btmnav li{float:left; margin:0; border-right:1px solid #e6e6e6; text-align: center;}
#btmnav li:first-child{padding-left: 10%; margin-left: -7%;}
#btmnav li:last-child{border:none;}
#btmnav li a{display:block; padding:2em 3em; color:#b3b3b3; background: #fff;}
#btmnav li a:hover{border:none; color:#ff6600;}

.how{float:left; width:100%; padding:5em 0; text-align: center; background: #f9f9f9;}
.how h2{font-weight: normal; font-size: 2.5em; width:65%; margin:0 auto 2em auto; color:#ff6600;}
.how ing{margin-bottom: 0;}

.fifth{float:left; width:16%; padding:1em 2%; border-right:1px solid #e6e6e6;}
.fifth:last-child{width:15.5%; border:none;}
.fifth p{font-size: 1em; line-height: 1.4em;}

.quarter{float:left; width:19%; padding:1em 3%; border-right:1px solid #e6e6e6;}
.quarter:last-child{width:18.5%; border:none;}
.quarter p{font-size: 1em; line-height: 1.4em;}

.third{float:left; width:21%; padding:3em 6%; border-right:1px solid #e6e6e6; background: #fff;}
.third:last-child{width:21%; border-right:none;}
.third p{font-size: 1em; margin-bottom:0; line-height: 1.4em;}

.half{float:left; width:30%; margin:0 0 0 10%; text-align: left;}
.half h3{margin-top: 1.5em;}

.abstract{float:left; width:35%; margin:0 0 0 10%; text-align: left;}
.abstract p{margin-right:10%;}

.product{float:right; width:45%; margin:0 10% 0 0; text-align: left;}
.product img{margin: 0 0 -3px 0; width: 72%; float: left;}
.product p{font-size:0.9em; line-height: 1.3em; text-align: right; background: url(../i/larrow.png) bottom left no-repeat; padding:0 0 10px 0; color:#ff6600; width:24%; float: right; margin:50px 0 0 1%;}

#devices{width:897px; margin:0 auto; text-align: center;}
#devices ing{margin-bottom: 0.7em;}
.ipad{float:left; width:235px;}
.laptop{float:left; width:542px;}
.iphone{float:left; width:120px; text-align: right;}
.iphone img{margin-top:2em;}

#devices p{font-size:1.1em; line-height: 1.3em; background: url(../i/uarrow.png) top center no-repeat; padding:30px 0 0 0; color:#ff6600; margin:0;}

.benefit{margin-bottom: 3em; padding-left: 40px;}
#time{background: url(../i/icon-time.png) 0 3px no-repeat;}
#beautiful{background: url(../i/icon-bucket.png) 0 3px no-repeat;}
#share{background: url(../i/icon-share.png) 0 3px no-repeat;}
.benefit:last-child{margin-bottom: 0;}
.benefit img{float:left;}
.benefit h3{font-size: 1.4em;}
.benefit p{font-size: 1em;}

table{margin:0 auto 8em auto; text-align: left; width:40%;}
table thead span{font-size: 3em;}
table thead td{background: #333; color:#fff;}
td{width:50%; padding:1em 0; text-align: center; border-left: 1px solid #fff;}
td:first-child{border:none;}
tr{background-color: #fff;}
tr:nth-child(odd){background: #ffede1;}
.tbtn td{padding:0; width: 100%; font-size: 1.4em; background: #f9f9f9;}
.tbtn a{background: #ff6600; border-bottom: 5px solid #aa4400; display:block; width: 100%; padding:1.5em 0; color:#fff; text-shadow: -1px 1px 0px rgba(0, 0, 0, 0.1); border-radius: 3px; margin:40px 0 0 0;}
.tbtn a:hover{background-color:#d45500;}
.tbtn a:active{margin-top:45px; border:none;}

/*BLOG*/
#main-blog{float:right; width:51%; padding:2em 10%; background: #fff; margin:0; text-align: left; min-height: 100%;}
.entry{width:100%; border-bottom:1px solid #ccc; margin:0 0 2em 0;}
#sidebar{float:left; width:25%; text-align: center; padding:2em 2% 2em 2%; position: fixed; background: #2ca089; min-height:100%;}
#sidebar img{max-width: 90%;}
#sidebar p{margin-bottom: 1em; color:#4c3d0f;}
#sidebar ul{list-style: none; padding:0; margin:0;}

#sidebar a{color:#4c3d0f; text-decoration: none;}

#main-blog h1{font-size:2em; line-height: 1em; margin:1em 0; border:none; padding:0; font-weight: normal; color:#2ca089;}
#main-blog h2{font-size:1.7em; line-height:1.3em; margin:2em 0 1em 0; font-weight: normal; color:#2ca089;}
#main-blog h3{font-size:1.5em; line-height:1.3em; margin:2em 0 1em 0; font-weight: normal; color:#2ca089;}
#main-blog h4{font-size:1.4em; line-height:1.3em; margin:2em 0 1em 0; font-weight: normal; color:#2ca089;}
#main-blog h5{font-size:1.3em; line-height:1.3em; margin:2em 0 1em 0; font-weight: normal; color:#2ca089;}
#main-blog p{font-size: 1.18em; line-height: 1.6em; margin:0 0 2em 0; color:#333; font-weight: normal;}
#main-blog ul, ol{font-size: 1.2em; margin:0 0 2em 0;}
#main-blog li{margin:0 0 0.8em 0; line-height: 1.4em;}
#main-blog ol{list-style-type: decimal;}
#main-blog ul{list-style-type: disc;}
#main-blog blockquote{width:100%; border-top:1px solid #2ca089; border-bottom:1px solid #2ca089; padding-top:2em; margin-left:0; margin-bottom: 2em; background: #fffae4;}
#main-blog blockquote p{font-style: italic; margin-bottom: 1.5em; font-size: 1.3em; width: 90%; margin-left: 5%;}
#main-blog table{margin: 0 0 30px 0; max-width: 100%;}
#main-blog p a{text-decoration:none; background-color: #2ca089; font-size: 0.9em; padding:0.15em 0.5em; color:#4d3e0f;}
#main-blog p a:hover{background-color:#4d3e0f; color:#2ca089;}

.center{text-align: center;}
.left{text-align: left;}
.italic{font-style: italic;}

p.date{font-size: 1em; margin:0 0 1em 0;}

/*FORM*/

.capture form label{display:block; width:100%; font-size:0.8em; margin:0 0 5px 0; font-family: 'Roboto', arial, sans-serif; font-weight: 300;}
.capture form input{border:none; width:100%; padding:10px 0; font-size: 1em; color:#808080; text-indent:10px;}
.capture form .row{margin:0 0 1em 0;}
.capture form input[type="submit"]{background:#d40000; border:none; color:#fff; border-radius: 3px; font-size: 1.3em; padding:10px 25px; border-bottom:5px solid #800000; font-family: 'Roboto', arial, sans-serif; font-weight: 300; cursor: pointer;}
.capture form input[type="submit"]:hover{background-color:#aa0000;}
.capture form .terms input{float:left; width:20px; margin-top:0;}
.capture form a{color:#333; border-bottom: 1px solid }

#sidebar form{text-align: center;}

#sidebar input[type="text"],
	#sidebar input[type="password"],
	#sidebar input[type="email"],
	#sidebar textarea,
	#sidebar select {
	margin:0 auto 1em auto; float:none; width:90% !important;}
	
	#sidebar input[type="submit"]{
	margin:0 auto 1em auto; float:none; width:auto;}

p.note{float:right;}
div.error {width:40%; background: red; padding:2.5%; font-style: normal; font-family: Arial, sans-serif; color:#fff; margin: 0 auto 0 auto; border-top-left-radius: 5px; border-top-right-radius: 5px;}
p.note a{text-decoration: underline; background-color: red; color:#fff; font-size: 100%; padding:0;}
p.note a:hover{color:#000;}

/*Signup*/

#main-blog form#signup input[type="email"], form#signup input[type="text"], form#signup input[type="password"]{width:500px; border:1px solid #ccc; clear: both; }

form#signup label {display: block; float:left; overflow: auto; width: auto; height: auto; font-family: arial, sans-serif;}

form#signup .row{float:left; width:100%; clear: both;}
form#signup .half{float:left; width:240px; margin:0 20px 0 0;}
form#signup .half:last-child{margin:0;}
form#signup .half input{width:100%;}

form#signup input[type="submit"]{float:left;}

/*REGISTER*/
#register{background: #f9f9f9; color:#4d4d4;}
#registration{float:left; width:100%; text-align: center; margin:0;}
#registration header{width:60%; margin:50px auto 20px auto; text-align: center;}
#registration header img{margin:0;}
#registration header a:hover{border:none;}
#registration header h1{width:50%; float:right; margin:0 auto;}

#registration h1{width:60%; margin:0 auto 50px auto;}
#registration p{width:60%; margin:0 auto 1.5em auto;}

#registration form{background: #fff; border:1px solid #e6e6e6; text-align: left; width:50%; margin:0 auto 4em auto; padding:30px;}
#registration form label{display:inline; width:40%; text-align: left; font-size:1em; margin:0 0 10px 0; font-family: 'Roboto', arial, sans-serif; font-weight: 300; padding:0; float: left;}
#registration form p{float:right; text-align: left; width:100%; padding:0; margin:0 0 10px 0; font-size:0.8em; color:#2ca089;}
#registration form input{border:none; width:100%; padding:10px 0; font-size: 1em; color:#808080; text-indent:10px; border:1px solid #ccc;}
#registration form .row{margin:0 0 1em 0;}
#registration form input[type="submit"]{width:auto; background:#ff6600; border:none; color:#fff; border-radius: 3px; font-size: 1.3em; padding:10px 25px; border-bottom:5px solid #aa4400; font-family: 'Roboto', arial, sans-serif; font-weight: 300; cursor: pointer; text-align: left;}
#registration form input[type="submit"]:hover{background-color:#d45500;}
#registration form input[type="submit"]:active{margin-top:5px; border-bottom: none;}
#registration form .terms{margin-bottom: 60px;}
#registration form .terms input{float:left; width:20px; margin-top:3px;}
#registration form .terms label{float:left; width:80%;}
#registration form a{color:#333; border-bottom: 1px solid }

#registration form .error{background:#fff; padding:0; color:red;}
#registration form .error input{border-color:red;}

#registration .submit{margin:15px 0 0 0;}

/*=============TABLETS - PORTRAIT ==========*/
@media only screen and (min-width: 569px) and (max-width: 959px) {
/*HOME PAGE */
body{}
.container{width:90%; margin:0 5%;}

#mast{height:auto; display:box; display:-moz-box; display:-webkit-box; box-orient:vertical; -moz-box-orient:vertical; -webkit-box-orient:vertical;}

#mast #testimonials{width:100%; height:auto; float:none; box-ordinal-group: 2; -moz-box-ordinal-group: 2; -webkit-box-ordinal-group: 2;}
#testimonials .testimonial{margin:10% 25%; width:50%;}
#testimonials .testimonial p.quote{padding:5%; width:90%;}

#mast #cta{width:100%; height:auto; padding-top: 0.2em; float:none; box-ordinal-group: 1; -moz-box-ordinal-group: 1; -webkit-box-ordinal-group: 1;}
#mast #cta h1{font-size: 2em; color:#ff6600;}

ul#btmnav{position: static;}
#btmnav li{}
#btmnav li:first-child{padding-left:0; margin-left:0;}
#btmnav li:last-child{}
#btmnav li a{padding:2em 2em;}
#btmnav li a:hover{border:none; color:#ff6600;}

#mast #cta img{float:left; max-width:30%; padding:0.4em 0 0 0;}
nav{float:right; width:70%; padding:0;}
nav ul {margin:0; float:right;}

.how{position: relative; width:90%; padding:0 5%; text-align: center;}
.how h2{width:80%; margin:1em 10%; padding:0; font-size: 1.8em;}

#devices{max-width:100%; text-align: center;}
#devices .ipad{width:100%; text-align: center; margin:0 auto;}
#devices .laptop{width:100%; text-align: center; margin:0 auto;}
#devices .iphone{width:100%; text-align: center; margin:0 auto;}

.product{width:100%; padding:0; margin:0;}
.product img{margin:0;}
.product p{margin-top:0;}
.abstract{width:100%; padding:0; margin:0;}
.abstract .testimonial{margin:0; width: 100%; margin:0 0 2em 0;}
.abstract .testimonial p.quote{margin:0 20%; padding:5%; width:50%;}

.third{width:38%; padding:2em 6%; border-right:none;}
.third:last-child{width:38%; margin:0 25%; padding-top:0; border-bottom: none;}

table{width:100%; margin-bottom: 2em;}

/*REGISTER*/
#registration form{width:70%; margin:0 10%; padding:5%;}
#registration form label{width:100%;}
#registration form p{float:left; width:100%; text-align: left; margin-bottom:10px;}

}


/*=============PHONES==========*/
@media only screen and (max-width: 568px) {


/*HOME PAGE */
body{}
.container{width:90%; margin:0 5%;}

#mast{height:auto; display:box; display:-moz-box; display:-webkit-box; box-orient:vertical; -moz-box-orient:vertical; -webkit-box-orient:vertical;}

#mast #testimonials{width:100%; height:auto; float:none; box-ordinal-group: 2; -moz-box-ordinal-group: 2; -webkit-box-ordinal-group: 2;}
#testimonials .testimonial{margin:10% 5%; width:90%;}
#testimonials .testimonial p.quote{padding:5%; width:90%;}

#mast #cta{width:100%; height:auto; padding-top: 0.2em; float:none; box-ordinal-group: 1; -moz-box-ordinal-group: 1; -webkit-box-ordinal-group: 1;}
#mast #cta h1{font-size: 1.8em; color:#ff6600;}

ul#btmnav{position: static;}
#btmnav li{}
#btmnav li:first-child{padding-left:0; margin-left:0;}
#btmnav li:last-child{}
#btmnav li a{padding:2em 2em;}
#btmnav li a:hover{border:none; color:#ff6600;}

#mast #cta img{float:left; max-width:30%; padding:0.4em 0 0 0;}
nav{float:right; width:70%; padding:0;}
nav ul {margin:0; float:right;}

.how{position: relative; width:90%; padding:0 5%;}
.how h2{width:80%; margin:1em 10%; padding:0; font-size: 1.6em;}

.product{width:100%; padding:0; margin:0;}
.product img{margin:0;}
.product p{margin-top:0;}
.abstract{width:100%; padding:0; margin:0;}
.abstract .testimonial{margin:0; width: 100%; margin:0 0 2em 0;}
.abstract .testimonial p.quote{margin:0; padding:5%; width:90%;}

.third{width:88%; padding:2em 6%; border-right:none; border-bottom: 1px solid #e6e6e6;}
.third:last-child{width:88%; border-bottom: none;}

table{width:100%; margin-bottom: 2em;}


/*REGISTER*/
#registration form{width:80%; margin:0 5%; padding:5%;}
#registration form label{width:100%;}
#registration form p{float:left; width:100%; text-align: left; margin-bottom:10px;}
}