/*
   _____      _   _   _                 
  / ____|    | | | | (_)                
 | (___   ___| |_| |_ _ _ __   __ _ ___ 
  \___ \ / _ \ __| __| | '_ \ / _` / __|
  ____) |  __/ |_| |_| | | | | (_| \__ \
 |_____/ \___|\__|\__|_|_| |_|\__, |___/
                               __/ |    
                              |___/     
*/

/* 
    ************ General Rules: ************

    1. Always create your respective stylesheets css files for stylings.
    2. Don't use any other values of color or font family rather than this one.
    3. Also included one special font for highlightings headings.
    4. We have created custom option for just in case if only required.
    5. You are requested to avoid using "settings.css" & "style.css" for editing.


    ************ Font Rules for Responsive: ************

    1. Use "rem" instead of "px".
    2. We set the value as [1rem = 10px].
        So calculate yours in "px" then use as "rem".
    3. Font size will automatically will change on screen size.
        Viewports: [992px & 768px]
    4. If required to change font size to fit in; you can do it in your
        respective stylesheets for different viewports.

    5. You can use other units like "px", "%", "vw", "vh", "em", "pt" etc.
        For minor/small changes.
*/

/* **************************** Fonts **************************** */

/* Noto & Poppins */

@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+Display:wght@300;400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+Mono:wght@400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif:wght@400;700&display=swap");

/* **************************** Site General Settings **************************** */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  scroll-behavior: smooth;
}

/* **************************** Responsive Font Size **************************** */

html {
  font-size: 62.5%;
}

@media (max-width: 992px) {
  html {
    font-size: 60%;
  }
}

@media (max-width: 768px) {
  html {
    font-size: 55%;
  }
}

/* **************************** Body Settings **************************** */

body {
  background: var(--darkwhite);
  font-family: var(--mainfont);
}

/* **************************** Root Variables **************************** */

/* Default Root (Don't Change This) */

:root {
  /* Default Colors */
  --darkblack: #3c434e;
  --lightblack: #495464;
  --offblack: #32456b;
  --darkwhite: #ffffff;
  --lightwhite: #f7fafc;
  --lightgrey: #9ba4b4;
  --darkgrey: #787a91;

  /* Theme Colors */
  --primaryred: #f74037;
  --primaryblue: #4a90f4;
  --primarygreen: #14b25f;
  --primaryyellow: #ffb808;

  /*
        If you want a low opacity color then just use "rgba" of this colors and 
        change the "Alpha" value to decrease the opacity.
  */

  /* Default Fonts */
  --mainfont: "Poppins", sans-serif;
  --primaryfont_sans: "Noto Sans Display", sans-serif;
  --primaryfont_serif: "Noto Serif", serif;
  --primaryfont_mono: "Noto Sans Mono", monospace;
}

/* ******************************************************** */
/*
    Contributors Root 
    [For Custom (Only If required) || Don't Use Variables of Default Ones]
*/

:root {
  --customcolor: #6f6bfa;
  --customfont: ;
}

/* **************************** Scroll Bar **************************** */

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: var(--lightblack);
  border-radius: 2px;
}

/* **************************** Selection **************************** */

::selection {
  color: var(--darkwhite);
  background: var(--customcolor);
}

/* **************************** User Select None **************************** */

a,
button,
img,
.noselect {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

button.btn:active,
button.btn:focus,
a.btn:active,
a.btn:focus {
  box-shadow: none;
}

/* **************************** Custom Fonts (Just in Case) **************************** */

/* We have included one font for special headings. */

@font-face {
  font-family: "Aware";
  src: url(../assets/fonts/Aware.ttf);
}
.bgimg {
  background: url(/bg.png) repeat-x;
  overflow: hidden;
}

.gdscrkm {
  display: flex;
  margin: 40px 0 0 0;
}
.gdscrkmimg {
  margin: auto;
  width: 60%;
  box-shadow: 0 0 14px rgb(120, 117, 117);
  /* border-radius: 1.25rem; */
}
@media (max-width:920px) {
    .gdscrkmimg{
      width: 100%;
    }
}
/* **************************** Styles End **************************** */