
/*!
 * Double Click CSS Theme
 *
 * Copyright Double Click Design 2018 All Rights Reserved.
 *
 * Author: Mark Barton
 *
 * Jan 05 2018
 */

/* ------------ */
/* Global Setup */
/* ------------ */
body {
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 300;
    color: #888;
    line-height: 30px;
    text-align: center;
    background: url('/website_assets/gui/fso-background.jpg') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

    padding-top: 75px;
}

.topPad { margin-top: 20px; }
.bottomPad {  margin-bottom: 20px; }
.bothPad { margin-top: 10px; margin-bottom: 10px; }

.floatleft { position: relative; float:left; }
.floatRight { position: relative; float:right; }

/* Global Sprite image use for icons */
.icon { background:url('/website_assets/gui/sprite-icons.png') no-repeat top left; }

/* ------------ */
/* Nav Styling  */
/* ------------ */

.navbar-toggle { margin-top: 20px;}
.navbar-default .navbar-toggle { border-color:#002873; }
.navbar-default .navbar-toggle .icon-bar { background-color:#002873; }
.navbar-default .navbar-collapse, .navbar-default .navbar-form { border-color:transparent; }
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover { background-color:#ffffff; }

.navbar { min-height: 74px; }
/*
@media (min-width: 768px){
    .navbar-nav{
        float:none;
        margin: 0 auto;
        display: table;
        table-layout: fixed;
    }
}
*/
.navbar-default { background-color: #ffffff; border-color: #ffffff; }

.navbar-default .navbar-nav>li>a { color:#002873; border-bottom: 3px solid #ffffff; font-weight: 400; }
.navbar-default .navbar-nav>li>a:hover { color:#df171f; border-bottom: 3px solid #df171f; }
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover { color:#df171f; border-bottom: 3px solid #df171f; background-color:transparent; }
.navbar-right { margin-top:8px; }
.navbar-right > li { display:block; }
.navbar-right > li > a { display:inline-block; }
.navbar-btn { width:84px; color:#002873; font-weight: 400; border-color:#002873; }
.navbar-btn:hover { width:84px; color:#df171f; font-weight: 400; border-color:#df171f; background-color: #fff !important; }

.navbar-btn-success {  width:84px; color:#449d44; font-weight: 400; border-color:#449d44; }
.navbar-btn-success:hover { width:84px; color:#df171f; font-weight: 400; border-color:#df171f; background-color: #fff !important; }


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

footer { position:relative; margin:20px auto 0px auto; width:100%; background:#f3efec; color:#646464; font-size:14px; line-height:25px; font-weight:normal; font-weight:300; }
footer ul { margin:20px 0px; }
footer .companyNo ul { position:relative; margin:0px 0px 15px 0px; font-size:10px; line-height:14px; text-align:center; }
footer a { color:#646464; text-decoration:underline; font-weight:300; }
footer h6 { position:relative; display:block; font-size:18px; line-height:26px; font-weight:400; }

/* Social Media links */
.follow { position:relative; height:25px; width:95px; background-position:-175px 0px; display:block; }
.vs-facebook, .vs-twitter, .vs-pinterest, .vs-youtube { position:relaive; width:25px; height:25px; display:block; }
.vs-facebook { background-position:-67px 0px; }
.vs-twitter { background-position:-94px 0px;}
.vs-pinterest { background-position:-121px 0px; }
.vs-youtube { background-position:-148px 0px; }

/* hover over state */
.vs-facebook span, .vs-twitter span, .vs-pinterest span, .vs-youtube span {
  position:relative;
  margin:0; padding:0;
  width:25px; height:25px;
  background:transparent;
  display:block;
  /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  /* IE 5-7 */
  filter: alpha(opacity=50);
  /* Netscape */
  -moz-opacity: 0.5;
  /* Safari 1.x */
  -khtml-opacity: 0.5;
  /* Good browsers */
  opacity: 0.5;
}
a.vs-facebook:hover span { background:#3b5999; }
a.vs-twitter:hover span  { background:#3f98fe;}
a.vs-pinterest:hover span  { background:#c82329; }
a.vs-youtube:hover span  { background:#cf2f00; }

/* Grey bottom stripe */
.footerStripe { position:relative; margin:0px;  background:#646464; color:#fff; }
.footerStripe ul { margin:10px 0px; font-size:12px;  }
.footerStripe ul li { border-right:1px solid #fff; padding:0px 8px; }
.footerStripe ul li:first-child, .footerStripe ul li:last-child  { border:none; }

.footerStripe a { color:#fff; text-decoration:none; }


/* Credit Cards Grphic */
.creditCards { position:absolute; bottom:-31px; left:0; }


/* ExtraPadding for mobile phone */
footer .list-unstyled, footer h6 { margin-left:5px; }
.footerStripe .list-inline { margin-left:0px; }

/* DCD Footer Logo */
.dcdFooter { position:relative; margin:20px 0px 8px 0px; display:inline-block; }
.dcdFooter svg { position: absolute; bottom: 8px; left: -25px; }
.dcdFooter .dcd { position:relative; margin-top:10px; margin-bottom:30px; margin-left: 40px; font-size:11px; display: inline-block; }
.dcdFooter a { text-decoration:underline; }


/* ------------ */
/* GDPR		    */
/* ------------ */
#ccc[light] #ccc-icon {  fill: #df171f !important; }
.ccc-notify-button { color: #fff !important; background: transparent !important; border-color:#fff !important; font-weight: 400; }
.ccc-button-solid { color: #fff !important; background: #449d44 !important; border-color:#449d44 !important; font-weight: 700; }


/* ------------ */
/* Features     */
/* ------------ */
.cloudContainer { position:relative; display: none; }
.cloud { position:absolute; top:0; left:0; }
.sway {
    animation: sway1 15s ease infinite;
    transform-origin: 50% 0% 0;
}
@keyframes sway1 {
    0%, 100%{ transform: rotate(-2deg);}
    50%{ transform: rotate(6deg); }
}


strong { font-weight: 500; }

a, a:hover, a:focus {
	color: #19b9e7;
	text-decoration: none;
    -o-transition: all .3s; -moz-transition: all .3s; -webkit-transition: all .3s; -ms-transition: all .3s; transition: all .3s;
}

.feature {
  position: relative;

  padding: 8px;
  text-align: center;
	background-color:#fff;
	cursor:pointer;
	/* -webkit-box-shadow:inset 0px 0px 0px 5px #eee;
  -moz-box-shadow:inset 0px 0px 0px 5px #eee;
  */
  border-radius: 6px;
  border:2px solid #949494;
	}


.active_feature {
  border-radius: 6px;
  border:2px solid #3fb34f;
  /*
    -webkit-box-shadow:inset 0px 0px 0px 4px #99cc00;
    -moz-box-shadow:inset 0px 0px 0px 4px #99cc00;
    */
   }

.packageDetails { position:relative; margin-bottom: 8px; font-size:12px; line-height: 30px; color:#2b2b2b; display: block; }
.packagedSelected { position:relative; font-size:14px; line-height: 30px; color:#3fb34f; display: block; }
.plans h3 { position: relative; margin-top: 0; font-family: Roboto, sans-serif; font-size: 16px; line-height:30px; color: #2b2b2b; font-weight: 400; }
.plans strong { position: relative; font-family: 'Roboto Condensed', sans-serif; font-size:28px; }
.plans strong i { position: relative; font-family:"Times New Roman", Times, serif; font-size:20px; font-weight: 600; }
.whichPackagedSelected i { color:#3fb34f; display: none; }
.whichPackagedSelected:before {
  content: "Select";
  position:relative;
  margin-bottom: 0;
  font-size:14px;
  line-height: 30px;
  color:#2b2b2b;
  /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  /* IE 5-7 */
  filter: alpha(opacity=50);
  /* Netscape */
  -moz-opacity: 0.5;
  /* Safari 1.x */
  -khtml-opacity: 0.5;
  /* Good browsers */
  opacity: 0.5;

}
.active_feature .whichPackagedSelected:before  { color:#3fb34f;  content: "Selected ";
/* IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
/* IE 5-7 */
filter: alpha(opacity=100);
/* Netscape */
-moz-opacity: 1;
/* Safari 1.x */
-khtml-opacity: 1;
/* Good browsers */
opacity: 1;

}
.active_feature  .whichPackagedSelected i { color:#3fb34f; display: inline-block; }
.floatRightBtnContainer { position: relative; margin-right: 16px; float: right; }
.floatRightBtnContainer .btn-previous { position: relative; margin-right:12px; }
.floatRightBtnContainer .btn-default { position:relative; background:#949494; border-color:#707070; }

label small { position: relative; margin-top: -1px; line-height: 22px; display: block;}
h1, h2 {
	margin-top: 10px;
	font-size: 38px;
    font-weight: 100;
    color: #2b2b2b;
    line-height: 50px;
}
h1 { margin-bottom: 0; }

h3 {
	font-size: 22px;
    font-weight: 300;
    color: #2b2b2b;
    line-height: 30px;
}

p { color:#2b2b2b; }

img { max-width: 100%; }

::-moz-selection { background: #19b9e7; color: #fff; text-shadow: none; }
::selection { background: #19b9e7; color: #fff; text-shadow: none; }


.btn-link-1 {
	display: inline-block;
	height: 50px;
	margin: 0 5px;
	padding: 16px 20px 0 20px;
	background: #19b9e7;
	font-size: 16px;
    font-weight: 300;
    line-height: 16px;
    color: #fff;
    -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
}
.btn-link-1:hover, .btn-link-1:focus, .btn-link-1:active { outline: 0; opacity: 0.6; color: #fff; }

.btn-link-2 {
	display: inline-block;
	height: 50px;
	margin: 0 5px;
	padding: 15px 20px 0 20px;
	background: rgba(0, 0, 0, 0.3);
	border: 1px solid #fff;
	font-size: 16px;
    font-weight: 300;
    line-height: 16px;
    color: #fff;
    -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
}
.btn-link-2:hover, .btn-link-2:focus,
.btn-link-2:active, .btn-link-2:active:focus { outline: 0; opacity: 0.6; background: rgba(0, 0, 0, 0.3); color: #fff; }



/***** Top content *****/

.steps { position: relative; font-size: 16px; line-height: 30px; color:#2b2b2b;}
a.redLink { position: relative; color:#df171f; text-decoration: none; }
a.redLink:hover { color:#df171f; text-decoration: underline; }

.inner-bg {
    padding: 40px 0 170px 0;
}

.top-content .text {
	color: #fff;
}

.top-content .text h1 { color: #fff; }

.top-content .description {
	margin: 20px 0 10px 0;
}

.top-content .description p { opacity: 0.8; }

.top-content .description a {
	color: #fff;
}
.top-content .description a:hover,
.top-content .description a:focus { border-bottom: 1px dotted #fff; }

.top-content .top-big-link {
	margin-top: 35px;
}

.form-box {
	padding-top: 40px;
}

.form-top {
	overflow: hidden;
	padding: 0 25px 15px 25px;
	background: transparent;
	-moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0;
	text-align: left;
}

.form-top-left {
	float: left;
	width: 75%;
	padding-top: 25px;
}

.form-top-left h3 { margin-top: 0; }

.form-top-right {
	float: left;
	width: 25%;
	padding-top: 25px;
	font-size: 66px;
	color: #ddd;
	line-height: 100px;
	text-align: right;
}

.form-bottom {
	padding: 25px 25px 30px 25px;
	background: transparent;
	-moz-border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px;
	text-align: left;
}
.form-bottom-login { padding-top: 0;}
a.forgottenLink { color:#002873; text-decoration: underline; }
a.forgottenLink:hover { color:#df171f; text-decoration: underline; }
.recaptchaTopPad { margin-top:17px; }

.form-box label { color:#2b2b2b; font-weight: 400; }
.input-group-addon { background-color:#f8f8f8; border-radius:0px 6px 6px 0px; border-color:#ddd; }
.input-group-addon i { color:#949494; }
form .form-bottom textarea {
	height: 100px;
}

form .form-bottom button.btn {
	min-width: 100px;
}

form .form-bottom .input-error {
	border-color: #df171f;
}
form .has-error .input-group-addon {
    color: #df171f;
    background-color: #f8f8f8;
    border-color: #df171f;
}
form  .has-error .form-control:focus {
  border-color: #df171f;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px #df171f;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px #df171f;

}

form.registration-form fieldset {
	display: none;
}

form  select {
    min-height: 50px;
    background: #f8f8f8 url(/website_assets/gui/select.png) no-repeat !important;
    background-size: 24px 20px !important;
    background-position: right center !important;

    border: none;
    outline: none;
    display: inline-block;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;

    border:1px solid #ddd;

    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 50px;
    color:#888;
}
form .form-group select { padding-left:20px;  color:#888;   border:1px solid #ddd;

  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0); */
      box-shadow: inset 0 1px 1px rgba(0,0,0,0);
      /* -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; */
      -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
      transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}


form .form-group select:focus {
  border-color: #ccc;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0), 0 0 8px rgba(102,175,233,0);
  box-shadow: inset 0 1px 1px rgba(0,0,0,0), 0 0 8px rgba(102,175,233,.0);


  outline: 0;
	background: #fff;
    border: 3px solid #ccc;
    -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none;
}
form  select:focus { background: #ffffff url(/website_assets/gui/select.png) no-repeat !important;
  background-size: 24px 20px !important;
  background-position: right center !important;
}


.newCustomerContainer { position: relative; margin:30px 0px 20px 0px; overflow: hidden;}
.newCustomerContainer h2 { font-size: 14px; color:#949494; text-align: center;}
.newCustomerContainer h2 .leftTitleLine {

  content: '';
position: absolute;
border-bottom: 1px solid #949494;
width: 100%;
left: -79%;
top: 36px;
z-index: -1;
}

.newCustomerContainer h2 .rightTitleLine {

  content: '';
position: absolute;
border-bottom: 1px solid #949494;
width: 100%;
right: -79%;
top: 36px;
z-index: -1;
}
@media screen and (orientation:landscape) {
.newCustomerContainer h2 .leftTitleLine { left: -64%; }
.newCustomerContainer h2 .rightTitleLine { right: -64%; }
}

.btn-customer { background:#f27121; color:#ffffff; border-color:#ea4a1d;}

/* ------------ */
/* Forgotten    */
/* ------------ */
.forgottenContainer { position:relative; margin:19px 0px 32px 0px; }
.forgottenTxt { position:relative; margin-bottom:20px; font-size:14px; line-height:22px; font-weight:300; color:#2b2b2b;  } 
.forgottenLine { border-top:1px solid #949494; }
.forgottenBottomContainer { position:relative; }
.forgottenBottomContainer h2 { font-size: 22px;
    font-weight: 300;
    color: #2b2b2b;
    line-height: 30px;  }
.forgottenBottomContainer small { font-size:12px; line-height:14px; color:#2b2b2b; } }


 
 
/***** Media queries *****/

@media (min-width: 992px) and (max-width: 1199px) {  }

@media (min-width: 768px) and (max-width: 991px) {}

@media (max-width: 767px) {}

@media (max-width: 415px) {

	h1, h2 { font-size: 32px; }

}


@media (min-width: 767px) {
	
	
	.navbar-right { position: absolute; top: 0; right: 21px;  margin-top: 8px; }
	.nav>li>a { padding:10px; font-size:14px;  }
	.navbar-right .btn { font-size:12px; }
	
	.navbar-right > li { display:inline-block; }
	.navbar-btn-success { margin-right:10px; }
	
	
	
	
   @media screen and (orientation:portrait) {

    }
    @media screen and (orientation:landscape) {

    }
}

@media (min-width: 768px) {

  .navbar-brand { margin-right:9px; }
  .navbar-nav>li>a { padding-top: 25px; padding-bottom: 28px; }
  ul.navbar-nav li { border-right:1px solid #f5f5f5; }
  ul.navbar-nav li:first-child { border-left:1px solid #f5f5f5; }


  footer { padding-top:20px; }
   .footerStripe {  margin-top:30px; }
  @media screen and (orientation:portrait) {
    footer .companyNo ul { position:relative; margin:-3px 0px 15px 0px; text-align:right; }
    .newCustomerContainer h2 .leftTitleLine { left: -64%; }
    .newCustomerContainer h2 .rightTitleLine { right: -64%; }
  }
  @media screen and (orientation:landscape) {
    footer .companyNo ul { position:relative; margin:-3px 25px 15px 0px; text-align:right; }

  }
 }

 @media (min-width: 992px) {

   .navbar-brand { margin-right:20px; }
   .nav>li>a { padding: 10px 20px; }
   .navbar-nav>li>a { padding-top: 25px; padding-bottom: 28px; }
   ul.navbar-nav li { border-right:1px solid #f5f5f5; }
   ul.navbar-nav li:first-child { border-left:1px solid #f5f5f5; }

   .cloudContainer { position:relative; display: block; }
   .newCustomerContainer h2 .leftTitleLine { left: -71%; }
   .newCustomerContainer h2 .rightTitleLine { right: -71%; }

  footer { margin-top:40px; padding-top:30px; }
    .footerStripe {  margin-top:30px; }

  .footerStripe ul { margin:15px 0px; }
  .copyright { padding-right:50px !important; }
  /* Credit Cards Grphic */
  .creditCards { position:absolute; bottom:-35px; left:0; }
  footer .companyNo ul { position:relative; margin:-3px -6px 15px 0px; text-align:right; }

 }
 @media (min-width: 1199px) {

   .navbar-brand { margin-right:20px; }
   .navbar-nav>li>a { padding-top: 25px; padding-bottom: 28px; }
   ul.navbar-nav li { border-right:1px solid #f5f5f5; }
   ul.navbar-nav li:first-child { border-left:1px solid #f5f5f5; }

   .newCustomerContainer h2 .leftTitleLine { left: -66%; }
   .newCustomerContainer h2 .rightTitleLine { right: -66%; }

   .footerStripe {  margin-top:40px; }
   footer .companyNo ul { position:relative; margin:-3px 25px 15px 0px; text-align:right; }
}

/* Retina-ize images/icons */

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) {}


}