@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700');
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700');

body {
	font-family: 'Roboto', sans-serif;
	margin: 0;
	font-size: 14px;
}

img {
	max-width: 100%;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 500;
	margin: 0;
}

.ui-loader {
	display: none;
}


.container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 15px;
	position: relative;
	z-index: 9;
}

.company-name {
	display: flex;
}

.container.login {
	max-width: 450px;
	margin: 0 auto;
	padding: 0 15px;	
}

.header-container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 15px;	
	min-height: 90px;	
}

.ui-link span {
	color: #007aff;
	font-weight: 700;
}

.account-name {
	margin-right: 40px;
}

.company-name {
	margin-left: 40px;
	display: flex;
}

.company-name span {
	margin: auto;
}

.site-header {
	background-color: #020099;	
}

.flex-row.header-flex {
	display: flex;
	min-height: 90px;
}

.flex-row.header-flex > .flex-col {
	flex: 1;
	margin: auto 0;
}

.flex-row.header-flex > .flex-col.right {
	text-align: right;
}

.flex-row.header-flex > .flex-col.right a {
	color: #fff;
	text-decoration: none;
	font-size: 16px;
	font-weight: 300;
}

.site-main {
	padding-top: 0;
	padding-bottom: 0;
	min-height: 69vh;
}

.site-footer {
	text-align: left;
	color: #09079c;
	font-weight: 500;
}

.login.site-footer {
	text-align: center;
}

.tab-content {
	display: none;
}

.tab-content.active {
	display: block;
}

.flex-row.main-flex {
	display: flex;
}

.flex-row.main-flex > .flex-col {
	flex: 1;
	padding: 68px 0 0;
	min-height: calc(100vh - 158px);
}

.flex-row.main-flex > .flex-col.active {
	flex: 1.2;
}

.login-logo-wrapper {
	width: 100%;
	max-width: 450px;
	text-align: center;
}

.login-desc {
	margin-bottom: 40px;
	font-size: 16px;
}

.flex-row.main-flex > .flex-col.left .tab-title {
	margin: 32px 0 30px;
	font-size: 26px;
	color: #020099;
}

.flex-row.main-flex > .flex-col.left .tab-title {

}

.login .flex-row.main-flex > .flex-col.left .tab-title {
	margin: 47px 0 0;
	font-weight: 400;
    font-size: 30px;	
}

.flex-row.main-flex > .flex-col.left ul {
	display: flex;
	list-style: none;
	padding: 0;
	margin: 0;
}

.flex-row.main-flex > .flex-col.left ul li {
	font-size: 16px;
	color: #5b59bd;
	display: flex;
	margin-right: 65px;
	cursor: pointer;
}

.flex-row.main-flex > .flex-col.left ul li:last-of-type {
	margin-right: 0;
}

.flex-row.main-flex > .flex-col.left ul li i {
	margin: auto 0;
}

.flex-row.main-flex > .flex-col.left ul li.active {
	padding: 10px 17px;
	border-radius: 5px;
	background-color: #020099;
	color: #ffa805;
}

.flex-row.main-flex > .flex-col.right {
	background-color: #fff2da;
}

.flex-row.main-flex > .flex-col.right h3 {
	color: #4a4a4a;
	font-size: 20px;
}

.flex-row.main-flex > .flex-col.right .current-google-review span {
	display: block;
}

.flex-row.main-flex > .flex-col.right .current-google-review span.review-value {
    font-size: 140px;
    line-height: 110px;
    font-family: 'Roboto Condensed', sans-serif;
    color: #020099;
    letter-spacing: -5px;
    text-align: center;
    margin: 28px 0 0;
    padding-bottom: 15px;
}

.copy-right {
	color: #b5b5b5;
	padding-bottom: 30px;
}

