/**
* @version   $Id$
* @author    RocketTheme http://www.rockettheme.com
* @copyright Copyright (C) 2007 - 2015 RocketTheme, LLC
* @license   http://www.rockettheme.com/legal/license.php RocketTheme Proprietary Use License
*/

@import "variables.less";
@import "mainbody-@{mainbody-overlay}.less";
@import "/jui/less/mixins.less";
@import "mixins/index.less";

/* Demo Image */
// General Image
.rt-image {
	position: relative;
	img {
		max-width: 100%;
		height: auto;
		border-radius: 4px;
	}
}

/* Demo Typography */
// General Typography
.promo1 {
	font-family: @anacron-font-regular;
	font-size: @base-font-size * 3;
	line-height: @base-line-height * 3;
	text-transform: uppercase;
}
.promo2 {
	font-size: @base-font-size * 1.5;
	line-height: @base-line-height * 1.5;
	font-family: Georgia, Times, "Times New Roman", serif;
	font-style: italic;
}
.rt-title-center {
	.module-title {
		text-align: center;
	}
}
.rt-big-title {
	.title {
		font-size: @base-font-size * 2.5;
		line-height: @base-line-height * 2;
	}
}
.rt-title-tag {
	display: block;
	font-size: @base-font-size * 1.2;
	line-height: 1.2em;
	opacity: 0.6;
	text-transform: capitalize;
}
.rt-title-divider {
	display: block;
	height: 1px;
	border-top: 1px solid;
	width: 25%;
	margin: 35px auto;
	opacity: 0.5;
}
.rt-large-text {
    font-size: 1.3em;
    line-height: 1.6em;
}
.rt-capitalize {
	text-transform: capitalize;
}
.rt-icon {
	color: @white;
	background: rgba(0, 0, 0, 0.3);
    border-radius: 100%;
    display: inline-block;
    font-size: 3em;
    width: 100px;
    height: 100px;
    line-height: 100px;
    text-align: center;
}
.rt-big-button {
    font-size: 1.2em;
    margin-top: 15px;
    padding: 15px 25px;
}
[class^="rt-arrow-"]:before {
    font-family: FontAwesome;
    font-size: 2em;
    color: @white;
    position: absolute;
    visibility: hidden;
}
.rt-arrow-right:before {
    content: "\f0da";
    right: -8px;
    top: 50%;
    margin-top: -10px;
}
.rt-arrow-left:before {
    content: "\f0d9";
    left: -8px;
    top: 50%;
    margin-top: -10px;
}
.rt-arrow-bottom:before {
    content: "\f0d7";
    bottom: -14px;
    left: 50%;
    margin-left: -9px;
}
.rt-large-button {
    font-size: 2em;
    padding: 2% 3%;
}
.rt-label-1, .rt-label-2 {
	color: @white;
	padding: 5px 15px;
}
.rt-label-1 {
	background: @accent-color1;
}
.rt-label-2 {
	background: @accent-color2;
}

// Demo Module Layout
.rt-mbsb-table {
	.rt-sb-table-col {
		height: 38px;
		vertical-align: middle;
	}
	.rt-mb-table-col {
		height: 75px;
		vertical-align: middle;
	}
}

// Extras
.gantry-example {
	position: relative;
	margin: 15px 0;
	padding: 45px 19px 14px;
	*padding-top: 19px;
	background-color: @white;
	border: 1px solid #dddddd;
	.border-radius(4px);
	.table, .well, blockquote {
		margin-bottom: 5px;
	}
	.lead {
		font-size: 18px;
		line-height: 24px;
	}
	> p:last-child {
		margin-bottom: 0;
	}
	+ .prettyprint {
		margin-top: -20px;
		padding-top: 15px;
	}
	&:after {
		content: "Example";
		position: absolute;
		top: -1px;
		left: -1px;
		padding: 3px 7px;
		font-size: 12px;
		font-weight: bold;
		background-color: #f5f5f5;
		border: 1px solid #dddddd;
		color: #9da0a4;
		.border-radius(4px 0 4px 0);
		font-style: normal;
	}
	.search-query {
		margin-bottom: 0;
	}
}
form.gantry-example {
	padding-bottom: 19px;
}
.form-actions {
	background-color: @body-background2;
	border-top: 1px solid @body-border;
}
.help-block, .help-inline {
	color: @body-text-line;
}


