/* wszystkie paragrafy*/
@font-face {
    font-family: 'raleway';
    src: url('../fonts/raleway-regular-webfont.woff'), url('../fonts/raleway-regular-webfont.woff2');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'raleway semibold';
    src: url('../fonts/raleway-semibold-webfont.woff'), url('../fonts/raleway-semibold-webfont.woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ralewaylight';
    src: url('../fonts/raleway-light-webfont.woff'), url('../fonts/raleway-light-webfont.woff2');
    font-weight: normal;
    font-style: normal;
}

body {
    font-family: 'raleway', Helvetica, sans-serif;
}
h1, h2 {
    font-family: 'raleway semibold', Helvetica, sans-serif;
}
.container {
    width: 80%;
    margin: 0 auto;
}

.flex {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.green {
    color: #27C7AB;
}
.green_underline {
    border-bottom: 8px solid #27C7AB;
}
.green_filled {
    background-color:#27C7AB;
}

.uppercase {
    text-transform: uppercase;
}



/*header*/
.header {
    background-color: black;
    width: 100%;
    color: white;
    margin: 2px;
    padding: 12px 0;
}
.nav__h, .nav__item--1 {
    font-size: 15px;
}
.nav__h .green {
    font-weight: 900;
}

.nav__list--1 {
    list-style-type: none;
    display: flex;
}

.nav__item--1 {
    padding: 0 20px;
}

.nav__item--1:first-of-type {
    position: relative;
}

.nav__list--2:before {
    content: '';
    display: inline-block;
    text-align: center;
    border-top: 10px solid transparent;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid black;
    position: absolute;
    top: -20px;
    left: 45px;
}

.nav__link:link, .nav__link:visited, .nav__link:hover, .nav__link:active {
    text-decoration: none;
    color: white;
}

#list {
    position: absolute;
    top: 39px;
    left: 4px;
    color: white;
    display: none;
}

.nav__item--2 {
    padding: 11px 18px 0 11px;
    background-color: black;
    letter-spacing: 0.7px;
}
.nav__item--2:last-of-type {
    padding-bottom: 10px;
}

/*.nav__item--1:hover > ul#list {*/
    /*display: block;*/
/*}*/







/*sekcja1*/
.row1 {
    background: linear-gradient(white, lightgrey);
}
.row1_move {
    font-size: 80px;
    width: 5%;
}
.move:link, .move:visited, .move:hover, .move:active {
    text-decoration: none;
}

.row1_text_container {
    width: 45%;
    margin: 136px 5% 119px 0;
}
.row1_h {
    text-align: center;
    font-size: 2.5em;
    margin: 0 0 0.7em 0;
}
.row1_text {
    text-align: center;
    font-size: 0.9em;
    line-height: 1.5em;
    margin-bottom: 28px;
}

.row1_button_container {
    text-align: center;
}

.row1_button {
    border-radius: 11px 11px 11px 11px;
    display: inline-block;
    color: white;
    padding: 10px 25px 10px 40px;
    text-transform: uppercase;
    font-size: 1.5em;
    border: #27C7AB;
}

/*sekcja 1 - slider*/
.slider li{
    margin-top: 70px;
    display: none;
    width: 400px;
    height: 400px;
    position: relative;
}

.slider .visible{
    display: inline-block;
}

.slider li img {
    width: 100%;
}

.slider li:first-child img {
    transform: scale(1.2);
}

.slider li:nth-child(2) img {
    width: 90%;
    position: absolute;
    left: 20px;
}
.slider li:nth-child(3) img {
    transform: scale(1.1);
}






/*row2*/
.row2 {
    padding: 0 0 30px 0;
}
.row2_item {
    width: 329px;
    height: 227px;
    background-color: white;
    margin: 10px 10px 0 0 ;
    position: relative;
    border: 1px solid lightgrey;
}
.row2_item:first-of-type {
    background-color: lightgrey;
    background-image: url('../images/box1_img.jpg');
    background-size: 100%;
    background-repeat: no-repeat;
}

.row2_item:nth-of-type(2) {
    background-color: lightgrey;
    background-image: url('../images/box2_img.jpg');
    background-size: 100%;
    background-repeat: no-repeat;
}

.row2_element {
     background-color: rgba(250, 250, 250, 0.4);
     width: 100%;
     height: 58px;
     padding: 20px 0;
     position: absolute;
     top: 153px;
     left: 0;
}
.row2_item:first-child .row2_h2 {
    width: 138px;
    margin-left: 18px;
    padding: 12px 25px 1px 0;
}
.row2_item:nth-child(2) .row2_h2 {
    width: 140px;
    margin-left: 18px;
    padding: 12px 0 1px 0;
}

.row2_item:not(:nth-child(3)) .row2_h2 {
    position: absolute;
    top: 0;
    left: 0;
}
/*box3 - element z tekstem*/
.row2_item:last-of-type {
    width: 341px;
    height: 254px;
    margin: 35px 0 0 4px;
}
.row2_item:last-child .row2_element:first-child {
    position: absolute;
    left: 0;
    top: 0;
}
/* box3 - header */
.row2_item:last-child .row2_h2 {
    padding: 6px 18px 4px 5px;
    width: 140px;
    margin: 5px 5px 5px 21px;
}

/* box3 - tekst*/
.row2_item:last-child .row2_element:nth-child(2) {
    position: absolute;
    left: 2%;
    top: 25%;
    padding: 6px 18px 4px 5px;
    color: slategrey;
}
.row2_par {
    margin: 10px 10px 10px 10px;
    font-size: 14px;
    line-height: 21px;
}
.row2_par:nth-of-type(2) {
    line-height: 18px;
}




/* row3*/
.row3 {
    background-color: #efefef;
}
.row3_h_container {
    width: 100%;
    height: 100px;
    margin: 0 0 59px 0;
}
.row3_h {
    margin: 20px 0 20px 0;
    padding: 47px 0 6px 7px;
    width: 321px;
    text-transform: uppercase;
    font-size: 21px;
    color: #595959;
}
.row3_item {
    position: relative;
    border: 3px solid lightgrey;
    width: 330px;
    height: 500px;
    background-color: #f4f4f4;
}

.circle1 {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    border: 3px solid lightgrey;
    background: #fafafa;
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}
.circle2 {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: lightgrey;
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
}
.circle3 {
    width: 130px;
    height: 130px;
    border-radius: 50%;
    background: white;
    position: absolute;
    border: 3px solid lightgrey;
    top: 29%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
}
.circle3_element {
    position: absolute;
    font-size: 43px;
    font-weight: 800;
    color: lightgrey;
}
.circle3_element:first-of-type {
    top: 27px;
    left: 38px;
}
.circle3_element:nth-of-type(2) {
    top: 28px;
    left: 64px;
}
.circle3_element:nth-of-type(3) {
    top: 27px;
    left: 92px;
    font-size: 19px;
}
.circle3_element:nth-of-type(4) {
    top: 81px;
    left: 28px;
    font-size: 15px;
}
.row3_header2{
    position: absolute;
    top: 28px;
    left: 50%;
    transform: translate(-50%, 0);
    font-size: 20px;
    letter-spacing: -1.2px;
}
.row3_list_container {
    position: absolute;
    top: 244px;
    width: 100%;
}

.row3_list {
    list-style-type: none;
    width: 100%;
    background-color: pink;
    text-align: center;
}
.row3_list_element {
    padding: 8px 0;
    font-size: 22px;
    color:slategrey;
}


.row3_list:nth-of-type(2n+1) > .row3_list_element:nth-of-type(2n+1) {
    background-color: #dadada;
}
.row3_list > .row3_list_element:nth-of-type(2n) {
    background-color: #ededed;
}

#row3_standard .row3_list_element:nth-of-type(2n+1) {
    background-color: white;
}