.flex-row.main-flex > .flex-col.right .current-google-review div.review-rate {
	display: flex;
	width: 100%;
	max-width: 115px;
	height: 34px;
	color: #3dce41;
	background-color: #f0f0f1;
	background-image:  url('../img/arrow-slant.jpg');
	background-repeat: no-repeat;
	background-position: right 15px center;
	border-radius: 5px;
	margin: 0 auto;
}

.logo img {
	max-width: 115px;
}

.flex-row.main-flex > .flex-col.right .flex-row-stats-list {
	display: flex;
}

.flex-row.header-flex > .flex-col.left {
	display: flex;
}

.flex-row.header-flex > .flex-col.left a, .flex-row.header-flex.left > .flex-col img {
	margin: auto 0;
	color: #babae3;
	text-decoration: none;
}

.flex-row.header-flex > .flex-col.left a {
	margin-left: 50px;
}

.flex-row.header-flex > .flex-col.left a.logo {
	margin-left: 0;
}

.flex-row.header-flex > .flex-col.left a.active {
	color: #fff;
}

.flex-row.main-flex > .flex-col.right .flex-row-stats-list label {
	display: block;
	color: #505050;
	font-size: 15px;
	font-weight: 500;
}

.tab-content.settings .flex-row {
	display: flex;
	flex-direction: column;
}

.tab-content.settings .flex-row .flex-col.left {
	padding-top: 40px;
}

.flex-row.main-flex > .flex-col.right .flex-row-stats-list.top {
	margin-top: 43px;	
}

.flex-row.main-flex > .flex-col.right .flex-row-stats-list.top .stats-list:first-of-type {
	margin-right: 56px;
	flex: 1.2;
}

.flex-row.main-flex > .flex-col.right .flex-row-stats-list.bottom .stats-list:first-of-type {
	margin-right: 80px;
	flex: 1.2;
}

.flex-row.main-flex > .flex-col.right .flex-row-stats-list.top .stats-list {
	flex: 1;
}

.flex-row.main-flex > .flex-col.right .flex-row-stats-list.bottom .stats-list {
	flex: 1;
}

.flex-row.main-flex > .flex-col.right .flex-row.main-right .flex-col.right {
	padding: 0 80px;
}

.flex-row.main-flex > .flex-col.right .flex-row-stats-list span {
	display: inline-block;
    color: #2c2aaa;
    font-size: 38px;
}

.flex-row.main-flex > .flex-col.right .flex-row-stats-list.top .stats-list:last-of-type span:last-of-type {
	font-size: 16px;
	color: #afaca7;
}

.flex-row.main-flex > .flex-col.right .flex-row-stats-list.bottom .stats-list:first-of-type span:last-of-type {
	font-size: 16px;
	color: #afaca7;
}

.flex-row.main-flex > .flex-col.right .current-google-review div.review-rate span {
    margin: auto 15px;
    font-size: 18px;
}

.flex-row.main-flex > .flex-col.right .flex-row-stats-list.top .stats-list {
	margin-bottom: 30px;
}

.flex-row.main-flex > .flex-col.right .flex-row-stats-list.top .stats-list {
	margin: auto;
}

.flex-row.main-flex > .flex-col.left .flex-row-stats-list.top .stats-list {
	margin: auto;
}

.flex-row.main-flex > .flex-col.right .flex-row.main-right .flex-col.left {
	margin-right: 0 !important;
}

.flex-row.main-flex > .flex-col.right .flex-row-stats-list.bottom .stats-list {
	margin: 50px auto 30px;
}

.col-custom-container {
	min-height: calc(100vh - 264px);
	margin-bottom: 40px;
}

.visible-all img {
	max-width: 150px;
}

.visible-all {
	text-align: center;
}

.flex-row.main-flex > .flex-col.left form label {
	display: inline-block;
	color: #9b9b9b;
	margin-bottom: 10px;
	position: relative;
}

.flex-row.main-flex > .flex-col.left form label span {
	display: none;
	background-color: #eee;
	font-size: 12px;
	padding: 15px;
	border-radius: 5px;
	width: 156px;
	line-height: 17px;
	position: absolute;
	top: -95px;
}

