/*Universal custom properties (variables) */

:root {

/* Spacing */

--gap: 1.5rem; 
--gapn: -1.5rem; 

/* Block content widths */

--width-standard:1160px;
--width-wide:var(--width-max);
--width-max:1440px;

--width-limit: calc(100% - 3rem);

/* Colors */

--gray: #F8F8F8; /* #EBEBEB */
--dark: #3E3E3E;
--red: #CA0123;
--blue: #1d66ab;

--link-color: var(--blue);

--selection-bgcolor: var(--dark);
--selection-textcolor: #fff;

--txt-dark:rgba(0,0,0,0.6);
--txt-light: rgba(255,255,255,0.6);

/* Typography */

--fallback: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif;

--sans: 'Poppins', 'Open Sans', var(--fallback); 
--serif: 'Open Sans', var(--fallback); 

--mono: 'Courier New', Courier, monospace;

--txt-xsmall: clamp(12px, 1vw, 14px);   /* tiny */

--txt-small: clamp(14px, 2vw, 16px);    /* h6 */
--txt-base: clamp(18px, 4vw, 24px);     /* h5 & paragraph text */
--txt-medium: clamp(18px, 4vw, 24px);   /* h4 */
--txt-large: clamp(24px, 5vw, 30px);     /* h3 */
--txt-xlarge: clamp(30px, 6vw, 36px);    /* h2 */
--txt-xxlarge: clamp(36px, 7vw, 40px);   /* h1*/

--txt-xxxlarge: clamp(48px, 8vw, 60px);  /* jumbo */    

/* Form fields */

--field-radius: 3px;
--field-padding: 0 0.75em !important;
--field-border: solid 1px #ddd;
--field-bgcolor: var(--gray);

--field-border-focus: solid 1px #000;
--field-bgcolor-focus: lightyellow;
--field-shadow-focus: 0 3px 0.3em rgba(0,0,0,0.3);


/* Form inputs and button height */

--input-height: 2.5em;

/* Border radius */

--radius: 5px;
--border: solid 1px #ddd;


/* Social Colors */

--facebook: #1977f3;
--linkedin: #0274b3;
--twitter: #1da1f2;
--reddit: #ff5600;
--tumblr: #314358;
--pocket: #ef4056;
--youtube: #FF0000;
--rss: #f26522;
--pinterest: #bd081c;
--vimeo: #1ab7ea;
--instagram: #c13584;

}