/* 
	Invoice and Proposal Default CSS
	Copyright 2014, Acuere Software LLC
*/

@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,300italic,400italic,600italic,700italic);

body { font: 16px 'Open Sans', sans-serif; }

#page-wrap {
    max-width: 800px;
    margin: 0 auto;
}

.printonly {
    display: none;
}

@media print {
    #page-wrap { width:100% !important; }
	.dontprint { display: none; }
    .printonly {
        display: grid;
        grid-template-columns: repeat(2,2fr);
        grid-auto-rows: auto;
        column-gap: 0.8em;
        grid-column-gap: 0.8em;
        row-gap: 0.8em;
        grid-row-gap: 0.8em; 
    }
}

textarea { border: 0; font: 16px 'Open Sans', sans-serif; overflow: hidden; resize: none; }
input[type=text], input[type=email], input[type=password], input[type=tel], textarea {
    padding: 4px;
    margin-right: 1em;
    border-left: 1px solid #CCC;
    border-top: 1px solid #CCC;
    border-right: 1px solid #CCC;
    border-bottom: 2px solid #CCC;
    outline: medium none;
}

input[type=text]:focus, input[type=email]:focus, input[type=password]:focus, input[type=tel]:focus, textarea:focus {
    border-left: solid 1px #CCC;
    border-top: solid 1px #CCC;
    border-right: solid 1px #CCC;
    border-bottom: solid 2px black;
}

.textarea-normal {
    border: 1px solid black;
}

    .textarea-normal:hover, .textarea-normal:focus {
        background-color: white;
    }


table { border-collapse: collapse; }
table td, table th { border: 1px solid black; padding: 5px; }
td.text-right { text-align: right; }
th.text-right { text-align: right; }

.initially-hidden {
    display: none;
}

#header { min-height: 15px; width: 100%; margin: 20px 0; background: #222; text-align: center; color: white; font: bold 18px Helvetica, Sans-Serif; letter-spacing: 12px; padding: .5em; }

#header p
{
	line-height: 18px;
}

#logo { text-align: right; float: right; max-width: 540px; max-height: 100px; overflow: hidden; width:40%; }
#logo img { max-width: 100%; max-height: 100px; }
#logoctr { display: none; }
#logohelp { text-align: left; display: none; font-style: italic; padding: 10px 5px;}
#logohelp input { margin-bottom: 5px; }
.edit #logohelp { display: block; }
.edit #save-logo, .edit #cancel-logo { display: inline; }
.edit #image, #save-logo, #cancel-logo, .edit #change-logo, .edit #delete-logo { display: none; }
.customer-title { font-size: 20px; font-weight: bold; float: left; }
#organization-info {
    float: left;
    width: 60%;
}

#meta { margin-top: 1px; width: 300px; float: right; }
#meta td { text-align: right;  }
#meta td.meta-head { text-align: left; background: #eee; }
#meta td textarea { width: 100%; height: 20px; text-align: right; }

.items-table { clear: both; width: 100%; margin: 30px 0 30px 0; }
.items-table th { background: #eee; color: #333; }
.items-table textarea { width: 80px; height: 50px; }
.items-table tr.item-row td { vertical-align: top; }
.items-table tr.item-row td.cost { border-left: 0; padding: 10px; text-align:right; }
.items-table tr.item-row td.qty { border-left: 0; padding: 10px; text-align:right; }

.items-table td.description { padding:10px; }
.items-table td.item-name { padding:10px; }
.items-table td.description textarea, #items td.item-name textarea { width: 100%; }
.items-table td.total-line { padding: 10px; text-align: right; }
.items-table td.total-value { border-left: 0; padding: 10px; text-align:right; }
.items-table td.total-value textarea { height: 20px; background: none; }
.items-table td.balance { background: #eee; text-align:right; }
.items-table td.blank { border: 0; }

    .items-table td.option-header {
        background: #eee;
        font-weight: bold;
    }

.proposal-items-table, .invoice-items-table {
    /* display: block; added dynamically */
    overflow-x: auto;
}

.terms { text-align: center; margin: 20px 0 20px 0; }
.terms h5 { text-transform: uppercase; font: 16px Helvetica, Sans-Serif; letter-spacing: 10px; border-bottom: 1px solid black; padding: 0 0 8px 0; margin: 0 0 8px 0; font-weight:bold; }
.terms textarea { width: 100%; text-align: center;}

.terms_details
{
    font-family: 'Open Sans', sans-serif;
}

.terms_details li
{
    padding-bottom: 5px;
    padding-top: 5px;
}

    .terms_details ul
    {
        padding-bottom: 10px;
    }

.terms_details h1 { text-transform: uppercase; font: 18px Helvetica, Sans-Serif; border-bottom: 1px solid black; padding: 0 0 8px 0; margin: 12px 0 8px 0; }
.terms_details h2 { text-transform: uppercase; font: 16px Helvetica, Sans-Serif; border-bottom: 1px solid black; padding: 0 0 8px 0; margin: 10px 0 8px 0; }
.terms_details h3 { text-transform: uppercase; font: 18px Helvetica, Sans-Serif; border-bottom: 1px solid black; padding: 0 0 8px 0; margin: 8px 0 8px 0; }
.terms_details h4 { text-transform: uppercase; font: 13px Helvetica, Sans-Serif; letter-spacing: 10px; border-bottom: 1px solid black; padding: 8px 0 8px 0; margin: 0 0 8px 0; }
.terms_details h5 { text-transform: uppercase; font: 13px Helvetica, Sans-Serif; letter-spacing: 10px; border-bottom: 1px solid black; padding: 8px 0 8px 0; margin: 0 0 8px 0; }

textarea:hover, textarea:focus, #items td.total-value textarea:hover, #items td.total-value textarea:focus, .delete:hover { background-color:#EEFF88; }

.delete-wpr { position: relative; }
.delete { display: block; color: #000; text-decoration: none; position: absolute; background: #EEEEEE; font-weight: bold; padding: 0px 3px; border: 1px solid; top: -6px; left: -22px; font-family: Verdana; font-size: 12px; }

#accept_div
{
    font: 16px SofiaProLightRegular,Helvetica,Arial,sans-serif;
	padding:20px;
	border-bottom: 2px solid black;
}

.spacer{clear:both; height:1px;}

.proposal_form{
	padding:14px;
}

/* ----------- stylized ----------- */
.proposal_form
{
	border-bottom: 2px solid black;
}
.proposal_form h1 {
	font-size:18px;
	font-weight:bold;
	margin-bottom:8px;
}
    .proposal_form .solution-radio {
        width:30px;
    }

input.proposal-header-radio:checked,
input.proposal-header-radio:not(:checked) {
    position: absolute;
    left: -9999px;
}

input.proposal-header-radio[type="radio"]:checked + label,
input.proposal-header-radio[type="radio"]:not(:checked) + label {
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
}

    input.proposal-header-radio[type="radio"]:checked + label:before,
    input.proposal-header-radio[type="radio"]:not(:checked) + label:before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 18px;
        height: 18px;
        border: 2px solid #fff;
        border-radius: 100%;
        background: #fff;
    }

    input.proposal-header-radio[type="radio"]:hover,
    input.proposal-header-radio[type="radio"]:checked + label:after,
    input.proposal-header-radio[type="radio"]:not(:checked) + label:after {
        content: '';
        width: 14px;
        height: 14px;
        position: absolute;
        top: 4px;
        left: 4px;
        border-radius: 100%;
        -webkit-transition: all 0.2s ease;
        transition: all 0.2s ease;
    }

    input.proposal-header-radio[type="radio"]:not(:checked) + label:after {
        opacity: 0;
        -webkit-transform: scale(0);
        transform: scale(0);
    }

    input.proposal-header-radio[type="radio"]:checked + label:after {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }

/* -------------------------------------------------------------- 
   Tabs
-------------------------------------------------------------- */
.tab_container {
}

ul.tabs {
    margin: 0;
    margin-bottom:10px;
    padding: 2px;
    float: left;
    list-style: none;
    border-left: 1px solid #fff;
    width: 100%;
}

    ul.tabs li {
        float: left;
        margin: 0;
        padding: 0;
        height: 31px;
        line-height: 31px;
        border: 1px solid #fff;
        border-bottom: 3px solid #fff;
        border-left: none;
        background: #f0f0f0;
        overflow: hidden;
        position: relative;
    }

        ul.tabs li a {
            text-decoration: none;
            color: #263849;
            display: block;
            font-size: 1.2em;
            padding: 0 10px;
            border: 1px solid #f0f0f0;
            outline: none;
        }

        ul.tabs li.active a {
            font-weight: bold;
        }


.tab_content_container {
    border-top: none;
    clear: both;
    float: left;
    width: 100%;
    background: #fff;
    -moz-border-radius-bottomright: 5px;
    -khtml-border-radius-bottomright: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-bottomleft: 5px;
    -khtml-border-radius-bottomleft: 5px;
    -webkit-border-bottom-left-radius: 5px;
}

.tab_content {
    padding: 20px 20px 10px;
}

#css_horizontal_menu{
    overflow:hidden;
    width:100%;
    padding:1px; 
    background-color:#FFFFFF;
    border-bottom:2px solid black;
}

/*2. the style of the links (html element <a>)*/
#css_horizontal_menu a{
    display:block;
    float:left;
    width:90px;
    height:30px;
    margin-left:1px;
    padding-left:11px;
    background-color:#dddddd;
    border-left:6px solid #333333;
    font-family:verdana,arial;
    font-size:14px;
    text-transform:uppercase;
    text-decoration:none;
    color:#000000;
    line-height:25px;
}

