@font-face {
    font-family: 'Noto Sans';
    src: url('/css/notosansregular.ttf') format("truetype");
}

/* Global Styles */
 html,
 body {
 	height: 100%;
 	font-family:  'Noto Sans', 'Open Sans', 'Droid Sans', sans-serif;
 	font-size: 12pt;
 }

 .well-header {
     border-radius: 0;
 }

.campaign-well .blog-post-date,
 .blogpost-well .blog-post-date {
    margin-top: -5px;
    font-size: 95%;
 }

 .container {
     text-align: left !important;
 }

 .popover {
     font-family:  'Open Sans', 'Droid Sans', sans-serif;
     font-size: 11pt;
 }

 /* These two classes are a workaound to fix the content move when displaying a modal */
 .modal-open {
	padding-right: 0 !important;
 }

 .scroll-body {
	overflow-y: scroll !important;
 }
 /****/

 body {
 	padding-top: 84px; /* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
 }

 body p {
     line-height: 1.5em;
 }

 label {
     font-size: 95%
 }

footer {
	position: relative;
	bottom: -10px;
}

 .navbar-inverse {
	-webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, .2) !important;
	-moz-box-shadow: 0 3px 7px rgba(0, 0, 0, .2) !important;
	box-shadow: 0 3px 7px rgba(0, 0, 0, .2) !important;
}

 .navbar-default .navbar-nav>.active>a,
 .navbar-default .navbar-nav>li>a:hover {
 	color: #2D659D;
 	background-color: #e7e7e7;
 }

 .navbar-inverse .navbar-nav > li[id$='-section'] {
	 margin-left: .1em;
     border-bottom-width: 5px;
     border-bottom-style: solid;
     border-bottom-color: #222;
 }

 .navbar-inverse .navbar-nav > li[id$='-section'].active,
 .navbar-inverse .navbar-nav > li[id$='-section']:hover {
	 border-bottom-width: 5px;
	 border-bottom-style: solid;
 }

 .navbar-inverse .navbar-nav >li#home-section.active,
 .navbar-inverse .navbar-nav >li#home-section:hover {
	 border-bottom-color: #7CAAE8;
 }

 .navbar-inverse .navbar-nav >li#blog-section.active,
 .navbar-inverse .navbar-nav >li#blog-section:hover {
	 border-bottom-color: #92C760;
 }

.navbar-inverse .navbar-nav >li#download-section > a{
	color: #fff686;
	font-weight: bold;
}

 .navbar-inverse .navbar-nav >li#download-section.active,
 .navbar-inverse .navbar-nav >li#download-section:hover {
	 border-bottom-color: #CE4043;
 }

 .navbar-inverse .navbar-nav >li#screenshots-section.active,
 .navbar-inverse .navbar-nav >li#screenshots-section:hover {
	 border-bottom-color: #27A4BE;
 }

 .navbar-inverse .navbar-nav >li#support-section.active,
 .navbar-inverse .navbar-nav >li#support-section:hover {
	 border-bottom-color: #F2B760;
 }

 .navbar-inverse .navbar-nav >li#about-section.active,
 .navbar-inverse .navbar-nav >li#about-section:hover {
	 border-bottom-color: #AFACAE;
 }

/* .navbar-inverse .navbar-nav >li#campaign-section > a {
	color: #fff686;
} */

.navbar-inverse .navbar-nav >li#campaign-section > a{
    color: #7CAAE8;
    font-weight: bold;
}

.navbar-inverse .navbar-nav >li#campaign-section.active,
.navbar-inverse .navbar-nav >li#campaign-section:hover {
	border-bottom-color: #fff686;
}

.navbar-right .dropdown-menu {
    right: unset;
}

.navbar-nav> li >.dropdown-menu > li {
	font-size: 12pt;
	padding-bottom: .2em;
}

.navbar-inverse .navbar-nav > li.dropdown:hover .dropdown-menu {
	display:block;
}

.navbar-absolute-top {
    position: absolute !important;
}

.feature-text {
    margin-top: 1.5em;
}

td > p.feature-text {
    margin-top: 1em;
    margin-left: 1.8em;
    margin-right: 0.5em;
    font-size: 90%;
}

.features-table td  {
	vertical-align: middle;
}

