//===== Colors =====//

:root {
    //Base colors
    --color-primary: #f9004d;
    --color-primary-light: #ffedf2;
    --color-body: #717173;
    --color-heading: #1f1f25;
    --color-secondary: #00D09C;
    --color-tertiary: #030303;
    --color-success: #3EB75E;
    --color-danger: #FF0003;
    --color-border: #e9e9e9;
    --color-border-2: #0000004d;
    --color-lighter: #f8f9fc;
    --color-white: #ffffff;
    --radius: 4px;
    --border-width: 2px;
    --border-sdfs: #717173;


    --color-extra1: #b1b4c1;

    // Heading Font 
    --h1: 72px; // 1.3
    --h2: 60px; // 1.4074
    --h3: 40px; // 1.4074
    --h4: 30px; // 1.4074
    --h5: 20px; // 1.4074
    --h6: 16px; // 1.4074
}


$theme-color: var(--color-primary);
// $body-color: #1d1d24;
$body-color: #717173;
$heading-color: #1f1f25;
$border-color: #e9e9e9;
$white:#fff;
$action-color:var(--color-primary);
$radius: 4px;

/*===============================
    Font Family 
=================================*/
$body-font: 'Poppins', sans-serif;
$heading-font: 'Poppins', sans-serif;


// Heading Font List
$font-1: 'Poppins', sans-serif;

$fontList: $font-1;


/*===============================
    Color Variation 
=================================*/
$color-1:  var(--color-primary);
$color-2:  #f4769a;
$color-3:  #2f21b3;
$color-4:  #8956e2;
$colorList: $color-1, $color-2 ,$color-3 ,$color-4;


//===== Line Height =====//
$body-line-height: 30px;
//==== Font size =====//
$body-font-size: 16px;
$h1: 72px;
$h2: 60px;
$h3: 40px;
$h4: 30px;
$h5: 20px;
$h6: 16px;


//===== Social Colors =====//
$facebook : #3B5998;
$twitter : #00ACEE;
$google-plus : #DD4B39;
$pinterest : #C8232C;
$linkedin : #0E76A8;
$flickr : #FF0084;
$google : #dd4b39;
$youtube : #cd201f;

// Layouts
$smlg-device: 'only screen and (max-width: 1199px)';
$xxl-device: 'only screen and (min-width: 1921px)';
$extra-device: 'only screen and (min-width: 1600px) and (max-width: 1919px)';
$laptop-device: 'only screen and (min-width: 1200px) and (max-width: 1599px)';
$lg-layout: 'only screen and (min-width: 992px) and (max-width: 1199px)';
$md-layout:'only screen and (min-width: 768px) and (max-width: 991px)';
$sm-layout:'only screen and (max-width: 767px)';
$large-mobile: 'only screen and (max-width: 575px)';
$small-mobile: 'only screen and (max-width: 479px)';