/*3. the css style on the hover state of the links*/
#css_horizontal_menu a:hover{
    background-color:#E5E5E5;
    border-left:6px solid #aaaaaa;
    color:#666666;
}

/* remove the left margin for the first link*/
#css_horizontal_menu a.first{
    margin-left:0;
}
   
.greyed-out {
    color: lightgrey;
}

.document-image {
    border: 1px solid white;
    margin: 5px;
}

.document-image:hover {
    border: 1px solid black;
}

div.text-overlay {
    position: absolute; 
    width: 100%; 
    bottom: 0px; 
    left: 0px; 
    background-color: #000000; 
    color:#FFFFFF; 
    opacity: 0.8;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.ellipsis-trim {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/*	--------------------------------------------------
	Alerts
	-------------------------------------------------- */

	div.alert-box 
	{ 
		padding: 3px; 
		font-size: 16px; background: #eee; 
		border: 1px solid rgba(0,0,0,0.1); 
		position: relative; 
	}
	.alert-box.success { background-color:#558b2f; color:#fff; }
	.alert-box.warning { background-color:#f9a825; color:#fff; }
	.alert-box.error { background-color:#c62828; color:#fff; }
	.alert-box.action { background-color:#E0761F; color:#333; }

    .alert-box p { margin:5px; }
    .alert-box a { color: white }
    .alert-box a.action-close { color: #333; position: absolute; right: 4px; top: 0px; font-size: 18px; padding: 4px; }
	.alert-box a.close { color: #000; position: absolute; right: 4px; top: 0px; font-size: 18px; opacity: 0.2; padding: 4px; }
	.alert-box a.close:hover,.alert-box a.close:focus { opacity: 0.4; }

    .form-validation-errors {
        display:none;
        margin-bottom:8px;
    }

.columns {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    margin: 5px 0;
}

.column {
    flex: 1;
    margin: 2px;
    padding: 10px;
    &:first-child {
        margin-left: 0;
    }

    &:last-child {
        margin-right: 0;
    }
}

@media screen and (max-width: 720px) {
    .columns .column {
        margin-bottom: 5px;
        flex-basis: 40%;
        &:nth-last-child(2) {
            margin-right: 0;
        }

        &:last-child {
            flex-basis: 100%;
            margin: 0;
        }

    }
}

@media screen and (max-width: 390px) {
    .columns .column {
        flex-basis: 100%;
        margin: 0 0 5px 0;
    }
}


@media (max-device-width: 800px) {

    #page-wrap {
        width: auto;
        overflow-x: scroll;
        padding: 0 20px;
    }

    #header {
        height: initial;
        width: 100%;
        margin: 20px 0;
        background: #222;
        text-align: center;
        color: white;
        font: bold 18px Helvetica, Sans-Serif;
        text-decoration: uppercase;
        letter-spacing: 20px;
        padding: 8px 0px;
    }

        #header p {
            line-height: 18px;
        }

}

#creditcardform br{display:none;}
#creditcardform{font:18px SofiaProLightRegular,Verdana,Helvetica,Arial,sans-serif; margin-top:3px;margin-left:auto;margin-right:auto;width:100%;}
#creditcardform div.sidetip p{font-size:13px;line-height:16px;padding-left:18px;background-repeat:no-repeat;background-position:center left;color:gray;display:none;}
#creditcardform div.sidetip p.error{color:#C33;}
#creditcardform div.sidetip p.isaok{color:#390;}
.former /*form*/ .holding{position:relative;overflow:visible;}
.former /*form*/ .holding .holder{position:absolute;top:0;z-index:1;left:8px;white-space:nowrap;cursor:text;color:#202020;text-shadow:0 1px 0 rgba(255,255,255,0.5);-webkit-transition:opacity .1s,font-size .1s;-moz-transition:opacity .1s,font-size .1s;-o-transition:opacity .1s,font-size .1s;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none;user-select:none;}.former form .hasome .holder{opacity:0;filter:alpha(opacity=0);font-size:0!important;}
form#creditcardform{width:100%;position:relative}
#creditcardform a{white-space:nowrap;}#creditcardform .textbox div.prompt{margin-bottom:15px;}
#creditcardform .textbox .holding input { 
    outline:0;padding:8px 6px;width:440px;-moz-border-radius:0px;-webkit-border-radius:0px;border-radius:0px;
    border-left: 1px solid #CCC;
    border-top: 1px solid #CCC;
    border-right: 1px solid #CCC;
    border-bottom: 2px solid #CCC;
}
#creditcardform .textbox .holding .holder{font:14px SofiaProLightRegular,Verdana,Helvetica,Arial,sans-serif;display:none;line-height:25px;padding-left:1px;}
#creditcardform.withjs .textbox .holding .holder{display:inline;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none;user-select:none;}
#creditcardform .textbox input,#creditcardform .textbox .holder{font:18px Verdana,Helvetica,Arial,sans-serif;}
#creditcardform .textbox .holding input:focus {
    border-left: 1px solid #CCC;
    border-top: 1px solid #CCC;
    border-right: 1px solid #CCC;
    border-bottom: 2px solid black;
}
#creditcardform .textbox .holding input.focusederror{border-color:rgba(200,0,0,.75);box-shadow:0 0 8px rgba(200,0,0,.5);-moz-box-shadow:0 0 8px rgba(200,0,0,.5);-webkit-box-shadow:0 0 8px rgba(200,0,0,.5);}
#creditcardform div.sidetip{position:absolute;left:458px;width:350px;}
#creditcardform .card img{opacity:0.2;margin:6px 2px 0 3px;}
#creditcardform .imgnotoffer{border:1px solid #D70000;opacity:1 !important;}
#creditcardform .card{margin:-32px 0 0 260px;width:187px;position:absolute;z-index:0;}	
#creditcardform .cardshow {opacity:1 !important;}
#creditcardform .submit{height:40px;margin:0;width:454px;border:1px solid #FFAA22;border-radius:0px;cursor:pointer;display:block;padding:4px 0px;}
#creditcardform .creditcard{width:253px !important;z-index:5;}

#creditcardform .tippercent {width: 440px;}
#creditcardform #payment-amount-div {margin-bottom:15px;width:440px;}
#creditcardform .tippercent .submit {width: 106px;float: left;height:45px;}
#creditcardform .tippercent .submit.selected {background-color: #2a8fbd;color: #fff;}
#creditcardform .tippercent .submit div {font-size:.95em;}

#creditcardform .singleselectoption { visibility: hidden }

.payment-panel {
    margin: 0 auto;
    width: 500px;
}

.payment-method-selectors {
    padding-top:1rem;
    padding-bottom: 1rem;
}
/*
 * jQuery FlexSlider v2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */

/* Browser Resets */
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}

/* FlexSlider Necessary Styles
*********************************/
.flexslider {margin: 0; padding: 0;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}

/* FlexSlider 
*********************************/
.flexslider {
	background: #fff; 
	position: relative; 
	zoom: 1;
}

.flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}

.loading .flex-viewport {max-height: 400px;}

.flexslider .slides {
	zoom: 1;
}

.flex-viewport .slides > li {
	position: relative;
}

.flex-viewport .slides > li > img,
.flex-viewport .slides > li > iframe {
    max-width: 100%;
}

.flex-viewport .slides > li > a,
.flexslider .slides > li > a {
	display: block;	
}

.flexslider .button {
	margin-bottom: 0;	
}

/* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */

.flex-container {
	zoom: 1; 
	position: relative;
}

/* Caption style */

.flex-caption {
	width: 800px;
	position: absolute;
	bottom: -10px;
    background-color: #000;
    color: #fff;
    opacity: 0.5;
}

.flex-caption h1, .flex-caption > div {
	background: rgba(0,0,0,0.75);
	border-radius: 3px;
}

.flex-caption > div {
	padding: 15px 20px;
}

.flex-caption h1 {
	margin-bottom: 10px;
	padding: 10px 20px;
}

.flex-caption p {
	font-size: 1.083em; /* 13px */
	line-height: 1.538em; /* 20px/13px */
}

.flex-caption p:last-child {
	margin-bottom: 0;
}

.flex-caption .button {
	float: right;
	margin: 0 0 0 20px;
	font-size: 1.333em; /* 16px */
	padding: 5px 15px;
}

.flex-caption .button:hover {
	background-color: #333;
}

/* Direction Nav */

.flex-direction-nav {
	z-index: 50; /* necessary for mobile devices */	
}

#flexslider-home .flex-direction-nav {
	opacity: 0;
	-webkit-transition: opacity 0.2s ease-in-out;
	-moz-transition: opacity 0.2s ease-in-out;
	-ms-transition: opacity 0.2s ease-in-out;
	-o-transition: opacity 0.2s ease-in-out;
	transition: opacity 0.2s ease-in-out;	
}

#flexslider-home.flex-container:hover .flex-direction-nav {
	opacity: 1;
}

