Не работают медиа-запросы в CSS3

119
05 июля 2021, 03:40

Столкнулся с такой проблемой: учусь верстать сайты, после того как сверстал страницу, решил попрактиковаться с адаптивностью, начал писать медиа-запросы, они никак не подсвечиваются в синтаксисе и соответственно не работают(пишу в NotePad++, пока его хватает) В гугле по вопросу ничего не нашел, или плохо искал, скорее всего второе, там насчет этого только проблемы с мобильной адаптивностью.

HTML

    <section class = "say_hello">
            <div class = "container_say_hello">
                <h3>SAY HELLO!</h3>
                <form action = "/" method = "">
                    <input id = "in_1" type = "text" name = "name_user" maxlength = "21" placeholder = "Name">
                    <input id = "in_2" type = "text" name = "email_user" maxlength = "30" placeholder = "Email">
                    <textarea name = "message" placeholder = "Message"></textarea>
                    <input id = "in_3" type = "submit"  name = "sub" value = "SEND"></br>
                    <img id = "send_img" src = "items/img/send_button.png" alt = "картинка">
                </form>
                <hr id = "hr" size = "2" >
                <h5>2017. All Right Reserved<h5>
                    <a href = "#"><div class = "contact_us_1"><img src = "items/img/facebook.png" alt = "картинка"></div></a>
                    <a href = "#"><div class = "contact_us_2"><img src = "items/img/twitter.png" alt = "картинка"></div></a>
                    <a href = "#"><div class = "contact_us_3"><img src = "items/img/linked.png" alt = "картинка"></div></a>
                    <a href = "#"><div class = "contact_us_4"><img src = "items/img/google.png" alt = "картинка"></div></a>
                    <a href = "#"><div class = "contact_us_5"><img src = "items/img/be.png" alt = "картинка"></div></a>
                    <a href = "#"><div class = "contact_us_6"><img src = "items/img/zemla.png" alt = "картинка"></div></a>
            </div>
        </section>

CSS

@media  and (max-width: 940px){
    .container_say_hello{
    width: 1170px;
    border: 2px solid red;
    height: inherit;
    margin: 0 auto;
    position: relative;
    margin-bottom: 0;
    }   
}

Полные Html и Css файлы

html,body,p { 
	padding: 0; 
	margin:0; 
	 
} 
 
header{ 
	height: 751px; 
	width: 100%; 
	background: url(../items/img/head_background.png) no-repeat center; 
	background-size: cover; 
	 
} 
.header_wrapper{ 
	width: 1170px; 
	height: inherit; 
	margin: 0 auto; 
	position: relative; 
	 
	 
} 
 
.head_logo{ 
	height: 70px; 
	width: 100px; 
	display: inline-block; 
} 
.logo_img{ 
	float: left; 
	clear: both; 
	margin-top: 16px; 
	margin-left: 37px; 
} 
.logo_name_1{ 
	float: left; 
	clear: both; 
	font-family: 'Lato'; 
	font-weight: 300; 
	font-size: 14.15pt; 
} 
 
.logo_name_2{ 
	float: left; 
	clear: both; 
	font-family: 'Lato'; 
	font-weight: 400; 
	font-size: 3.54pt; 
	margin-left: 34px; 
	line-height: 5px; 
} 
 
.head_menu{ 
	text-decoration: none; 
	float: right; 
	margin-top: 15px; 
	 
} 
.head_menu li{ 
	display: inline; 
	color: #4d4d4d; 
	font-family: 'Asap'; 
	font-weight: 400; 
	padding-right: 38px; 
	 
} 
#contact{ 
	padding-right: 0px; 
} 
a:link{ 
	text-decoration: none; 
	position: relative; 
} 
a:visited{ 
	text-decoration: none; 
} 
a:active{ 
	text-decoration: none; 
} 
 
.head_menu li a{ 
	color: #4d4d4d; 
	 
} 
.head_menu li a:before{ 
	content: ''; 
	top: 20px; 
	position: absolute; 
	width: 0%; 
	height: 3px; 
	background-color: #4d4d4d; 
	 
} 
.head_menu li a:hover:before{ 
	width: 100%; 
	 
} 
 
