/* Start:/brief/css/style.css?17101503475938*/
:root {
	--main-color: #009da6;
	--error-bg: #f8d7da;
	--error-border: #f5c6cb;
	--error-color: #AB3F49;

	--success-bg: #d4edda;
	--success-border: #d4edda;
	--success-color: #155724;
}

[v-cloak] { display: none; }

.brif-form {
	counter-reset: blocks;
}

.brif-form *::placeholder { color: rgba(0,0,0,.3); }
.brif-form textarea,
.brif-form input {
	height: 35px;
	line-height: 35px;
	border: 1px solid rgba(0,0,0,.15);
	padding: 5px 15px;
	font-size: 1em;
}
.brif-form textarea {
	height: 4.4em;
	padding: 15px;
	line-height: 1.1em;
}


.brif-form button {
	display: inline-block;
	height: 60px;
	line-height: 60px;
	padding: 0 60px;
	font-size: 1.5em;
	border: 0 none;
	background-color: var(--main-color);
	color: #fff;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.brif-block {
	counter-increment: blocks;
	padding: 45px;
	margin: 45px 0;
	border-radius: 15px;
	background: #fff;
	box-shadow: 0 5px 15px rgba(0,0,0,.15);
}
.brif-block h2 {
	position: relative;
	line-height:45px;
	padding: 0 0 15px 50px;
	margin: 0;
}
.brif-block h2:before {
	position: absolute;
	left: 0;
	top: 0;
	content: counter(blocks);
	margin-right: 15px;
	padding: 3px;
	width:35px;
	height:35px;
	line-height:35px;
	border-radius: 50%;
	background-color: rgba(0,0,0,.05);
	font-size: .8em;
	color: rgba(0,0,0,.15);
	display: flex;
	justify-content: center;
	align-items: center;
}

.brif-elements {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 7px;
}

.brif-element {
	display: flex;
	flex-direction: column;
	gap: 7px;
	padding: 20px 0;
	width: 100%;
}

.brif-label {
	padding-bottom: 5px;
	font-size: 1.2em;
	font-weight: 500;
}

.brif-success {
	margin: 25px 0;
	padding: 25px;
	background: var(--success-bg);
	border: 1px solid var(--success-border);
	color: var(--success-color) !important;
	border-radius: 15px;
	box-shadow: 0 5px 15px rgba(0, 0, 0, .15);
	font-size: 1.2em;
	font-weight: 500;
}

.brif-error {
	padding: 5px 15px;
	font-style: italic;
	font-size: .8em;
	border: 1px dotted var(--error-border);
	color: var(--error-color);
}
.error { color: var(--error-color) !important; }
.error-bg { background-color: var(--error-bg) !important; }

.brif-descr {
	padding: 10px 0;
	font-style: italic;
	font-size: .8em;
	font-weight: 400;
}

.brif-phone,
.brif-email,
.brif-text {
	width: 49%;
}

.brif-checkbox,
.brif-readiobox,
.brif-textarea {
	width: 100%;
}

.brif-val-list {
	padding: 15px 0;
	columns: 2;
	width: 100%;
}
.brif-textlist { width: 100%; }
.brif-textlist .brif-val-list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 15px;
}
.brif-textlist .brif-val-list .addtextitem {
	display: block;
	height: 35px;
	padding: 5px;
}

.radiobox span,
.checkbox span { font-size: .8em; font-weight: 400; }

.checkbox {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkbox .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
}

/* On mouse-over, add a grey background color */
.checkbox:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.checkbox input:checked ~ .checkmark {
  background-color: var(--main-color);
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkbox .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.checkbox input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.checkbox .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}


/* Customize the label (the radio) */
.radiobox {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.radiobox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.radiobox .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.radiobox:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.radiobox input:checked ~ .checkmark {
  background-color: var(--main-color);
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.radiobox .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.radiobox input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.radiobox .checkmark:after {
  top: 9px;
  left: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: white;
}

@media (max-width: 890px) {

	.brif-val-list {
		columns: 1;
	}

	.brif-textlist .brif-val-list {
		grid-template-columns: repeat(1, 1fr);
	}

	.brif-phone, .brif-email, .brif-text {
		width: 100%;
	}
}
/* End */


/* Start:/local/templates/flweb/components/bitrix/breadcrumb/default/style.min.css?17811798441*/


/* End */
/* /brief/css/style.css?17101503475938 */
/* /local/templates/flweb/components/bitrix/breadcrumb/default/style.min.css?17811798441 */