.flex-direction-nav a {
	position: absolute;
	top: 50%;
	margin-top: -25px; /* half the height */
	display: block;
	width: 40px; 
	height: 50px; 
	background: url(/content/service/images/slider/arrows.png) no-repeat;
	cursor: pointer; 
	text-indent: -999em;
	z-index: 2; /* necessary when there is an overlay */
}

.flex-direction-nav a.flex-prev,
.flex-direction-nav a.flex-prev.flex-disabled {
	background-position: 15px center;
	left: 0;
	border-radius: 0 3px 3px 0;
}

.flex-direction-nav a.flex-next,
.flex-direction-nav a.flex-next.flex-disabled {
	background-position: -35px center; 
	right: 0;
	border-radius: 3px 0 0 3px;
}

.flex-direction-nav a:link, .flex-direction-nav a:visited,

.flex-direction-nav a.flex-disabled:link, .flex-direction-nav a.flex-disabled:visited, 
.flex-direction-nav a.flex-disabled:hover, .flex-direction-nav a.flex-disabled:active {
	background-color: rgba(0,0,0,0.6);	
}

.flex-direction-nav a.flex-disabled:link, .flex-direction-nav a.flex-disabled:visited, 
.flex-direction-nav a.flex-disabled:hover, .flex-direction-nav a.flex-disabled:active {
	cursor: default;
}

/* Control Nav */

.flex-control-nav {
	position: absolute; 
	left: 60px;
	bottom: 20px;
	overflow: hidden;
	z-index: 50; /* necessary for mobile devices and when there is an overlay */
}

.entry-slider .flex-control-nav {
	left: 40px;
	top: 15px;
    right: 40px;
}

.flex-control-nav li {
	margin-right: 6px;
	float: left;
}

.flex-control-paging a {
    width: 10px;
    height: 10px;
    display: block;
    background: url(/content/service/images/slider/nav.png) no-repeat left bottom;
    cursor: pointer;
    text-indent: -999em;
}

.flex-control-paging a:hover, .flex-control-paging a.flex-active {
	background-position: left top;	
}

.flex-control-paging a.flex-active {
	cursor: default;
}

/* Video */

.flexslider iframe {
	margin: 0 auto;	
}
.jquery-lightbox-overlay
{
  background:#000000;
}

.jquery-lightbox
{
  position:relative;
  padding:17px 0;
}

.jquery-lightbox-border-top-left,
.jquery-lightbox-border-top-right,
.jquery-lightbox-border-bottom-left,
.jquery-lightbox-border-bottom-right
{
  position:absolute;
  height:17px;
  width:12%;
  z-index:7000;
}

.jquery-lightbox-border-top-left
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat 0 0;
  top:0;
  left:0;
}

.jquery-lightbox-border-top-right
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat right 0;
  top:0;
  right:0;
}

.jquery-lightbox-border-top-middle
{
  background:#2b2b2b;
  position:absolute;
  height:7px;
  width:78%;
  top:0;
  left:12%;
  z-index:7000;
  overflow:hidden;
}

.jquery-lightbox-border-bottom-left
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat 0 bottom;
  bottom:0;
  left:0;
}

.jquery-lightbox-border-bottom-right
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat right bottom;
  bottom:0;
  right:0;
}