.flex-row.main-flex > .flex-col.left form label:hover span {
	display: block;
}

.flex-row.main-flex > .flex-col.left form label span p {
	margin: 0;
	position: relative;
}
.flex-row.main-flex > .flex-col.left form label span p:after {
    content: '';
    border: 6px solid transparent;
    border-top: 6px solid #eee;
    margin-left: 2px;
    display: inline-block;
    margin-left: 0;
    left: 33px;
    bottom: -27px;
    position: absolute;
    vertical-align: bottom;
}
.flex-row.main-flex > .flex-col.right .flex-row.main-right {
	display: flex;
	flex-direction: column;
}

.flex-row.main-flex > .flex-col.right .flex-row.main-right .flex-col.left {
	margin-right: 80px;
}

.flex-row.main-flex > .flex-col.right .flex-row.main-right .flex-col.right {
	flex: 1;
}

.flex-row.main-flex > .flex-col.left form .form-input {
	padding-bottom: 15px;
	border-bottom: 2px solid #9b9b9b;
	cursor: pointer;
	max-width: 393px;
	position: relative;
}

.login .flex-row.main-flex > .flex-col.left form .form-input {
	max-width: 450px;
}

.flex-row.main-flex > .flex-col.left form .form-input.custom-1 {
	margin-bottom: 8px !important;	
	position: relative;
}

.save-settings button {
	position: absolute;
    right: 0;
    top: 22px;
    background-color: #3dce41;
    border: 0;
    color: #fff;
    font-size: 13px;
    padding: 6px 11px 5px;
    cursor: pointer;
}

.limit-remaining {
	margin-bottom: 10px;
	color: #9c9c9c;
}

.limit-remaining.customer-name {
	position: absolute;
    bottom: -35px;	
}

.dealer-desc p {
	margin: 0;
	color: #9c9c9c;
	max-width: 300px;
}

.dealer-desc {
	margin-bottom: 30px;
}

.flex-row.main-flex > .flex-col.left form .form-input.active {
	border-bottom: 2px solid #020099;
}

.flex-row.main-flex > .flex-col.left form .form-input:first-of-type {
	margin-bottom: 45px;
}

.flex-row.main-flex > .flex-col.left form input {
	display: block;
	border: 0;
	outline: none;
	width: 100%;
}

.capitalize-text {
	text-transform: capitalize;
}

.settings-text {
	min-width: 190px;
	max-width: 190px;
}

.settings-text .text-1 {
	overflow: hidden;
	white-space: nowrap;
	width: 0;
	transition: width 1s ease;
}

.settings-text .text-1.active {
	width: 190px;
}

.settings-dealer-name {
	color: #020202;
	font-weight: 500;
	position: absolute;
	left: 0;
	padding-left: 11px;
	top: 133px;
	width: 100%;
	text-align: center;
	opacity: 0;
	transition: opacity 0.5s ease;
}

.settings-dealer-name.active {
	opacity: 1;
}

.settings-text .text-2 {
	overflow: hidden;
	white-space: nowrap;
	width: 0;
	transition: all 1s ease 0.5s;
}

.settings-text .text-2.active {
	width: 190px;
}

.settings-text .text-3 {
	overflow: hidden;
	white-space: nowrap;
	width: 0;
	transition: width 1s ease 1s;
}

.settings-text .text-3.active {
	width: 190px;
}

.settings-text .text-4 {
	overflow: hidden;
	white-space: nowrap;
	width: 0;
	transition: width 1s ease 1.5s;
}

.settings-text .text-4.active {
	width: 190px;
}

.settings-text .text-5 {
	overflow: hidden;
	white-space: nowrap;
	width: 0;
	transition: width 1s ease 2s;
}

.settings-text .text-5.active {
	width: 190px;
}

.flex-row.main-flex > .flex-col.left ul li.active i:before {
	color: #ffa805;
}