#row3_standard {
    background-color: #27C7AB;
    border: 3px solid #27C7AB;
}
#row3_standard .row3_header2 {
    color: white;
}


.row3_button_container{
    position: absolute;
    top: 441px;
    left: 50%;
    transform: translate(-50%, 0);
}

.row3_button {
    padding: 8px 25px 8px 25px;
    font-size: 16px;
    border: #27C7AB;
    border-radius: 8px 8px 8px 8px;
    color: white;
}

#row3_standard .row3_button {
    color: #27C7AB;
    background-color: #fafafa;
}

#row3_standard .circle2 {
    background: #fafafa;
}

#row3_standard .circle1 {
    background: #27C7AB;
    border-color: #27C7AB
}

#row3_standard .circle3 {
    border-color: #27C7AB;
}
#row3_standard .circle3_element {
    color: #27C7AB;
}

#row3_advance .circle3_element:first-of-type {
    top: 25px;
    left: 20px;
}
#row3_advance .circle3_element:nth-of-type(2) {
    top: 28px;
    left: 84px;
    font-size: 15px;
}
#row3_advance .circle3_element:nth-of-type(3) {
    top: 80px;
    left: 26px;
    font-size: 14px;
}




/*row4*/
.row4 .flex {
    align-items: flex-start;
}
.row4_h_container {
    width: 100%;
    height: 90px;
    margin: -18px 0 32px 0;
    font-size: 20px;
    color: #595959;
}
.row4_h {
    padding: 50px 0 7px 1px;
    width: 319px;
    text-transform: uppercase;
}