.jquery-lightbox-border-bottom-middle
{
  background:#2b2b2b;
  height:7px;
  width:78%;
  position:absolute;
  bottom:0;
  left:12%;
  z-index:7000;
  overflow:hidden;
}

.jquery-lightbox-title
{
  background:#2b2b2b;
  color:#FFFFFF;
  font-family:verdana,arial,serif;
  font-size:11px;
  line-height:14px;
  padding:5px 8px;
  margin:3px;
  position:absolute;
  bottom:0;
  z-index:7000;
  opacity:0.9;
}

.jquery-lightbox-html
{
  z-index:7000;
  position:relative;
  border:0;
  border-left:7px solid #2b2b2b;
  border-right:7px solid #2b2b2b;
  padding:0px 15px;
  vertical-align:top;
}

.jquery-lightbox-html embed,
.jquery-lightbox-html object,
.jquery-lightbox-html iframe
{
  vertical-align:top;
}

.jquery-lightbox-background
{
  position:absolute;
  top:7px;
  left:7px;
  z-index:6999;
  float:left;
  padding:0;
}

.jquery-lightbox-background img
{
  display:block;
  position:relative;
  border:0;
  margin:0;
  padding:0;
  width:100%;
  height:100%;
}


.jquery-lightbox-mode-image .jquery-lightbox-html
{
  z-index:6998;
  padding:0;
}

.jquery-lightbox-mode-html .jquery-lightbox-background
{
  background:#FFFFFF;
}

.jquery-lightbox-mode-html .jquery-lightbox-html
{
  overflow:auto;
}

.jquery-lightbox-loading,
.jquery-lightbox-mode-html .jquery-lightbox-loading {
    background: #FFFFFF url(/Content/images/rolling-1s-100px.svg) no-repeat center center;
}

.jquery-lightbox-button-close
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat -190px -115px;
  position:absolute;
  top:12px;
  right:-26px;
  width:29px;
  height:29px;
}

.jquery-lightbox-button-close:hover
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat -220px -115px;
}

.jquery-lightbox-button-close span,
.jquery-lightbox-buttons span
{
  display:none;
}

.jquery-lightbox-mode-image .jquery-lightbox-button-close
{
  right:14px;
  z-index:7002;
}

.jquery-lightbox-buttons 
{
  position:absolute;
  top:7px;
  left:7px;
  z-index:7001;
  height:39px;
  display:none;
}

.jquery-lightbox-buttons .jquery-lightbox-buttons-init,
.jquery-lightbox-buttons .jquery-lightbox-buttons-end
{
  width:5px;
  height:39px;
  float:left;
  display:inline;
}

.jquery-lightbox-buttons .jquery-lightbox-buttons-init
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat -151px -153px;
  margin:7px 0 0 7px;
}

.jquery-lightbox-buttons .jquery-lightbox-buttons-end
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat -244px -153px;
  margin:7px 0 0 0;
}

.jquery-lightbox-buttons .jquery-lightbox-button-left
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat -156px -153px;
  width:24px;
  height:39px;
  float:left;
  display:inline;
  margin:7px 0 0 0;
}

.jquery-lightbox-buttons .jquery-lightbox-button-left:hover
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat -156px -194px;
}


.jquery-lightbox-buttons .jquery-lightbox-button-right
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat -220px -153px;
  width:24px;
  height:39px;
  float:left;
  display:inline;
  margin:7px 0 0 0;
}

.jquery-lightbox-buttons .jquery-lightbox-button-right:hover
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat -220px -194px;
}


.jquery-lightbox-buttons .jquery-lightbox-button-max
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat -182px -153px;
  width:36px;
  height:39px;
  float:left;
  display:inline;
  margin:7px 0 0 0;
}

.jquery-lightbox-buttons .jquery-lightbox-button-max:hover
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat -182px -194px;
}


.jquery-lightbox-buttons .jquery-lightbox-button-min
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat -162px -235px;
  width:36px;
  height:39px;
  float:left;
  display:inline;
  margin:7px 0 0 0;
}

.jquery-lightbox-buttons .jquery-lightbox-button-min:hover
{
  background: url(/Content/css/lightbox/default/images/jquery-lightbox-theme.png) no-repeat -207px -235px;
}


.jquery-lightbox-buttons-custom
{
  height:39px;
  float:left;
  display:inline;
  background:#2b2b2b;
  line-height:39px;
  font-size:10px;
  margin:7px 0 0 0;
}

.jquery-lightbox-buttons-custom a
{
  color:#FFFFFF;
  font-size:10px;
  display:inline;
  font-weight:normal;
  text-decoration:underline;
  padding:0 3px;
}

.jquery-lightbox-mode-image .jquery-lightbox-button-close
{
  opacity:0.7;
}

.jquery-lightbox-mode-image .jquery-lightbox-buttons
{
  opacity:0.3;
}

.jquery-lightbox-mode-image:hover .jquery-lightbox-buttons,
.jquery-lightbox-mode-image:hover .jquery-lightbox-button-close
{
  opacity:0.9;
}

.jquery-lightbox-navigator
{
  display:none;
}
 /*Messagebox */

.divMessageBox{
    width:100%;
    height:100%;
    position:fixed;
    top:0;
    left:0;

    background: rgba(0,0,0,0.6);
    z-index:100000;
}

.MessageIE{
    /* background-image: url(../img/bg.png); */
}

.MessageBoxContainer{
    position: relative;
    top: 35%;
    color: black;
    position: relative;
    width: 100%;
    background-color:white;
    font-family: SofiaProLightRegular, Tahoma, Helvetica, Sans-Serif;
}

.MessageBoxMiddle{
    position: relative;
    left: 20%;
    width: 50%;
    font-family: SofiaProLightRegular, Tahoma, Helvetica, Sans-Serif;
    padding: 10px;
}

.MessageBoxMiddle .MsgTitle{
    font-size: 26px;
}

.MessageBoxMiddle .pText{
    margin-top:10px;
    font-size:20px;
}

.MessageBoxContainer select{
    width: 50%;
    padding: 5px;   
}

.MessageBoxMiddle input[type="text"], .MessageBoxMiddle textarea, .MessageBoxMiddle input[type="email"], .MessageBoxMiddle input[type="password"], .MessageBoxMiddle input[type="tel"] {
    padding: 4px;
    margin-right: 1em;
    border-left: 1px solid #ccc;
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 2px solid #ccc;
    outline: medium none;
}

.MessageBoxMiddle input[type=text]:focus, .MessageBoxMiddle textarea:focus, .MessageBoxMiddle input[type=email]:focus, .MessageBoxMiddle input[type=password]:focus,
.MessageBoxMiddle input.error:focus,
.MessageBoxMiddle textarea:focus {
    border-left: solid 1px #CCC;
    border-top: solid 1px #CCC;
    border-right: solid 1px #CCC;
    border-bottom: solid 2px black;
}

/* End of MessageBox */

.botClose{
    position: absolute;
    right: 10px;
    height: 15px;
    width: 15px;
    cursor: pointer;

}

.purehtml{
    color: white;
    font-family: SofiaProLightRegular, Tahoma, Helvetica, Sans-Serif;
    font-size: 16px;
}


@font-face {
    font-family: Quattro;
    src: url('Quattrocento-Regular.otf');
}