.main_head{ 
	display: inline-block; 
	position: absolute; 
	left: 0px; 
	top: 150px; 
	 
} 
.main_head h1{ 
	font-family: 'Asap'; 
	font-weight: 500; 
	font-size: 66pt; 
	color: #4d4d4d; 
	margin-left: -5px; 
	 
} 
.main_head h2{ 
	font-family: 'Asap'; 
	font-weight: 500; 
	font-size: 16.6pt; 
	color: #9a9a9a; 
	margin-top: -60px; 
	 
} 
 
.head_guy{ 
	position: absolute; 
	top: 100px; 
	right: 0px; 
} 
 
.know_more{ 
	position: absolute; 
	bottom: 325px; 
	font-family: 'Asap'; 
	font-weight: 500; 
	left: 20px; 
	border: 1px solid black; 
	padding-top: 20px; 
	padding-bottom: 20px; 
	padding-left: 30px; 
	padding-right: 30px; 
	transition: background, border 0.3s; 
} 
.know_more a{ 
	color: #4d4d4d; 
} 
.hire_me a{ 
	color: #4d4d4d; 
} 
.hire_me{ 
	position: absolute; 
	bottom: 325px; 
	left: 225px; 
	font-family: 'Asap'; 
	font-weight: 500; 
	border: 1px solid black; 
	padding-top: 20px; 
	padding-bottom: 20px; 
	padding-left: 45px; 
	padding-right: 45px; 
	transition: background, border, 0.3s; 
} 
.know_more:hover{ 
	background: white; 
	color: black; 
	border-color: white; 
	-webkit-box-shadow: 0px 13px 15px -12px rgba(0,0,0,0.46); 
	-moz-box-shadow: 0px 13px 15px -12px rgba(0,0,0,0.46); 
	box-shadow: 0px 13px 15px -12px rgba(0,0,0,0.46); 
} 
.hire_me:hover{ 
	background: white; 
	color: black; 
	border-color: white; 
	-webkit-box-shadow: 0px 13px 15px -12px rgba(0,0,0,0.46); 
	-moz-box-shadow: 0px 13px 15px -12px rgba(0,0,0,0.46); 
	box-shadow: 0px 13px 15px -12px rgba(0,0,0,0.46); 
 
} 
 
.about_me{ 
	width: 1170px; 
	height: 578px; 
	margin: 0 auto; 
	position: relative; 
} 
 
.about_me h3{ 
	font-family: 'Asap'; 
	font-weight: 700; 
	font-size: 46px; 
	color: #7c7c7c; 
	letter-spacing: 9px; 
	width: 500px; 
	position: relative; 
	margin-top: 178px; 
	margin-bottom: 0; 
} 
.about_me h3:before{ 
	content:''; 
	top: -10px; 
	left: 4px; 
	width: 60px; 
	border-top: 4px solid #7c7c7c; 
	position: absolute;	 
} 
.about_me p{ 
	font-family: 'Asap'; 
	font-weight: 400; 
	font-size: 16px; 
	color: #4d4d4d; 
	width: 470px; 
	line-height: 1.5;	 
	margin-bottom: 40px; 
}	 
.buttom_download{ 
	border: 1px solid black; 
	width: 200px; 
	text-align: center; 
	padding-top: 19px; 
	padding-bottom: 19px; 
	padding-left: 48px; 
	padding-right: 48px; 
	transition: background, border, box-shadow, 0.3s; 
} 
 
.buttom_download span{ 
	font-family: 'Asap'; 
	font-weight: 500; 
	color: #4d4d4d; 
} 
.buttom_download:hover{ 
	background: white; 
	color: black; 
	border-color: white; 
	-webkit-box-shadow: 0px 13px 15px -12px rgba(0,0,0,0.46); 
	-moz-box-shadow: 0px 13px 15px -12px rgba(0,0,0,0.46); 
	box-shadow: 0px 13px 15px -12px rgba(0,0,0,0.46); 
	cursor: pointer; 
} 
 