.flex-row.main-flex > .flex-col.left ul li span {
	font-weight: 500;
	margin: auto 0;
}

.site-main {
	position: relative;
}

.right-overlay {
	width: 40%;
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	background-color: #fff2da;
}

.flex-row.main-flex > .flex-col.right h2 {
	margin: 0 0 40px;
	font-size: 26px;
	color: #020099;
	padding: 0 80px;
}

.flag-item {
    display: inline-block;
    padding-top: 0px;
    background-image: url(../img/all-flags-sprite.png);
    background-repeat: no-repeat;
    height: 12px;
    width: 20px;
    margin-right: 10px;
}

.flag-item-wrapper {
	cursor: pointer;
}

.uk-flag.flag-item {
	background-position: -100px -252px;	
}

.ireland-flag.flag-item {
	background-position: -80px -108px;
}

.flag-item-wrapper:hover {
	color: #5b59bd;
}

#mobile_number {
	padding-left: 40px;
}

.active-flag {
	display: inline-block;
    position: absolute;
    padding-right: 15px;
    top: 29px;
    background-image: url(../img/arrow-down.png);
    background-position: right 9px center;
    background-repeat: no-repeat;
    line-height: 11px;
}

.flag-main-wrapper {
	position: relative;
}

.dropdown-flag {
    display: none;
    padding: 15px 15px 11px;
    position: absolute;
    background-color: #fff;
    line-height: 22px;
    left: -16px;
    bottom: -57px;
    border: 1px solid #eee;
}

.dropdown-flag.active {
	display: inline-block;
}

.submit-button {
    display: block;
    width: 100%;
    max-width: 230px;
    color: #fff;
    font-size: 18px;
    background-color: #3dce41;
    font-family: 'Roboto', sans-serif;
    margin-top: 25px;
    border-radius: 5px;
    border: 0;
    cursor: pointer;
    padding: 20px 0;
    text-align: center;
}

.login .submit-button {
	max-width: 450px;
	height: 54px;
	margin-top: 34px;
}

.visible-desktop {
	display: block;
}

.visible-mobile {
	display: none;
}

.settings-img {
	border-bottom: 2px solid #202227;
    display: inline-block;
    line-height: 0;
    padding: 0 31px 0 28px;
    position: relative;
}

.settings-img img {
	max-width: 312px;
}

.settings-text {
    line-height: 19px;
    position: absolute;
    top: 175px;
    background-color: #efeff4;
    padding: 16px 13px;
    color: #636364;
    font-weight: 500;
    left: 50%;
    margin-left: -108px;
    border-radius: 10px;
}

.settings-text a {
	color: #429bfb;
}

.google-rating {
    display: block;
    width: 150px;
    height: 75px;
    background-image: url(../img/google-rating-sprite.png);
    background-repeat: no-repeat;
    background-size: 979.5px;
    margin: auto;
    background-position: 0 3px;
}

.google-rating.zero-half-star {
	background-position: -166px -76px;	
}

.google-rating.one-star {
	background-position: -166px 3px;	
}


.google-rating.one-half-star {
	background-position: -332px -76px;	
}

.google-rating.two-star {
	background-position: -332px 3px;	
}

.google-rating.two-half-star {
	background-position: -499px -76px;	
}

.google-rating.three-star {
	background-position: -499px 3px;	
}

.google-rating.three-half-star {
	background-position: -664px -76px;	
}

.google-rating.four-star {
	background-position: -664px 3px;	
}

.google-rating.four-half-star {
	background-position: -829px 3px;	
}

.google-rating.five-star {
	background-position: 0 -76px;	
}