/* Demo Frontpage */
// FP RokSprocket Showcase
.fp-roksprocket-showcase {
	&.rt-block {
		margin: 0;
		padding: 100px 0 80px 0;
	}
	.layout-showcase {
		.sprocket-features-content,
		.sprocket-features-img-container {
			float: none;
			width: 100%;
			text-align: center;
		}
		.sprocket-features-title {
			font-family: @anacron-font-regular;
			font-size: 3.5em;
			line-height: 1.3em;
			text-shadow: 1px 2px 0 rgba(0, 0, 0, 0.2);
		}
		.rt-button-group {
			margin: 40px auto;
			.readon, .readon2, .readon3 {
				display: inline-block;
				font-size: @base-font-size + 2;
				margin: 0 5px;
				padding: 15px 25px;
				width: 150px;
				&:hover {
					.buttonStyleFlat(@white, darken(@showcase-background, 50%), 3px) !important;
					border-bottom: 2px solid darken(@showcase-background, 70%) !important;
				}
			}
		}
		.sprocket-features-pagination {
			margin-left: -31px;
		}
		.sprocket-features-arrows .arrow {
			background: darken(@showcase-background, 12%);
			/* IE8 Crap */background: darken(@showcase-background, 40%) \9;
		    font-size: 4em;
		    width: 80px;
		    height: 80px;
		    line-height: 80px;
		    opacity: 1;
		    box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.15);
		    .transition(all 0.2s ease-in);
		    &:hover {
		    	background: darken(@showcase-background, 50%);
		    }
		}
	}
}
// FP Top
.fp-top {
	&.rt-block {
		width: 80%;
		margin: 15px auto;
	}
	h2.title {
		margin-bottom: 10px;
	}
}
// FP RokSprocket Mosaic
.fp-utility {
	.sprocket-mosaic {
		.sprocket-padding {
			text-align: center;
		}
		.sprocket-mosaic-container {
			margin: 15px -10px;
		}
		.sprocket-readmore {
			display: none;
		}
	}
}
// FP Feature
.fp-feature {
	&.rt-block {
		margin: 25px auto;
	}
}
// FP ExpandedTop
.fp-expandedtop {
	.rt-pricing-table {
		border: 1px solid lighten(@expandedtop-text-color, 45%);
		li {
			border-bottom: 1px dotted lighten(@expandedtop-text-color, 25%);
		}
	}
}
// FP ExpandedBottom
.fp-expandedbottom {
	&.rt-block {
		width: 80%;
		margin: 15px auto;
	}
}
// FP RokSprocket Tabs
.fp-roksprocket-tabs {
	.sprocket-tabs-panels {
		min-height: 300px;
	}
	.sprocket-tabs .sprocket-tabs-nav > li {
		float: none;
		display: inline-block;
		&:before{
			font-family: FontAwesome;
			content: "\f111";
			font-size: 5px;
			margin-right: 5px;
			vertical-align: middle;
		}
		&:first-child {
			&:before{
				display: none;
			}
		}
		&:hover > .sprocket-tabs-inner,
		&.active > .sprocket-tabs-inner,
		&.active:hover > .sprocket-tabs-inner {
			color: @accent-color1;
			background: none;
		}
		.sprocket-tabs-inner {
			border-radius: 0;
			display: inline-block;
			padding: 8px 18px;
		}
	}
	.layout-top .sprocket-tabs-panels {
		margin-top: 0;
	}
}
// FP About Tab
.rt-about-img {
	margin: 10px 15px 0 0;
	img {
		display: block;
		border-radius: 3px 3px 0 0;
	}
}
.rt-about-info {
    background: lighten(@mainbottom-text-color, 50%);
    border-radius: 0 0 3px 3px;
    display: block;
    width: 100%;
    height: 60px;
    line-height: 60px;
}
// FP Team Tab
.fp-team-tab {
	img {
	    border-radius: 100%;
	    display: block;
	    margin: auto;
	    width: 100px;
	}
	.gantry-width-spacer {
		margin: 5px;
	}
}
.fp-team-name {
	display: block;
	margin-top: 15px;
	font-family: @anacron-font-bold;
	line-height: 1;
}
.fp-team-position {
	font-size: 80%;
	line-height: 1;
	opacity: 0.8;
}
// FP RokSprocket Lists
.fp-roksprocket-lists {
	&.rt-block {
		margin-top: 15px;
	}
}
// FP RokSprocket Strips
.fp-roksprocket-strips {
	.sprocket-strips {
		.sprocket-strips-content {
		    font-family: serif;
		    font-style: italic;
		    font-size: 1.6em;
		    line-height: 1.3em;
		}
	}
	.sprocket-strips-text {
		.rt-overlay-dark & {
			text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.1);
		}
		&:before, &:after {
			font-family: FontAwesome;
		}
		&:before {
			content: "\f10d";
			margin-right: 5px;
		}
		&:after {
			content: "\f10e";
			margin-left: 5px;
		}
	}
	h2.title {
		text-shadow: 1px 2px 0 rgba(0, 0, 0, 0.2);
	}
}
// FP Extension
.fp-extension {
	img {
		opacity: 0.5;
		-webkit-backface-visibility: hidden;
		-moz-backface-visibility: hidden;
		-ms-backface-visibility: hidden;
		backface-visibility: hidden;
		.transition(opacity 0.2s ease-in);
		&:hover {
			opacity: 1;
		}
	}
}
// FP Footer Logo
.rt-footer-logo {
	display: block;
	margin: 25px auto 15px auto;
	width: 165px;
	height:60px;
	background-image: url(../images/logo/white/logo.png);
}
// FP Latest news
.fp-latest-news {
	&.rt-block {
		margin-top: 0;
		padding-top: 0;
	}
	ul {
		margin-top: 20px;
		list-style: circle;
	}
}
// FP Newsletter
.fp-newsletter {
	&.rt-block {
		margin-top: 0;
		padding-top: 0;
	}
	.fp-newsletter-form {
		margin-top: 25px;
	}
	.inputbox, .button {
		width: 100%;
		height: 45px;
		margin-bottom: 10px;
		border: none;
		border-radius: 3px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
}
// Demo ToTop
.rt-totop-icon {
	font-size: 2em;
}
// Demo Social Buttons
.rt-social-buttons {
	&.rt-block {
		float: right;
	}
}

/* Demo Pages */
// Pages
.menu-pages {
	#rt-feature .rt-overlay {
		#gradient > .horizontal(fadeout(@white, 50%), fadeout(@white, 50%)) !important;
	}
}
// About Us Page
.rt-readon-row {
	text-align: center;
	.readon {
		font-style: 1.5em;
		margin: 25px 15px 0 15px;
	}
}
.rds-info {
	margin: 0 5px;
	[class*="rt-data"] {
	    display: inline-block;
	    height: 15px;
	    margin-right: 5px;
	    vertical-align: middle;
	    width: 15px;
	}
}
.rt-data-{
	&1 {background: #D95240;}
	&2 {background: #6FC6A0;}
	&3 {background: #D6A842;}
	&4 {background: #6FB4C5;}
	&5 {background: #D49245;}
}

// Team Page
.rt-team-img, .rt-team-img2 {
	img {
		border-radius: 4px;
	}
}

// Pricing Page
.fp-pricing-table {
	display: block;
	width: 80%;
	margin: 25px auto;
	.gantry-width-spacer {
		margin: 5px 15px;
	}
}
.rt-pricing-table {
	list-style: none;
	padding: 10px;
	margin: 0;
	border: 1px solid lighten(@expandedtop-text-color, 45%);
	border-radius: 3px;
	box-shadow: 0 2px 0 rgba(0, 0, 0, 0.1);
	.transition(all 0.1s ease-in);
	li {
		padding: 20px 15px;
		border-bottom: 1px dotted lighten(@expandedtop-text-color, 25%);
		&.rt-table-title, &:last-child {
			border-bottom: 0;
		}
		&.rt-table-cta-button {
			padding: 15px 15px 5px 15px;
		}
	}
	[class*="readon"] {
		width: 100%;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	&:hover {
		transform: scale(1.1);
		-ms-transform: scale(1.1);
		-webkit-transform: scale(1.1);
	}
}
.rt-table-title {
	color: @white;
	background: @accent-color1;
	border-radius: 3px;
	font-size: 1.5em;
}
.rt-table-price {
	font-size: 3em;
	line-height: 1.5em;
}


// Portfolio Page
.rt-demo-portfolio {
	.sprocket-mosaic {
		.sprocket-mosaic-header {
			margin-bottom: 50px;
		}
	}
	.sprocket-mosaic-filter, .sprocket-mosaic-order {
		li {
			text-transform: uppercase;
			font-family: @anacron-font-regular;
		}
	}
	.sprocket-mosaic-item {
		.sprocket-padding {
			padding: 0;
			border: none;
			border-radius: 4px;
		}
		.sprocket-mosaic-image {
			border-radius: 4px;
		}
		.sprocket-mosaic-title {
			color: darken(@body-text, 25%);
			font-size: @base-font-size;
			margin-bottom: 0;
			line-height: 1;
			a {
				color: darken(@body-text, 25%);
				font-size: @base-font-size;
				&:hover {
					color: @accent-color1;
				}
			}
		}
		.sprocket-mosaic-text {
			font-size: 1em;
			font-family: @anacron-font-light;
			margin-top: 5px;
			margin-bottom: 5px;
			opacity: 0.5;
		}
		.sprocket-mosaic-tags li {
			.textColor(darken(@body-background, 15%));
			background: darken(@body-background, 15%);
			text-transform: lowercase;
			font-style: italic;
		}
		.sprocket-readmore {
			display: none;
		}
	}
}
.rt-demo-clients {
	.sprocket-strips-content {
		height: 180px;
	}
}

// Blog Page
.rt-blog-form {
	.inputbox, .readon {
		display: inline-block;
		height: 45px;
		padding: 0 15px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	.inputbox {
		font-family: @anacron-font-regular;
		width: 60%;
		color: @grey;
		border: 1px solid transparent;
		background: @white;
		box-shadow: none;
	}
	.readon {
		width: 35%;
	}
}
.rt-blog-search {
	&.icon-search:before {
		display: none;
	}
	.inputbox {
		display: inline-block;
		height: 45px;
		padding: 0 15px;
		font-family: @anacron-font-regular;
		width: 100%;
		color: @grey;
		border: 1px solid transparent;
		background: @white;
		box-shadow: none;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
}

// FAQ Page
.menu-faq {
	#rt-showcase {
		opacity: 0.75;
	}
}

// Contact Page
.menu-contact {
	#rt-mainbody-surround {
		background: darken(@body-background, 5%);
	}
	.contact h3 {
		display: none;
	}
}
.rt-contact-icon-title {
    color: @dark-grey;
    display: block;
    font-size: 5em;
    margin: 50px 0;
    opacity: 0.5;
}
.menu-contact .contact-form {
	margin-top: -15px;
	legend {
		font-size: 1.5em;
		border-bottom: none;
		margin-bottom: 0;
	}
	dt {
		width: 250px;
	}
	dd {
		float: none !important;
		margin: 0;
	}
	label {
		font-size: 1.2em;
		margin: 10px 0;
	}
	input[type="text"], input[type="email"], textarea {
	    width: 100%;
	    height: auto;
		color: @body-text;
		border: 1px solid darken(@body-background, 10%);
		background: @body-background;
		padding: 12px 15px;
		margin-bottom: 10px;
		box-shadow: none;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	input[type="checkbox"] {
		margin: 13px 0;
	}
	button {
	    font-size: 1.2em;
	    padding: 15px 25px;
	}
}
.rt-contact-info {
    margin-top: 35px;
    hr {
    	border-color: lighten(@grey, 25%);
    	border-top: none;
    }
}
.rt-contact-icon {
	clear: both;
    float: left;
    span {
    	color: lighten(@grey, 25%);
	    display: block;
	    font-size: 3em;
	    width: 80px;
	    height: 60px;
	    line-height: 40px;
	    text-align: center;
    }
}

// Pages Footer
.rt-email-form {
	.inputbox, .readon {
		display: inline-block;
		height: 45px;
		padding: 0 15px;
		margin-bottom: 5px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	textarea {
		padding: 15px;
		margin-bottom: 5px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	.inputbox, textarea {
		font-family: @anacron-font-regular;
		width: 100%;
		color: @light-grey;
		border: 1px solid transparent;
		#gradient > .horizontal(fadeout(@grey, 70%), fadeout(@grey, 70%));
	}
	.button {
		width: 100%;
	}
}

// Offline Page
.menu-offline-page {
	#rt-mainbody-surround {
		display: none;
	}
}


/* Demo MediaQueries */
// Large Mode
@media only screen and (min-width: 1200px) {
	body.layout-mode-responsive {
		/* Demo Frontpage */


	}
}

// Desktop Modes
@media only screen and (min-width: 960px) and (max-width: 1199px) {
	body.layout-mode-responsive {
		/* General Typography */
		.rt-big-title {
			.title {
				font-size: @base-font-size * 2.3;
			}
		}

		/* Demo Frontpage */
		/* FP RokSprocket Showcase */
		.fp-roksprocket-showcase .layout-showcase .sprocket-features-title {
			font-size: 3.2em;
		}

		/* Demo Pages */
		/* Pricing Page */
		.fp-pricing-table {
			width: 100%;
		}
	}
}

// Tablet Modes
@media only screen and (min-width: 768px) and (max-width: 959px) {
	body.layout-mode-responsive {
		/* Demo Typography */
		// General Typography
		.promo1 {
			font-size: @base-font-size * 3;
			line-height: @base-line-height * 3;
		}
		.promo2 {
			font-size: @base-font-size * 1.5;
			line-height: @base-line-height * 1.5;
			font-family: Georgia, Times, "Times New Roman", serif;
			font-style: italic;
		}
		.rt-big-title {
			.title {
				font-size: @base-font-size * 2;
			}
		}

		/* Demo Frontpage */
		/* FP RokSprocket Showcase */
		.fp-roksprocket-showcase .layout-showcase .sprocket-features-title {
			font-size: 2.8em;
		}


		/* Demo Pages */
		/* Pricing Page */
		.fp-pricing-table {
			width: 100%;
		}
		.rt-table-title {
			font-size: 0.9em;
		}
		.rt-table-price {
			font-size: 1.5em;
		}
		.rt-table-item {
			font-size: 0.9em;
		}
		// Portfolio Page
		.rt-demo-portfolio {
			.sprocket-mosaic-filter, .sprocket-mosaic-order {
				li {
					padding: 8px 18px;
				}
			}
		}
		.rt-demo-clients {
			.sprocket-strips-content {
				height: 245px;
			}
			.cols-4 > li {
				width: 48% !important;
			}
		}
	}
}

// Mobile Modes
@media (max-width: 767px) {
	body.layout-mode-responsive {
		/* Demo Typography */
		// General Typography
		.promo1 {
			font-size: @base-font-size * 2.8;
			line-height: @base-line-height * 2.8;
		}
		.promo2 {
			font-size: @base-font-size * 1.3;
			line-height: @base-line-height * 1.3;
			font-family: Georgia, Times, "Times New Roman", serif;
			font-style: italic;
		}
		.rt-title-tag {
			font-size: @base-font-size * 1.1;
			line-height: @base-line-height * 1.1;
		}
		.rt-big-title {
			.title {
				font-size: @base-font-size * 1.6;
			}
		}

		/* Demo Frontpage */
		/* FP RokSprocket Showcase */
		.fp-roksprocket-showcase .layout-showcase {
			.sprocket-features-title {
				font-size: 2em;
			}
			.rt-button-group .readon, .rt-button-group .readon2, .rt-button-group .readon3 {
				font-size: 15px;
				padding: 15px 20px;
				margin-bottom: 15px;
				width: 150px;
				display: block;
				margin: 0 auto 15px auto;
			}
			.sprocket-features-arrows .arrow {
				width: 50px;
				height: 50px;
				line-height: 50px;
				font-size: 2em;
			}
		}

		/* Demo Pages */
		// Pricing Page
		.fp-pricing-table {
			width: 100%;
		}
		.rt-pricing-table {
			margin-bottom: 35px;
		}
		.rt-table-col {
			border-right: 0;
		}
		.rt-first-col .rt-table-header {
			border-radius: 4px 4px 0 0;
		}
		.rt-last-col .rt-table-header {
			border-radius: 0;
		}
		.rt-table-highlight .rt-table-header {
			margin-top: -25px;
			padding: 25px;
			border-radius: 0;
		}


		// FP MainBottom
		.rt-about-img {
			margin-bottom: 25px;
		}

		// Portfolio Page
		.rt-demo-portfolio {
			.sprocket-mosaic-filter, .sprocket-mosaic-order {
				li {
					display: inline-block;
					text-align: center;
					width: 12.5%;
				}
			}
		}
		.rt-demo-clients {
			.sprocket-strips-content {
				height: 245px;
			}
			.sprocket-strips-container {
				padding: 35px;
			}
		}
	}
}

// Small Screen Mobile Modes
@media only screen and (max-width: 480px) {
	body.layout-mode-responsive {
		/* Demo Typography */
		// General Typography
		.promo1 {
			font-size: @base-font-size * 2.5;
			line-height: @base-line-height * 2.5;
		}
		.promo2 {
			font-size: @base-font-size * 1.2;
			line-height: @base-line-height * 1.2;
			font-family: Georgia, Times, "Times New Roman", serif;
			font-style: italic;
		}


		/* Demo Frontpage */
		// FP RokSprocket Showcase
		.fp-roksprocket-showcase {
			&.rt-block {
				padding-top: 25px;
			}
			.layout-showcase {
				margin: 0 15px;
				.sprocket-features-title {
				    font-size: 1.5em;
				    line-height: 1.5em;
				    margin: auto;
				    width: 90%;
				}
				.rt-button-group {
					margin: 20px auto;
					.readon, .readon2, .readon3 {
					    font-size: 13px;
					    margin-bottom: 15px;
					    padding: 15px;
					    width: 120px;
					}
				}
				.sprocket-features-arrows .arrow {
					top: 100%;
					margin-top: 3px;
					&.prev {
						left: 0;
					}
					&.next {
						right: 0;
					}
				}
			}
		}


		/* Demo Pages */
		// Portfolio Page
		.rt-demo-portfolio {
			.sprocket-mosaic-filter, .sprocket-mosaic-order {
				li {
					font-size: @base-font-size * 0.6;
					width: 18%;
				}
			}
		}
		.rt-demo-clients {
			.sprocket-strips-content {
				height: 150px;
			}
			.sprocket-strips-container {
				padding: 35px;
			}
			.sprocket-strips-arrows .arrow {
				width: 20px;
				height: 20px;
				line-height: 20px;
				margin-top: -50px;
				&.prev {
					left: 0;
				}
				&.next {
					right: 0;
				}
			}
		}
	}
}