.about_me_guy{ 
	position: absolute; 
	right: -100px; 
	top: -68px;	 
} 
 
.services{ 
	width: 100%; 
	height: 693px; 
	background: url(../items/img/services_bg.png) no-repeat center; 
	background-size: cover; 
} 
.container_services{ 
	width: 1031px; 
	height: inherit; 
	margin: 0 auto; 
	position: relative; 
	 
} 
.container_services h3{ 
	font-family: 'Asap'; 
	font-weight: 700; 
	font-size: 46px; 
	letter-spacing: 9px; 
	color: #7c7c7c; 
	position: relative; 
	text-align: center; 
	margin: 0 0 0 0 ; 
	padding-top: 150px; 
} 
 
.container_services h3:before{ 
	content:''; 
	top: 130px; 
	left: 480px; 
	width: 60px; 
	border-top: 4px solid #7c7c7c; 
	position: absolute; 
	 
} 
 
.serv_block{ 
	display: inline-block; 
	text-align: center; 
	font-family: 'Asap'; 
	font-weight: 500; 
	font-size: 24px; 
	margin-top: 70px; 
} 
.serv_block_2{ 
	display: inline-block; 
	margin-left: 260px; 
	margin-top: 70px; 
	text-align: center; 
	font-family: 'Asap'; 
	font-weight: 500; 
	font-size: 24px; 
} 
.serv_block_3{ 
	display: inline-block; 
	margin-left: 285px; 
	margin-top: 70px; 
	text-align: center; 
	font-family: 'Asap'; 
	font-weight: 500; 
	font-size: 24px; 
} 
 
.serv_block_4{ 
	display: inline-block; 
	text-align: center; 
	font-family: 'Asap'; 
	font-weight: 500; 
	font-size: 24px; 
	margin-top: 70px; 
	margin-left: -65px; 
} 
.serv_block_5{ 
	display: inline-block; 
	margin-left: 250px; 
	margin-top: 70px; 
	text-align: center; 
	font-family: 'Asap'; 
	font-weight: 500; 
	font-size: 24px; 
} 
.serv_block_6{ 
	position: absolute; 
	top: 450px; 
	left: 900px; 
	text-align: center; 
	font-family: 'Asap'; 
	font-weight: 500; 
	font-size: 24px; 
} 
 
.skills{ 
	width: 100%; 
	height: 767px; 
	 
	 
	 
} 
 
.container_skills{ 
	width: 1013px; 
	height: inherit; 
	margin: 0 auto; 
	position: relative; 
	 
} 
.container_skills h3{ 
	font-family: 'Asap'; 
	font-weight: 700; 
	font-size: 46px; 
	letter-spacing: 9px; 
	color: #7c7c7c; 
	position: relative; 
	text-align: center; 
	margin: 0 0 0 0 ; 
	padding-top: 150px; 
	margin-bottom: 63px; 
} 
 
.container_skills h3:before{ 
	content:''; 
	top: 130px; 
	left: 480px; 
	width: 60px; 
	border-top: 4px solid #7c7c7c; 
	position: absolute; 
	 
	 
} 
.wave{ 
	width: 952px; 
	height: 375px; 
	margin: 0 auto; 
	background: url(../items/img/skill_wave.png) 99% 0, url(../items/img/skill_bg.png), url(../items/img/wave_bg.png); 
	position: relative; 
	 
} 
.mark_1{ 
	position: absolute; 
	top: 115px; 
	left: 91px; 
	 
} 
.mark_2{ 
	position: absolute; 
	top: 175px; 
	left: 315px; 
} 
.mark_3{ 
	position: absolute; 
	top: 25px; 
	left: 546px; 
} 
.mark_4{ 
	position: absolute; 
	top: 115px; 
	left: 748px; 
} 
.xd{ 
	position: absolute; 
	top: 385px; 
	left: 87px; 
} 
.ae{ 
	position: absolute; 
	top: 385px; 
	left: 310px;	 
} 
.ps{ 
	position: absolute; 
	top: 385px; 
	left: 540px; 
} 
.ai{ 
	position: absolute; 
	top: 385px; 
	left: 750px; 
} 
.wave p{ 
	font-family: 'Asap'; 
	font-weight: 400; 
	font-size: 15px; 
	 
} 
.procent_1{ 
	position: absolute; 
	top: -15px; 
	left: -45px; 
} 
.procent_2{ 
	position: absolute; 
	top: 50px; 
	left: -45px; 
} 
.procent_3{ 
	position: absolute; 
	top: 115px; 
	left: -45px; 
} 
.procent_4{ 
	position: absolute; 
	top: 180px; 
	left: -45px; 
} 
.procent_5{ 
	position: absolute; 
	top: 245px; 
	left: -45px; 
} 
.procent_6{ 
	position: absolute; 
	top: 310px; 
	left: -45px; 
} 
 