@media only screen and (max-width: 768px) {
	.login-logo-wrapper img {
		max-width: 220px;
	}
	.flex-row.main-flex > .flex-col.left .tab-title {
	    margin: 8vh 0 8vh;
	}
	.flex-row.main-flex > .flex-col.left .tab-content.settings .tab-title {
		margin: 2vh 0 2vh;
	}
	.sms-preview {
		color: #020099;
		font-weight: 700;
		font-size: 16px;
	}
	.login-logo-wrapper {
		text-align: left;
	}
	.container.login {
		padding: 0 40px;
	}

	.visible-desktop {
		display: none;
	}

	.visible-mobile {
		display: block;
	}

	.site-main {
		min-height: 415px;
	}
	.login-desc {
		margin-bottom: 70px;
	}
	.site-main.home {
		padding-top: 0;
		padding-bottom: 0;
	}
	.home .container {
		padding: 0;
	}
	.flex-row.main-flex > .flex-col.left ul li.active {
		border-radius: 0;
	}

	.tab-content{
		padding: 0 40px;
	}
	.flex-row.main-flex > .flex-col.left ul li {
		margin: 0;
		flex: 1;
	}
	.tab-content.settings .flex-row {
		flex-direction: column;
	}
	.flex-row.main-flex > .flex-col.left ul li i {
		margin: auto 0;
		flex: 1;
		text-align: right;
		color: #020099;
	}

	.flex-row.main-flex > .flex-col.left ul li span {
		font-weight: 500;
	    margin: auto 0;
	    flex: 1;
	    text-align: left;
	    padding-right: 5px;
	}

	.flex-row.main-flex > .flex-col.left ul li.active {
		padding: 13px 0;
		background-color: #fff;
		color: #020099;
	}
	.flex-row.main-flex > .flex-col.left ul li.active i:before {
		color: #020099;
	}
	.flex-row.main-flex > .flex-col.left ul {
		background-color: #ffa805;
	}
	.tab-content.settings .flex-row .flex-col.left {
		padding-top: 0;
	}
	.header-container {
		padding: 0 25px;
	}
	.flex-row.main-flex > .flex-col.right .flex-row.main-right {
		flex-direction: column;
		padding: 0 30px;
	}

	.flex-row.main-flex > .flex-col.right .flex-row.main-right .flex-col.left {
		margin-right: 0;
	}

	.login .login-logo-wrapper {
		padding-top: 20px;
	}

	.site-footer {
		text-align: center;
		margin-top: 30px;
	}

	.flex-row.main-flex > .flex-col.right .flex-row-stats-list.top .stats-list:first-of-type {
		flex: 1.1;
	}

	.flex-row.main-flex > .flex-col.right .flex-row-stats-list.bottom .stats-list:first-of-type {
		flex: 2;
	}

	.flex-row.main-flex > .flex-col.right .flex-row-stats-list.top .stats-list {
		margin: 0 auto !important;
	}

	.flex-row.main-flex > .flex-col.right .flex-row-stats-list.bottom .stats-list {
		margin: 6vh auto 0 !important;
	}

	.flex-row.main-flex > .flex-col.right h2 {
		margin: 4vh 0 4vh;
    	text-align: left;
    	padding: 0 40px;
	}

	.flex-row.main-flex > .flex-col.right h3 {
		text-align: center;
		margin-top: 16px;
	}

	.flex-row.main-flex > .flex-col.right .current-google-review span.review-value {
		margin: 0 0 8px;
	}

	.main-footer {
		display: none;
	}

	.flex-row.main-flex > .flex-col.right .flex-row-stats-list.top {
		margin-top: 7vh;
	}

	.dealer-desc {
		margin-bottom: 7px;
	}
	.flex-row.main-flex > .flex-col {
		padding: 0;
	}

	.right-overlay {
		display: none;
	}

	.copy-right {
		display: none;
	}

	.flex-row.main-flex > .flex-col.right .current-google-review span.review-value {
		font-size: 120px;
	}

	.flex-row.main-flex > .flex-col {
		min-height: calc(100vh - 65px);
	}
	.flex-row.main-flex > .flex-col.right .flex-row.main-right .flex-col.right {
		padding: 0;
	}
	.flex-row.main-flex > .flex-col.right .flex-row-stats-list span {
		font-size: 32px;
	}

	.flex-row.main-flex > .flex-col.left ul li {
		color: #020099;
	}
	.logo img {
		max-width: 80px;
	}
	.flex-row.header-flex > .flex-col.right a {
		font-size: 14px;
	}
	.flex-row.header-flex {
		min-height: 65px;
	}
	.header-container {
		min-height: 65px;
	}
	.flex-row.main-flex > .flex-col.left {
		transition: all 0.5s ease;
		position: relative;
		left: 0;
	}
	.flex-row.main-flex > .flex-col.left.slide-active {
		left: -100%;
	}
	.flex-row.main-flex > .flex-col.right {
		position: absolute;
		right: -100%;
		transition: all 0.5s ease;
	}
	.flex-row.main-flex > .flex-col.right.slide-active {
		right: 0;
	}
	.flex-row.main-flex {
		overflow: hidden;
	}
	.container {
		overflow-x: hidden;
	}
	.flex-row.main-flex > .flex-col.active {
		flex: 1;
	}
	.flex-row.main-flex > .flex-col.right {
		width: 100%;
	}
	.col-custom-container {
		margin-bottom: 0;
	}

	.settings-img {
		overflow: hidden;
		padding: 0;
		max-height: 305px;
	}

	.settings-img img {
	    max-width: 295px;
	}

	.settings-dealer-name {
		top: 126px;
	}
	.company-name {
		margin-left: 15px;
	}
	.account-name {
		margin-right: 0;
	    margin-bottom: 6px;
	    display: block;
	}
}