.row4_item {
    display: inline-block;
    position: relative;
}
.row4_item:first-of-type {
    width: 60%;
}
.row4_item:nth-of-type(2) {
    width: 40%;
    text-align: center;
}
.row4_formitem {
    width: 100%;
    margin: 2% 0;
    padding: 12px;
    border: 1px solid rgba(39,199,171,0.5);
    font-size: 35px;
}


::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: lightgrey;
    opacity: 1; /* Firefox */
    font-family: 'raleway', Helvetica, sans-serif;
    font-weight: 500;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: lightgrey;
    font-family: 'raleway', Helvetica, sans-serif;
    font-weight: 500;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: lightgrey;
    font-family: 'raleway', Helvetica, sans-serif;
    font-weight: 500;
}
textarea {
    height: 191px;
}

.row4_image_container {
    text-align: center;
    margin: -17px 24px 29px 20px;
}

.row4_button_container {
    text-align: center;
    position: absolute;
    top: 279px;
    left: 32px;
}
.row4_button {
    padding: 17px 105px 17px 105px;
    font-weight: 700;
    color: white;
    border-radius: 8px 8px 8px 8px;
    margin: 25px;
    border: 1px solid #27C7AB;
    font-size: 33px;
    letter-spacing: 1px;
}

/* label */
.checkbox_container {
    font-size: 20px;
    width: 400px;
    color: lightgrey;
    display: block;
    position: relative;
    padding-left: 117px;
    margin-bottom: 12px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-align: left;
}

.checkbox_container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.checkmark {
    position: absolute;
    top: 0;
    left: 58px;
    height: 50px;
    width: 50px;
    border: 1px solid rgba(39,199,171,0.5);
}

.checkmark:after {
    content: "\2714";
    position: absolute;
    display: none;
}

.checkbox_container input:checked ~ .checkmark:after {
    display: block;
}

.checkbox_container .checkmark:after {
    left: 5px;
    top: 0;
    width: 20px;
    height: 50px;
    font-weight: 900;
    font-size: 38px;
    color: #27C7AB;
}



/*footer*/
footer {
    color: gray;
}
footer span {
    font-weight: 900;
}

.footer_info {
    text-transform: capitalize;
    width: 40%;
    display: inline-block;
    letter-spacing: 1.1px;
    font-size: 15px;
}
.footer_empty {
    width: 213px;
    display: inline-block;
    height: 20px;
}

.footer_images {
    padding: 0 20px;
    width: 19%;
    display: inline-block;
    background: transparent;
}

.footer_logo {
    padding: 5px;
    width: 168px;
    display: inline-block;
    font-size: 20px;
    letter-spacing: 1.1px;
}


/*application section*/
.application {
    font-family: Arial, Verdana, sans-serif;
    background-color: #f9f9f9;
    padding:30px 0;
}
.application h3 {
    color: #575757;
    font-size: 18px;
}

.application header.align_right{
    text-align: right;
}

.inline {
    display:inline-block;
    width:300px;
    padding:14px;
    vertical-align: top;
}

.form {
    margin-top:50px;
}

.drop_down_list {
    border:1px solid #8de0d2;
    width: 280px;
    height:38px;
    background-color: white;
    margin-top:22px;
    padding: 8px 12px;
    position: relative;
}

.list_label {
    font-size: 20px;
    color: #e2e2e2;
    font-family: 'ralewaylight', Arial, Tahoma, sans-serif;
}

.checkbox {
    position: relative;
    padding: 30px 30px 30px 0;
}
.checkbox input {
    display: block;
    opacity: 0;
    height: 48px;
    position: absolute;
    width: 48px;
    cursor: pointer;
}