#campaign-text > p,
#campaign-text > p > p {
	font-size: 13pt !important;
	margin-bottom: 1.5em;
	line-height: 1.5em !important;
}

 .campaing-progress {
	 min-height: 30px !important;
     background-color: #d0d0d0;
 }

 .campaing-percentage {
     color: white;
     font-size: 14pt;
 }

 .campaing-progress .progress-bar {
     /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1e5799+0,2989d8+50,7db9e8+100 */
     background: #7db9e8; /* Old browsers */
     background: -moz-linear-gradient(left,  #1e5799 0%, #7db9e8 100%); /* FF3.6-15 */
     background: -webkit-linear-gradient(left,  #1e5799 0%, #7db9e8 100%); /* Chrome10-25,Safari5.1-6 */
     background: linear-gradient(to right,  #1e5799 0%, #7db9e8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=1 ); /* IE6-9 */
 }

.campaing-goal {
	font-size: 18pt;
	margin-top: 0em !important;
}

 .campaing-donor-counter {
	 margin-right: .8em;
 }

 .no-bottom-margin {
	margin-bottom: 0 !important;
 }

 .source-code {
   font-family: monospace, "Courier New",Menlo,Monaco,Consolas;
 	font-size: 12pt;
 }

 .page-body {
    min-height: 100%;
 }

 .brand-logo {
 	height: 180px;
 	margin-right: 1.5em;
 }

 .brand-logo-sm {
 	height: 80px;
 	margin-right: 1.8em;
 }

 .brand-name {
 	height: 45px;
    margin-top: 0.25em;
 }

 .brand-subname,
 .brand-subname-sm {
 	color: #fff;
 	margin-top: 3em;
 }

 .brand-subname {
 	margin-left: 9.75em;
 }

 .brand-subname-sm {
 	margin-left: 4.5em;
 }

 .nav {
 	font-size: 12pt;
 }

 .img-portfolio {
 	/*margin-bottom: 30px;*/
 }

 .img-hover:hover {
 	opacity: 0.8;
 }

 footer a {
 	color: #2D659D;
 }

 footer p {
 	color: #222;
 }

 footer a:hover {
 	color: #2D659D;
 	text-decoration: none;  
 }

 .sns-link {
 	margin-left: 1em;
 	color: #333;
 }

 .sns-link img {
     max-height: 35px;
 }

 .sns-links {
 	margin-top: .6em;
 }

 .well .page-header {
 	margin: 0 0 20px 0;
 	border: transparent;
 }

 .panel-version {
 	margin-top: 2em;
	min-height: 216px;
 }

 .panel-version h3 {
	margin-top: 0;
 }

.panel-version h2 {
	margin-bottom: 0;
}

 /* .panel-version h4 small,
 .panel-version h4 small em {
 	margin-left: .3em
 } */

.panel-version .panel-body {
	min-height: 160px !important
 }

 .ss-cover {
	 margin-top: 1.2em;
 }

 .mandatory-label {
	 font-size: 80%;
	 color: dimgray;
 }

 /* Footer Styles */
 footer {
 	font-size: 11pt;
 	color: white;
 	padding-top: 10px;
 	padding-bottom: 0px;
	background-color: #d9edf7;
 	border-top: 1px solid #bce8f1;
 }

 /* Home Page Carousel */
 header.carousel {
 	height: 50%;
 }

 header.carousel .item,
 header.carousel .item.active,
 header.carousel .carousel-inner {
 	height: 100%;
 }

 header.carousel .fill {
 	width: 100%;
 	height: 100%;
 	background-position: top;
 	border-bottom: 1px solid #a0a0a0;
 }

 .orange-text {
 	color:orange
 }

 .yellow-text {
 	color: #fbe53d;
 }

 .green-text {
 	color:green;
 }

 .carousel-caption h1 a {
    color:#4AA5FF;
 }

 .blue-text {
 	color:#337ab7;
 }

 .carousel-caption h1 a:hover {
 	text-decoration:none;
 	color: #4ED0FF;
 }

 .carousel-caption {
 	padding-bottom: 8%;
 }

 .carousel-caption-bg {
 	border-radius: .35em;
 	background-color: rgba(51, 122, 183, 0.75);
 	padding: 5px 10px 5px 10px;
 }

 .carousel-caption h4 {
 	color:#f0f0f0;
 	font-style: italic;
 }

 span.carousel-caption-bg a {
 	text-decoration: none;
 }

 .carousel-indicators li {
 	border-color: #303030;
 	background-color: #fafafa;
 }

 .carousel-indicators .active {
 	background-color: rgba(100,100,100,.65);
 }

 .carousel-caption p span {
     margin-top: .2em !important;
 }

#ss-carousel .carousel-control {
    width: 5% !important;
}

 .panel-min-h {
 	min-height: 245px;
 }

 .page-header,
 .blog-post-title,
 .blog-post-section,
 .header {
 	color: #2D659D;
 }

 .page-header small {
 	font-size: 65%;
 	font-style: italic;
 	margin-left: 2.5em;
 }

 .blog-post {
 	margin-bottom: 2em;
 }

 .blog-post-summary {
 	font-size: 12pt;
	 margin-top: .5em;
     line-height: 1.5em;
    text-align: left;
 }

 .blog-post-text p {
    font-size: 12pt;
    margin-bottom: 1.0em;
    line-height: 1.5em;
 }

.blog-post-text td {
    border: 1px solid gray;
    padding: .5em;
}

.blog-post-text th {
    border: 1px solid gray;
    padding: .5em;
}

.blog-post-text table {
    border: 1px solid gray;
    margin: auto;
}

 .blog-post-section,
 .blog-post-title {
 	padding-bottom: 9px;
 	margin: 40px 0 20px;
 	border-bottom: 1px solid #eee;
    font-size: 125%;
 }

 .blog-post-title small {
 	font-size: 70%;
 	font-style: italic;
 	margin-left: 2.2em;
 }

.blog-post-section {
    font-size: 110%;
}

 .blog-post-author {
 	margin: auto;
 	color: #505050;
 	font-style: italic !important;
    font-size: 85%;
 }

 .blog-post-footer {
 	margin-top: 2em;
 	padding-bottom: 1em;
 }

 .blog-footer {
 	padding-bottom: 1.5em;
 	padding-top: 1.5em;
 	border-top: 1px solid #eee;
 }

 .panel-footer-info {
 	background-color: #d9edf7;
 	border-color: #bce8f1;
 }

 .blogpost-well {
     background-color: #f6fcff;
     border-color: #bce8f1;
 }

 .campaign-well,
 .panel-footer-warning {
 	background-color: #fcf8e3;
 	border-color: #faebcc;
 }

 .footer-btn-group {
 	margin-left:1em;
	margin-right:1em;
 	padding-top: .7em;
 	padding-bottom: .7em;
 }

 .well-min-h {
 	min-height: 169px;
 }

 .well-min-h:hover {
 	cursor: pointer;
 }

.btn-icon-xs {
    height: 24px;
    width: 24px;
}

 .btn-icon-sm {
 	height: 32px;
 	width: 32px;
 }

 .btn-icon-md {
 	height: 44px;
 	width: 44px;
 }

 .btn-icon-lg {
	 height: 56px;
	 width: 56px;
 }

.btn-icon-xg {
	height: 64px;
	width: 64px;
}

 .btn-bottom {
	 position: relative;
	 top: 25px;
	 left: 0%;
 }

 .header {
 	margin-top: 1.5em;
 	margin-bottom: 1em;
 }

 .well .header {
 	margin-top: 0;
 }

 #helpMenu.download {
     postion: relative;
     left: 215px;
 }

 #helpMenu.issues {
     postion: relative;
     left: 110px;
 }

  /* 404 Page Styles */
 .http-error {
     font-size: 36pt !important;
     color: red;
 }

 /* Pricing Page Styles */

 .price {
 	display: block;
 	font-size: 50px;
 	line-height: 50px;
 }

 .price sup {
 	top: -20px;
 	left: 2px;
 	font-size: 20px;
 }

 .period {
 	display: block;
 	font-style: italic;
 }

 .navbar-fixed-top .nav {
 	padding: 15px 0;
 }

 .navbar-fixed-top .navbar-brand {
 	padding: 0 15px;
 }

 .spinner {
 	max-width: 200px;
 }

 .spinner-input {
 	text-align: right;
 	padding-right: 0;
 }

 .spinner-plus {}
 .spinner-minus {}

 .spinner .input-group-addon {
 	padding: 0 5px 0 5px;
 }

 .toggle-group {}

 .btn-toggle {
 	background-color: white;
 }

 .btn-profile {
	padding: 4px;
 }

 .well-min-h:hover,
 .btn-toggle:hover,
 .btn-checked {
 	background-color: #d9edf7;
 	border-color: #bce8f1;
 }