.portfolio{ 
	width: 100%; 
	height: 1096px; 
	background: url(../items/img/portfolio_bg.png) no-repeat center; 
	background-size: cover; 
} 
.container_portfolio{ 
	width: 1170px; 
	height:inherit; 
	margin: 0 auto; 
	position: relative; 
	 
} 
 
.container_portfolio h3{ 
	font-family: 'Asap'; 
	font-weight: 700; 
	font-size: 46px; 
	letter-spacing: 9px; 
	color: #7c7c7c; 
	position: relative; 
	text-align: center; 
	margin: 0 0 0 0 ; 
	padding-top: 150px; 
	margin-bottom: 63px; 
} 
.container_portfolio h3:before{ 
	content:''; 
	top: 130px; 
	left: 550px; 
	width: 60px; 
	border-top: 4px solid #7c7c7c; 
	position: absolute;	 
	 
} 
 
.group_1{ 
	float: left; 
	width: 368px; 
	clear: both; 
	box-shadow: 0px 0px 19px -4px rgba(0,0,0,0.75); 
} 
 
.group_2{ 
	float: left; 
	width: 368px; 
	margin-left: 33px; 
	box-shadow: 0px 0px 19px -4px rgba(0,0,0,0.75); 
} 
.group_3{ 
	float: left; 
	width: 368px; 
	margin-left: 30px; 
	box-shadow: 0px 0px 19px -4px rgba(0,0,0,0.75); 
} 
 
.load_more{ 
	position: absolute; 
	bottom: 185px; 
	left: 495px; 
	font-family: 'Asap'; 
	font-weight: 700; 
	border: 1px solid black; 
	padding-top: 15px; 
	padding-bottom: 15px; 
	padding-left: 49px; 
	padding-right: 49px; 
	transition: background, border 0.3s; 
	clear: both; 
} 
 
.load_more:hover{ 
	background: white; 
	color: black; 
	border-color: white; 
	-webkit-box-shadow: 0px 13px 15px -12px rgba(0,0,0,0.46); 
	-moz-box-shadow: 0px 13px 15px -12px rgba(0,0,0,0.46); 
	box-shadow: 0px 13px 15px -12px rgba(0,0,0,0.46); 
} 
.load_more a{ 
	text-decoration: none; 
	color: white; 
	color: #4d4d4d; 
} 
 
.testimonials{ 
	width: 100%; 
	height: 711px; 
	 
} 
 
.container_testimonials{ 
	width: 1010px; 
	height: inherit; 
	margin: 0 auto; 
	position: relative; 
	 
} 
.container_testimonials h3{ 
	font-family: 'Asap'; 
	font-weight: 700; 
	font-size: 46px; 
	letter-spacing: 9px; 
	color: #7c7c7c; 
	position: relative; 
	text-align: center; 
	margin: 0 0 0 0 ; 
	padding-top: 150px; 
	margin-bottom: 63px;	 
} 
.container_testimonials h3:before{ 
	content:''; 
	top: 130px; 
	left: 470px; 
	width: 60px; 
	border-top: 4px solid #7c7c7c; 
	position: absolute;	 
} 
.container_worker{ 
	width: 955px; 
	height: 348px; 
	margin: 0 auto; 
	border: 1px solid black; 
	 
} 
.container_worker_center{ 
	margin: 0 auto; 
	margin-top: 80px; 
	width: 760px; 
	 
} 
.container_worker_center img{ 
	float: left; 
	margin-right: 32px; 
} 
 
