gleendo

1. Не надо бутстрапа.
2. Воспользуйтесь в следующий раз jsbin/jsfiddle.
3. Разбейте на части.
Например:
верхняя часть, где находится блок с буквой p
контент - заголовки и кнопка
футер - вылезающий телефон - он накладывается на остальные из-за z-index.

Пипетка + linear-gradient

У tutsplus есть скринкасты. Но опять же на английском. Но по контексту будет, я думаю понятно, что к чему.

echo > .bowerrc

Для первого раза, тем более за 2 часа - молодец. Твердая 5-ка. А фон фикс или не фикс - это формальности. CSS и HTML оформленны очень хорошо.

Если смотреть код css то зачем и html и body присваивать фон одновременно? Во вторых, у вас background: cover не работает, потому что его переопределяет следущая строка:

html, body {
	background: cover;
	background: url(../images/background.jpg) no-repeat center fixed;
}

Ну и конечно wrapper с шириной 1512px и фиксированной высотой 1016px явно что-то пошло не так.

Далее весь код из звездочки кроме box-sizing, рекомендую перенести в body:

* {
	box-sizing: border-box;
	color: #485254;
	font-family: 'Roboto';
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
}

Более сложные анимации лучше делать например на d3.js, где для этого есть все нужные инструменты и можно написать нормальную формулу вычисления траектории, а не имитировать на CSS.

Внутри head должен быть мета тег viewport, примерно такой:

<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=0" />

слышали про :
height: **?

Использовать float и маргином задать отступы от текста и родительского блока, и

float:right; 
margin:10px;
margin-right:20px;

помоему так .

Ага.
Пусть еще тему по мотивам хохломы сделают, с медведями и балалайками.

с хохломой в следующем релизе )


А если серьезно, то это прост никому не нужно.

Тут неплохие шаблоны для сайтов есть psd-stock.ru/shablony-dlja-sajtov

Совет дам такой: побольше практики, но не просто тупого кода, а ищи грамотный, смотри на youtube там очень много каналов по верстке (sorax, looftblog, master-css, webdesign master, magisters, psd to html и т.д.) Смотри, повторяй каждый день и результат будет. Макеты выбирай попроще, наловчишься, тогда уже бери сложнее. Вообще зайди и зарегистрируйся на https://htmlacademy.ru, получай ежемесячно 3 классных макета на проверку знаний и верстай себе. И еще пока не знаешь базиса зачем тебе sass? Твоя структура файлов должна сейчас выглядеть так: папки css и img и индексный файл index.html, со временем подключишь папку js, когда выучишь javascript. И лишь тогда компиляция, препроцессоры и менеджеры сборок.

Помогите пожалуйста, советом, что да как, как лучше практиковаться, как практиковались вы и т.д. Как научиться все таки нормально верстать макеты, желательно любые).

Заходите на themeforest.net ( или какой другой сайт с шаблонами ... открываете шаблон .... смотрите на него, можете сриншот страницы сделать.
Режете в PS и верстаете, что то не понятно - смотрите как сделано на уже готовом шаблоне.

Да и зачем вам сразу уроки по адаптив, sass/susy и т.д , если обычный шаблон сверстать пока не можете. Все делать нужно поэтапно и размеренно. Что то не ясно - потратьте время, чтобы разобраться самому почему и как.

А ведь еще неделю назад этот человек собирался создать собственный css фреймворк.