/* Mobile Phones */
@media screen and (max-width: 450px) and (max-width: 767px) {

/* SmallBox Responsive */
#divSmallBoxes{

    position: fixed;
    width: 90%;
    right: 0;
    top: 0;

}

.SmallBox{
    position: absolute;
    right: 0px;
    top: 20px;
    padding-right: 30px;
    width: 100%;
    color: white;
    font-family: SofiaProLightRegular, Tahoma, Helvetica, Sans-Serif;

    z-index: 9999;
}

.SmallBox:hover{
    box-shadow: 0px 0px 10px #888888;
    cursor: pointer;
}

.SmallBox span{
    font-size: 16px;
    /*font-weight:bold;*/
}
.SmallBox p{
    font-size: 12px;
    margin-top: 2px;
}


.SmallBox .foto{
    width: 100px;
    height: 100px;
    margin: -10 -10px 2em;
    float: left;
}

.SmallBox .textoFull{
    width: 93%;
    float: left;
    padding-left: 20px;
}

.SmallBox .textoFoto{
    width: 55%;
    margin: 0 15px 0em;
    float: left;    
}


/* End of SmallBox Responsive*/


/* bigBoxes Responsive */
.bigBox{
    position: fixed;
    right: 10px;
    bottom: 10px;
    background-color: #004d60;
    padding-left: 10px;
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 5px;
    width: 88%;
    height: 150px;
    color: white;
    font-family: SofiaProLightRegular, Tahoma, Helvetica, Sans-Serif;
    z-index: 99999;
}

.bigBox span{
    font-size: 19px;
}
.bigBox p{
    font-size: 12px;
    margin-top: 2px;
}

#divMiniIcons{
    float: right;
    position: fixed;
    right: 10px;
    bottom: 180px;
    z-index: 9999;

}

.botClose{
    position: absolute;
    right: 10px;
    height: 20px;
    width: 20px;
}

.bigBox .bigboxicon{
    width: 100px;
    margin: 0 0px 0em;
    float: left;
}

.bigBox .bigboxnumber{
    position: fixed;
    width: 220px;
    margin: 5 0px 0em;
    float: left;    
    text-align: right;
    font-size: 25px;
    margin-top: 2px;
}

/* End of  bigBoxes  Responsive */


 /*Messagebox Responsive */

.divMessageBox{
    width:100%;
    height:100%;
    position:fixed;
    top:0;
    left:0;

    background: rgba(0,0,0,0.6);
    z-index:100000;
}

.MessageBoxContainer{
    position: relative;
    top: 25%;
    color: white;
    position: relative;
    width: 100%;
   /* background-color:#232323; */
    font-family: SofiaProLightRegular, Tahoma, Helvetica, Sans-Serif;
}

.MessageBoxMiddle{
    position: relative;
    left: 10%;
    width: 80%;
    font-family: SofiaProLightRegular, Tahoma, Helvetica, Sans-Serif;
    padding: 3px;
}

.MessageBoxMiddle .MsgTitle{
    font-size: 22px;
    color:black;
}

.MessageBoxMiddle .pText{
    font-size: 20px;
    color:black;
}

.MessageBoxContainer input{
    /* width: 50%; */
    padding: 5px;
    color:black;
}

.MessageBoxContainer select{
    width: 50%;
    padding: 5px;   
}


.MessageBoxButtonSection{
    width: 100%;
    height: 35px;
}

.MessageBoxButtonSection button{
    float: right;

    /*background-color: black;*/
    border-color: white;
    border-width: 2px;
    border-style: solid;
    color: white;
    margin-right: 5px;
    padding: 5px;
    padding-left: 15px;
    padding-right: 15px;
    font-family: arial;
}

.MessageBoxButtonSection button:hover{
    background-color: red;
}

/* End of MessageBox Responsive */


}




/* Animations */

.animated {
    -webkit-animation-duration: 1s;
       -moz-animation-duration: 1s;
         -o-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-fill-mode: both;
       -moz-animation-fill-mode: both;
         -o-animation-fill-mode: both;
            animation-fill-mode: both;
}

.animated.fast {
    -webkit-animation-duration: 0.4s;
        -moz-animation-duration: 0.4s;
        -ms-animation-duration: 0.4s;
        -o-animation-duration: 0.4s;
        animation-duration: 0.4s;
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0;}    
    100% {opacity: 1;}
}

@-moz-keyframes fadeIn {
    0% {opacity: 0;}    
    100% {opacity: 1;}
}

@-o-keyframes fadeIn {
    0% {opacity: 0;}    
    100% {opacity: 1;}
}

@keyframes fadeIn {
    0% {opacity: 0;}    
    100% {opacity: 1;}
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    -moz-animation-name: fadeIn;
    -o-animation-name: fadeIn;
    animation-name: fadeIn;
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(20px);
    }
    
    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@-moz-keyframes fadeInRight {
    0% {
        opacity: 0;
        -moz-transform: translateX(20px);
    }
    
    100% {
        opacity: 1;
        -moz-transform: translateX(0);
    }
}

@-o-keyframes fadeInRight {
    0% {
        opacity: 0;
        -o-transform: translateX(20px);
    }
    
    100% {
        opacity: 1;
        -o-transform: translateX(0);
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        transform: translateX(20px);
    }
    
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    -moz-animation-name: fadeInRight;
    -o-animation-name: fadeInRight;
    animation-name: fadeInRight;
}

@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(20px);
    }
    
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

@-moz-keyframes fadeInUp {
    0% {
        opacity: 0;
        -moz-transform: translateY(20px);
    }
    
    100% {
        opacity: 1;
        -moz-transform: translateY(0);
    }
}

@-o-keyframes fadeInUp {
    0% {
        opacity: 0;
        -o-transform: translateY(20px);
    }
    
    100% {
        opacity: 1;
        -o-transform: translateY(0);
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    -moz-animation-name: fadeInUp;
    -o-animation-name: fadeInUp;
    animation-name: fadeInUp;
}

@-webkit-keyframes fadeOut {
    0% {opacity: 1;}
    100% {opacity: 0;}
}

@-moz-keyframes fadeOut {
    0% {opacity: 1;}
    100% {opacity: 0;}
}

@-o-keyframes fadeOut {
    0% {opacity: 1;}
    100% {opacity: 0;}
}

@keyframes fadeOut {
    0% {opacity: 1;}
    100% {opacity: 0;}
}

.fadeOut {
    -webkit-animation-name: fadeOut;
    -moz-animation-name: fadeOut;
    -o-animation-name: fadeOut;
    animation-name: fadeOut;
}
@-webkit-keyframes fadeOutLeft {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
    
    100% {
        opacity: 0;
        -webkit-transform: translateX(-20px);
    }
}

@-moz-keyframes fadeOutLeft {
    0% {
        opacity: 1;
        -moz-transform: translateX(0);
    }
    
    100% {
        opacity: 0;
        -moz-transform: translateX(-20px);
    }
}

@-o-keyframes fadeOutLeft {
    0% {
        opacity: 1;
        -o-transform: translateX(0);
    }
    
    100% {
        opacity: 0;
        -o-transform: translateX(-20px);
    }
}

@keyframes fadeOutLeft {
    0% {
        opacity: 1;
        transform: translateX(0);
    }
    
    100% {
        opacity: 0;
        transform: translateX(-20px);
    }
}

.fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    -moz-animation-name: fadeOutLeft;
    -o-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft;
}
/* End of Animations */
/**
 * pretty-checkbox.css
 *
 * A pure CSS library to beautify checkbox and radio buttons
 *
 * Source: https://github.com/lokesh-coder/pretty-checkbox
 * Demo: https://lokesh-coder.github.io/pretty-checkbox
 *
 * Copyright (c) 2017 Lokesh rajendran
 */

