Created
July 3, 2019 17:59
-
-
Save ennjoy/23090fd6545288edb4006fd88c75a88b to your computer and use it in GitHub Desktop.
primerp.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
* { | |
margin: 0; | |
padding: 0; | |
font-family: Arial; | |
font-size: 15px; | |
} | |
html, body { | |
background: url('/img/background.png'); | |
background-repeat: repeat-x; | |
height: 100%; | |
} | |
a { | |
text-decoration: none | |
} | |
h1 { | |
max-width: 500px; | |
} | |
.white { | |
color: white | |
} | |
.red { | |
color: red | |
} | |
.mt-200 { | |
margin-top: 80px !important | |
} | |
.mt-300 { | |
margin-top: 300px !important | |
} | |
.w100 { | |
width: 100% | |
} | |
.w120 { | |
width: 120px | |
} | |
.pt-12 { | |
padding-top: 12px | |
} | |
.mw200 { | |
max-width: 200px | |
} | |
.mw400 { | |
max-width: 400px | |
} | |
.mw480 { | |
max-width: 480px | |
} | |
.right { | |
float: right | |
} | |
.fs25 { | |
font-size: 25px !important; | |
} | |
.preloader { | |
position: fixed; | |
left: 0; | |
top: 0; | |
width: 100%; | |
height: 100%; | |
background: black; | |
z-index: 2; | |
transition: 1s all; | |
opacity: 1; | |
visibility: visible; | |
} | |
.loader { | |
width: 75px; | |
height: 75px; | |
border: 10px solid white; | |
border-radius: 50%; | |
border-top-color: red; | |
position: absolute; | |
left: 50%; | |
top: 50%; | |
transform: translate(-50%, -50%); | |
animation: 1s spin infinite linear; | |
} | |
.done { | |
opacity: 0; | |
visibility: hidden; | |
} | |
@keyframes spin { | |
from { | |
transform: translate(-50%, -50%) rotate(0deg); | |
} to { | |
transform: translate(-50%, -50%) rotate(360deg); | |
} | |
} | |
.wrapper { | |
margin-top: 100px; | |
margin-bottom: 100px | |
} | |
.header { | |
background: #140404; | |
display: flex; | |
} | |
.header div { | |
flex: 1; | |
height: 20px; | |
text-align: center; | |
padding: 25px; | |
} | |
.header_left { | |
max-width: 600px; | |
} | |
.header_left { | |
color: #414141; | |
font-size: 20px; | |
} | |
.header_center a { | |
padding: 20px; | |
color: #ffffff; | |
} | |
.header_center a:hover { | |
border-bottom: 6px solid #BB0000; | |
color: #ffffff; | |
background: linear-gradient(to top, #2C0303 50%, #140404 90%, #140404 80%); | |
} | |
.header .header_left .logo { | |
width: 120px; | |
margin-top: -5px; | |
} | |
.block { | |
max-width: 1000px; | |
margin: 0 auto; | |
} | |
.block_nav .nav_img { | |
margin-left: -10px; | |
} | |
.block_title { | |
font-size: 45px; | |
font-weight: 800; | |
} | |
.block_desc { | |
color: #DE7070; | |
font-size: 17px; | |
font-weight: 500; | |
max-width: 510px | |
} | |
.block_button { | |
background: #C20000; | |
color: #ffffff; | |
padding: 8px; | |
width: 180px; | |
height: 45px; | |
border: none; | |
font-size: 15px; | |
font-weight: 600; | |
} | |
.start_block .img { | |
margin: -400px 60px 0 0; | |
float: right; | |
} | |
.start_block button { | |
margin-right: -650px; | |
margin-top: -55px; | |
float: right; | |
border: none; | |
background: none; | |
} | |
.center_block { | |
margin-left: calc(40% - 45%); | |
max-width: 1200px; | |
margin-left: auto; | |
margin-right: auto; | |
} | |
.item .item_desc { | |
color: #ea6360; | |
font-size: 14px; | |
} | |
.item .item_title { | |
color: #ffffff; | |
font-size: 18px; | |
font-weight: 550; | |
} | |
.item .item_button { | |
background: linear-gradient(to right, #630d0c, #390909); | |
color:#fff; | |
font-size: 16px; | |
font-weight: 550; | |
width: 200px; | |
height: 50px; | |
border: none; | |
} | |
.center_block .item_one img { | |
width: 600px; | |
padding-right: 10px; | |
float: left; | |
margin-left: -35px; | |
} | |
.center_block .item_one .item { | |
margin-left: -300px; | |
margin-top: 140px; | |
float: left; | |
} | |
.center_block .item_one .item .item_title { | |
max-width: 195px; | |
margin-left: 70px; | |
text-align: right | |
} | |
.center_block .item_one .item .item_desc { | |
max-width: 270px; | |
text-align: right; | |
} | |
.center_block .item_one .item .item_button { | |
margin-left: 70px; | |
margin-top: 7px; | |
} | |
.center_block .item_two img { | |
float: right; | |
width: 600px; | |
margin-right: 15px; | |
margin-top: 10px; | |
} | |
.center_block .item_two .item { | |
margin-left: -25px; | |
margin-top: -345px; | |
float: left; | |
} | |
.center_block .item_two .item .item_title { | |
max-width: 195px; | |
margin-left: 55px; | |
text-align: left | |
} | |
.center_block .item_two .item .item_desc { | |
max-width: 270px; | |
text-align: left; | |
margin-left: 55px | |
} | |
.center_block .item_two .item .item_button { | |
margin-left: 55px; | |
margin-top: 10px; | |
} | |
.center_block .item_three img { | |
width: 1200px; | |
margin-top: -70px; | |
margin-left: auto; | |
margin-right: auto; | |
} | |
.center_block .item_three .item { | |
margin-top: -250px; | |
} | |
.center_block .item_three .item .item_title { | |
margin-left: auto; | |
margin-right: auto; | |
text-align: center; | |
max-width: 200px; | |
} | |
.center_block .item_three .item .item_desc { | |
margin-left: auto; | |
margin-right: auto; | |
text-align: center; | |
max-width: 500px; | |
} | |
.center_block .item_three .item .item_button { | |
margin-left: 500px; | |
margin-top: 20px; | |
} | |
.telki_block_left { | |
display: block; | |
margin-left: 100px; | |
} | |
.telki_block_left img { | |
width: 500px; | |
} | |
.telki_block_right { | |
float: right; | |
margin: 0; | |
padding: 0 130px 0 0; | |
text-align: right; | |
} | |
.news_title { | |
text-align: center; | |
text-transform: uppercase; | |
font-size: 20px; | |
} | |
.news_slider { | |
max-width: 66.8%; | |
margin-bottom: 300px; | |
display: flex; | |
transition: transform 0.6s ease; | |
} | |
.news_block { | |
margin-left: 80px; | |
width: 300px; | |
float: left; | |
} | |
.news_block .cover img { | |
width: 300px; | |
height: auto; | |
} | |
.news_block .desc { | |
background: #290203; | |
margin-top: -20px; | |
} | |
.news_block .desc .news_title { | |
font-size: 15px; | |
font-weight: 550; | |
max-width: 180px; | |
text-align: left; | |
padding: 15px; | |
color: #ffffff; | |
} | |
.news_block .desc .news_content { | |
color: #bf7778; | |
font-size: 13px; | |
padding: 15px; | |
margin-top: -40px; | |
} | |
.slider_button { | |
text-align: center; | |
} | |
.slider_button .news_button { | |
position: absolute; | |
top: 50%; | |
border-radius: 30px; | |
background: #b80000; | |
color: #ffffff; | |
border: none; | |
} | |
.news_button_left { | |
left: 0 | |
} | |
.slider_button .news_button_right { | |
right: 0 | |
} | |
.slider_button .letter_button { | |
padding: 6px; | |
width: 40px; | |
margin: 0 200px 0 200px; | |
} | |
.slider { | |
position: relative; | |
overflow: hidden; | |
margin-bottom: -185px; | |
} | |
.slider__control { | |
position: absolute; | |
top: 50%; | |
display: none; | |
align-items: center; | |
justify-content: center; | |
width: 40px; | |
color: #fff; | |
text-align: center; | |
opacity: 0.5; | |
transform: translateY(-50%); | |
} | |
.slider__control_show { | |
display: flex; | |
} | |
.slider__control:hover, .slider__control:focus { | |
color: #fff; | |
text-decoration: none; | |
outline: 0; | |
opacity: .9; | |
} | |
.donate { | |
background: url('/img/donate/bg.png'); | |
background-repeat: repeat-y; | |
background-color: #990000; | |
width: 600px; | |
height: 600px; | |
margin: 0 auto; | |
border-radius: 10px; | |
} | |
.donate .donate_title { | |
color: #ffffff; | |
font-size: 30px; | |
font-weight: 550; | |
padding: 30px; | |
text-align: center; | |
margin-left: 5%; | |
text-transform: lowercase; | |
} | |
.donate .donate_desc { | |
text-align: center; | |
} | |
.donate_desc .item { | |
margin-bottom: 30px; | |
} | |
.donate_desc .item h3 { | |
font-size: 20px; | |
margin: 0 0 10px 130px; | |
color: #ffffff; | |
text-align: left; | |
} | |
.donate_desc select, .donate_desc input { | |
background: #ffffff !important; | |
color: #771313 !important; | |
font-weight: normal !important; | |
font-size: 18px !important; | |
width: 350px !important; | |
height: 50px !important; | |
border: 4px solid #880c0c !important; | |
border-radius: 10px !important; | |
} | |
.donate_desc .item button { | |
background: linear-gradient(to right, #c20000 20%, #960001 80%); | |
color: #ffffff; | |
font-size: 20px; | |
font-weight: 550; | |
text-transform: lowercase; | |
width: 350px; | |
height: 55px; | |
border: none; | |
} | |
.donate_desc .item h2 { | |
color: #ffffff; | |
font-size: 20px; | |
font-weight: bold; | |
} | |
.donate .donate_top { | |
background: #ffffffff; | |
margin: 0 auto; | |
margin-top: -40px; | |
margin-bottom: 40px; | |
width: 65px; | |
height: 11px; | |
} | |
.news_page { | |
margin: 0 auto; | |
width: 1000px; | |
height: 300px; | |
line-height: 15px; | |
} | |
.news_page .news_block { | |
margin-left: 20px !important; | |
margin-top: 20px !important; | |
} | |
.news_pages { | |
text-align: left; | |
font-weight: bold; | |
font-size: 30px; | |
margin-left: 230px; | |
} | |
.news_listing { | |
position: absolute; | |
} | |
.news_listing img { | |
margin-left: 230px; | |
width: 400px; | |
height: auto; | |
float: left; | |
} | |
.news_listing .desc { | |
color: #ffffff; | |
float: right; | |
margin-left: 40px; | |
max-width: 550px; | |
} | |
.content { | |
color: #ffffff; | |
margin: 0 auto; | |
max-width: 800px; | |
margin-top: 250px; | |
border-left: 4px solid red; | |
padding-left: 40px; | |
} | |
.social { | |
max-width: 900px !important | |
} | |
.social h1 { | |
margin-left: 70px; | |
} | |
.social .social_link a i { | |
font-size: 30px; | |
width: 60px; | |
color: #ffffff; | |
} | |
.social .social_link a .fa-youtube-play:hover { | |
color: red; | |
} | |
.social .social_link a .fa-vk:hover { | |
color: #4a76a8; | |
} | |
.social .social_link a .fa-telegram:hover { | |
color: #31abde; | |
} | |
.social .social_link a .fa-instagram:hover { | |
color: #6955c6; | |
} | |
.social_block { | |
margin-left: 20px; | |
width: 300px; | |
float: right; | |
} | |
.social_block .cover img { | |
width: 300px; | |
height: auto; | |
} | |
.social_block .desc { | |
background: #390b0b; | |
height: 120px; | |
margin-top: -7px; | |
border-radius: 0 0 8px 8px; | |
} | |
.social_block .desc .social_title { | |
color: #ffffff; | |
font-size: 16px; | |
font-weight: 550; | |
margin-left: auto; | |
margin-right: auto; | |
max-width: 20px; | |
float: left; | |
padding: 0 0 0 10px; | |
} | |
.social_block .desc .social_members { | |
color: #bf7778; | |
font-size: 14px; | |
float: right; | |
padding: 15px; | |
} | |
.social_block .desc .subscripes { | |
background: #b70100; | |
color: #ffffff; | |
width: 275px; | |
margin: 10px 0 0 10px; | |
border: none; | |
border-radius: 6px; | |
} | |
.footer_wrapper { | |
position: absolute; | |
margin-top: 50px; | |
width: 100%; | |
} | |
.footer { | |
height: 90px; | |
text-align: center; | |
color: #fff; | |
background: radial-gradient(at top, #2c0203, #0c0201); | |
} | |
.footer_logo { | |
padding-top: 30px; | |
} | |
.footer_center { | |
margin-top: -35px; | |
margin-left: 230px; | |
} | |
.footer_center a { | |
padding: 35px; | |
color: #fff; | |
font-size: 14px; | |
} | |
.footer_center a:hover { | |
color: #850504; | |
} | |
.copyright { | |
background: #0c0201; | |
color: #fff; | |
height: 40px; | |
text-align: center; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment