img{
    max-width: 100%;
    height: auto;
}
a{
    text-decoration: none;
}
.header{
    background: url("./img/header-bg.png") center no-repeat;
    background-size: cover;
}
.menu {
    padding-top: 60px;
}

.nav__link{
    margin-left: 30px;
    font-size: 18px;
	position: relative;
	color: #b4b4b4; 
	cursor: pointer;
	text-decoration: none; 
}
.nav__link:hover{
    font-size: 18px;
	position: relative;
	color: #a3a2a2; 
	cursor: pointer;
	text-decoration: none; 
}
.nav__link::after {
	display: block;
	position: absolute;
	left: 0; 
	width: 0;
	height: 3px; 
	background-color: #f1cdb3; 
	content: "";
	transition: 0.3s ease-out; 
}

.nav__link:hover::after,
.nav__link:focus::after {
	width: 100%; /*устанавливаем значение 100% чтобы ссылка подчёркивалась полностью*/
}

.need-house__h2 {
    max-width: 340px;
    color: white;
    padding-top: 240px;
    font-family: 'Open Sans', sans-serif;
}
.need-house__text{
    padding-top: 50px;
    font-size: 15px;
    max-width: 460px;
    color: #878584;
}
.need-house__submit-block{
    padding-top: 30px;
    padding-bottom: 150px;
}
.need-house__submit{
    font-size: 18px;
    font-family: 'Open Sans', sans-serif;
    color: #292929;
    background-color: #f1cdb3;
    border: 0;
    border-radius: 30px;
    padding-left: 50px;
    padding-right: 50px;
    padding-top:15px;
    padding-bottom: 15px;
    transition: 1s;
    font-weight: 700;
}
.need-house__submit:hover{
    font-family: 'Open Sans', sans-serif;
    font-size: 18px;
    color: #292929;
    background-color: #fddcc4;
    border: 0;
    border-radius: 30px;
    padding-left: 50px;
    padding-right: 50px;
    padding-top:15px;
    padding-bottom: 15px;
    transition: 1s;
}
.need-house__submit:focus {
outline: none ;
}
.about{
    background-color: #fafafa;
    
}
.about__title {

    color: #545454;
    font-size: 30px;
}
.about__img-block{
    text-align: center;
}
.about__img {
    max-width: 300px;
}
.about-block{
    padding-top: 60px;
    padding-bottom: 80px;
}
.about__text{
    padding-top: 20px;
    font-size: 17px;
    color: #4c4c4c;
    max-width: 470px;
    text-align: justify;
}
.pets {
    background-color: #f6f6f6;
    max-width: 100%;
}
.pets__title{
    font-size: 30px;
    padding-top: 70px;
    padding-bottom: 60px;
    color: #545454;
}
.slider__block {

    width: 270px;
    height: 417px;
    background-color: #fafafa;
}

.slider__title {
    padding-top: 30px;
    font-size: 18px;
    color: #545454;
}
.slider__item {
    padding-left: 50px;
}

.slider__submit {
    font-size: 18px;
    font-family: 'Open Sans', sans-serif;
    color: #292929;
    background-color: #fafafa;
    border: 2px solid #f1cdb3;
    border-radius: 30px;
    padding-left: 50px;
    padding-right: 50px;
    padding-top: 15px;
    padding-bottom: 15px;
    transition: 1s ease-out; 
}
.slider__submit:hover{
    font-family: 'Open Sans', sans-serif;
    font-size: 18px;
    color: #292929;
    background-color: #f1cdb3;
    border: 0;
    border-radius: 30px;
    padding-left: 50px;
    padding-right: 50px;
    padding-top: 15px;
    padding-bottom: 15px;
    transition: 1s ease-out; 
}
.slider__submit:focus {
outline: none ;
}
.pets__submit-block{
    padding-top: 50px;
    padding-bottom: 40px;
}
.pets__submit{
    padding-left: 55px;
    padding-right: 55px;
    padding-top: 15px;
    padding-bottom: 15px;
    font-size: 18px;
    font-family: 'Open Sans', sans-serif;
    color: #292929;
    background-color: #f1cdb3;
    border: 0;
    border-radius: 30px;
    transition: 1s;
    font-weight: 700;
}
.pets__submit:hover{
    font-family: 'Open Sans', sans-serif;
    font-size: 18px;
    color: #292929;
    background-color: #fddcc4;
    border: 0;
    border-radius: 30px;
    transition: 1s;
    padding-left: 55px;
    padding-right: 55px;
    padding-top: 15px;
    padding-bottom: 15px;
}
.pets__submit:focus {
outline: none ;
}
.help{
    background-color: #fafafa;
}
.help__pet-title {
    color: #545454;
    font-size: 18px;
    font-weight: 500;
    padding-top: 25px;
}
.help__row{
    padding-top: 70px;
}
.donation {
    background-color: #f6f6f6;
}
.donation__block{
    padding-top: 70px;
    padding-bottom: 70px;
}
.help__dog-block {
    text-align: end;
}
.help__title{
    font-size: 26px;
    color: #545454;
    font-weight: 500;
    
}
.help__rek {
    color: #545454;
    font-size: 15px;
}
.help__credit-card {
    max-width: 300px;
    background-color: #f1cdb3;
    border-radius: 15px;
    color: #403b37;
    font-size: 17px;
    font-weight: 500;
    
}
.credit__block{
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 20px;
}
.card-nubmer {
    
    padding-left: 15px;
}
.dog {
    height:100%;
   
}
.help__text {
    color: #b2b2b2;
    font-size: 17px;
    font-weight: 600;
    padding-top: 20px;
}
.prev {
    left: -50px;
    
}

.header__dog {
    background: url(img/dog-header.png) center no-repeat;
    height: 100%;
    
}
.contact  {
    background: url(img/bg-footer.png) center no-repeat;
    background-size: cover;
}
.contact__block {
    padding-top: 60px;
    padding-bottom: 68px;
}
.contact__title {
    font-size: 30px;
    color: #ffffff;
    padding-top: 20px;
}
.contact__img{
    padding-top: 35px;
}
.contact__img-block{
    padding-bottom: 15px;
}
.contact__img-block1{
    padding-bottom: 55px;
}
.contact__ep {
    font-size: 17px;
    color: #f1cdb3;
    padding-left: 15px;
}
.contact__img-dog{
    width: 100%;
    padding-top: 60px;
}
.modal__img {
    padding-bottom: 40px;
}
/*~~~~~~~~~~~~~~~~~~~~~~~MEDIA~~~~~~~~~~~~~~~~~~~~~~~~~*/
@media (max-width:1300px) {
    .slider__item {
    padding-left: 135px;
}
@media (max-width:1199px) {
    .slider__item {
    padding-left: 85px;
}
@media (max-width:999px) {
    .slider__item {
    padding-left: 75px;
}
}
@media (max-width:992px) {
    .slider__item {
    padding-left: 45px;
}
}
@media (max-width:767px) {
    .slider__item {
    padding-left: 135px;
}
}
@media (max-width:530px) {
    .slider__item {
    padding-left: 115px;
}
}
@media (max-width:500px) {
    .slider__item {
    padding-left: 105px;
}
}
@media (max-width:465px) {
    .slider__item {
    padding-left: 75px;
}
}
@media (max-width:425px) {
    .slider__item {
    padding-left: 55px;
}
}
@media (max-width:390px) {
    .slider__item {
    padding-left: 40px;
}
}
@media (max-width:370px) {
    .slider__item {
    padding-left: 23px;
}
}
@media (max-width:340px) {
    .slider__item {
    padding-left: 13px;
}
}