.btn-pkg-checked {
	background-color: #5cb85c;
	border-color: #4E9C4E;
}


 .currency {
 	text-align: center;
 	color:#4AA5FF;
 	font-size: 18pt;
 	font-weight: bold;
 	padding: 5px 5px 5px 0;
 }

 .currency ul {
 	font-size: 9pt;
 	text-align: left;
 	list-style-type: none;
 	color: #303030;
 	font-weight: normal;
 }

 .currency .singlePrice {
	 margin-left: -2.5em;
 }

 .currency .otherPrice {
 	font-size: 10.0pt;
	margin-left: -2em;
 }

 .currency hr {
	margin-bottom: .2em;
	margin-top: .2em;
 	border-color: #dadada;
 }

 .modal-scroll-body {
 	max-height: calc(100vh - 200px);
 	overflow-y: auto;
 }

 .search-box {
 	margin: 2em 0 0 0;
 }

.search-box * {
    margin: 0;
}

.search-box > .col-md-12 {
    padding: 0;
    margin: 0;
}

 p.carousel-caption-bg {
     display: inline-block !important;
 }

 #blog-archive .panel-body {
 	padding: 0;
 	margin-bottom: 0;
 }

 #blog-archive .list-group-item {
 	border: none;
 }

 #blog-archive .list-group-item:first-child {
 	border-radius: 0;
 }

 #blog-archive .list-group-item:hover, 
 #blog-archive .active {
 	background-color: #d9edf7;
 	color: #31708f;
 }

 .blog-post-date {
	 margin-top: 42px;
	 font-size: 95%;
	 padding: 5px;
	 border-top: 3px solid green;
	 color:green;
 }

 .ss-description {
 	margin-top: .1em;
 	margin-bottom: 2em;
 }

 .carousel-inner .thumbnail {
 	margin-bottom: 0;
 }

 .carousel-caption p {
 	font-size: 14pt;
 }

 .note {
 	font-size: 95%;
 	font-style: italic;
 }

 .code {
 	font-family: "Source Code Pro", monospace, "Courier New",Menlo,Monaco,Consolas;
 	border: 1px solid #ccc;
 	border-radius: 4px;
 	padding: 1em;
 	background-color: #f5f5f5;
 	color: #333;
 	margin-top: .8em;
 }

 .terms-area {
     font-family: "Source Code Pro", monospace, "Courier New",Menlo,Monaco,Consolas !important;
	 border: none;
	 margin: 0;
     padding: 10px 10px 10px 10px;
     font-size: 11.5pt !important;
     background-color: #f5f5f5;
 }

 .well pre {
 	font-family: "Source Code Pro", monospace, "Courier New",Menlo,Monaco,Consolas;
    font-size: 95%;
 	margin: 0;
 	margin-top: 1.5em;
 	padding: 0;
 	border: none;
 	background-color: transparent;
 }

 .pkg-listing .alert {
	 margin-top: 0em;
	 margin-bottom: 0;
 }

 .pkg-listing {
	 /*margin-bottom: 0;*/
 }

 .form-painel {
	 min-height: 200px;
 }

 .modal-iframe {
	 width: 100%;
	 height: 100%;
	 margin: 0;
	 padding: 0;
	 border: hidden;
 }

 .min-h-500 {
     min-height: 500px;
 }

 .min-h-350 {
     min-height: 350px;
 }

 .modal-iframe-body {
	 padding: 5px 15px 0 15px;
	 margin-left: auto;
	 margin-right: auto;
 }

 .modal-terms {
	 width: 100%;
	 height: 100%;
	 padding-bottom: 0;
 }

 .slider-resposive {
	 margin-left: .5em !important;
	 width: 95% !important;
 }

 .slider-track {
	 background: white !important;
	 border: 1px solid #e0e0e0 !important;
 }

 .slider-selection {
	 background: #4AA5FF !important;
 }

 .slider-handle {
	 background: linear-gradient(45deg, #FCD852, #FFF37E) !important;
	 border: 1px #EAAB4C solid !important;
	 min-height: 22px;
	 min-width: 22px;
	 top: -2px;
 }

 .slider-handle-icon {
	 color: #D29A46;
	 position: relative;
	 left: .01em;
	 top: -1px;
 }

 .mb-progress {
    font-size: 85%;
    color: #808080;
    margin: auto !important;
 }

 .testimonial {
	 font-size: 105%;
 }

 .testimonial-img {
	 height: auto;
	 width: 128px !important;
 }


.btn-file {
	position: relative;
	overflow: hidden;
}

.btn-file input[type=file] {
	position: absolute;
	top: 0;
	right: 0;
	min-width: 100%;
	min-height: 100%;
	font-size: 100px;
	text-align: right;
	filter: alpha(opacity=0);
	opacity: 0;
	outline: none;
	background: white;
	cursor: inherit;
	display: block;
}

 #donationForm .panel {
	 margin-bottom: 0;
 }

 #donationForm .panel .panel-body{
	 padding-bottom: 0;
 }

 .recaptcha-container {
     margin-left: 1em;
     margin-bottom: 1em;
     margin-top: -.7em;
 }

 .alert-container .alert {
     margin: 0;
     margin-top: 1em;
 }

 .image-in-wrap-text {
     margin: 0;
     margin-right: 12px;
     margin-bottom: 10px;
 }

 .img-center,
 .img-preview {
     margin: auto !important;
 }
 
 .img-preview {
     max-width: 65%;
     margin-bottom: 1.5em !important;
 }

 .img-preview:hover {
     cursor:pointer;
 }

 .blog-post .alert {
     margin-top: .5em;
 }

 .keyword {
     color:#337ab7;
     background-color: #f8fc6b;
     border-radius: .25em;
     padding-left: .2em;
     padding-right: .2em;
     font-weight: bold;
     font-size: 110%;
 }

 .comment-box {
     min-height: 70px;
 }

 .comment-box h4 {
     margin-top: 0;
     margin-bottom: 1em;
 }

 .comment-box .form-group:last-child {
     margin-bottom: 0;
     margin-top: .9em;
 }

 .comment-box .panel-body p {
     margin-bottom: 0;
 }

 .author-reply {
     background-color: #FEFFF6;
 }

