@charset "UTF-8";

@import url('https://fonts.googleapis.com/css?family=Anton|Bungee&subset=latin-ext');
@import url('fontawesome.css');

/*=============================================
=                    PUBG                     =
=               ISMAIL AKDOGAN                =
=         webmaster@ismailakdogan.com         =
=============================================*/

/*=== Font Family ====================================================================================================*/

html, body {
    font-family: "Anton", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.bungee {
    font-family: 'Bungee', cursive;
}

/*=== Start ==========================================================================================================*/

body,
html {
    height: auto;
}

html {
    box-sizing: border-box
}

* {
    margin: 0;
    padding: 0
}

*,
:after,
:before {
    box-sizing: inherit
}

body,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Anton", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

body,
html {
    font-size: 16px;
    line-height: 1.5
}

a {
    transition: all .3s ease-in-out;
}

a,
a:active,
a:hover {
    outline: 0;
    text-decoration: none
}

img {
    max-width: 100%;
}


.cf {
    zoom: 1
}

.cf:after,
.cf:before {
    content: "";
    display: table
}

.cf:after {
    clear: both
}

/*=== Colors =========================================================================================================*/
.orangeBtn {
    background: #F47C01;
    border: 1px solid #F47C01;
}

.orangeBtn:hover {
    background: #b45b01 !important;
    border: 1px solid #b45b01 !important;
}

.orangeGradientBg {
    background: linear-gradient(30deg, rgb(244, 124, 1) 0%, rgb(226, 156, 46) 100%);
}

.text-black {
    color: #000 !important;
}

/* Small Devices */
@media (max-width: 575.98px) {
    .orangeGradientBg {
        background: none;
    }

    header#intro #introCenter .text-black {
        color: white !important;
    }
}

/*=== Shadow =========================================================================================================*/

.shadow1 {
    box-shadow: 0 13px 26px rgba(57, 20, 213, 0.15);
}

/*=== Css Image Filter ===============================================================================================*/

.brightness {
    filter: brightness(100);
}

/*=== Website ========================================================================================================*/

body {
    background: #F4F4F4;
}

#wrapper {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 100%;
    overflow: hidden;
}

.logo {
    width: 118px;
    height: 130px;
    display: block;
}

.logoMpark{
    width: 160px !important;
    height: auto !important;
}

/*=== Header =========================================================================================================*/

header#intro {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100vh;
    display: block;
}

header#intro .bg {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    display: block;
    background: url("../images/bg.png") center center no-repeat;
    background-size: cover;
}

/* IntroTop */
header#intro .container {
    position: relative;
    z-index: 100;
    padding-top: 50px;
}

header#intro .logo svg {
    width: 100%;
    height: 100%;
}

header#intro a {
    display: block;
    cursor: pointer;
}

header#intro #goToForm {
    width: 216px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
}

/* IntroCenter */
header#intro #introCenter {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: block;
}

header#intro #introCenter h1 {
    font-size: 70px;
    margin-bottom: 0;
    padding: 2rem 5rem;
}

@media (max-width: 991.98px) {
    header#intro #introCenter h1 {
        text-align: center;
    }
}

header#intro #introCenter h2 {
    font-size: 60px;
    padding: 1.5rem 4.5rem;
}

header#intro #introCenter h3 {
    color: white;
    font-size: 60px;
}

/* Small Devices */
@media (max-width: 575.98px) {
    header#intro #introCenter h1 {
        font-size: 38px;
    }

    header#intro #introCenter h2 {
        font-size: 32px;
    }

    header#intro #introCenter h3 {
        font-size: 26px;
    }

    header#intro #introCenter * {
        padding: 0;
    }
}

/* introBottom */
header#intro #introBottom {
    position: absolute;
    bottom: 50px;
    left: 0;
    z-index: 1;
    width: 100%;
    display: block;
}

header#intro #introBottom #goToContent {
    height: 82px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
    color: #f0f0f0;
}

header#intro #introBottom #goToContent:hover {
    color: white;
}

/* pubGMan */
header#intro img.pubGMan {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 0;
    width: 640px;
    height: 820px;
    display: block;
}

/*=== Sections =======================================================================================================*/
section.defaultSection {
    position: relative;
    z-index: 1;
    width: 100%;
    height: auto;
    padding: 100px 0 400px 0;
    display: block;
}

/* Small Devices */
@media (max-width: 575.98px) {
    section.defaultSection {
        padding: 100px 0;
    }
}

section.defaultSection .sectionHeader {
    position: relative;
    margin-bottom: 3rem;
    text-align: center;
}

section.defaultSection h3,
section.defaultSection h4 {
    font-size: 42px;
    line-height: 84px;
}

section.defaultSection p {
    font-size: 18px;
    line-height: 36px;
}

/*=== Participant ====================================================================================================*/
section#participant {
    background: url("../images/techizat.png") 5% 95% no-repeat;
}

/* Small Devices */
@media (max-width: 575.98px) {
    section#participant {
        background: none;
    }
}

section#participant:before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 60px;
    height: 60px;
    display: block;
    margin-top: -30px;
    margin-left: -30px;
    transform: rotate(45deg);
    background: #F4F4F4;
}

section#participant img.headerImg {
    position: absolute;
    top: -60px;
    right: -360px;
}

section#participant h3 {
    color: #171C29;
}

section#participant p {
    color: #535D76;
}

/* InputField + CustomSelect */
section#participant .custom-select,
section#participant .form-control {
    height: calc(1.5em + 3rem + 2px);
    border-radius: 0 !important;
    border: 3px solid #E9941C;
    font-size: 18px;
    color: #AEAEB2;
}

