h2 {
    font-weight: 400;
    text-align: center;
    margin-top: 0;
    margin-bottom: 30px
}
/*--===== Pricing Services =====--*/
.pricing-services {
    text-align: center;
    margin: 30px auto
}
.rtl .service-display {
    direction: ltr;
}
.pricing-service {
    margin: 22.5px 22.5px 0;
    display:inline-block;
    width: 120px;
    height: 120px;
    position: relative;
    border-radius: 50%;
    background-color: #ff8a00;
    color: #ffffff;
    transition: 400ms all;
    padding: 20px 4px 0;
    text-align: center;
    cursor: pointer;
	vertical-align: top;
}
.pricing-services .pricing-service input {
    display: none
}
@media(max-width:1200px) {
    .pricing-service {
        margin: 30px 15px 0
    }
}
.pricing-service:hover, .pricing-service:hover *, .pricing-service:focus, .pricing-service:focus * {
    color: #ffffff;
    text-decoration: none
}
.pricing-service i {
    display: block;
    width: 47px;
    height: 25px;
	font-size: 28px;
    margin: 0 auto 8px;
    background-position: top center;
    background-size: auto 100%;
    background-repeat: no-repeat;
	overflow: hidden
}
.pricing-service i:before {
    display: block;
    margin: 0 auto;
	width: 47px;
	height: 25px;
	line-height: 25px;
}
.pricing-service .logo-icon {
    background-image: url('../images/logo-icon.png')
}
.pricing-service .envelope-icon {
    background-image: url('../images/stationery-icon.png')
}
.pricing-service .website-icon {
    background-image: url('../images/website-icon.png')
}
.pricing-service .brochure-icon {
    background-image: url('../images/brochure-icon.png')
}
.pricing-service .menu-icon {
    background-image: url('../images/menu-icon.png')
}
.pricing-service .social-icon {
    background-image: url('../images/social-icon.png')
}
.pricing-service .promotional-icon {
    background-image: url('../images/promotional-icon.png')
}
.pricing-service p {
    text-transform: uppercase;
    font-size: 0.900em;
    margin: 5px auto 0;
    display: table;
    line-height: 1;
    font-weight: 700
}
.rtl .pricing-service p {
    font-size: 0.850em;
}
.pricing-service p:after {
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    margin-top: 0px;
    content: ' ';
    display: block
}
.pricing-service:before {
    width: 136px;
    height: 136px;
    content: ' ';
    position: absolute;
    left: -8px;
    top: -8px;
    border-radius: 50%;
    border: solid 1px #ff8a00;
    transition: 400ms all
}
.pricing-service:hover:before, .pricing-service:focus:before {
    border-width: 5px;
    border-color: #d36a00;}
.pricing-service .select-service {
    width: 100%;
    height: 100%;
    text-align: center;
    padding: 45px 10px 0;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 0.9em;
    line-height: 1.1;
    transition: 300ms all;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 50%
}
.pricing-service:hover .select-service, .pricing-service:focus .select-service {
    background-color: #d36a00;
    opacity: 1
}
.pricing-service span {
    margin-top: 10px;
    line-height: 1;
    text-align: center;
    display: block
}
.pricing-service span strong {
    display: block;
    font-size: 1.1em;
    line-height: 1.3;
    font-family: Arial, san-serif;
    font-weight: 400
}
/*--===== Pricing Services END =====--*/

/*--===== Pricing Selected Services =====--*/
.service-selected {
    text-align: left;
    margin-bottom: 30px
}
.service-selected:last-child {
    margin-bottom: 0
}
.service-selected .pricing-service {
    background-color: #16a086;
    cursor: auto;
    z-index: 10
}
.service-selected .pricing-service:before{
    border-width: 5px;
    border-color: #16a086
}
.service-display {
    display: block;
    padding: 90px 25px 25px 25px;
    background-color: #f9f9f9;
    border: solid 2px #d9d9d9;
    border-radius: 0 0 25px 25px;
    min-height: 135px;
    position: relative;
    float: right;
}
.service-display .close-btn {
    position: absolute;
    left: 0;
	right: 0;
    bottom: -15px;
	margin: auto;
	width: 110px;
    background-color: #3C3C3C;
    color: #ffffff;
    padding: 6px 9px;
    cursor: pointer !important;
    border-radius: 3px;
    transition: 600ms all;
    line-height: 1
}
.service-display .close-btn:before {
	font-size: 1.100em
}
.service-display .close-btn span {
	padding-left: 5px;
	font-weight: 700;
	text-transform: uppercase
}
.service-display > .row > div label {
    margin-bottom: 0
}
.service-display > .row > div label p {
    margin-bottom: 0
}
.service-display .close-btn:hover, .service-display .close-btn:focus {
    background-color: #C12D20;
    text-decoration: none
}
.service-selected select {
    background-color: #ffffff;
    width: auto !important
}
.rtl .service-selected select {
    margin: 0 0 15px 0;
}
.service-display > .row > div {
    border-right: solid 1px rgba(0,0,0,0.10)
}
.service-display > .row > div:last-child {
    border-right: 0
}
.rtl .service-display > p, .rtl .service-display > h4 {
    text-align: left;
}
.service-checkbox p {
	width: 100% !important;
	font-style: normal !important 
}
.service-checkbox .checkbox {
	border: 0 !important;
}
.service-checkbox .checkbox input {
	margin-top: 5px !important
}
.service-checkbox .checkbox:after {
	display: none
}
@media(min-width:991px) {
	.service-display > .row > div:nth-child(6n) {
		border-right: 0
	}
}
@media(min-width:768px) {
    .service-display {
        margin-top: -127px;
        padding: 25px 25px 25px 95px;
        width: calc(100% - 80px)
    }
    .service-display > .row > div {
        padding: 0 20px
    }
}
@media(max-width:767px) {
    .service-selected .pricing-service {
        margin: 0 auto -60px;
        display: block
    }
    .service-display > .row > div h4 {
        text-align: center;
        margin-top: 30px
    }
    .service-display > .row > div:first-child h4 {
        margin-top: 0
    }
}
@media(max-width:540px), ( min-width: 768px ) and ( max-width: 1199px ) {
    .service-display .service-checkbox label p {
        display: block;
        width: 100% !important;
        text-align: left
    }
    .service-selected select {
        width: 60%
    }
}
@media(max-width:480px), ( min-width: 768px ) and ( max-width: 1199px ) {
    .service-display  h4 {
        font-size: 1.2em
    }
    .logo-choose > div:nth-child(n+7) {
        margin-top: 30px
    }
}

@media ( min-width: 991px ) and ( max-width: 1199px ) {
    .service-display .service-checkbox label p.hint-lg {
        width: 180px !important
    }
}
@media (max-width: 767px) {
    .service-display {
        float: inherit
    }
}
@media (max-width: 991px) {
	.logo-choose > div:nth-child(n+5) {
        margin-top: 30px;
    }
	.logo-choose > div:nth-child(4n+4) {
        border-right: 0;
    }
}
.service-display h4 {
    display: block;
    margin: 0 0 30px;
    font-weight: 400;
    text-transform: uppercase;
    font-size: 1.55em
}

.service-display ul + h4 {
	margin: 15px 0
}
.question-icon {
    font-size: 0.700em;
    margin: -10px 0 0 5px;
    color: #0196cf
}
.logo-choose {
    margin: 0 -15px 30px
}
.logo-choose > div:nth-child(n+7) {
    margin-top: 30px
}
.logo-choose > div {
    padding: 0 20px
}
@media(max-width: 600px) {
	.logo-choose > div {
		padding: 0 10px
	}
}
@media (max-width: 500px) {
	.logo-choose > div {
		width: 50%;
		padding: 0 30px
	}
	.logo-choose > div:nth-child(n+3) {
		margin-top: 30px
	}
	.logo-choose > div:nth-child(2n+2) {
		border-right: 0
	}
}
@media (max-width: 400px) {
	.logo-choose > div {
		width: 50%;
		padding: 0 20px
	}
}
.logo-choose .logo-total {
    padding: 10px 0;
    display: block;
    height: 90px;
    background-color: #ffffff;
    text-align: center;
    position: relative;
    border-radius: 8px 8px 0 0;
    border: solid 1px #cadcd9;
    cursor: pointer;
    overflow: hidden
}
.logo-choose .logo-total p {
    font-size: 1.6em;
    margin-bottom: 0;
    color: #2aa891
}
.logo-choose .logo-total span {
    position: absolute;
    bottom: -50%;
    left: 0;
    right: 0;
    margin: auto;
    width: 85%;
    max-width: 110px;
    height: 100%;
    line-height: 50px;
    overflow: hidden;
    font-family: Oxygen, serif;
    font-weight: 700;
    font-size: 1.300em;
    background-color: #2aa891;
    color: #ffffff;
    border-radius: 50%
}
.logo-choose .logo-total span i {
    font-size: 0.75em;
    font-weight: 400;
    padding-right: 3px
}
.logo-choose span.total-check {
    position: absolute;
    top: -13px;
    left: 0;
    right: 0;
    margin: auto;
    width: 28px;
    height: 28px;
    background-color: #ffffff;
    z-index: 1;
    color: #D7D7D7;
    font-size: 1em;
    cursor: pointer
}
.logo-choose span.total-check .fa-stack-1x {
    display: none
}
.logo-choose span.total-check.logo-total-checked {
    color: #df3223;
}
.logo-choose span.total-check.logo-total-checked .fa-stack-1x {
    display: block
}
/*logo-total-checked*/
.service-display .service-checkbox {
    width: 100%;
    margin-bottom: 10px;
    cursor: pointer
}
.service-display .service-checkbox:last-child {
    margin-bottom: 0
}
.service-display .service-checkbox label {
    padding: 3px 0px 3px 7px;
    font-weight: 400;
    width: calc(100% - 39px);
    margin-bottom: 0;
    cursor: pointer
}
.service-display .service-checkbox label p.hint-lg {
    width: 200px
}
.service-display .service-checkbox label p a {
    white-space: nowrap
}
.service-display ul {
    display: block;
    margin: 0;
    padding: 0
}
.service-display ul li {
    background-image: url(../images/left-arrow.png);
    background-position: 0 12px;
    background-size: 12px;
    background-repeat: no-repeat;
    list-style: none;
    padding: 10px 0 10px 20px;
    display: block;
    border-bottom: solid 1px #e0e0e0
}
.service-display ul li:last-child {
    border-bottom: 0
}
/*--===== Pricing Selected Services END =====--*/

/*--===== Pricing Widget =====--*/
.pricing-widget {
    display: block;
    line-height: 1;
    position: fixed;
    right: -225px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 225px;
    height: 197px;
    min-height: 197px;
    z-index: 100;
    font-weight: 400;
    color: #ffffff;
    font-size: 0.900em;
    transition: 800ms all
}
.pricing-widget-full {
    right: 0
}
.pricing-widget .pw-body {
    background-color: #0d7d68;
    height: 100%;
    width: 100%;
    border-radius: 10px 0 0 10px;
    overflow: hidden;
}
.pricing-widget .pw-body:before {
    content: '';
    background-color: #bf2820;
    content: '';
    width: 10px;
    z-index: -1;
    height: 46px;
    left: 0;
    position: absolute;
    transition: 1.1s all;
    border-radius: 3px 0 0 3px;
    bottom: 34px;
}
.pricing-widget-full .pw-body:before {
    left: -10px;
}
.rtl .pricing-widget .pw-body:before {
    bottom: 34px;
    height: 47px;
}
@-moz-document url-prefix() {
    .rtl .pricing-widget .pw-body:before {
        bottom: 32px !important;
        height: 48px !important;
    }
}
    .pricing-widget .pw-toggle {
    position: absolute;
    display: table-cell;
    vertical-align: middle;
    left: -28px;
    top: -60px;
    bottom: 0;
    margin: auto;
    width: 56px;
    height: 56px;
    line-height: 56px;
    color: #ffffff;
    text-align: center;
    padding-right: 28px;
    z-index: -1;
    font-size: 2em;
    text-decoration: none;
    background-color: #095f4f;
    border-radius: 50%;
    transition: 400ms all;
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
}
.pricing-widget .pw-toggle:before {
    display: block;
    transition: 400ms all;
}
.pricing-widget-full .pw-toggle:before {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
}
.pricing-widget .pw-toggle:after {
    width: 68px;
    height: 68px;
    border: solid 1px #095f4f;
    border-radius: 50%;
    top: -6px;
    left: -6px;
    content: '';
    display: block;
    position: absolute;
    transition: 400ms all
}
.pricing-widget .pw-toggle:hover {
    background-color: #053E33;
}
.pricing-widget .pw-toggle:hover:after {
    border-color: #053E33;
    border-width: 5px
}
.pricing-widget h2 {
    text-align: center;
    font-weight: 700;
    line-height: 0.95;
    font-size: 4.4em;
    margin: 25px 0 5px
}
.pricing-widget .pricing-approx {
    padding: 0;
    margin: 0 0 15px;
    text-align: center;
    font-size: 1.200em
}
.pricing-widget .pricing-approx span {
    font-weight: 400
}
.pricing-widget ul, .pricing-widget ul li {
    display: block;
    margin: 0;
    padding: 0
}
.pricing-widget ul li {
    list-style: none;
    background-color: #16a086;
    text-transform: uppercase;
    border-bottom: solid 1px #3faa98
}
.pricing-widget ul li i {
    margin-right: 10px
}
.rtl .pricing-widget ul li i {
    margin: 0 0 0 10px
}

.pricing-widget ul li  {
    padding: 15px
}
.pricing-widget .pricing-initial {
    background-color: #DF3223;
    padding: 8px 15px 8px 10px;
    line-height: 1.2;
    display: block;
    width: 100%;
    border-radius: 0;
    text-transform: inherit;
    font-size: 1em;
    font-weight: inherit;
    text-align: left;
    position: relative;
    position: relative;
}
.pricing-widget .pricing-initial:hover {
    background-color: #bf2820;
}
.pricing-widget .pricing-initial span {
    text-align: right;
    float: right;
    font-weight: 700;
    line-height: 29px;
    font-size: 1.150em;
}
.pricing-widget .pricing-initial p {
    font-size: 0.800em;
    margin-bottom: 0;
}
.pricing-widget .pricing-initial i {
    animation: initialdirection 2s infinite;
    -webkit-animation: initialdirection 2s infinite;
    -moz-animation: initialdirection 2s infinite;
}
@-webkit-keyframes initialdirection {
    0% { color: #ffffff; -webkit-transform: translate(0px,0px);}
    50% { color: #ffffff; -webkit-transform: translate(10px,0px);}
    100% { color: #ffffff; -webkit-transform: translate(0px,0px);}
}
@-moz-keyframes initialdirection {
    0% { color: #ffffff; -moz-transform: translate(0px,0px);}
    50% { color: #ffffff; -moz-transform: translate(10px,0px);}
    100% { color: #ffffff; -moz-transform: translate(0px,0px);}
}
@keyframes initialdirection {
    0% { color: #ffffff; transform: translate(0px,0px);}
    50% { color: #ffffff; transform: translate(10px,0px);}
    100% { color: #ffffff; transform: translate(0px,0px);}
}
.pricing-widget .pricing-bank {
    display: block;
    background-color: #3C3C3C;
    color: #ffffff;
    font-weight: 700;
    padding: 10px 10px 10px 15px;
    text-decoration: none;
    transition: 400ms all;
}
.rtl .pricing-widget .pricing-bank {
    font-size: 1.000em;
    font-weight: 300;
}
.pricing-widget .pricing-bank:hover {
    background-color: #BB0E00
}
.pricing-widget ul li, .pricing-widget .pricing-initial, .pricing-widget .pricing-bank {
    margin: 0
}
/*--===== Pricing Widget END =====--*/

/*--===== Radio / Checkbox =====--*/
span.checkbox input {
    z-index: 1;
    cursor: pointer
}
span.checkbox , span.checkbox-disabled, span.radiobtn {
    border: solid 2px #16A086 !important;
    background-color: inherit !important;
    color: #16A086 !important;
    position: relative;
    cursor: pointer
}
span.checkbox-active:after, span.radio-active:after {
    font-family: FontAwesome, san-serit;
    text-align: center;
    display: block;
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 24px;
    line-height: 24px;
    font-size: 1.5em;
    cursor: pointer
}
span.checkbox-active:after {
    content: "\f00c"
}
span.radio-active:after {
    content: '\f111';
    font-size: 0.9em;
}
.rtl span.checkbox , span.checkbox-disabled, span.radiobtn {
    float: left;
}
/*--===== Radio / Checkbox END =====--*/

/*--===== Colorful Pricing Service =====--*/
.skygreen .pricing-service, .skygreen.pricing-service, .skygreen  .select-service, .skygreen .price-tag {
    background-color: #16a086 !important
}
.blue .pricing-service, .blue.pricing-service, .blue .select-service, .blue .price-tag {
    background-color: #354a5f !important
}
.skyblue .pricing-service, .skyblue.pricing-service, .skyblue .select-service, .skyblue .price-tag {
    background-color: #3598db !important
}
.purple .pricing-service, .purple.pricing-service, .purple .select-service, .purple .price-tag {
    background-color: #9a59b5 !important
}
.green .pricing-service, .green.pricing-service, .green .select-service, .green .price-tag {
    background-color: #5ac95a !important
}
.red .pricing-service, .red.pricing-service, .red .select-service, .red .price-tag {
    background-color: #db3462 !important
}
.light-green .pricing-service, .light-green.pricing-service, .light-green .select-service, .light-green .price-tag {
    background-color: #ff8a00 !important
}

.skygreen span.checkbox, .skygreen span.checkbox-disabled, .skygreen span.radiobtn {
    border-color: #16a086 !important
}
.blue span.checkbox, .blue span.checkbox-disabled, .blue span.radiobtn {
    border-color: #354a5f !important
}
.skyblue span.checkbox, .skyblue span.checkbox-disabled, .skyblue span.radiobtn {
    border-color: #3598db !important
}
.purple span.checkbox, .purple span.checkbox-disabled, .purple span.radiobtn {
    border-color: #9a59b5 !important
}
.green span.checkbox, .green span.checkbox-disabled, .green span.radiobtn {
    border-color: #5ac95a !important
}
.red span.checkbox, .red span.checkbox-disabled, .red span.radiobtn {
    border-color: #db3462 !important
}
.light-green span.checkbox, .light-green span.checkbox-disabled, .light-green span.radiobtn {
    border-color: #A3B12B !important
}

.skygreen .pricing-service:before, .skygreen.pricing-service:before {
    border-color: #16a086
}
.blue .pricing-service:before, .blue.pricing-service:before {
    border-color: #354a5f
}
.skyblue .pricing-service:before, .skyblue.pricing-service:before {
    border-color: #3598db
}
.purple .pricing-service:before, .purple.pricing-service:before {
    border-color: #9a59b5
}
.green .pricing-service:before, .green.pricing-service:before {
    border-color: #5ac95a
}
.red .pricing-service:before, .red.pricing-service:before {
    border-color: #db3462
}
.light-green .pricing-service:before, .light-green.pricing-service:before {
    border-color: #ff8a00
}

.skygreen span.checkbox:after, .skygreen span.checkbox-disabled:after, .skygreen span.radiobtn:after, .skygreen .question-icon {
    color: #16a086 !important
}
.blue span.checkbox:after, .blue span.checkbox-disabled:after, .blue span.radiobtn:after, .blue .question-icon {
    color: #354a5f !important
}
.skyblue span.checkbox:after, .skyblue span.checkbox-disabled:after, .skyblue span.radiobtn:after, .skyblue .question-icon {
    color: #3598db !important
}
.purple span.checkbox:after, .purple span.checkbox-disabled:after, .purple span.radiobtn:after, .purple .question-icon {
    color: #9a59b5 !important
}
.green span.checkbox:after, .green span.checkbox-disabled:after, .green span.radiobtn:after, .green .question-icon {
    color: #5ac95a !important
}
.red span.checkbox:after, .red span.checkbox-disabled:after, .red span.radiobtn:after, .red .question-icon {
    color: #db3462 !important
}
.light-green span.checkbox:after, .light-green span.checkbox-disabled:after, .light-green span.radiobtn:after, .light-green .question-icon {
    color: #ff8a00 !important
}

span.radiobtn {
	border: 0 !important
}
span.radiobtn input {
	margin-top: 6px !important
}

.pricing-services {
    max-width: 100%;
    width: 930px;
}

.pricing-services .pricing-service {
    margin: 22.5px 30px 30px;
}

/*--===== Colorful Pricing Service END =====--*/