.pretty * {
  box-sizing: border-box;
}

.pretty input:not([type='checkbox']):not([type='radio']) {
  display: none;
}

.pretty {
    position: relative;
    display: inline-block;
    line-height: .85rem;
    vertical-align: top;
    margin-top: 3px;
}

.pretty input {
  position: absolute;
  left: 0;
  top: 0;
  min-width: 1em;
  width: 100%;
  height: 100%;
  z-index: 2;
  opacity: 0;
  margin: 0;
  padding: 0;
  cursor: pointer;
}

.pretty .state label {
  position: initial;
  display: inline-block;
  font-weight: normal;
  margin: 0;
  text-indent: 20px;
  min-width: 18px;
  padding-right: 8px;
}

.pretty .state label:before,
.pretty .state label:after {
  content: '';
  width: 13px;
  height: 13px;
  display: block;
  /* box-sizing: border-box; */
  border-radius: 0;
  border: 1px solid transparent;
  z-index: 0;
  position: absolute;
  left: 0;
  top: -2px;
  background-color: transparent;
}

.pretty .state label:before {
  border-color: #888;
  background-color:white;
}

.pretty .state.p-is-hover,
.pretty .state.p-is-indeterminate {
  display: none;
}

@-webkit-keyframes zoom {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
}

@keyframes zoom {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
}