/* Small Devices */
@media (max-width: 575.98px) {
    section#participant .custom-select,
    section#participant .form-control {
        margin-bottom: 1rem;
    }
}

section#participant .custom-select,
section#participant .form-control::placeholder {
    color: #AEAEB2;
}

section#participant .custom-select:focus,
section#participant .form-control:focus {
    box-shadow: none;
    color: #495057;
}

/* Button */
section#participant .btn {
    height: calc(1.5em + 2.75rem + 2px);
    border-radius: 0 !important;
}

section#participant .btn:focus {
    box-shadow: none;
}

/* Custom Control */
section#participant .custom-control {
    color: #AEAEB2;
}

section#participant .custom-control a {
    color: #E9941C;
    text-decoration: underline;
}

/* States */
section#participant .was-validated .form-control:valid,
section#participant .was-validated .custom-select:valid {
    border-color: #28a745 !important;
}

section#participant .was-validated .form-control:invalid,
section#participant .was-validated .custom-select:invalid {
    border-color: #dc3545 !important;
}

/*=== Awards =========================================================================================================*/
section#awards {
    background: url("../images/awardsBg.png") top center no-repeat;
    background-color: #171C29;
    background-blend-mode: normal;
    padding: 200px 0 525px 0;
}

section#awards:before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 60px;
    height: 60px;
    display: block;
    margin-top: -30px;
    margin-left: -30px;
    transform: rotate(45deg);
    background: #171C29;
}

section#awards img.headerImg {
    position: absolute;
    top: -230px;
    right: -325px;
}

section#awards h3, section#awards h4, section#awards p {
    color: white;
}

section#awards .awardsBox {
    position: relative;
    width: 100%;
    max-width: 450px;
    text-align: center;
}

section#awards .awardsBox * {
    position: relative;
    z-index: 1;
}

section#awards .awardsBox img:first-child {
    margin-bottom: 2rem;
}

section#awards .awardsBox .awardMedal {
    position: absolute;
    z-index: 2;
}

section#awards .awardsBox .goldMedal {
    top: 7rem;
    right: 2rem;
}

section#awards .awardsBox .silverMedal,
section#awards .awardsBox .bronzMedal {
    top: 12rem;
    right: 5rem;
}


/*=== Gallery ========================================================================================================*/
section#gallery {
    margin-top: -450px;
    padding-bottom: 100px;
}

section#gallery h3, section#gallery p {
    color: white;
}

section#gallery #galleryWraper {
    width: 115%;
    margin-left: -7.5%;
}

section#gallery .galleryThumb {
    margin-bottom: 1.25rem;
    cursor: pointer;
}

section#gallery .galleryThumb img {
    width: 100%;
    height: 100%;
}

/* Small Devices */
@media (max-width: 575.98px) {
    section#gallery .galleryThumb {
        width: 45%;
    }
}

/*=== S.S.S ==========================================================================================================*/
section#sss {
}

section#sss img.headerImg {
    position: absolute;
    top: -60px;
    left: -360px;
}

section#sss #accordionSSS {
}

section#sss #accordionSSS .card {
    margin-bottom: 1rem;
    background: #F4F4F4;
    border: 3px solid orange;
}

section#sss #accordionSSS .card-header {
    background: none;
    border: 0;
    padding: 1.25rem;
}

section#sss h5 {
    font-size: 22px;
    line-height: 32px;
}

section#sss #accordionSSS .card-header button {
    position: relative;
    padding: 0;
    text-align: left;
    text-decoration: none;
    color: #F47C01;
    font-size: inherit;
}

section#sss #accordionSSS .card-header button:after {
    content: "\f078";
    font-family: "Font Awesome 5 Free";
    font-size: inherit;
    font-weight: 900;
    display: inline-block;

    position: absolute;
    top: 0;
    right: 0;
    width: 32px;
    height: 32px;

    color: inherit;
    transition: all 0.3s;
}

section#sss #accordionSSS .card-header button:not(.collapsed) {
    margin-bottom: 1.25rem;
}

section#sss #accordionSSS .card-header button:not(.collapsed):after {
    content: "\f077";
}


section#sss #accordionSSS .card-body,
section#sss p {
    font-size: 18px;
    line-height: 32px;
    color: #535D76;
}

/* Small Devices */
@media (max-width: 575.98px) {
    section#sss h5 {
        word-break: break-word;
    }

    section#sss #accordionSSS .card-header button {
        padding-right: 32px;
    }
}

/*=== Footer =========================================================================================================*/
footer#siteBottom {
    position: relative;
    z-index: 1;
    width: 100%;
    height: auto;
    min-height: 250px;
    margin-top: 100px;
    padding: 50px 0;
    display: block;
    background: #171C29;
}

footer#siteBottom .toros,
footer#siteBottom .tavuk {
    position: absolute;
}

footer#siteBottom .toros {
    top: -300px;
    right: -185px;
}

footer#siteBottom .container {
    position: relative;
}

footer#siteBottom .tavuk {
    top: -159px;
    left: 0;
}

footer#siteBottom a.nav-link {
    font-size: 32px;
    color: white;
}

/* Small Devices */
@media (max-width: 575.98px) {
    footer#siteBottom .toros {
        width: 424px;
        height: auto;
        max-height: 240px;
        top: -150px;
        right: -115px;
    }

    footer#siteBottom .tavuk {
        width: 60px;
        height: 55px;
        top: -104px;
    }
}