.container_worker_center strong{ 
	font-family: 'Asap'; 
	font-size: 30px; 
	font-weight: 500px; 
	color: #474747; 
} 
.sub_strong{ 
	font-family: 'Asap'; 
	font-size: 12px; 
	font-weight: 500; 
	font-style: italic; 
	color: #505050; 
	margin-bottom: 15px; 
} 
.information_worker{ 
	font-family: 'Asap'; 
	font-size: 16px; 
	font-weight: 400; 
	color: #949494; 
	line-height: 1.5; 
	text-transform: uppercase; 
	 
} 
.conditions{ 
	width: 100%; 
	height: 302px; 
	background: url(../items/img/condition_bg.png) no-repeat center; 
	background-size: cover; 
	 
} 
.conatainer_conditions{ 
	width: 1170px; 
	height: inherit; 
	margin: 0 auto; 
	position: relative; 
	line-height: 32px; 
	 
} 
 
 
.plus_1, .plus_2, .plus_3, .plus_4{ 
	text-align: center; 
	 
} 
.plus_1{ 
	margin-top: 73px; 
	float: left; 
	margin-left: 87px; 
	margin-right: 137px; 
 
} 
.plus_1 p{ 
	font-family: 'Asap'; 
	font-size: 30px; 
	font-weight: 500; 
} 
.plus_1 span{ 
	font-family: 'Asap'; 
	font-size: 22px; 
	font-weight: 400; 
	 
} 
.plus_2{ 
	margin-top: 83px; 
	float: left; 
	line-height: 35px; 
} 
.plus_2 p{ 
	font-family: 'Asap'; 
	font-size: 30px; 
	font-weight: 500; 
} 
.plus_2 span{ 
	font-family: 'Asap'; 
	font-size: 22px; 
	font-weight: 400; 
	 
} 
.plus_3{ 
	margin-top: 83px; 
	float: right; 
	line-height: 35px; 
} 
.plus_3 p{ 
	font-family: 'Asap'; 
	font-size: 30px; 
	font-weight: 500; 
} 
.plus_3 span{ 
	font-family: 'Asap'; 
	font-size: 22px; 
	font-weight: 400; 
	 
}	 
.plus_4{ 
	margin-top: 73px; 
	float: right; 
	margin-right: 87px; 
	margin-left: 137px; 
 
} 
.plus_4 p{ 
	font-family: 'Asap'; 
	font-size: 30px; 
	font-weight: 500; 
} 
.plus_4 span{ 
	font-family: 'Asap'; 
	font-size: 22px; 
	font-weight: 400; 
	 
} 
.say_hello{ 
	width: 100%; 
	height: 784px; 
	background: url(../items/img/say_hello_bg.png) no-repeat center; 
 
 
	 
} 
.container_say_hello{ 
	width: 1170px; 
	height: inherit; 
	margin: 0 auto; 
	position: relative; 
	margin-bottom: 0; 
	 
	 
} 
.container_say_hello h3{ 
	font-family: 'Asap'; 
	font-weight: 700; 
	font-size: 46px; 
	letter-spacing: 9px; 
	color: white; 
	position: relative; 
	text-align: center; 
	margin: 0 0 0 0 ; 
	padding-top: 150px; 
	margin-bottom: 63px;		 
} 
.container_say_hello h3:before{ 
	content:''; 
	top: 130px; 
	left: 550px; 
	width: 60px; 
	border-top: 4px solid #c9c9c9; 
	position: absolute;	 
} 
form{ 
	display: block; 
	margin: 0 auto; 
} 
#in_1{ 
	width: 370px; 
	height: 56px; 
	float: left; 
	margin-left: 195px; 
	font-size: 21px; 
	margin-bottom: 24px; 
} 
#in_2{ 
	width: 370px; 
	height: 56px; 
	float: right; 
	margin-right: 195px; 
	font-size: 21px; 
	margin-bottom: 24px; 
} 
textarea { 
	clear: both; 
	display: block; 
	margin: 0 auto; 
	font-size: 21px; 
	width: 770px; 
	height: 207px; 
	resize: none; 
} 
 