@-webkit-keyframes tada {
  0% {
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
    -webkit-transform: scale(7);
    transform: scale(7);
  }
  38% {
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  55% {
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
  }
  72% {
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  81% {
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    -webkit-transform: scale(1.24);
    transform: scale(1.24);
  }
  89% {
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  95% {
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    -webkit-transform: scale(1.04);
    transform: scale(1.04);
  }
  100% {
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes tada {
  0% {
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
    -webkit-transform: scale(7);
    transform: scale(7);
  }
  38% {
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  55% {
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
  }
  72% {
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  81% {
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    -webkit-transform: scale(1.24);
    transform: scale(1.24);
  }
  89% {
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  95% {
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    -webkit-transform: scale(1.04);
    transform: scale(1.04);
  }
  100% {
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes jelly {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  40% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  50% {
    -webkit-transform: scale3d(0.85, 1.15, 1);
    transform: scale3d(0.85, 1.15, 1);
  }
  65% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  75% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes jelly {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  40% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  50% {
    -webkit-transform: scale3d(0.85, 1.15, 1);
    transform: scale3d(0.85, 1.15, 1);
  }
  65% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  75% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@-webkit-keyframes rotate {
  0% {
    opacity: 0;
    -webkit-transform: translateZ(-200px) rotate(-45deg);
    transform: translateZ(-200px) rotate(-45deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateZ(0) rotate(0);
    transform: translateZ(0) rotate(0);
  }
}

@keyframes rotate {
  0% {
    opacity: 0;
    -webkit-transform: translateZ(-200px) rotate(-45deg);
    transform: translateZ(-200px) rotate(-45deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateZ(0) rotate(0);
    transform: translateZ(0) rotate(0);
  }
}

@-webkit-keyframes pulse {
  0% {
    box-shadow: 0px 0px 0px 0px #bdc3c7;
  }
  100% {
    box-shadow: 0px 0px 0px 1.5em rgba(189, 195, 199, 0);
  }
}

@keyframes pulse {
  0% {
    box-shadow: 0px 0px 0px 0px #bdc3c7;
  }
  100% {
    box-shadow: 0px 0px 0px 1.5em rgba(189, 195, 199, 0);
  }
}

.pretty.p-default.p-fill .state label:after {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.pretty.p-default .state label:after {
  -webkit-transform: scale(0.6);
  -ms-transform: scale(0.6);
  transform: scale(0.6);
}

.pretty.p-default input:checked ~ .state label:after {
    background-color: #263849 !important;
}

.pretty.p-default input:not(:checked):hover ~ .state label:after {
    background-color: #dcdcdc !important;
}

.pretty.p-default.p-thick .state label:before,
.pretty.p-default.p-thick .state label:after {
  border-width: 2px;
}

.pretty.p-default.p-thick .state label:after {
  -webkit-transform: scale(0.4) !important;
  -ms-transform: scale(0.4) !important;
  transform: scale(0.4) !important;
}

.pretty.p-icon .state .icon {
  position: absolute;
  font-size: 1em;
  width: calc(1em + 2px);
  height: calc(1em + 2px);
  left: 0;
  z-index: 1;
  text-align: center;
  line-height: normal;
  top: calc((0% - (100% - 1em)) - 8%);
  border: 1px solid transparent;
  opacity: 0;
}

.pretty.p-icon .state .icon:before {
  margin: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  line-height: 1;
}

.pretty.p-icon input:checked ~ .state .icon {
  opacity: 1;
}

.pretty.p-icon input:checked ~ .state label:before {
  border-color: #5a656b;
}

.pretty.p-svg .state .svg {
  position: absolute;
  font-size: 1em;
  width: calc(1em + 2px);
  height: calc(1em + 2px);
  left: 0;
  z-index: 1;
  text-align: center;
  line-height: normal;
  top: calc((0% - (100% - 1em)) - 8%);
  border: 1px solid transparent;
  opacity: 0;
}

.pretty.p-svg .state svg {
  margin: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  line-height: 1;
}

.pretty.p-svg input:checked ~ .state .svg {
  opacity: 1;
}

.pretty.p-image .state img {
  opacity: 0;
  position: absolute;
  width: calc(1em + 2px);
  height: calc(1em + 2px);
  top: 0;
  top: calc((0% - (100% - 1em)) - 8%);
  left: 0;
  z-index: 0;
  text-align: center;
  line-height: normal;
  -webkit-transform: scale(0.8);
  -ms-transform: scale(0.8);
  transform: scale(0.8);
}

.pretty.p-image input:checked ~ .state img {
  opacity: 1;
}

.pretty.p-switch input {
  min-width: 2em;
}

.pretty.p-switch .state {
  position: relative;
}

.pretty.p-switch .state:before {
  content: '';
  border: 2px solid gray;
  border-radius: 60px;
  width: 2em;
  box-sizing: unset;
  height: 16px;
  position: absolute;
  top: 0;
  top: calc((0% - (100% - 1em)) - 16%);
  z-index: 0;
  transition: all 0.5s ease;
}

.pretty.p-switch .state label {
  text-indent: 2.5em;
}

.pretty.p-switch .state label:before,
.pretty.p-switch .state label:after {
  transition: all 0.5s ease;
  border-radius: 100%;
  left: 0;
  border-color: transparent;
  -webkit-transform: scale(0.8);
  -ms-transform: scale(0.8);
  transform: scale(0.8);
}

.pretty.p-switch .state label:after {
  background-color: gray !important;
}

.pretty.p-switch input:checked ~ .state:before {
  border-color: #5a656b;
}

.pretty.p-switch input:checked ~ .state label:before {
  opacity: 0;
}

.pretty.p-switch input:checked ~ .state label:after {
  background-color: #5a656b !important;
  left: 1em;
}

.pretty.p-switch.p-fill input:checked ~ .state:before {
  border-color: #5a656b;
  background-color: #5a656b !important;
}

.pretty.p-switch.p-fill input:checked ~ .state label:before {
  opacity: 0;
}

.pretty.p-switch.p-fill input:checked ~ .state label:after {
  background-color: #fff !important;
  left: 1em;
}

.pretty.p-switch.p-slim .state:before {
  height: 0.1em;
  background: #bdc3c7 !important;
  top: calc(50% - 0.1em);
}

.pretty.p-switch.p-slim input:checked ~ .state:before {
  border-color: #5a656b;
  background-color: #5a656b !important;
}

.pretty.p-has-hover input:hover ~ .state:not(.p-is-hover) {
  display: none;
}

.pretty.p-has-hover input:hover ~ .state.p-is-hover {
  display: block;
}

.pretty.p-has-hover input:hover ~ .state.p-is-hover .icon {
  display: block;
}

.pretty.p-has-focus input:focus ~ .state label:before {
  box-shadow: 0px 0px 3px 0px #bdc3c7;
}

.pretty.p-has-indeterminate input[type='checkbox']:indeterminate ~ .state:not(.p-is-indeterminate) {
  display: none;
}

.pretty.p-has-indeterminate input[type='checkbox']:indeterminate ~ .state.p-is-indeterminate {
  display: block;
}

.pretty.p-has-indeterminate input[type='checkbox']:indeterminate ~ .state.p-is-indeterminate .icon {
  display: block;
  opacity: 1;
}

.pretty.p-toggle .state.p-on {
  opacity: 0;
  display: none;
}

.pretty.p-toggle .state.p-off,
.pretty.p-toggle .state .icon,
.pretty.p-toggle .state .svg,
.pretty.p-toggle .state img {
  opacity: 1;
  display: inherit;
}

.pretty.p-toggle .state.p-off .icon {
  color: #bdc3c7;
}

.pretty.p-toggle input:checked ~ .state.p-on {
  opacity: 1;
  display: inherit;
}

.pretty.p-toggle input:checked ~ .state.p-off {
  opacity: 0;
  display: none;
}

.pretty.p-plain input:checked ~ .state label:before,
.pretty.p-plain.p-toggle .state label:before {
  content: none;
}

.pretty.p-plain.p-plain .icon {
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}

.pretty.p-round .state label:before,
.pretty.p-round .state label:after {
  border-radius: 100%;
}

.pretty.p-round.p-icon .state .icon {
  border-radius: 100%;
  overflow: hidden;
}

.pretty.p-round.p-icon .state .icon:before {
  -webkit-transform: scale(0.8);
  -ms-transform: scale(0.8);
  transform: scale(0.8);
}

.pretty.p-curve .state label:before,
.pretty.p-curve .state label:after {
  border-radius: 20%;
}

.pretty.p-smooth label:before,
.pretty.p-smooth label:after,
.pretty.p-smooth .icon,
.pretty.p-smooth .svg {
  transition: all 0.5s ease;
}

.pretty.p-smooth input:checked + .state label:after {
  transition: all 0.3s ease;
}

.pretty.p-smooth input:checked + .state .icon,
.pretty.p-smooth input:checked + .state .svg,
.pretty.p-smooth input:checked + .state img {
  -webkit-animation: zoom 0.2s ease;
  animation: zoom 0.2s ease;
}

.pretty.p-smooth.p-default input:checked + .state label:after {
  -webkit-animation: zoom 0.2s ease;
  animation: zoom 0.2s ease;
}

.pretty.p-smooth.p-plain input:checked + .state label:before {
  content: '';
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
  transition: all 0.5s ease;
}

.pretty.p-tada:not(.p-default) input:checked + .state .icon,
.pretty.p-tada:not(.p-default) input:checked + .state .svg,
.pretty.p-tada:not(.p-default) input:checked + .state img,
.pretty.p-tada:not(.p-default) input:checked + .state label:before,
.pretty.p-tada:not(.p-default) input:checked + .state label:after {
  -webkit-animation: tada 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1 alternate;
  animation: tada 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1 alternate;
  opacity: 1;
}

.pretty.p-jelly:not(.p-default) input:checked + .state .icon,
.pretty.p-jelly:not(.p-default) input:checked + .state .svg,
.pretty.p-jelly:not(.p-default) input:checked + .state img,
.pretty.p-jelly:not(.p-default) input:checked + .state label:before,
.pretty.p-jelly:not(.p-default) input:checked + .state label:after {
  -webkit-animation: jelly 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  animation: jelly 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  opacity: 1;
}

.pretty.p-jelly:not(.p-default) input:checked + .state label:before {
  border-color: transparent;
}

.pretty.p-rotate:not(.p-default) input:checked ~ .state .icon,
.pretty.p-rotate:not(.p-default) input:checked ~ .state .svg,
.pretty.p-rotate:not(.p-default) input:checked ~ .state img,
.pretty.p-rotate:not(.p-default) input:checked ~ .state label:before,
.pretty.p-rotate:not(.p-default) input:checked ~ .state label:after {
  -webkit-animation: rotate 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  animation: rotate 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  opacity: 1;
}

.pretty.p-rotate:not(.p-default) input:checked ~ .state label:before {
  border-color: transparent;
}

.pretty.p-pulse:not(.p-switch) input:checked ~ .state label:before {
  -webkit-animation: pulse 1s;
  animation: pulse 1s;
}

.pretty input[disabled] {
  cursor: not-allowed;
  display: none;
}

.pretty input[disabled] ~ * {
  opacity: .5;
}

.pretty.p-locked input {
  display: none;
  cursor: not-allowed;
}

.pretty input:checked ~ .state.p-primary label:after,
.pretty.p-toggle .state.p-primary label:after {
  background-color: #428bca !important;
}

.pretty input:checked ~ .state.p-primary .icon,
.pretty input:checked ~ .state.p-primary .svg,
.pretty.p-toggle .state.p-primary .icon,
.pretty.p-toggle .state.p-primary .svg {
  color: #fff;
  stroke: #fff;
}

.pretty input:checked ~ .state.p-primary-o label:before,
.pretty.p-toggle .state.p-primary-o label:before {
  border-color: #428bca;
}

.pretty input:checked ~ .state.p-primary-o label:after,
.pretty.p-toggle .state.p-primary-o label:after {
  background-color: transparent;
}

.pretty input:checked ~ .state.p-primary-o .icon,
.pretty input:checked ~ .state.p-primary-o .svg,
.pretty input:checked ~ .state.p-primary-o svg,
.pretty.p-toggle .state.p-primary-o .icon,
.pretty.p-toggle .state.p-primary-o .svg,
.pretty.p-toggle .state.p-primary-o svg {
  color: #428bca;
  stroke: #428bca;
}

.pretty.p-default:not(.p-fill) input:checked ~ .state.p-primary-o label:after {
  background-color: #428bca !important;
}

.pretty.p-switch input:checked ~ .state.p-primary:before {
  border-color: #428bca;
}

.pretty.p-switch.p-fill input:checked ~ .state.p-primary:before {
  background-color: #428bca !important;
}

.pretty.p-switch.p-slim input:checked ~ .state.p-primary:before {
  border-color: #245682;
  background-color: #245682 !important;
}

.pretty input:checked ~ .state.p-info label:after,
.pretty.p-toggle .state.p-info label:after {
  background-color: #5bc0de !important;
}

.pretty input:checked ~ .state.p-info .icon,
.pretty input:checked ~ .state.p-info .svg,
.pretty.p-toggle .state.p-info .icon,
.pretty.p-toggle .state.p-info .svg {
  color: #fff;
  stroke: #fff;
}

.pretty input:checked ~ .state.p-info-o label:before,
.pretty.p-toggle .state.p-info-o label:before {
  border-color: #5bc0de;
}

.pretty input:checked ~ .state.p-info-o label:after,
.pretty.p-toggle .state.p-info-o label:after {
  background-color: transparent;
}

.pretty input:checked ~ .state.p-info-o .icon,
.pretty input:checked ~ .state.p-info-o .svg,
.pretty input:checked ~ .state.p-info-o svg,
.pretty.p-toggle .state.p-info-o .icon,
.pretty.p-toggle .state.p-info-o .svg,
.pretty.p-toggle .state.p-info-o svg {
  color: #5bc0de;
  stroke: #5bc0de;
}

.pretty.p-default:not(.p-fill) input:checked ~ .state.p-info-o label:after {
  background-color: #5bc0de !important;
}

.pretty.p-switch input:checked ~ .state.p-info:before {
  border-color: #5bc0de;
}

.pretty.p-switch.p-fill input:checked ~ .state.p-info:before {
  background-color: #5bc0de !important;
}

.pretty.p-switch.p-slim input:checked ~ .state.p-info:before {
  border-color: #2390b0;
  background-color: #2390b0 !important;
}

.pretty input:checked ~ .state.p-success label:after,
.pretty.p-toggle .state.p-success label:after {
  background-color: #263849 !important;
}

.pretty input:checked ~ .state.p-success .icon,
.pretty input:checked ~ .state.p-success .svg,
.pretty.p-toggle .state.p-success .icon,
.pretty.p-toggle .state.p-success .svg {
  color: #fff;
  stroke: #fff;
}

.pretty input:checked ~ .state.p-success-o label:before,
.pretty.p-toggle .state.p-success-o label:before {
  border-color: #263849;
}

.pretty input:checked ~ .state.p-success-o label:after,
.pretty.p-toggle .state.p-success-o label:after {
  background-color: transparent;
}

.pretty input:checked ~ .state.p-success-o .icon,
.pretty input:checked ~ .state.p-success-o .svg,
.pretty input:checked ~ .state.p-success-o svg,
.pretty.p-toggle .state.p-success-o .icon,
.pretty.p-toggle .state.p-success-o .svg,
.pretty.p-toggle .state.p-success-o svg {
  color: #263849;
  stroke: #263849;
}

.pretty.p-default:not(.p-fill) input:checked ~ .state.p-success-o label:after {
  background-color: #263849 !important;
}

.pretty.p-switch input:checked ~ .state.p-success:before {
  border-color: #263849;
}

.pretty.p-switch.p-fill input:checked ~ .state.p-success:before {
  background-color: #263849 !important;
}

.pretty.p-switch.p-slim input:checked ~ .state.p-success:before {
  border-color: #357935;
  background-color: #357935 !important;
}

.pretty input:checked ~ .state.p-warning label:after,
.pretty.p-toggle .state.p-warning label:after {
  background-color: #f0ad4e !important;
}

.pretty input:checked ~ .state.p-warning .icon,
.pretty input:checked ~ .state.p-warning .svg,
.pretty.p-toggle .state.p-warning .icon,
.pretty.p-toggle .state.p-warning .svg {
  color: #fff;
  stroke: #fff;
}

.pretty input:checked ~ .state.p-warning-o label:before,
.pretty.p-toggle .state.p-warning-o label:before {
  border-color: #f0ad4e;
}

.pretty input:checked ~ .state.p-warning-o label:after,
.pretty.p-toggle .state.p-warning-o label:after {
  background-color: transparent;
}

.pretty input:checked ~ .state.p-warning-o .icon,
.pretty input:checked ~ .state.p-warning-o .svg,
.pretty input:checked ~ .state.p-warning-o svg,
.pretty.p-toggle .state.p-warning-o .icon,
.pretty.p-toggle .state.p-warning-o .svg,
.pretty.p-toggle .state.p-warning-o svg {
  color: #f0ad4e;
  stroke: #f0ad4e;
}

.pretty.p-default:not(.p-fill) input:checked ~ .state.p-warning-o label:after {
  background-color: #f0ad4e !important;
}

.pretty.p-switch input:checked ~ .state.p-warning:before {
  border-color: #f0ad4e;
}

.pretty.p-switch.p-fill input:checked ~ .state.p-warning:before {
  background-color: #f0ad4e !important;
}

.pretty.p-switch.p-slim input:checked ~ .state.p-warning:before {
  border-color: #c77c11;
  background-color: #c77c11 !important;
}

.pretty input:checked ~ .state.p-danger label:after,
.pretty.p-toggle .state.p-danger label:after {
  background-color: #d9534f !important;
}

.pretty input:checked ~ .state.p-danger .icon,
.pretty input:checked ~ .state.p-danger .svg,
.pretty.p-toggle .state.p-danger .icon,
.pretty.p-toggle .state.p-danger .svg {
  color: #fff;
  stroke: #fff;
}

.pretty input:checked ~ .state.p-danger-o label:before,
.pretty.p-toggle .state.p-danger-o label:before {
  border-color: #d9534f;
}

.pretty input:checked ~ .state.p-danger-o label:after,
.pretty.p-toggle .state.p-danger-o label:after {
  background-color: transparent;
}

.pretty input:checked ~ .state.p-danger-o .icon,
.pretty input:checked ~ .state.p-danger-o .svg,
.pretty input:checked ~ .state.p-danger-o svg,
.pretty.p-toggle .state.p-danger-o .icon,
.pretty.p-toggle .state.p-danger-o .svg,
.pretty.p-toggle .state.p-danger-o svg {
  color: #d9534f;
  stroke: #d9534f;
}

.pretty.p-default:not(.p-fill) input:checked ~ .state.p-danger-o label:after {
  background-color: #d9534f !important;
}

.pretty.p-switch input:checked ~ .state.p-danger:before {
  border-color: #d9534f;
}

.pretty.p-switch.p-fill input:checked ~ .state.p-danger:before {
  background-color: #d9534f !important;
}

.pretty.p-switch.p-slim input:checked ~ .state.p-danger:before {
  border-color: #a02622;
  background-color: #a02622 !important;
}

.pretty.p-bigger label:before,
.pretty.p-bigger label:after,
.pretty.p-bigger .icon,
.pretty.p-bigger .svg,
.pretty.p-bigger .img {
  font-size: 1.2em !important;
  top: calc((0% - (100% - 1em)) - 35%) !important;
}

.pretty.p-bigger label {
  text-indent: 1.7em;
}

@media print {
  .pretty .state:before,
  .pretty .state label:before,
  .pretty .state label:after,
  .pretty .state .icon {
    color-adjust: exact;
    /* stylelint-disable */
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