.checkbox label {
    display: block;
    padding-left: 65px;
    position: relative;
    font-size: 28px;
    color: #cecece;
    line-height: 120%;
    padding-top: 10px;
    cursor: pointer;
}

.checkbox label::before, .checkbox label::after {
    border: 1px solid #27c7ab;
    content: "";
    display: block;
    left: 0;
    height: 48px;
    position: absolute;
    width: 48px;
    top: 0;
}
.checkbox label::after {
    background: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20preserveAspectRatio%3D%22xMidYMid%22%20width%3D%2233.875%22%20height%3D%2233%22%20viewBox%3D%220%200%2033.875%2033%22%3E%0A%20%20%3Cpath%20d%3D%22M9.470%2C15.209%20L14.061%2C24.104%20C14.061%2C24.104%2021.522%2C6.026%2033.287%2C-0.000%20C33.000%2C4.304%2031.852%2C8.035%2033.861%2C12.626%20C28.696%2C13.774%2018.078%2C26.687%2014.635%2C33.000%20C9.756%2C26.974%204.017%2C22.382%20-0.000%2C20.948%20L9.470%2C15.209%20Z%22%20fill%3D%22%2327c7ab%22/%3E%0A%3C/svg%3E%0A") no-repeat center;
    border: 0;
    display: none;
}

.checkbox input:checked + label::after {
    display: block;
}


/*.active {*/
    /*background: url('../images/form_ok.jpg');*/
    /*width: 48px;*/
    /*height: 40px;*/

/*}*/


/*.inline_text {*/
    /*display: inline-block;*/
    /*width: 228px;*/
    /*vertical-align: top;*/
    /*margin-top: 30px;*/
    /*margin-left: 15px;*/
    /*color: #aeaeae;*/
/*}*/
.image_part img{
    margin-top: 110px;
    margin-left: 38px;
}


.application .green_bell {
    background-color: #24baa0;
    width: 200px;
    height: 6px;
    display: inline-block;
    margin: 5px 0 5px 0;
}

.summary_panel {
    background-color: white;
    width:100%;
    height:195px;
    padding:10px;
    margin-top: 50px;

}

.application .green_button {
    background-color: #27c7ab;
    color: white;
    text-align:center;
    text-transform: uppercase;
    width: 200px;
    padding: 10px 30px;
    font-size: 24px;
    display: inline-block;
    font-family: 'ralewaymedium', Arial, Tahoma, sans-serif;
    margin-top: 20px;
    margin-left: 29px;
    border-radius: 8px;
    text-decoration: none;
}
.panel_left {
    display: inline-block;
    width: 150px;
    vertical-align: top;
    padding-bottom:10px;
    border-bottom:1px solid #e7e7e7;
    height: 135px;
}

.panel_right {
    display: inline-block;
    width: 70px;
    border-left:1px solid #e7e7e7;
    text-align: right;
    vertical-align: top;
    padding-bottom:10px;
    border-bottom:1px solid #e7e7e7;
    height: 135px;
}

.panel_left h4 , .panel_right h4{
    color: #24baa0;
    font-size: 21px;
}

.panel_left span{
    margin-top:7px;
    font-size: 16px;
    color: #5b5a5a;
    display: block;
}

.panel_right span {
    display: block;
    font-size: 16px;
    color: #24baa0;
    margin-top:10px;
}
.sum_label{
    display: inline-block;
    width: 150px;
    margin-top: 10px;
    font-size: 22px;
    color: #5b5a5a;
}

.sum {
    display: inline-block;
    width: 70px;
    text-align: right;
    margin-top: 10px;
    font-size: 22px;
    color: #24baa0;
}

.list_arrow {
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid #24baa0;
    display:block;
    position: absolute;
    right: 14px;
    top: 10px;
    cursor: pointer;
}

.list_panel {
    background-color: white;
    border: 1px solid #ccc;
    width: 288px;
    padding-left: 15px;
    padding-bottom: 10px;
    list-style: none;
    margin: 0;
    left: 0px;
    z-index: 2;
    position: absolute;
    top: 54px;
    display:none;
}
.list_panel li {
    margin-top:10px;
    cursor: pointer;
    color: #585858;
}

.title {
    height: 30px;
}