.payment-info-modal {
     font-size: 120%;
 }

 .char-counter {
     font-size: 90%;
     color: #555;
 }

 .blog-post-separator {
     max-width: 100px;
     border: 1px solid lightgray;
 }

#testimonial-carousel > .carousel-control {
	width: 5%;
	background-image: none;
}

#testimonial-carousel > .carousel-control {
	color: #2D659D;
}

.panel-body.source-code {
    padding: 0px;
}

.panel-body > pre {
    margin: 0px;
    border: 0;
    border-top: 1px solid #ddd;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}

.paypal-btn {
    background-repeat: no-repeat;
    background-position: center;
    background-size: 103px 50px;
    min-height: 50px;
    min-width: 215px;
    background-color:#009cde;
    border-radius:12px;
    border: 0;
    padding: 10px;
    background-image: url(/img/paypal.svg);
}

 /* Responsive Styles */
@media(min-width:1200px) {
     header.carousel .fill {
        width: 100%;
        height: 100%;
        background-position: top;
        background-size: cover;
        border-bottom: 1px solid #a0a0a0;
    }
}

 @media(max-width:1199px) {
 	 .brand-logo,
     .brand-logo-sm {
         height: 80px;
         margin: 0;
     }

     .brand-name {
         height: 40px;
         margin-left: 1.5em;
     }

     .brand-subname,
     .brand-subname-sm {
         margin-left: 4.2em;
         margin-top: 3em;
     }

     header.carousel .fill {
         width: 100%;
         height: 100%;
         background-position: top;
         background-size: cover;
         border-bottom: 1px solid #a0a0a0;
     }
 }


 @media(min-width:768px) {
 	.navbar-fixed-top .navbar-brand {
 		padding: 5px 0;
 	}

	 .blog-post-comments .col-md-10 {
		 padding-left: 0 !important;
	 }

	 .blog-post-comments .level-0{
		 margin-left: -3.8em;
	 }

	 .blog-post-comments .level-1{
		 margin-left: 4em;
	 }

	 .blog-post-comments .level-2{
		 margin-left: 11.8em;
	 }

     header.carousel p.carousel-caption-bg {
         font-size: 165%;
     }

     /* Centering the modal vertically
    Source: https://css-tricks.com/centering-in-the-unknown/ */
     .modal {
         text-align: center;
         padding: 0 !important;
     }

     .modal-md {

     }

     .modal:before {
         content: '';
         display: inline-block;
         height: 100%;
         vertical-align: middle;
         margin-right: -4px;
     }

     .modal-dialog {
         display: inline-block;
         text-align: left;
         vertical-align: middle;
     }

	 #keyRecoveryModal .modal-dialog {
		 min-width: 660px;
	 }

	 #testimonialModal .modal-dialog {
		 min-width: 720px;
	 }
 }

 @media(max-width:767px) {
	header {
	 margin-top: -.2em !important;
	}

 	header.carousel .carousel {
 		height: 70%;
 	}

 	.navbar-fixed-top .navbar-brand {
 		padding: 5px 5px;
 	}

 	.navbar-header {
 		height: 80px;
 	}

 	.brand-logo,
 	.brand-logo-sm {
 		height: 72px;
 		margin: 0;
 	}

 	.brand-name {
 		height: 40px;
 		margin-left: 0em;
 	}

 	.brand-subname,
 	.brand-subname-sm {
 		margin-left: 4.75em;
 		margin-top: 3em;
 	}

 	.carousel-caption-bg {
 		font-size: 70%;
 	}

     .carousel-caption h1 {
         font-size: 160%;
     }

     .carousel-caption h4 {
         font-size: 130%;
     }
 }

@media(max-width:991px) {
	header {
		margin-top: 5.3em;
	}
}