#in_3{ 
	width: 123px; 
	height: 50px; 
	background-color: #ffffff; 
	color: #4d4d4d; 
	font-family: 'Asap'; 
	font-weight: 600; 
	font-size: 16px; 
	display: block; 
	margin: 0 auto; 
	margin-top: 30px; 
	border: 0; 
	 
	 
} 
#send_img{ 
	position: absolute; 
	left: 610px; 
	bottom: 157px; 
} 
#hr{ 
	margin-top: 50px; 
	display: block; 
	margin-left: 0px; 
	margin-right: 0px; 
	width: 1170px;	 
} 
.container_say_hello h5{ 
	font-family: 'Asap'; 
	font-weight: 500; 
	font-size: 16px; 
	color: #f8f8f8; 
	text-align: center; 
	margin: 0 0 0 0; 
	margin-top: 20px; 
} 
.contact_us_1{ 
	float: left; 
	margin-top: -26px; 
	margin-right: 9px; 
 
} 
.contact_us_2{ 
	float: left; 
	margin-top: -26px; 
	margin-right: 9px; 
 
} 
.contact_us_3{ 
	float: left; 
	margin-top: -26px; 
	margin-right: 9px; 
 
} 
.contact_us_4{ 
	float: left; 
	margin-top: -26px; 
	margin-right: 9px; 
 
} 
.contact_us_5{ 
	float: left; 
	margin-top: -26px; 
	margin-right: 9px; 
 
} 
.contact_us_6{ 
	float: left; 
	margin-top: -26px; 
} 
 
 
@media (max-width: 940px){ 
	.container_say_hello{ 
	width: 1170px; 
	border: 2px solid red; 
	height: inherit; 
	margin: 0 auto; 
	position: relative; 
	margin-bottom: 0; 
	 
	}	 
}
<!DOCTYPE html>  
	<html lang = "ru"> 
		<head> 
			<title>Luis Oenrique</title> 
			<meta charset = "UTF-8"> 
			<link rel = "stylesheet" href = "styles/style.css"> 
			<link rel = "stylesheet" href = "media.css"> 
			<link type="text/css" href="https://fonts.googleapis.com/css?family=Asap:400,400i,500,500i,600,600i,700,700i&Lato:300,300i,400,400i&display=swap" rel="stylesheet"> 
			 
		</head> 
		 
		 
		<body> 
			<header> 
			 
				<div class = "header_wrapper"> 
					<div class = "head_logo"> 
						<img alt = "Картинка" class = "logo_img" src = "items/img/head_logo.png"> 
						<span class = "logo_name_1">OENRIQUE</span> 
						<span class = "logo_name_2">UX/UI EXPERT</span> 
					</div> 
					<ul class = "head_menu"> 
						<li><a href = "#">Home</a></li> 
						<li><a href = "#">ABOUT</a></li> 
						<li><a href = "#">SERVICE</a></li> 
						<li><a href = "#">PORTFOLIO</a></li> 
						<li id = "contact"><a href = "#">CONTACT</a></li> 
					</ul> 
				<div class = "main_head"> 
					<h1>Luis Oenrique</h1> 
					<h2>User Experience/User Interface Expert</h2> 
				</div> 
				<img alt = "Картинка" class = "head_guy" src = "items/img/head_guy.png"> 
				 
				<div class = "know_more"> 
					<a class = "buttom" href = "#" >KNOW MORE</a> 
				</div> 
				 
				<div class = "hire_me"> 
					<a class = "buttom" href = "#" >HIRE ME</a>	 
				</div> 
				</div> 
			</header> 
			 
			<section class = "about_me"> 
				<h3>KNOW MORE ABOUT ME</h3> 
				<p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit.Aenean commodo ligula eget dolor. Aenean 
				massa.Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. 
				Donec quam felis,ultricies nec,pellentesque eu,pretium quis,sem. 
				Nulla consequat massa quis enim. 
				</p> 
				 
				<div class = "buttom_download"> 
					<span>DOWNLOAD MY CV</span> 
				</div> 
				<img alt = "Картинка" class = "about_me_guy" src = "items/img/about_me_guy.png"> 
			</section> 
			 
			<section class = "services"> 
				<div class = "container_services"> 
				 
					<h3>SERVICES</h3> 
					<div class = "serv_block"> 
						<img alt = "Картинка" src = "items/img/serv_1.png"> 
						<p>User Research</p> 
					</div> 
					<div class = "serv_block_2"> 
						<img alt = "Картинка" src = "items/img/serv_2.png"> 
						<p>IA And Wireframes</p> 
					</div> 
					<div class = "serv_block_3"> 
						<img alt = "Картинка" src = "items/img/serv_3.png"> 
						<p>User Testing</p> 
					</div> 
					<div class = "serv_block_4"> 
						<img alt = "Картинка" src = "items/img/serv_4.png"> 
						<p>Looks and Feel Design (UI)</p> 
					</div> 
					 
					<div class = "serv_block_5"> 
						<img alt = "Картинка" src = "items/img/serv_5.png"> 
						<p>Delivery</p> 
					</div> 
					 
					<div class = "serv_block_6"> 
						<img alt = "Картинка" src = "items/img/serv_6.png"> 
						<p>Integration Support</p> 
					</div> 
					 
				</div> 
			</section> 
			 
			<section class = "skills"> 
				<div class = "container_skills"> 
					<h3>MY SKILLS</h3> 
					<div class = "wave"> 
						<img class = "mark_1" alt = "картинка" src = "items/img/mark_1.png"> 
						<img class = "mark_2" alt = "картинка" src = "items/img/mark_2.png"> 
						<img class = "mark_3" alt = "картинка" src = "items/img/mark_3.png"> 
						<img class = "mark_4" alt = "картинка" src = "items/img/mark_4.png"> 
						<img class = "xd" alt = "картинка" src = "items/img/xd.png"> 
						<img class = "ae" alt = "картинка" src = "items/img/ae.png"> 
						<img class = "ps" alt = "картинка" src = "items/img/ps.png"> 
						<img class = "ai" alt = "картинка" src = "items/img/ai.png"> 
						<p class = "procent_1">100%</p> 
						<p class = "procent_2">90%</p> 
						<p class = "procent_3">80%</p> 
						<p class = "procent_4">70%</p> 
						<p class = "procent_5">60%</p> 
						<p class = "procent_6">50%</p> 
					</div> 
				</div> 
			</section> 
			 
			<section class = "portfolio"> 
				<div class = "container_portfolio"> 
					<h3>PORTFOLIO</h3> 
					<img class = "group_1" alt = "картинка" src = "items/img/port_1.png"> 
					<img class = "group_2" alt = "картинка" src = "items/img/port_2.png"> 
					<img class = "group_3" alt = "картинка" src = "items/img/port_3.png"> 
					<img class = "group_1" alt = "картинка" src = "items/img/port_4.png"> 
					<img class = "group_2" alt = "картинка" src = "items/img/port_5.png"> 
					<img class = "group_3" alt = "картинка" src = "items/img/port_6.png"> 
					 
				<div class = "load_more"> 
					<a class = "buttom" href = "#" >LOAD MORE</a> 
				</div> 
				</div> 
			</section> 
 
			<section class = "testimonials"> 
				<div class = "container_testimonials"> 
					<h3>TESTIMONIALS</h3> 
					<div class = "container_worker"> 
						<div class = "container_worker_center"> 
							<img alt = "картинка" src = "items/img/worker_1.png"> 
							<strong>LIMARA TUSI</strong> 
							<p class = "sub_strong">CEO, RANDOM COMPANY</p> 
							<p class = "information_worker">Lorem ipsum dolor sit amet, consectetuer adipiscing elit.Aenean commodo ligula eget dolor. Aenean 
								massa.Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. 
								Donec quam felis,ultricies nec.</p> 
						</div>	 
					</div> 
				</div> 
			</section> 
			<section class = "conditions"> 
				<div class = "conatainer_conditions"> 
					<div class = "plus_1"> 
						<img class = "img_1" alt = "картинка" src = "items/img/cond_1.png"> 
						<p>120</p> 
						<span>HANDS TO WORK</span> 
					</div> 
					<div class = "plus_2"> 
						<img class = "img_2" alt = "картинка" src = "items/img/cond_2.png"> 
						<p>310</p> 
						<span>HAPPY CLIENT</span> 
					</div> 
					<div class = "plus_4"> 
						<img class = "img_4" alt = "картинка" src = "items/img/cond_4.png"> 
						<p>510</p> 
						<span>FINISHED PROJECT</span> 
					</div> 
					<div class = "plus_3"> 
						<img class = "img_3" alt = "картинка" src = "items/img/cond_3.png"> 
						<p>720</p> 
						<span>CUPS OF COFFE</span> 
					</div> 
				</div> 
			</section> 
			 
			 
			<section class = "say_hello"> 
				<div class = "container_say_hello"> 
					<h3>SAY HELLO!</h3> 
					<form action = "/" method = ""> 
						<input id = "in_1" type = "text" name = "name_user" maxlength = "21" placeholder = "Name"> 
						<input id = "in_2" type = "text" name = "email_user" maxlength = "30" placeholder = "Email"> 
						<textarea name = "message" placeholder = "Message"></textarea> 
						<input id = "in_3" type = "submit"  name = "sub" value = "SEND"></br> 
						<img id = "send_img" src = "items/img/send_button.png" alt = "картинка"> 
					</form> 
					<hr id = "hr" size = "2" > 
					<h5>2017. All Right Reserved<h5> 
						<a href = "#"><div class = "contact_us_1"><img src = "items/img/facebook.png" alt = "картинка"></div></a> 
						<a href = "#"><div class = "contact_us_2"><img src = "items/img/twitter.png" alt = "картинка"></div></a> 
						<a href = "#"><div class = "contact_us_3"><img src = "items/img/linked.png" alt = "картинка"></div></a> 
						<a href = "#"><div class = "contact_us_4"><img src = "items/img/google.png" alt = "картинка"></div></a> 
						<a href = "#"><div class = "contact_us_5"><img src = "items/img/be.png" alt = "картинка"></div></a> 
						<a href = "#"><div class = "contact_us_6"><img src = "items/img/zemla.png" alt = "картинка"></div></a> 
						 
				</div> 
			 
			</section> 
		 
		</body> 
	 
	</html>

Answer 1

Проблема решена, не знаю каким образом, но я открыл файл стилей в Atom, и все заработало, что странно, раньше Notepad не подводил, всем спасибо кто пытался помочь!

READ ALSO
alert при закрытии модального окна fancybox
HTML

alert при закрытии модального окна fancybox

Доброго времени сутокЕсть HTML в body только это

 102
Как сделать возможность скролить блок с помощью мыши, не используя скроллбар?
HTML

Как сделать возможность скролить блок с помощью мыши, не используя скроллбар?

Всем приветЕсть вот такой блок: скажите пожалуйста, что нужно сделать, чтобы была возможность скролить этот блок при зажатой левой клавиши...

 89
Очередь из входных параметров одной функции [дубликат]
c#

Очередь из входных параметров одной функции [дубликат]

Необходимо создать поток, в котором будет функция и очередь разных параметров и он будет по мере добавления в очередь данных параметров запускать...

 94
Ожидание добавления данных, если они используются где-то
c#

Ожидание добавления данных, если они используются где-то

У меня есть событие, которое добавляет в список типа List данныеИ во всём остальном коде я использую этот список

 83