@media only screen and (max-width: 360px) {
	.settings-text {
		top: 151px;
		font-size: 13px;
	}
	.settings-dealer-name {
	    top: 126px;
	    font-size: 13px;
	}
}

@media only screen and (max-width: 320px) {
	.dealer-desc {
		margin-bottom: 0;
	}

	#mobile_number {
		font-size: 13px;
		margin-top: 13px;
	}

	.flex-row.main-flex > .flex-col.left .tab-title {
		margin: 6vh 0 6vh;
	}
	.flex-row.main-flex > .flex-col.left .tab-content.settings .tab-title {
		margin: 2vh 0 1vh;
	}
	.flex-row.main-flex > .flex-col.right h2 {
		margin: 4vh 0 2vh;
	}

	.settings-img img {
		max-width: 240px;
	}

	.sms-preview {
		margin: 7px 0 5px;
	}

	.flex-row.main-flex > .flex-col.left form label {
		margin-bottom: 0;
	}

	.settings-img {
		max-height: 242px;
	}

	.settings-text {
	    line-height: 19px;
	    position: absolute;
	    top: 120px;
	    padding: 10px 10px;
	    font-size: 12px;
	    color: #636364;
	    font-weight: 500;
	    left: 50%;
	    margin-left: -91px;
	    border-radius: 10px;
	    max-width: 165px;
	    min-width: 165px;
	}

	.settings-dealer-name {
		color: #020202;
		font-weight: 500;
		position: absolute;
		left: 0;
		z-index: 9;
		padding-left: 11px;
		top: 102px;
		font-size: 12px;
		width: 100%;
		text-align: center;
		opacity: 0;
		transition: opacity 0.5s ease;
	}

	.settings-text .text-1.active, .settings-text .text-2.active, .settings-text .text-3.active, .settings-text .text-4.active, .settings-text .text-5.active {
		max-width: 165px;
	}
}



.sweet-alert .sa-icon.sa-error {
	border-color: #020099;
}

.sweet-alert .sa-icon.sa-error .sa-line {
	position: absolute;
	height: 5px;
	width: 47px;
	background-color: #FFA805;
	display: block;
	top: 37px;
	border-radius: 2px;
}

.settings-text:focus {
    outline: 0;
}

.settings-text span{
	font-weight: bold;
	text-decoration: underline;
	color: #429bfb;
}
