/*@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&display=swap');

@import url('https://fonts.googleapis.com/css2?family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap');
*/
@font-face {
  font-family: "DM Serif Display";
  src: url("/content/font/DM-Serif/DMSerifDisplay-Italic.woff2") format("woff2"), url("../scss/content/font/DM-Serif/DMSerifDisplay-Italic.woff") format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "DM Serif Display";
  src: url("/content/font/DM-Serif/DMSerifDisplay-Regular.woff2") format("woff2"), url("../scss/content/font/DM-Serif/DMSerifDisplay-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "PT Serif";
  src: url("/content/font/PT-Serif/PTSerif-Italic.woff2") format("woff2"), url("../scss/content/font/PT-Serif/PTSerif-Italic.woff") format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "PT Serif";
  src: url("/content/font/PT-Serif/PTSerif-Bold.woff2") format("woff2"), url("../scss/content/font/PT-Serif/PTSerif-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "PT Serif";
  src: url("/content/font/PT-Serif/PTSerif-BoldItalic.woff2") format("woff2"), url("../scss/content/font/PT-Serif/PTSerif-BoldItalic.woff") format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "PT Serif";
  src: url("/content/font/PT-Serif/PTSerif-Regular.woff2") format("woff2"), url("../scss/content/font/PT-Serif/PTSerif-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-BlackItalic.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-BlackItalic.woff") format("woff");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-Bold.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-Black.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-Black.woff") format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-ExtraLight.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-ExtraLight.woff") format("woff");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-Italic.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-Italic.woff") format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-LightItalic.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-LightItalic.woff") format("woff");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-Medium.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-Light.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-ExtraBoldItalic.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-ExtraBoldItalic.woff") format("woff");
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-BoldItalic.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-BoldItalic.woff") format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-ExtraLightItalic.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-ExtraLightItalic.woff") format("woff");
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-ExtraBold.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-ExtraBold.woff") format("woff");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-ThinItalic.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-ThinItalic.woff") format("woff");
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-MediumItalic.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-MediumItalic.woff") format("woff");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-Regular.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-SemiBold.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-Thin.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-Thin.woff") format("woff");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("/content/font/Poppins/Poppins-SemiBoldItalic.woff2") format("woff2"), url("../scss/content/font/Poppins/Poppins-SemiBoldItalic.woff") format("woff");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Gibson";
  src: url("/content/font/gibson/Gibson.eot");
  src: local("Gibson"), url("/content/font/gibson/Gibson.eot?#iefix") format("embedded-opentype"), url("/content/font/gibson/Gibson.woff2") format("woff2"), url("/content/font/gibson/Gibson.woff") format("woff"), url("/content/font/gibson/Gibson.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Gibson";
  src: url("/content/font/gibson/Gibson-SemiBold.eot");
  src: local("Gibson SemiBold"), local("Gibson-SemiBold"), url("/content/font/gibson/Gibson-SemiBold.eot?#iefix") format("embedded-opentype"), url("/content/font/gibson/Gibson-SemiBold.woff2") format("woff2"), url("/content/font/gibson/Gibson-SemiBold.woff") format("woff"), url("/content/font/gibson/Gibson-SemiBold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-BoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-BoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: italic;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-BoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-BoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: italic;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-BoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-BoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-BoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-BoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-BoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-BoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRVariable-VF-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRVariable-VF-Testing.woff") format("woff");
  font-family: "FormaDJRVariable";
  font-style: normal;
  font-weight: normal;
}
@font-face {
  src: url("/content/font/djr/FormaDJRVariable-Italic-VF-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRVariable-Italic-VF-Testing.woff") format("woff");
  font-family: "FormaDJRVariable";
  font-style: italic;
  font-weight: normal;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-ExtraLight-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-ExtraLight-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: normal;
  font-weight: 275;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-ExtraLightItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-ExtraLightItalic-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: italic;
  font-weight: 275;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-Light-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-Light-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: normal;
  font-weight: 300;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-LightItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-LightItalic-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: italic;
  font-weight: 300;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-Regular-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-Regular-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: normal;
  font-weight: normal;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-Italic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-Italic-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: italic;
  font-weight: normal;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-Medium-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-Medium-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: normal;
  font-weight: 500;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-MediumItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-MediumItalic-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: italic;
  font-weight: 500;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-Bold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-Bold-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: normal;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-BoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-BoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: italic;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-ExtraBold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-ExtraBold-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: normal;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-ExtraBoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-ExtraBoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: italic;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-Black-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-Black-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: normal;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-BlackItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-BlackItalic-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: italic;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-ExtraLight-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-ExtraLight-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: normal;
  font-weight: 275;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-ExtraLightItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-ExtraLightItalic-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: italic;
  font-weight: 275;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-Light-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-Light-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: normal;
  font-weight: 300;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-LightItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-LightItalic-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: italic;
  font-weight: 300;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-Regular-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-Regular-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: normal;
  font-weight: normal;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-Italic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-Italic-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: italic;
  font-weight: normal;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-Medium-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-Medium-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: normal;
  font-weight: 500;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-MediumItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-MediumItalic-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: italic;
  font-weight: 500;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-Bold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-Bold-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: normal;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-BoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-BoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: italic;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-ExtraBold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-ExtraBold-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: normal;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-ExtraBoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-ExtraBoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: italic;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-Black-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-Black-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: normal;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-BlackItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-BlackItalic-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: italic;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-Hairline-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-Hairline-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: normal;
  font-weight: 1;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-HairlineItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-HairlineItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: 1;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-Thin-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-Thin-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: normal;
  font-weight: 100;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-ThinItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-ThinItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: 100;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-ExtraLight-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-ExtraLight-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: normal;
  font-weight: 275;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-ExtraLightItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-ExtraLightItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: 275;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-Light-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-Light-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: normal;
  font-weight: 300;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-LightItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-LightItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: 300;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-Regular-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-Regular-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: normal;
  font-weight: normal;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-Italic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-Italic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: normal;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-Medium-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-Medium-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: normal;
  font-weight: 500;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-MediumItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-MediumItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: 500;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-Bold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-Bold-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: normal;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-BoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-BoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-ExtraBold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-ExtraBold-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: normal;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-ExtraBoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-ExtraBoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-Black-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-Black-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: normal;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-BlackItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-BlackItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-Hairline-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-Hairline-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: normal;
  font-weight: 200;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-HairlineItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-HairlineItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: 100;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-Thin-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-Thin-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: normal;
  font-weight: 200;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-ThinItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-ThinItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: 100;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-ExtraLight-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-ExtraLight-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: normal;
  font-weight: 275;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-ExtraLightItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-ExtraLightItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: 275;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-Light-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-Light-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: normal;
  font-weight: 300;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-LightItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-LightItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: 300;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-Regular-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-Regular-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: normal;
  font-weight: normal;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-Italic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-Italic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: normal;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-Medium-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-Medium-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: normal;
  font-weight: 500;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-MediumItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-MediumItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: 500;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-Bold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-Bold-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: normal;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-BoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-BoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-ExtraBold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-ExtraBold-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: normal;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-ExtraBoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-ExtraBoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-Black-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-Black-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: normal;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-BlackItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-BlackItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-Hairline-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-Hairline-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: normal;
  font-weight: 1;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-HairlineItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-HairlineItalic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: 1;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-Thin-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-Thin-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: normal;
  font-weight: 100;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-ThinItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-ThinItalic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: 100;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-ExtraLight-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-ExtraLight-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: normal;
  font-weight: 275;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-ExtraLightItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-ExtraLightItalic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: 275;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-Light-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-Light-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: normal;
  font-weight: 300;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-LightItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-LightItalic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: 300;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-Regular-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-Regular-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: normal;
  font-weight: normal;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-Italic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-Italic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: normal;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-Medium-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-Medium-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: normal;
  font-weight: 500;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-MediumItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-MediumItalic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: 500;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-Bold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-Bold-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: normal;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-BoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-BoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: bold;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-ExtraBold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-ExtraBold-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: normal;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-ExtraBoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-ExtraBoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-Black-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-Black-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: normal;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-BlackItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-BlackItalic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-Thin-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-Thin-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: normal;
  font-weight: 100;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-Thin-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-Thin-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: normal;
  font-weight: 200;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-Thin-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-Thin-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: normal;
  font-weight: 100;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-ThinItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-ThinItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: 100;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-ThinItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-ThinItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: 100;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-ThinItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-ThinItalic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: 100;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-ExtraBold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-ExtraBold-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: normal;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-ExtraBold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-ExtraBold-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: normal;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-ExtraBold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-ExtraBold-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: normal;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-ExtraBold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-ExtraBold-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: normal;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-ExtraBold-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-ExtraBold-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: normal;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-ExtraBoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-ExtraBoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: italic;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-ExtraBoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-ExtraBoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: italic;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-ExtraBoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-ExtraBoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-ExtraBoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-ExtraBoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-ExtraBoldItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-ExtraBoldItalic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: 800;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-Hairline-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-Hairline-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: normal;
  font-weight: 1;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-Hairline-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-Hairline-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: normal;
  font-weight: 200;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-Hairline-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-Hairline-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: normal;
  font-weight: 1;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-HairlineItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-HairlineItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: 1;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-HairlineItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-HairlineItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: 100;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-HairlineItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-HairlineItalic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: 1;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-Black-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-Black-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: normal;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-Black-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-Black-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: normal;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-Black-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-Black-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: normal;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-Black-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-Black-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: normal;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-Black-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-Black-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: normal;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRMicro-BlackItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRMicro-BlackItalic-Testing.woff") format("woff");
  font-family: "FormaDJRMicro";
  font-style: italic;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRText-BlackItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRText-BlackItalic-Testing.woff") format("woff");
  font-family: "FormaDJRText";
  font-style: italic;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDeck-BlackItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDeck-BlackItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDeck";
  font-style: italic;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRDisplay-BlackItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRDisplay-BlackItalic-Testing.woff") format("woff");
  font-family: "FormaDJRDisplay";
  font-style: italic;
  font-weight: 900;
}
@font-face {
  src: url("/content/font/djr/FormaDJRBanner-BlackItalic-Testing.woff2") format("woff2"), url("/content/font/djr/FormaDJRBanner-BlackItalic-Testing.woff") format("woff");
  font-family: "FormaDJRBanner";
  font-style: italic;
  font-weight: 900;
}
@font-face {
  font-family: "Big Caslon FB";
  src: url("/content/font/bigcaslon/BigCaslonFB-BlackItalic.eot");
  src: local("Big Caslon FB Black Italic"), local("BigCaslonFB-BlackItalic"), url("/content/font/bigcaslon/BigCaslonFB-BlackItalic.eot?#iefix") format("embedded-opentype"), url("/content/font/bigcaslon/BigCaslonFB-BlackItalic.woff2") format("woff2"), url("/content/font/bigcaslon/BigCaslonFB-BlackItalic.woff") format("woff"), url("/content/font/bigcaslon/BigCaslonFB-BlackItalic.ttf") format("truetype");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Big Caslon FB";
  src: url("/content/font/bigcaslon/BigCaslonFB-Bold.eot");
  src: local("Big Caslon FB Bold"), local("BigCaslonFB-Bold"), url("/content/font/bigcaslon/BigCaslonFB-Bold.eot?#iefix") format("embedded-opentype"), url("/content/font/bigcaslon/BigCaslonFB-Bold.woff2") format("woff2"), url("/content/font/bigcaslon/BigCaslonFB-Bold.woff") format("woff"), url("/content/font/bigcaslon/BigCaslonFB-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "BigCaslon Expert";
  src: url("/content/font/bigcaslon/BigCaslon-Expert.eot");
  src: local("BigCaslon Expert"), local("BigCaslon-Expert"), url("/content/font/bigcaslon/BigCaslon-Expert.eot?#iefix") format("embedded-opentype"), url("/content/font/bigcaslon/BigCaslon-Expert.woff2") format("woff2"), url("/content/font/bigcaslon/BigCaslon-Expert.woff") format("woff"), url("/content/font/bigcaslon/BigCaslon-Expert.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Big Caslon FB";
  src: url("/content/font/bigcaslon/BigCaslonFB-Regular.eot");
  src: local("Big Caslon FB Regular"), local("BigCaslonFB-Regular"), url("/content/font/bigcaslon/BigCaslonFB-Regular.eot?#iefix") format("embedded-opentype"), url("/content/font/bigcaslon/BigCaslonFB-Regular.woff2") format("woff2"), url("/content/font/bigcaslon/BigCaslonFB-Regular.woff") format("woff"), url("/content/font/bigcaslon/BigCaslonFB-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Big Caslon FB";
  src: url("/content/font/bigcaslon/BigCaslonFB-Black.eot");
  src: local("Big Caslon FB Black"), local("BigCaslonFB-Black"), url("/content/font/bigcaslon/BigCaslonFB-Black.eot?#iefix") format("embedded-opentype"), url("/content/font/bigcaslon/BigCaslonFB-Black.woff2") format("woff2"), url("/content/font/bigcaslon/BigCaslonFB-Black.woff") format("woff"), url("/content/font/bigcaslon/BigCaslonFB-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Big Caslon FB";
  src: url("/content/font/bigcaslon/BigCaslonFB-Italic.eot");
  src: local("Big Caslon FB Italic"), local("BigCaslonFB-Italic"), url("/content/font/bigcaslon/BigCaslonFB-Italic.eot?#iefix") format("embedded-opentype"), url("/content/font/bigcaslon/BigCaslonFB-Italic.woff2") format("woff2"), url("/content/font/bigcaslon/BigCaslonFB-Italic.woff") format("woff"), url("/content/font/bigcaslon/BigCaslonFB-Italic.ttf") format("truetype");
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "BigCaslon Alternatives";
  src: url("/content/font/bigcaslon/BigCaslon-Alternatives.eot");
  src: local("BigCaslon Alternatives"), local("BigCaslon-Alternatives"), url("/content/font/bigcaslon/BigCaslon-Alternatives.eot?#iefix") format("embedded-opentype"), url("/content/font/bigcaslon/BigCaslon-Alternatives.woff2") format("woff2"), url("/content/font/bigcaslon/BigCaslon-Alternatives.woff") format("woff"), url("/content/font/bigcaslon/BigCaslon-Alternatives.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "BigCaslon SmallCaps";
  src: url("/content/font/bigcaslon/BigCaslon-SmallCaps.eot");
  src: local("BigCaslon SmallCaps"), local("BigCaslon-SmallCaps"), url("/content/font/bigcaslon/BigCaslon-SmallCaps.eot?#iefix") format("embedded-opentype"), url("/content/font/bigcaslon/BigCaslon-SmallCaps.woff2") format("woff2"), url("/content/font/bigcaslon/BigCaslon-SmallCaps.woff") format("woff"), url("/content/font/bigcaslon/BigCaslon-SmallCaps.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Big Caslon FB";
  src: url("/content/font/bigcaslon/BigCaslonFB-BoldItalic.eot");
  src: local("Big Caslon FB Bold Italic"), local("BigCaslonFB-BoldItalic"), url("/content/font/bigcaslon/BigCaslonFB-BoldItalic.eot?#iefix") format("embedded-opentype"), url("/content/font/bigcaslon/BigCaslonFB-BoldItalic.woff2") format("woff2"), url("/content/font/bigcaslon/BigCaslonFB-BoldItalic.woff") format("woff"), url("/content/font/bigcaslon/BigCaslonFB-BoldItalic.ttf") format("truetype");
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "BigCaslon ItalicSwash";
  src: url("/content/font/bigcaslon/BigCaslon-ItalicSwash.eot");
  src: local("BigCaslon Italic Swash"), local("BigCaslon-ItalicSwash"), url("/content/font/bigcaslon/BigCaslon-ItalicSwash.eot?#iefix") format("embedded-opentype"), url("/content/font/bigcaslon/BigCaslon-ItalicSwash.woff2") format("woff2"), url("/content/font/bigcaslon/BigCaslon-ItalicSwash.woff") format("woff"), url("/content/font/bigcaslon/BigCaslon-ItalicSwash.ttf") format("truetype");
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "PTRootUI";
  src: url("/content/font/PT-Root-UI/pt-root-ui_bold.woff2") format("woff2"), url("../scss/content/font/PT-Root-UI/pt-root-ui_bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "PTRootUI";
  src: url("/content/font/PT-Root-UI/pt-root-ui_light.woff2") format("woff2"), url("../scss/content/font/PT-Root-UI/pt-root-ui_light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "PTRootUI";
  src: url("/content/font/PT-Root-UI/pt-root-ui_medium.woff2") format("woff2"), url("../scss/content/font/PT-Root-UI/pt-root-ui_medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "PTRootUI";
  src: url("/content/font/PT-Root-UI/pt-root-ui_regular.woff2") format("woff2"), url("../scss/content/font/PT-Root-UI/pt-root-ui_regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}
:root {
  /* General Colors */
  --12punto-default-cyan: #0dbe98;
  --12punto-default-darkcyan: #0d7070;
  --12punto-default-white: #fff;
  --12punto-default-black: #252525;
  --12punto-background-color: #f0f0f0;
  --12punto-default-gray: #e7e7e7;
  --12punto-dark-gray: #525252;
  /* Other Colors */
  --12punto-header-gray: #dcdcdc;
  --12punto-c-gray: #949494;
  --12punto-author-gray: #7c7979;
  --12punto-footer-white: #f0f0f0;
  --12punto-footer-cyan: #347171;
  --12punto-input-gray: #c9d3d3;
  --12punto-box-shadow: #ababab26;
  --12punto-pink: #fb506c;
  --12punto-author-white: #dadada;
  --12punto-author-border: #b8b8b8;
  /* Font Weight */
  --12punto-font-thin: 300;
  --12punto-font-regular: 400;
  --12punto-font-normal: 500;
  --12punto-font-bold: 600;
  /* Font Size */
  --12punto-font-x-large: 75px;
  --12punto-font-large: 48px;
  --12punto-font-title: 28px;
  --12punto-font-subtitle: 24px;
  --12punto-font-gallery: 20px;
  --12punto-font-stock: 18px;
  --12punto-font-medium: 17px;
  --12punto-font-small: 14px;
  --12punto-font-x-small: 12px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
  outline: 0;
}

* {
  margin: 0;
}

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-thumb {
  background-color: var(--12punto-default-cyan);
  border-radius: 3px;
}

html,
body {
  height: 100%;
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  font-family: "FormaDJRDisplay", sans-serif;
  background-color: var(--12punto-background-color);
  min-height: 100vh;
  padding-top: 134px;
  font-size: var(--12punto-font-small);
  color: var(--12punto-default-black);
  font-weight: var(--12punto-font-normal);
  letter-spacing: 0.2px;
}
@media (max-width: 1000px) {
  body {
    padding-top: 150px;
  }
}
@media (max-width: 768px) {
  body {
    padding-top: 100px;
  }
}
@media (min-width: 768px) {
  body .lb-outerContainer {
    width: 100%;
    padding: 15px;
    height: fit-content;
  }
  body .lb-outerContainer .lb-container {
    width: 100%;
  }
  body .lb-outerContainer .lb-container .lb-image {
    max-width: 1200px;
    width: 100% !important;
    height: fit-content !important;
  }
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

input,
button,
textarea,
select {
  font: inherit;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

a {
  text-decoration: none;
  color: var(--12punto-default-black);
  overflow: hidden;
  transition: all 0.2s;
}
a p {
  transition: all 0.2s;
}
a:hover {
  color: var(--12punto-default-cyan);
  transition: all 0.2s;
}
a:hover p {
  color: var(--12punto-default-cyan);
}

#root,
#__next {
  isolation: isolate;
}

.scroll {
  height: 70px;
}

@media (max-width: 1000px) {
  img:not(.health img, .law img, .adarea img, .readsmore img, .science img, .latest img, .sport .second img) {
    height: auto !important;
  }
}

.embed-video-container {
  position: relative;
  overflow: hidden;
  width: 100%;
}
.embed-video-container::after {
  display: block;
  content: "";
  padding-top: 56.25%;
}
.embed-video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

p.alinti {
  font-family: "DM Serif Display";
  font-style: italic;
  letter-spacing: -0.1px;
  font-weight: 400;
}

.dark-mode {
  --12punto-default-white: #424242;
  --12punto-default-black: #fff;
  --12punto-background-color: #303030;
}
.dark-mode img[src$="no-image.svg"] {
  filter: brightness(86%) contrast(147%) hue-rotate(194deg) saturate(141%) invert(100%);
}
.dark-mode header section.top {
  background-color: #272727;
}
.dark-mode header section.top .container .content nav a {
  color: var(--12punto-default-black);
}
.dark-mode header section.top .container .content nav a:hover {
  color: var(--12punto-default-cyan);
  transition: all 0.2s;
}
.dark-mode header section.top .container .content nav .theme .dropdown .icon i {
  color: #fff;
}
.dark-mode header section.top .container .content nav .theme .dropdown .select {
  background-color: #303030;
}
.dark-mode header section.top .container .content nav .theme .dropdown .select .themes {
  color: #fff;
}
.dark-mode header section.top .container .content nav .theme .dropdown .select .themes:hover {
  color: #fff;
}
@media (max-width: 1000px) {
  .dark-mode header section.top .container .content nav .theme .dropdown .select .themes:not(:last-child) {
    border-right: 2px solid #46be96;
  }
}
.dark-mode header section.top .container .content nav .theme .dropdown .select .selected-theme {
  color: #46be96;
  background-color: #303030;
}
.dark-mode header section.top .container .content nav .theme .dropdown .select .selected-theme:hover {
  color: #46be96;
  background-color: #303030;
}
@media (max-width: 1000px) {
  .dark-mode header section.top .container .content nav .theme .dropdown .select {
    background-color: #303030;
  }
}
@media (max-width: 1000px) {
  .dark-mode header section.top .container .content nav {
    background-color: var(--12punto-background-color);
  }
}
.dark-mode header section.bottom {
  background-color: var(--12punto-default-white) !important;
}
.dark-mode header section.bottom .value {
  color: #000;
}
.dark-mode header section.bottom .decrease span, .dark-mode header section.bottom .decrease img {
  filter: invert(33%) sepia(92%) saturate(4236%) hue-rotate(349deg) brightness(91%) contrast(93%) !important;
}
.dark-mode main .content {
  /*HOME*/
  /*NEWS - AUTHORS*/
  /*STATIC PAGES*/
}
.dark-mode main .content h3:after {
  border-bottom: solid 1.5px #fff !important;
}
.dark-mode main .content section.latest {
  background: var(--12punto-default-white);
  /*box-shadow: 0px 0px 6px 0px var(--12punto-box-shadow);*/
}
.dark-mode main .content section.last24 a:before {
  border: 3px solid #121212 !important;
}
.dark-mode main .content section.last24 .second a {
  background-color: var(--12punto-default-white);
}
.dark-mode main .content section.breaking .pagination .swiper-pagination-bullet {
  color: #fff !important;
}
.dark-mode main .content section.breaking swiper-container {
  background-color: var(--12punto-default-white);
}
.dark-mode main .content section.breaking swiper-container swiper-slide {
  background-color: var(--12punto-default-white);
}
.dark-mode main .content section.bottom .left a {
  box-shadow: unset !important;
}
.dark-mode main .content section.home-authors {
  background-color: var(--12punto-default-white);
}
.dark-mode main .content section.home-authors button {
  background-color: var(--12punto-default-white);
}
.dark-mode main .content section.home-authors swiper-slide a, .dark-mode main .content section.home-authors .home-authors-box a {
  background-color: var(--12punto-background-color);
}
.dark-mode main .content section.home-authors swiper-slide a img, .dark-mode main .content section.home-authors .home-authors-box a img {
  border-color: #fff;
}
.dark-mode main .content section.home-authors swiper-slide a h4, .dark-mode main .content section.home-authors .home-authors-box a h4 {
  color: #e7e7e7;
}
.dark-mode main .content section.home-authors swiper-slide a:hover, .dark-mode main .content section.home-authors .home-authors-box a:hover {
  background-color: #121212;
}
.dark-mode main .content section.opinion .first .box a {
  box-shadow: unset !important;
}
.dark-mode main .content section.opinion .first .box a div:after {
  color: #fff;
}
.dark-mode main .content section.opinion .first .social span {
  color: #fff;
}
.dark-mode main .content section.opinion .first .social .boxes a:nth-child(3) img {
  filter: invert(100%) sepia(0%) saturate(1939%) hue-rotate(195deg) brightness(108%) contrast(101%);
}
.dark-mode main .content section.opinion .first form #btnSaveEmail {
  color: var(--12punto-default-white);
}
.dark-mode main .content section.economy .box a {
  box-shadow: unset !important;
}
.dark-mode main .content section.sport .left .inside {
  box-shadow: 0px 0px 6px 0px var(--12punto-box-shadow);
}
.dark-mode main .content section.science .box a span {
  color: #fff;
}
.dark-mode main .content section.gourmet .box a {
  box-shadow: unset !important;
}
.dark-mode main .content section.life .box p {
  color: #fff;
}
.dark-mode main .content section.inform a p, .dark-mode main .content section.inform a i {
  color: #fff;
}
.dark-mode main .content section.breadcrumb a {
  color: #e5e5e5 !important;
}
.dark-mode main .content section.breadcrumb a:hover {
  color: var(--12punto-default-darkcyan) !important;
}
.dark-mode main .content section.interests .box a {
  box-shadow: unset;
}
.dark-mode main .content section.share .socials .box, .dark-mode main .content section.share-article .socials .box, .dark-mode main .content section.share-author .socials .box {
  background-color: #fff !important;
}
.dark-mode main .content section.share .socials .box i, .dark-mode main .content section.share-article .socials .box i, .dark-mode main .content section.share-author .socials .box i {
  color: var(--12punto-default-white);
}
.dark-mode main .content section.share .socials .gnews, .dark-mode main .content section.share-article .socials .gnews, .dark-mode main .content section.share-author .socials .gnews {
  background-color: #fff !important;
}
.dark-mode main .content section.share .date span, .dark-mode main .content section.share-article .date span, .dark-mode main .content section.share-author .date span {
  color: #fff !important;
}
.dark-mode main .content section.author .socials .box {
  background-color: #fff !important;
}
.dark-mode main .content section.details-author a span {
  color: #e5e5e5;
}
.dark-mode main .content section.today-authors-page .box a, .dark-mode main .content section.authors-page .box a {
  background-color: var(--12punto-default-white);
}
.dark-mode main .content section.today-authors-page .box a img, .dark-mode main .content section.authors-page .box a img {
  border-color: #fff;
}
.dark-mode main .content section.today-authors-page .box a h4, .dark-mode main .content section.authors-page .box a h4 {
  color: #e7e7e7;
}
.dark-mode main .content section.today-authors-page .box a:hover, .dark-mode main .content section.authors-page .box a:hover {
  background-color: #121212;
}
.dark-mode main .content section.kunye table tr:nth-child(odd) {
  color: var(--12punto-default-white);
}
.dark-mode main .content section.details-contact .contact table td:nth-child(3), .dark-mode main .content section.details-contact .contact table td span {
  color: #e5e5e5;
}
.dark-mode footer section.top .footer-logo {
  background-image: url(https://i.12punto.com.tr/content/img/header/logo.svg);
}

header {
  position: fixed;
  inset: 0;
  z-index: 2;
  height: 120px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
header section {
  display: grid;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin: auto;
  justify-items: center;
  grid-auto-columns: 1fr 6.8fr 1fr;
  grid-auto-flow: column;
}
header section.top {
  height: 70px;
  background-color: #272727;
}
header section.top .container {
  display: grid;
  max-width: 1200px;
  width: 100%;
  margin: auto;
  justify-items: center;
  grid-auto-flow: column;
  /*
  .empty {
  	width: 160px;
  	height: 10px;
  	display: block;
  }*/
}
header section.top .container .content {
  display: grid;
  width: 100%;
  padding: 0 15px;
  align-items: center;
  position: relative;
}
header section.top .container .content .logo {
  width: 160px;
  grid-column: 1;
  z-index: 2;
}
header section.top .container .content nav {
  display: grid;
  justify-content: flex-start;
  align-items: center;
  grid-column: 2/span 8;
  height: 100%;
  grid-auto-flow: column;
  justify-items: center;
  max-width: 980px;
}
header section.top .container .content nav a {
  transition: all 0.4s;
  padding: 5px;
  margin-right: 10px;
  font-weight: var(--12punto-font-normal);
  font-size: 18px;
  color: var(--12punto-default-white);
  cursor: pointer;
  letter-spacing: 0.2px;
  z-index: 2;
}
header section.top .container .content nav a.active, header section.top .container .content nav a:hover {
  border-radius: 5px;
  color: var(--12punto-default-cyan);
}
header section.top .container .content nav .theme {
  position: absolute;
  right: 75px;
  top: 13px;
  display: flex;
  z-index: 3;
}
header section.top .container .content nav .theme .dropdown {
  position: relative;
  display: inline-block;
}
header section.top .container .content nav .theme .dropdown .select {
  display: block;
  visibility: hidden;
  opacity: 0;
  transition: all 0.4s;
  position: absolute;
  background-color: #f9f9f9;
  border-radius: 5px;
  left: -16px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index: 1;
  margin-top: 5px;
}
header section.top .container .content nav .theme .dropdown .icon {
  cursor: pointer;
}
header section.top .container .content nav .theme .dropdown .icon i {
  color: var(--12punto-default-black);
  font-size: 20px;
}
header section.top .container .content nav .theme .dropdown .themes {
  padding: 12px 16px;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 10px;
  transition: all 0.4s;
  border-radius: unset;
  cursor: pointer;
}
header section.top .container .content nav .theme .dropdown .themes i {
  width: 14px;
}
header section.top .container .content nav .theme .dropdown .themes:nth-child(1) {
  border-radius: 5px 5px 0px 0px;
}
header section.top .container .content nav .theme .dropdown .themes:nth-child(3) {
  border-radius: 0px 0px 5px 5px;
}
header section.top .container .content nav .theme .dropdown .themes:hover {
  background-color: #ddd;
}
header section.top .container .content nav .theme .dropdown .selected-theme {
  color: #46be96;
}
header section.top .container .content nav .theme .dropdown .select.show {
  visibility: visible;
  opacity: 1;
}
header section.top .container .content .active {
  transform: translateX(0);
}
header section.top .container .content .search-modal {
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 50%;
  left: 50%;
  gap: 12px;
  transform: translate(-50%, -50%);
  background-color: rgba(39, 39, 39, 0.3803921569);
  /*backdrop-filter: blur(4px) brightness(0.5);*/
  display: flex;
  flex-direction: column;
  z-index: -1;
  /*padding: 24px;*/
  border-radius: 5px;
  transition: all 0.4s;
  visibility: hidden;
  opacity: 0;
}
header section.top .container .content .search-modal form {
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  width: 100%;
  max-width: 768px;
  max-height: 95vh;
  padding: 15px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  overflow-y: auto;
  z-index: 4;
}
header section.top .container .content .search-modal form .advancedSearchClose {
  position: absolute;
  right: 1rem;
  top: 1rem;
  background-color: var(--12punto-default-black);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  cursor: pointer;
  border-radius: 5px;
}
header section.top .container .content .search-modal form .advancedSearchClose i {
  color: var(--12punto-default-white);
  font-size: var(--12punto-font-gallery);
}
header section.top .container .content .search-modal form .archiveInput, header section.top .container .content .search-modal form .archiveInputText {
  font-weight: 600;
  font-size: 0.8rem;
  padding: 1rem;
  height: 38px;
  background-color: var(--12punto-default-white);
  border: none;
  /*		box-shadow: 0 0 15px -3px rgba(0, 0, 0, 0.2);*/
  transition: 0.3s ease-in-out;
  margin-right: 10px;
  border-radius: 5px;
}
@media (max-width: 450px) {
  header section.top .container .content .search-modal form .archiveInput, header section.top .container .content .search-modal form .archiveInputText {
    display: block;
    width: 100%;
  }
}
header section.top .container .content .search-modal form .searchTitle {
  display: flex;
  justify-content: space-between;
  margin-top: 15px;
  font-size: var(--12punto-font-medium);
  font-weight: 500;
}
@media (max-width: 600px) {
  header section.top .container .content .search-modal form .searchTitle {
    display: block;
  }
}
header section.top .container .content .search-modal form .searchDataPicker {
  display: flex;
  margin: 25px 0;
}
header section.top .container .content .search-modal form .searchDataPicker div {
  display: inline-block;
  margin-right: 15px;
}
header section.top .container .content .search-modal form .searchDataPicker div input {
  color: var(--12punto-default-black);
  border: 1px solid var(--12punto-author-border);
}
@media (max-width: 520px) {
  header section.top .container .content .search-modal form .searchDataPicker {
    flex-direction: column;
  }
  header section.top .container .content .search-modal form .searchDataPicker div {
    margin-right: 0;
    margin-bottom: 15px;
  }
}
header section.top .container .content .search-modal form .searchInputs {
  margin-top: 15px;
  width: 100%;
  display: flex;
  align-items: center;
  background: var(--12punto-background-color);
  padding: 15px;
  margin-bottom: 10px;
  border-radius: 5px;
}
header section.top .container .content .search-modal form .searchInputs .labelBox {
  width: 30%;
}
header section.top .container .content .search-modal form .searchInputs .inputBox {
  width: 70%;
  margin-left: auto;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 15px;
}
header section.top .container .content .search-modal form .searchInputs .inputBox input {
  width: 28.5%;
  height: 35px;
  border: 0;
  outline: 0;
  padding: 0 15px;
  transition: background 0.3s;
  font-size: 15px;
  font-weight: 400;
  border-radius: 5px;
  margin: 0 5px;
  background-color: var(--12punto-default-white);
  color: var(--12punto-default-black);
  border: 1px solid var(--12punto-author-border);
}
header section.top .container .content .search-modal form .searchInputs .inputBox input:focus {
  border: 1px solid #ccc;
}
@media (max-width: 1000px) {
  header section.top .container .content .search-modal form .searchInputs {
    display: block;
  }
  header section.top .container .content .search-modal form .searchInputs .labelBox {
    width: 100% !important;
    margin-bottom: 15px;
  }
  header section.top .container .content .search-modal form .searchInputs .inputBox {
    width: 100% !important;
    display: block !important;
  }
  header section.top .container .content .search-modal form .searchInputs .inputBox input {
    width: 100% !important;
  }
  header section.top .container .content .search-modal form .searchInputs .inputBox span {
    display: block;
    margin: 15px 0;
  }
}
header section.top .container .content .search-modal form .buttons {
  display: flex;
  justify-content: flex-end;
}
header section.top .container .content .search-modal form .buttons .searchFilterButton {
  display: inline-block;
  padding: 5px 10px;
  text-align: center;
  color: #fff;
  font-size: var(--12punto-font-medium);
  font-weight: 400;
  transition: background 0.3s;
  cursor: pointer;
  border-radius: 5px;
  background-color: #989898;
  margin-right: 10px;
}
header section.top .container .content .search-modal form .buttons #submitButton {
  background-color: var(--12punto-default-cyan);
  margin: 0;
  border: none;
}
header section.top .container .content .opens {
  visibility: visible;
  opacity: 1;
  z-index: 1000;
}
header section.top .container .content form.search {
  position: absolute;
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
  z-index: 2;
  right: 15px;
  width: fit-content;
}
header section.top .container .content form.search .search-box {
  width: 100%;
  max-width: 200px;
  position: relative;
  display: flex;
  align-items: center;
}
header section.top .container .content form.search .search-box .buttons {
  margin: auto;
  position: absolute;
  transition: 0.4s;
  display: flex;
  gap: 10px;
  right: 5px;
  z-index: 2 !important;
}
header section.top .container .content form.search .search-box .buttons i {
  color: var(--12punto-default-black) !important;
  font-size: 20px;
  cursor: pointer;
}
header section.top .container .content form.search .search-box .buttons #filter {
  display: block;
}
header section.top .container .content form.search .search-input {
  display: block;
  border: 1px solid var(--12punt-default-cyan);
  background: none;
  outline: none;
  color: var(--12punto-default-black) !important;
  font-size: 17px;
  transition: 0.4s;
  line-height: 50px;
  height: 40px;
  z-index: 1 !important;
  padding: 0 55px 0 10px !important;
  margin: auto;
  background-color: var(--12punto-default-white);
  box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.15);
  pointer-events: all !important;
  border-radius: 5px;
  width: 100%;
}
header section.top .container .content form.search .search-input::placeholder {
  font-size: 17px;
  color: var(--12punto-default-black);
}
header section.top .container .content form.search .search-input::selection {
  background-color: var(--12punto-default-cyan);
  padding: 0 3px;
  color: var(--12punto-default-white);
}
header section.bottom {
  height: 40px;
  background-color: var(--12punto-header-gray);
  transition: all 0.4s;
  overflow: hidden;
}
header section.bottom .container {
  display: grid;
  max-width: 1200px;
  width: 100%;
  margin: auto;
  justify-items: center;
  grid-auto-flow: column;
  padding: 0 15px;
  /*.empty {
  	width: 160px;
  	height: 10px;
  	display: block;
  }*/
}
header section.bottom .container .content {
  display: flex;
  width: 100%;
  height: 40px;
  align-content: center;
  justify-content: center;
  align-items: center;
  gap: 30px;
}
header section.bottom .container .content .item {
  display: flex;
  height: 40px;
  gap: 10px;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: var(--12punto-font-bold);
  color: var(--12punto-default-black);
}
header section.bottom .container .content .item img {
  width: 15px;
  height: 15px !important;
  max-width: unset;
}
header section.bottom .container .content .item .increase, header section.bottom .container .content .item .decrease {
  display: grid;
  grid-auto-flow: column;
  align-items: center;
  gap: 5px;
}
header section.bottom .container .content .item .increase img, header section.bottom .container .content .item .increase span {
  filter: invert(22%) sepia(99%) saturate(3460%) hue-rotate(104deg) brightness(93%) contrast(104%);
}
header section.bottom .container .content .item .decrease img, header section.bottom .container .content .item .decrease span {
  filter: brightness(0) saturate(100%) invert(49%) sepia(14%) saturate(2477%) hue-rotate(314deg) brightness(89%) contrast(59%);
}
header section.bottom .container .content .item .decrease img {
  transform: rotate(180deg);
}
header section.bottom .container .content .item .value {
  display: grid;
}
header section.bottom .container .content .item .value span:nth-child(1) {
  font-weight: var(--12punto-font-regular);
  font-size: 14px;
}
header section.bottom .container .content .item .value span:nth-child(2) {
  font-weight: var(--12punto-font-thin);
  font-size: 14px;
  line-height: 8px;
}
header section.bottom .container .content a {
  font-size: 13px;
  color: var(--12punto-default-black);
}
header section.bottom.hide {
  visibility: hidden;
  height: 0 !important;
  top: 70px !important;
}
header section.bottom.hide nav {
  display: none !important;
}
@media (min-width: 1000px) and (max-width: 1150px) {
  header section.top .container .content nav a {
    margin-right: 5px;
  }
  header section.top .container .content nav .search .search-box {
    max-width: 150px;
  }
}
@media (max-width: 1000px) {
  header {
    height: 70px;
  }
  header section.top {
    display: flex;
    justify-content: space-between;
  }
  header section.top .container {
    height: 100%;
  }
  header section.top .container .content .logo {
    position: absolute;
    left: 50%;
    top: 50%;
    translate: -50% -50%;
    padding: 0;
  }
  header section.top .container .content nav {
    position: absolute;
    inset: 0;
    height: calc(100vh - 70px);
    display: block;
    margin-top: 70px;
    background-color: #f0f0f0;
    display: flex;
    flex-direction: column;
    padding: 15px;
    transform: translateX(-100%);
    transition: all 0.4s;
    z-index: 1 !important;
    gap: 10px;
    padding: 15px 0;
    padding-top: 55px;
  }
  header section.top .container .content nav a {
    width: 100%;
    display: flex;
    color: var(--12punto-default-black);
    padding-left: 15px;
    margin: 0;
  }
  header section.top .container .content nav .theme {
    position: unset;
    width: 100%;
    display: block;
  }
  header section.top .container .content nav .theme .dropdown .icon i {
    color: #252525;
  }
  header section.top .container .content nav .theme .dropdown .select {
    display: flex;
    margin-top: 2px;
    visibility: visible;
    opacity: 1;
    margin: 0;
    box-shadow: unset;
    background-color: #f0f0f0;
    position: unset;
  }
  header section.top .container .content nav .theme .dropdown .select .themes {
    padding: 7px 15px;
    color: #252525;
    border-radius: unset;
    font-size: 18px;
  }
  header section.top .container .content nav .theme .dropdown .select .themes:hover {
    color: #252525;
    background-color: unset;
  }
  header section.top .container .content nav .theme .dropdown .select .themes:not(:last-child) {
    border-right: 2px solid #f0f0f0;
  }
  header section.top .container .content nav .theme .dropdown .select .selected-theme {
    color: #fff;
    background-color: #272727;
  }
  header section.top .container .content nav .theme .dropdown .select .selected-theme:hover {
    color: #fff;
    background-color: #272727;
  }
  header section.top .container .content nav form.search {
    left: 15px;
    top: 10px;
    width: 100%;
    padding-right: 20px;
  }
  header section.top .container .content nav form.search .search-box {
    max-width: 100%;
  }
  header section.top .container .content .active {
    color: var(--12punto-default-white);
  }
  header section.bottom {
    height: 50px;
  }
  header section.bottom .container {
    padding: 0 10px;
  }
  header section.bottom .container .content {
    height: 50px;
    overflow-y: hidden;
    overflow-x: scroll;
    padding: 10px 0;
    justify-content: unset;
  }
  header section.bottom .container .content::-webkit-scrollbar {
    width: 5px;
    height: 5px;
  }
  header section.bottom .container .content::-webkit-scrollbar-thumb {
    background-color: var(--12punto-default-gray);
  }
  header .wrapper-menu {
    width: 35px;
    height: 35px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
    transition: transform 330ms ease-out;
    position: absolute;
    left: 18px;
    top: 18px;
    z-index: 2;
  }
  header .wrapper-menu.open {
    transform: rotate(-45deg);
  }
  header .line-menu {
    background-color: #fff;
    border-radius: 5px;
    width: 100%;
    height: 5px;
  }
  header .line-menu.half {
    width: 50%;
  }
  header .line-menu.start {
    transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57);
    transform-origin: right;
  }
  header .open .line-menu.start {
    transform: rotate(-90deg) translateX(3px);
  }
  header .line-menu.end {
    align-self: flex-end;
    transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57);
    transform-origin: left;
  }
  header .open .line-menu.end {
    transform: rotate(-90deg) translateX(-3px);
  }
}
@media (max-width: 768px) {
  header section.bottom .container .content {
    gap: 10px;
  }
  header section.bottom .container .content .item {
    font-size: 12px;
    gap: 5px;
  }
  header section.bottom .container .content .item .increase, header section.bottom .container .content .item .decrase {
    gap: 5px;
  }
}

footer {
  width: 100%;
  background-color: var(--12punto-default-white);
  margin-top: 80px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
footer section {
  display: grid;
  padding: 30px 15px;
  gap: 25px;
  max-width: 1170px;
  width: 100%;
  margin: 0 auto;
}
footer section hr {
  border: 1px solid var(--12punto-footer-white);
}
footer section h3 {
  font-weight: var(--12punto-font-bold);
  font-size: 20px;
  color: var(--12punto-default-black);
}
footer section.top {
  grid-auto-flow: column;
  align-items: center;
  grid-auto-columns: 1fr 4fr 2fr;
  gap: 24px;
}
footer section.top .footer-logo {
  background-image: url(https://i.12punto.com.tr/content/img/footer/logo.svg);
  max-width: 160px;
  height: 43px;
  width: 100%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom;
}
footer section.top .follow {
  display: grid;
  justify-items: end;
}
footer section.top .follow span {
  font-weight: var(--12punto-font-bold);
  color: var(--12punto-default-cyan);
}
footer section.top .follow .social {
  display: grid;
  justify-content: flex-start;
  grid-auto-flow: column;
  align-items: center;
  gap: 8px;
  margin-top: 15px;
}
footer section.top .follow .social .box {
  display: grid;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid var(--12punto-default-cyan);
  transition: all 0.4s;
  color: var(--12punto-default-cyan);
}
footer section.top .follow .social .box img {
  width: 18px;
  height: 18px;
  object-fit: cover;
  filter: invert(57%) sepia(96%) saturate(363%) hue-rotate(117deg) brightness(85%) contrast(103%);
}
footer section.top .follow .social .box:last-child img {
  filter: unset;
}
footer section.top .follow .social .box:last-child:hover {
  filter: unset;
}
footer section.top .follow .social .box:last-child:hover img {
  filter: unset;
}
footer section.top .follow .social .box:hover {
  background-color: var(--12punto-default-cyan);
  color: #272727;
}
footer section.top .follow .social .box:hover img {
  filter: invert(10%) sepia(29%) saturate(0%) hue-rotate(246deg) brightness(105%) contrast(90%);
}
footer section.top nav {
  display: grid;
  gap: 20px;
  grid-auto-flow: column;
  max-width: fit-content;
}
footer section.top nav a {
  font-weight: var(--12punto-font-normal);
  font-size: 15px;
}
footer section.middle {
  gap: 20px;
}
footer section.middle nav {
  display: grid;
  gap: 15px;
  height: fit-content;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(5, 1fr);
}
footer section.middle nav a {
  font-weight: var(--12punto-font-regular);
  font-size: var(--12punto-font-small);
}
@media (max-width: 1000px) {
  footer section.middle nav a {
    font-size: var(--12punto-font-x-small);
  }
}
footer section.bottom {
  display: grid;
  grid-auto-flow: column;
  align-items: center;
  justify-content: space-between;
}
footer section.bottom nav {
  display: grid;
  gap: 20px;
  grid-auto-flow: column;
}
footer section.bottom nav a {
  background: #000;
  padding: 5px;
  border-radius: 5px;
  color: var(--12punto-default-black);
}
footer section.bottom span {
  font-size: var(--12punto-font-small);
}
@media (max-width: 768px) {
  footer section.top {
    grid-auto-flow: row;
    justify-items: center;
  }
  footer section.top .follow {
    justify-items: unset;
    text-align: center;
  }
  footer section hr, footer section.middle {
    display: none;
  }
  footer section.bottom {
    grid-auto-flow: row;
    justify-content: center;
    gap: 24px;
  }
  footer section.bottom span {
    text-align: center;
  }
}
@media (max-width: 420px) {
  footer section.top nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 20px;
    column-gap: 5px;
  }
  footer section.top nav a {
    flex: 0 0 25%;
    text-align: center;
  }
  footer section.top nav a:nth-child(4), footer section.top nav a:nth-child(5) {
    flex: 0 0 35%;
  }
}

main {
  display: -ms-grid;
  display: grid;
  max-width: 1556px;
  width: 100%;
  margin: auto;
  justify-items: center;
  grid-auto-columns: 1fr 6.8fr 1fr;
  grid-auto-flow: column;
}
main .subNews {
  width: 160px;
  height: 600px;
  display: block;
  position: sticky;
  top: 95px;
  overflow: hidden;
  border-radius: 5px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
main .subNews img {
  max-width: 100%;
  margin: 0 auto;
}
@media (max-width: 1350px) {
  main .subNews:not(.readsmore .subNews, main .content section.subNews) {
    display: none;
  }
}
main .content, main article {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  padding: 0 15px;
  display: -ms-grid;
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(24, 1fr);
}
main .content article, main article article {
  display: -ms-grid;
  display: grid;
  grid-column: 1/span 24;
  padding: 0;
  gap: 24px;
  grid-template-columns: repeat(24, 1fr);
}
main .content article article, main article article article {
  display: unset !important;
  grid-column: unset !important;
}
main .content section.subNews, main article section.subNews {
  width: 100%;
  position: unset;
  height: unset;
  /*background-color: var(--12punto-default-gray);*/
  top: unset;
  grid-column: 1/span 24;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
main .content section.subNews img, main article section.subNews img {
  width: 100%;
  height: 100% !important;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
main .content section.adarea, main article section.adarea {
  display: -ms-grid;
  display: grid;
  grid-column: 19/span 6;
  gap: 24px;
  grid-template-rows: max-content;
  margin-top: 60px;
}
@media (min-width: 1001px) {
  main .content section.adarea a, main article section.adarea a {
    position: sticky;
    top: 80px;
  }
}
@media (max-width: 1000px) {
  main .content section.adarea, main article section.adarea {
    grid-column: 13/span 12 !important;
  }
  main .content section.adarea img, main article section.adarea img {
    width: 100%;
    object-fit: cover;
  }
}
@media (max-width: 600px) {
  main .content section.adarea, main article section.adarea {
    display: none;
  }
}
main .content section.error-page, main article section.error-page {
  display: grid;
  justify-items: center;
  width: 100%;
  align-items: center;
  gap: 24px;
  justify-content: center;
  grid-column: 1/span 24;
}
main .content section.error-page p, main article section.error-page p {
  font-size: 1.2rem;
  font-weight: 400;
  text-align: center;
  color: #6f7481;
}
main .content section.error-page a, main article section.error-page a {
  width: 150px;
  height: 50px;
  border-radius: 10px;
  background-color: var(--12punto-default-cyan);
  color: #FFF;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
}
main .content section.error-page img, main article section.error-page img {
  max-width: 70%;
}
main .content section.breadcrumb, main article section.breadcrumb {
  grid-column: 1/span 24;
  padding: 24px 0;
  border-bottom: 1px solid var(--12punto-default-gray);
  font-size: var(--12punto-font-x-small);
}
main .content section.breadcrumb h1, main article section.breadcrumb h1 {
  all: unset;
}
main .content section.breadcrumb a, main article section.breadcrumb a {
  color: var(--12punto-author-gray);
}
main .content section.breadcrumb a:hover, main article section.breadcrumb a:hover {
  color: var(--12punto-default-darkcyan);
}
main .content section.share, main .content section.share-article, main .content section.share-author, main article section.share, main article section.share-article, main article section.share-author {
  border-top: 1px solid var(--12punto-default-gray);
  border-bottom: 1px solid var(--12punto-default-gray);
  padding: 15px 0;
  display: grid;
  justify-content: space-between;
  grid-column: 1/span 24;
  grid-auto-flow: column;
}
main .content section.share .socials, main .content section.share-article .socials, main .content section.share-author .socials, main article section.share .socials, main article section.share-article .socials, main article section.share-author .socials {
  display: grid;
  gap: 10px;
  grid-auto-flow: column;
  position: relative;
  align-items: center;
}
main .content section.share .socials .casebtn, main .content section.share-article .socials .casebtn, main .content section.share-author .socials .casebtn, main article section.share .socials .casebtn, main article section.share-article .socials .casebtn, main article section.share-author .socials .casebtn {
  appearance: none;
  width: 30px;
  height: 30px;
  border: none;
  cursor: pointer;
}
main .content section.share .socials .case, main .content section.share-article .socials .case, main .content section.share-author .socials .case, main article section.share .socials .case, main article section.share-article .socials .case, main article section.share-author .socials .case {
  display: grid;
  visibility: hidden;
  opacity: 0;
  bottom: -40px;
  position: absolute;
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  box-shadow: 0px 0px 15px 0px var(--12punto-box-shadow);
  transition: all 0.4s;
}
main .content section.share .socials .box, main .content section.share-article .socials .box, main .content section.share-author .socials .box, main article section.share .socials .box, main article section.share-article .socials .box, main article section.share-author .socials .box {
  border-radius: 50%;
  width: 30px;
  height: 30px;
  display: grid;
  align-items: center;
  justify-content: center;
  background-color: var(--12punto-default-white);
}
main .content section.share .socials a.gnews, main .content section.share-article .socials a.gnews, main .content section.share-author .socials a.gnews, main article section.share .socials a.gnews, main article section.share-article .socials a.gnews, main article section.share-author .socials a.gnews {
  display: grid;
  grid-auto-flow: column;
  align-items: center;
  gap: 10px;
  border-radius: 5px;
  padding: 2px 8px;
  color: var(--12punto-author-gray);
  transition: all 0.4s;
  font-size: var(--12punto-font-x-small);
  height: 30px;
  background-color: var(--12punto-default-white);
}
main .content section.share .socials a.gnews:hover, main .content section.share-article .socials a.gnews:hover, main .content section.share-author .socials a.gnews:hover, main article section.share .socials a.gnews:hover, main article section.share-article .socials a.gnews:hover, main article section.share-author .socials a.gnews:hover {
  color: var(--12punto-author-gray);
}
main .content section.share .socials a.gnews img, main .content section.share-article .socials a.gnews img, main .content section.share-author .socials a.gnews img, main article section.share .socials a.gnews img, main article section.share-article .socials a.gnews img, main article section.share-author .socials a.gnews img {
  width: 70px;
  margin: 0;
}
@media (max-width: 380px) {
  main .content section.share .socials a.gnews, main .content section.share-article .socials a.gnews, main .content section.share-author .socials a.gnews, main article section.share .socials a.gnews, main article section.share-article .socials a.gnews, main article section.share-author .socials a.gnews {
    gap: 5px;
    grid-auto-flow: unset;
    justify-items: center;
    height: auto;
  }
}
main .content section.share .date, main .content section.share-article .date, main .content section.share-author .date, main article section.share .date, main article section.share-article .date, main article section.share-author .date {
  display: grid;
  align-items: center;
}
main .content section.share .date span, main .content section.share-article .date span, main .content section.share-author .date span, main article section.share .date span, main article section.share-article .date span, main article section.share-author .date span {
  font-size: var(--12punto-font-x-small);
  color: var(--12punto-author-gray);
}
@media (max-width: 550px) {
  main .content section.share, main .content section.share-article, main .content section.share-author, main article section.share, main article section.share-article, main article section.share-author {
    grid-auto-flow: unset;
    gap: 24px;
  }
}
main .content section.category div.pagination, main .content section.details-author div.pagination, main article section.category div.pagination, main article section.details-author div.pagination {
  display: grid;
  justify-items: center;
  margin-top: 24px;
}
main .content section.category div.pagination .box, main .content section.details-author div.pagination .box, main article section.category div.pagination .box, main article section.details-author div.pagination .box {
  display: inline-block;
}
main .content section.category div.pagination .box a, main .content section.details-author div.pagination .box a, main article section.category div.pagination .box a, main article section.details-author div.pagination .box a {
  color: var(--12punto-default-cyan);
  float: left;
  padding: 8px 8px;
  text-decoration: none;
  border-radius: 5px;
  transition: background-color 0.3s;
  border: 1px solid var(--12punto-input-gray);
  margin: 4px;
  height: 37px;
  width: 35px;
  text-align: center;
  background-color: var(--12punto-default-white);
}
main .content section.category div.pagination .box .active, main .content section.details-author div.pagination .box .active, main article section.category div.pagination .box .active, main article section.details-author div.pagination .box .active {
  background-color: var(--12punto-default-cyan);
  border-color: var(--12punto-default-cyan);
  color: var(--12punto-default-white);
  border-radius: 5px;
}
main .content section.category div.pagination .box .disabled, main .content section.details-author div.pagination .box .disabled, main article section.category div.pagination .box .disabled, main article section.details-author div.pagination .box .disabled {
  cursor: not-allowed;
  color: var(--12punto-default-cyan);
  background-color: var(--12punto-default-white);
  opacity: 0.5;
}
@media (max-width: 1000px) {
  main .content section.category div.pagination, main .content section.details-author div.pagination, main article section.category div.pagination, main article section.details-author div.pagination {
    grid-column: unset;
  }
}
main .content #copylink, main article #copylink {
  position: relative;
  cursor: pointer;
}
main .content #copylink i, main article #copylink i {
  font-size: var(--12punto-font-medium);
}
main .content #copylink div.tooltip, main article #copylink div.tooltip {
  visibility: hidden;
  min-width: 125px;
  background-color: #313131;
  color: #fff;
  text-align: center;
  font-weight: 600;
  font-size: 12px;
  border-radius: 6px;
  padding: 5px;
  position: absolute;
  z-index: 15;
  bottom: 40px;
  left: 15px;
  transform: translateX(-50%);
  opacity: 0;
  transition: opacity, visibility, 0.3s;
}
main .content #copylink div.tooltip::after, main article #copylink div.tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 5px;
  border-style: solid;
  border-color: #313131 transparent transparent transparent;
}
main .content #copylink .tooltip.copied, main article #copylink .tooltip.copied {
  visibility: visible;
  opacity: 1;
}
main .content .popup, main article .popup {
  position: fixed;
  z-index: 3;
  bottom: 10px;
  display: none;
  justify-content: center;
  align-items: center;
  left: 10px;
  max-width: 320px;
  width: 100%;
  height: 160px;
  /*height: 200px;*/
}
main .content .popup .popup-content, main article .popup .popup-content {
  background-color: #fff;
  padding: 15px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  z-index: 4;
  position: relative;
  display: flex;
  flex-direction: column;
  border-radius: 5px;
}
main .content .popup .popup-content .popup-close, main article .popup .popup-content .popup-close {
  font-size: 12px;
  margin-top: 10px;
  display: flex;
  justify-content: flex-end;
  width: 100%;
  gap: 5px;
}
main .content .popup .popup-content .popup-close a, main article .popup .popup-content .popup-close a {
  padding: 5px;
  width: 49%;
  display: flex;
  justify-content: center;
  font-weight: var(--12punto-font-bold);
}
main .content .popup .popup-content .popup-close a:nth-child(1), main article .popup .popup-content .popup-close a:nth-child(1) {
  background-color: var(--12punto-default-black);
  color: var(--12punto-default-cyan);
}
main .content .popup .popup-content .popup-close a:nth-child(2), main article .popup .popup-content .popup-close a:nth-child(2) {
  background-color: var(--12punto-default-cyan);
  color: var(--12punto-default-white);
}
main .content .popup .popup-content p, main article .popup .popup-content p {
  font-size: 12px;
}
main .content .popup .popup-content p a, main article .popup .popup-content p a {
  text-decoration: underline;
  font-weight: var(--12punto-font-bold);
}
@media (max-width: 1000px) {
  main .content section:not(section.law, section.health, section.education, section.adarea, section.interests), main article section:not(section.law, section.health, section.education, section.adarea, section.interests) {
    grid-column: 1/span 24 !important;
    grid-row: unset !important;
  }
}
@media (min-width: 1001px) {
  main .content section.readsmore + section.subNews, main .content section.authorsmore + section.subNews, main .content section.tags + section.subNews, main .content section.interests + section.subNews, main .content section.author-other-articles + section.subNews, main article section.readsmore + section.subNews, main article section.authorsmore + section.subNews, main article section.tags + section.subNews, main article section.interests + section.subNews, main article section.author-other-articles + section.subNews {
    grid-column: 1/span 17 !important;
  }
  main .content section.readsmore:not(article section.readsmore, section.details-author + section.readsmore), main article section.readsmore:not(article section.readsmore, section.details-author + section.readsmore) {
    grid-row: 2/span 10;
  }
}
@media (max-width: 1000px) {
  main .content, main article {
    /*section.interests {
    	order: 9;
    }*/
  }
  main .content section.breaking, main article section.breaking {
    order: -1;
  }
  main .content section.breadcrumb, main article section.breadcrumb {
    order: 1;
  }
  main .content section.author,
  main .content section.side, main .content h1.today-authors, main .content section.headline, main .content section.category, main .content section.details-contact, main .content section.kunye, main .content section.weather, main .content section.gazete-mansetleri, main article section.author,
  main article section.side, main article h1.today-authors, main article section.headline, main article section.category, main article section.details-contact, main article section.kunye, main article section.weather, main article section.gazete-mansetleri {
    order: 2;
  }
  main .content section.side, main article section.side {
    height: 200px;
  }
  main .content section.date, main .content section.author-headline, main .content section.today-authors-page, main .content section.author-about, main article section.date, main article section.author-headline, main article section.today-authors-page, main article section.author-about {
    order: 3;
  }
  main .content section.authors-page img, main article section.authors-page img {
    height: 80px !important;
  }
  main .content section.share, main .content section.share-author, main .content section.share-article, main .content h2.authors-title, main article section.share, main article section.share-author, main article section.share-article, main article h2.authors-title {
    order: 4;
  }
  main .content section.details-author,
  main .content section.article, main .content section.details, main .content section.gallery-page, main .content section.authors-page, main article section.details-author,
  main article section.article, main article section.details, main article section.gallery-page, main article section.authors-page {
    order: 5;
  }
  main .content a.articlesmore, main .content section.tags, main article a.articlesmore, main article section.tags {
    order: 6;
    grid-column: 9/span 12;
  }
  main .content a.articlesmore img, main .content section.tags img, main article a.articlesmore img, main article section.tags img {
    height: 70px !important;
  }
  main .content section.author-other-articles, main article section.author-other-articles {
    order: 6;
  }
  main .content section.authorsmore, main .content section.readsmore, main article section.authorsmore, main article section.readsmore {
    order: 8;
  }
  main .content section.readsmore + section.subNews, main .content section.authorsmore + section.subNews, main .content section.tags + section.subNews, main .content section.author-other-articles + section.subNews, main article section.readsmore + section.subNews, main article section.authorsmore + section.subNews, main article section.tags + section.subNews, main article section.author-other-articles + section.subNews {
    order: 10;
  }
}
@media (max-width: 768px) {
  main {
    display: unset;
    padding: 0 15px;
  }
  main section.content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
  }
  main section.content article {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
  }
}

/* Home */
section.latest {
  /*	background: url(https://i.12punto.com.tr/content/img/latest/bg.jpg);*/
  grid-column: 1/span 24;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  grid-gap: 24px;
}
section.latest h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.latest h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.latest a {
  display: flex;
  border-radius: 5px;
  background-color: var(--12punto-default-white);
  box-shadow: 0px 0px 6px 0px var(--12punto-box-shadow);
  flex-direction: column;
  grid-auto-flow: column;
  position: relative;
  justify-content: start;
  overflow: visible;
  /*	&::after {
  	display: grid;
  	justify-items: center;
  	content: attr(data-count);
  	position: absolute;
  	width: 22px;
  	height: 22px;
  	border: 2px solid var(--12punto-default-white);
  	background: var(--12punto-default-black);
  	top: 5px;
  	left: 70px;
  	border-radius: 50%;
  }*/
}
section.latest a p {
  font-size: 17px;
  padding: 10px;
}
section.latest a img {
  width: 100%;
  height: 140px;
  object-fit: cover;
}
section.latest a[data-count] {
  color: var(--12punto-default-white);
  font-size: var(--12punto-font-small);
}
@media (max-width: 1370px) {
  section.latest p {
    line-height: 20px;
  }
}
@media (min-width: 768px) and (max-width: 1000px) {
  section.latest {
    grid-template-columns: repeat(auto-fill, minmax(305px, 1fr));
  }
}
@media (max-width: 768px) {
  section.latest {
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    grid-row: 2/span 2 !important;
    padding: 5px;
    grid-gap: 16px;
  }
}
@media (max-width: 500px) {
  section.latest a {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    gap: 5px;
    justify-content: start;
  }
  section.latest a img {
    max-width: max-content;
    height: 100% !important;
    width: 160px;
  }
}

section.breaking {
  grid-column: 1/span 17;
  grid-row: 2/span 1;
  max-width: inherit;
  width: 100%;
  border-radius: 5px;
  overflow: hidden;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
section.breaking swiper-container {
  height: 100%;
  border-radius: 5px;
  background: var(--12punto-default-white);
}
section.breaking swiper-container swiper-slide {
  /*a {*/
  /*position: relative;*/
  /*&:before {
  		content: "";
  		position: absolute;
  		top: 0;
  		left: 0;
  		width: 100%;
  		height: 100%;
  		background: linear-gradient(360deg, #000000 0%, rgba(0, 0, 0, 0) 42.12%);
  		z-index: 1;
  	}
  }*/
}
section.breaking swiper-container swiper-slide a:hover {
  color: unset;
}
section.breaking swiper-container swiper-slide .image {
  width: 100%;
  height: 490px;
  overflow: hidden;
}
section.breaking swiper-container swiper-slide .image img {
  background-size: cover;
  background-repeat: no-repeat;
  object-fit: cover;
  width: 100%;
  height: 100%;
  z-index: 2;
}
section.breaking swiper-container swiper-slide .manset-logo {
  position: absolute;
  left: 15px;
  top: 0;
  width: 125px;
}
section.breaking swiper-container swiper-slide .canli-logo {
  position: absolute;
  right: 15px;
  top: 15px;
  width: 125px;
}
section.breaking swiper-container swiper-slide .box {
  display: grid;
  position: relative;
  justify-items: flex-start;
  width: 100%;
  z-index: 2;
  padding: 0 15px;
  max-width: 100%;
  margin-top: -33px;
  margin-bottom: 45px;
}
section.breaking swiper-container swiper-slide .box h2 {
  padding: 10px;
  font-size: var(--12punto-font-subtitle);
  font-weight: var(--12punto-font-bold);
  text-align: center;
  width: max-content !important;
  background-color: #272727;
  color: var(--12punto-default-cyan);
  letter-spacing: 0.7px;
}
section.breaking swiper-container swiper-slide .box h1 {
  font-size: var(--12punto-font-title);
  font-weight: var(--12punto-font-bold);
  color: var(--12punto-footer-black);
  padding: 0 5px;
}
section.breaking .pagination {
  position: absolute;
  z-index: 1;
  display: grid;
  grid-auto-flow: column;
  justify-content: center;
  align-items: center;
}
section.breaking .pagination .swiper-pagination-bullet {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 35px;
  height: 35px;
  border: 2px solid #808080;
  color: #808080;
  font-weight: var(--12punto-font-bold);
  background-color: transparent;
  opacity: 1;
}
section.breaking .pagination .swiper-pagination-bullet-active {
  color: var(--12punto-default-white);
  border: 2px solid var(--12punto-default-cyan);
  background-color: var(--12punto-default-cyan);
}
@media (max-width: 768px) {
  section.breaking .pagination {
    bottom: 10px;
  }
  section.breaking .pagination .swiper-pagination-bullet {
    width: 14px;
    height: 14px;
    font-size: 0px;
  }
}
section.breaking button {
  background: none;
  border-style: none;
  cursor: pointer;
  position: absolute;
  margin: 0;
  top: 40%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 1;
}
section.breaking button i {
  font-size: var(--12punto-font-large);
  color: var(--12punto-default-white);
}
section.breaking .prev {
  left: 24px;
}
section.breaking .next {
  right: 0;
}
@media (min-width: 1000px) and (max-width: 1370px) {
  section.breaking {
    grid-column: 1/span 15;
  }
  section.breaking swiper-container swiper-slide .image {
    height: 360px;
  }
}
@media (max-width: 1000px) {
  section.breaking {
    margin-left: -15px;
    width: calc(100% + 30px);
    border-radius: 0;
  }
  section.breaking swiper-container {
    border-radius: 0;
  }
}
@media (max-width: 768px) {
  section.breaking swiper-container {
    background-color: #fff;
  }
  section.breaking swiper-container swiper-slide {
    /*	padding: 10px;*/
  }
  section.breaking swiper-container swiper-slide .image {
    height: auto;
  }
  section.breaking swiper-container swiper-slide .manset-logo {
    width: 100px;
  }
  section.breaking swiper-container swiper-slide .canli-logo {
    width: 70px;
  }
  section.breaking swiper-container swiper-slide .box {
    align-items: flex-start;
    justify-items: start;
  }
  section.breaking swiper-container swiper-slide .box h2 {
    border-radius: 0;
    font-size: 20px;
    text-align: left;
    padding: 5px;
    width: fit-content !important;
  }
  section.breaking swiper-container swiper-slide .box h1 {
    width: 100% !important;
    /* margin-bottom: 35px; */
    margin: 3px 0 !important;
    overflow: hidden;
    display: -webkit-box;
    font-size: 18px;
    line-height: 20px;
    text-align: left;
    padding: 0 5px !important;
  }
}
@media (max-width: 520px) {
  section.breaking swiper-container swiper-slide {
    background-color: #fff;
  }
  section.breaking swiper-container swiper-slide a {
    /*position: relative;*/
  }
  section.breaking swiper-container swiper-slide a:before {
    background: none;
  }
  section.breaking swiper-container swiper-slide .box {
    grid-gap: 0;
    bottom: 0;
    /* justify-items: start; */
    position: relative;
    min-height: 80px;
    padding: 0;
    /*align-items: center;*/
    display: flex !important;
    flex-direction: column;
    margin-top: -25px;
    margin-bottom: 35px;
  }
  section.breaking swiper-container swiper-slide .box h2 {
    border-radius: 0;
    font-size: 18px;
    text-align: left;
    padding: 5px;
    width: fit-content !important;
  }
  section.breaking swiper-container swiper-slide .box h1 {
    width: fit-content !important;
    color: var(--12punto-default-black);
    /* margin-bottom: 35px; */
    overflow: hidden;
    display: -webkit-box;
    font-size: 17px;
    line-height: 20px;
    text-align: left;
    padding: 5px !important;
    margin-top: -3px !important;
    background-color: transparent;
  }
  section.breaking .prev,
  section.breaking .next {
    display: none;
  }
}
@media (max-width: 420px) {
  section.breaking swiper-container swiper-slide .box h1 {
    margin-top: -1px !important;
  }
}
@media (max-width: 768px) {
  section.breaking {
    padding-top: 30px;
  }
}

/* Languages bar inside .last24 under tv-button */
.last24-languages {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 10px 0;
  background: var(--12punto-default-white);
  border: 1px solid var(--12punto-default-gray);
  border-radius: 5px;
  width: 100%;
  box-sizing: border-box;
}
.last24-languages .lang-slogan {
  font-size: 13px;
  font-weight: var(--12punto-font-bold);
  color: var(--12punto-dark-gray);
  letter-spacing: 0.5px;
  text-transform: uppercase;
  margin-bottom: 10px;
  text-align: center;
  opacity: 0.9;
}
.last24-languages .lang-flags {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
}
.last24-languages .lang-flag-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  transition: transform 0.2s ease-in-out, border-color 0.2s;
  cursor: pointer;
}
.last24-languages .lang-flag-link:hover {
  transform: scale(1.15);
  border-color: var(--12punto-default-cyan);
}
.last24-languages .lang-flag-link svg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

/* Dark mode override */
.dark-mode .last24-languages {
  background: #272727;
  border-color: #3b3b3b;
}
.dark-mode .last24-languages .lang-slogan {
  color: #b0b0b0;
}
.dark-mode .last24-languages .lang-flag-link {
  border-color: rgba(255, 255, 255, 0.1);
}
.dark-mode .last24-languages .lang-flag-link:hover {
  border-color: var(--12punto-default-cyan);
}

/* Mobile overrides */
@media (max-width: 1000px) {
  .last24-languages {
    margin: 20px 0;
    padding: 20px 15px;
  }
  .last24-languages .lang-slogan {
    font-size: var(--12punto-font-subtitle);
    margin-bottom: 18px;
  }
  .last24-languages .lang-flag-link {
    width: 45px;
    height: 45px;
    flex-shrink: 0;
  }
}
section.last24 {
  grid-row: 2/span 2;
  display: grid;
  grid-auto-flow: row;
  justify-items: center;
  grid-gap: 24px;
  border-radius: 5px;
  height: max-content;
  grid-column: 18/span 7;
}
section.last24 .youtube {
  width: 100%;
  border-radius: 5px;
}
section.last24 .youtube img {
  width: 100%;
}
section.last24 .first {
  grid-auto-flow: row;
  padding: 20px;
  background-color: var(--12punto-default-white);
  gap: 15px;
  display: grid;
  width: 100%;
  border-radius: 5px;
  min-height: 920px;
  align-content: baseline;
}
section.last24 .first h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: 30px;
}
section.last24 .first p {
  height: 100%;
  border-left: 1px solid #d1d1d1;
  list-style-type: none;
  grid-auto-flow: row;
  grid-gap: 24px;
  padding-left: 15px;
  display: grid;
  align-items: start;
}
section.last24 .first p a {
  display: grid;
  font-size: var(--12punto-font-medium);
  position: relative;
  line-height: 20px;
  overflow: visible;
}
section.last24 .first p a span {
  color: var(--12punto-photo-gray);
  font-size: var(--12punto-font-x-small);
}
section.last24 .first p a::before {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: var(--12punto-default-cyan);
  border: 3px solid #d1d1d1;
  left: -21px;
  top: 5px;
}
section.last24 .second {
  justify-items: center;
  background-color: var(--12punto-background-color);
  align-items: end;
  display: grid;
  width: 100%;
}
section.last24 .second a {
  display: grid;
  grid-auto-flow: column;
  justify-items: center;
  align-items: center;
  background-color: var(--12punto-default-gray);
  border-radius: 35px;
  padding: 5px 20px;
  max-width: 260px;
  width: 100%;
  height: 45px;
  transition: all 0.4s;
}
@media (min-width: 1000px) and (max-width: 1370px) {
  section.last24 {
    grid-column: 16/span 9;
  }
  section.last24 .first {
    min-height: 780px;
  }
}
@media (max-width: 1000px) {
  section.last24 {
    max-width: 100%;
    height: unset;
    width: unset;
  }
  section.last24 .first {
    min-height: auto;
  }
}

main section.bottom {
  grid-column: 1/span 17;
  width: 100%;
  display: grid;
  /*	grid-template-columns: 1fr 1fr;*/
  gap: 24px;
}
main section.bottom .left {
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 24px;
  display: grid;
  grid-template-rows: max-content;
}
main section.bottom .left a {
  border-radius: 5px;
  background-color: var(--12punto-default-white);
  box-shadow: 0px 0px 6px 0px var(--12punto-box-shadow);
}
main section.bottom .left a p {
  padding: 10px 5px;
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-normal);
}
main section.bottom .left a img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}
main section.bottom .right {
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  gap: 24px;
  padding: 20px;
  display: grid;
}
main section.bottom .right a {
  display: grid;
  gap: 15px;
  grid-auto-flow: column;
  justify-content: start;
  align-items: center;
}
main section.bottom .right a p {
  display: grid;
  grid-auto-flow: row;
  font-size: var(--12punto-font-medium);
}
main section.bottom .right a p span {
  color: var(--12punto-default-cyan);
  font-size: var(--12punto-font-x-small);
  font-weight: var(--12punto-font-regular);
}
main section.bottom .right a img {
  width: 100px;
  height: 70px;
  object-fit: cover;
  border-radius: 5px;
  max-width: unset;
}
@media (min-width: 1000px) and (max-width: 1370px) {
  main section.bottom {
    grid-column: 1/span 15;
  }
}
@media (max-width: 1000px) {
  main section.bottom {
    grid-template-columns: unset;
    grid-template-rows: unset;
  }
  main section.bottom .left,
  main section.bottom .right {
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important;
  }
  main section.bottom .left img {
    height: auto !important;
  }
}
@media (max-width: 768px) {
  main section.bottom .left {
    grid-template-columns: unset !important;
  }
  main section.bottom .left a:not(:first-child) {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    gap: 5px;
    justify-content: start;
  }
  main section.bottom .left a:not(:first-child) img {
    max-width: max-content;
    height: 100% !important;
    width: 160px;
  }
}

section.home-authors {
  width: 100%;
  height: fit-content;
  border-radius: 5px;
  background-color: var(--12punto-default-gray);
  padding: 15px 30px;
  grid-column: 1/span 24;
  overflow: hidden;
  gap: 10px;
  display: grid;
  /*swiper-container {
  	width: 100%;
  	max-height: 415px;

  	swiper-slide {
  		a {
  			background-color: var(--12punto-author-white);
  			border: 1px dashed var(--12punto-author-border);
  			@include display-flex();
  			flex-direction: column;
  			justify-items: center;
  			gap: 5px;
  			padding: 5px;
  			border-radius: 5px;
  			height: 100%;
  			align-items: center;
  			transition: all .4s;

  			img {
  				width: 75px;
  				height: 75px;
  				object-fit: cover;
  				border: 2px dashed var(--12punto-author-border);
  				border-radius: 50%;
  			}

  			h4 {
  				font-size: var(--12punto-font-medium);
  				font-weight: var(--12punto-font-normal);
  				color: var(--12punto-author-gray);
  				text-align: center;
  			}

  			p {
  				font-size: var(--12punto-font-medium);
  				font-weight: var(--12punto-font-small);
  				color: var(--12punto-default-black);
  				text-align: center;
  			}

  			span {
  				font-size: var(--12punto-font-regular);
  				font-weight: var(--12punto-font-x-small);
  				color: var(--12punto-default-cyan);
  				text-align: center;
  			}

  			&:hover {
  				background-color: var(--12punto-default-white);
  				border-color: var(--12punto-default-cyan);

  				img {
  					border-color: var(--12punto-default-cyan)
  				}
  			}
  		}

  		@media (max-width: 1000px) {
  			height: calc((100% - 24px) / 2) !important;*/
  /*		min-height: 220px;*/
  /*padding: 10px;*/
  /*	height:auto;*/
  /*a {
  				padding: 5px;

  				p {
  					font-size: 16px;
  					overflow: hidden;
  					display: -webkit-box;
  					-webkit-line-clamp: 3;
  					-webkit-box-orient: vertical;
  				}
  			}
  		}
  	}

  	@media (max-width: 560px) {
  		max-height: 550px;
  	}
  }*/
}
section.home-authors .box {
  display: grid;
  grid-auto-flow: column;
  justify-content: space-between;
  gap: 5px;
  align-items: center;
}
section.home-authors .box h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
@media (max-width: 768px) {
  section.home-authors .box h3 {
    font-size: var(--12punto-font-gallery);
  }
}
section.home-authors .box h3:nth-child(2) {
  text-align: right;
}
section.home-authors .box .navigation {
  display: grid;
  grid-auto-flow: column;
  justify-content: space-between;
  gap: 5px;
}
section.home-authors .box .navigation button {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 2px solid var(--12punto-default-cyan);
  cursor: pointer;
  padding: 0 !important;
  display: -ms-grid;
  display: grid;
  align-items: center;
}
section.home-authors .box .navigation button i {
  color: var(--12punto-default-cyan);
}
@media (max-width: 768px) {
  section.home-authors .box .navigation div {
    display: none;
  }
}
section.home-authors .home-authors-box {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  grid-auto-rows: 1fr;
}
section.home-authors .home-authors-box a {
  background-color: var(--12punto-author-white);
  border: 1px dashed var(--12punto-author-border);
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;
  justify-items: center;
  gap: 5px;
  padding: 5px;
  border-radius: 5px;
  height: 100%;
  align-items: center;
  transition: all 0.4s;
  justify-content: center;
}
section.home-authors .home-authors-box a img {
  width: 75px;
  height: 75px;
  object-fit: cover;
  border: 2px dashed var(--12punto-author-border);
  border-radius: 50%;
}
section.home-authors .home-authors-box a h4 {
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-normal);
  color: var(--12punto-author-gray);
  text-align: center;
}
section.home-authors .home-authors-box a p {
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-small);
  color: var(--12punto-default-black);
  text-align: center;
}
section.home-authors .home-authors-box a .authors-text {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
section.home-authors .home-authors-box a span {
  font-size: var(--12punto-font-regular);
  font-weight: var(--12punto-font-x-small);
  color: var(--12punto-default-cyan);
  text-align: center;
}
section.home-authors .home-authors-box a:hover {
  background-color: var(--12punto-default-white);
  border-color: var(--12punto-default-cyan);
}
section.home-authors .home-authors-box a:hover img {
  border-color: var(--12punto-default-cyan);
}
@media (max-width: 1000px) {
  section.home-authors .home-authors-box {
    padding: 10px;
  }
  section.home-authors .home-authors-box a {
    padding: 5px;
  }
  section.home-authors .home-authors-box a p {
    font-size: 16px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
  }
}
@media (max-width: 768px) {
  section.home-authors .home-authors-box {
    grid-template-columns: unset;
    gap: 12px;
    padding: 0;
  }
  section.home-authors .home-authors-box a {
    flex-direction: row;
    gap: 10px;
    justify-content: flex-start;
  }
  section.home-authors .home-authors-box a .authors-text {
    gap: 5px;
    align-items: flex-start;
  }
  section.home-authors .home-authors-box a .authors-text p, section.home-authors .home-authors-box a .authors-text h4 {
    text-align: left;
  }
  section.home-authors .home-authors-box a .authors-text p {
    font-size: 15px;
    -webkit-line-clamp: 4;
  }
}
@media (max-width: 1000px) {
  section.home-authors {
    padding: 15px;
  }
}

section.opinion {
  grid-column: 1/span 24;
  display: grid;
  grid-auto-flow: row;
  gap: 24px;
}
section.opinion h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.opinion h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.opinion .first {
  display: grid;
  gap: 24px;
  /*@media (max-width: 495px) {
  	.box {	
  		grid-template-areas:
  			'news1 news1' 'news2 news2' 'news3 news3' 'news4 news4' 'news5 news5' 'news6 news6' 'socials socials' 'form form';
  	}
  }*/
}
section.opinion .first .box {
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  grid-template-areas: "news1 news2 news3 social-newspaper" "news4 news5 news6 form";
  gap: 24px;
  display: grid;
}
section.opinion .first .box .news1,
section.opinion .first .box .news2,
section.opinion .first .box .news3,
section.opinion .first .box .news4,
section.opinion .first .box .news5,
section.opinion .first .box .news6 {
  border-radius: 5px;
  background-color: var(--12punto-default-white);
  box-shadow: 0px 0px 6px 0px var(--12punto-box-shadow);
}
section.opinion .first .box .news1 div,
section.opinion .first .box .news2 div,
section.opinion .first .box .news3 div,
section.opinion .first .box .news4 div,
section.opinion .first .box .news5 div,
section.opinion .first .box .news6 div {
  position: relative;
}
section.opinion .first .box .news1 div:after,
section.opinion .first .box .news2 div:after,
section.opinion .first .box .news3 div:after,
section.opinion .first .box .news4 div:after,
section.opinion .first .box .news5 div:after,
section.opinion .first .box .news6 div:after {
  content: attr(data-kategori);
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: var(--12punto-default-cyan);
  color: var(--12punto-default-white);
  font-weight: var(--12punto-font-regular);
  font-size: var(--12punto-font-x-small);
  padding: 5px;
}
section.opinion .first .box .news1 p,
section.opinion .first .box .news2 p,
section.opinion .first .box .news3 p,
section.opinion .first .box .news4 p,
section.opinion .first .box .news5 p,
section.opinion .first .box .news6 p {
  padding: 10px 5px;
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-normal);
  position: relative;
}
section.opinion .first .box .news1 img,
section.opinion .first .box .news2 img,
section.opinion .first .box .news3 img,
section.opinion .first .box .news4 img,
section.opinion .first .box .news5 img,
section.opinion .first .box .news6 img {
  width: 100%;
  height: 160px;
  object-fit: cover;
}
section.opinion .first .box .news1 {
  order: 1;
  grid-area: news1;
}
section.opinion .first .box .news2 {
  order: 2;
  grid-area: news2;
}
section.opinion .first .box .news3 {
  order: 3;
  grid-area: news3;
}
section.opinion .first .box .news4 {
  order: 5;
  grid-area: news4;
}
section.opinion .first .box .news5 {
  order: 6;
  grid-area: news5;
}
section.opinion .first .box .news6 {
  order: 7;
  grid-area: news6;
}
section.opinion .first .box .social-newspaper {
  display: grid;
  grid-template-rows: 1fr 1fr;
  width: 100%;
  order: 4;
  grid-area: social-newspaper;
  row-gap: 10px;
}
section.opinion .first .box .social-newspaper .social {
  background-color: var(--12punto-pink);
  padding: 10px;
  display: grid;
  border-radius: 5px;
  align-items: start;
  gap: 10px;
  position: relative;
  overflow: hidden;
  grid-row: 2;
  grid-column: 1/span 2;
}
section.opinion .first .box .social-newspaper .social span {
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-regular);
  color: var(--12punto-default-white);
}
section.opinion .first .box .social-newspaper .social .store, section.opinion .first .box .social-newspaper .social .boxes {
  display: grid;
  gap: 5px;
  grid-auto-flow: column;
  justify-content: start;
  z-index: 1;
}
section.opinion .first .box .social-newspaper .social .store img, section.opinion .first .box .social-newspaper .social .boxes img {
  height: unset;
}
section.opinion .first .box .social-newspaper .social .store {
  gap: 5px;
}
section.opinion .first .box .social-newspaper .social .store img {
  padding: 3px;
  background-color: #000;
  max-width: 80px;
  border-radius: 3px;
}
section.opinion .first .box .social-newspaper .social .boxes a {
  width: 22px;
  height: 22px;
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  display: grid;
  justify-items: center;
  align-items: center;
}
section.opinion .first .box .social-newspaper .social .boxes a i {
  color: var(--12punto-default-black);
  font-size: var(--12punto-font-medium);
}
section.opinion .first .box .social-newspaper .social .boxes a img {
  height: 15px;
  width: 15px;
}
section.opinion .first .box .social-newspaper .social img:not(a img) {
  position: absolute;
  right: -10px;
  bottom: -40px;
  z-index: 0;
}
section.opinion .first .box .social-newspaper .daily-newspaper {
  display: flex;
  padding: 10px;
  grid-column: 1/span 2;
  background: url(../img/opinion/newspaper.jpg) no-repeat center/cover;
  border-radius: 5px;
  position: relative;
}
section.opinion .first .box .social-newspaper .daily-newspaper:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  filter: blur(5px);
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.39) 0%, rgba(13, 112, 112, 0.39) 100%);
  border-radius: 10px;
}
section.opinion .first .box .social-newspaper .daily-newspaper a {
  font-size: var(--12punto-font-gallery);
  font-weight: var(--12punto-font-regular);
  color: #fff;
  z-index: 1;
  height: 100%;
  width: 100%;
}
@media (min-width: 768px) and (max-width: 1000px) {
  section.opinion .first .box .social-newspaper .daily-newspaper a {
    font-size: var(--12punto-font-title);
  }
}
section.opinion .first .box form {
  background-color: var(--12punto-default-cyan);
  border-radius: 5px;
  padding: 15px;
  order: 8;
  grid-area: form;
}
section.opinion .first .box form div {
  padding: 15px;
  background-color: var(--12punto-default-white);
  display: grid;
  gap: 10px;
  border-radius: 5px;
  position: relative;
  height: 100%;
}
section.opinion .first .box form div p {
  margin-top: 10px;
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-bold);
  color: var(--12punto-default-cyan);
  text-align: center;
}
section.opinion .first .box form div input {
  height: 35px;
  width: 100%;
}
section.opinion .first .box form div input:focus {
  outline: none;
}
section.opinion .first .box form div input[type=email] {
  border-radius: 5px;
  border: 1px solid #d2d2d2;
  padding: 10px;
}
section.opinion .first .box form div input[type=email]::placeholder {
  color: var(--12punto-default-gray);
}
section.opinion .first .box form div input[type=button] {
  border-radius: 5px;
  background-color: var(--12punto-input-gray);
  padding: 10px;
  cursor: pointer;
  border-style: none;
  font-size: var(--12punto-font-x-small);
  font-weight: var(--12punto-font-normal);
  color: var(--12punto-default-black);
}
section.opinion .first .box form div span {
  position: absolute;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: var(--12punto-default-black);
  display: grid;
  align-items: center;
  justify-items: center;
  left: 0;
  right: 0;
  margin: auto;
  top: -30px;
}
section.opinion .first .box form div span i {
  color: var(--12punto-default-white);
  font-size: var(--12punto-font-subtitle);
}
@media (max-width: 1000px) {
  section.opinion .first {
    /*grid-template-columns: unset;*/
  }
  section.opinion .first .box {
    grid-template-columns: unset;
    grid-template-areas: "news1 news2" "news3 news4" "news5 news6" "social-newspaper social-newspaper" "form form";
  }
  section.opinion .first .box .social-newspaper {
    row-gap: unset;
    gap: 24px;
  }
  section.opinion .first .box .social-newspaper .social {
    order: 7 !important;
    grid-template-rows: 4fr 1fr 1fr;
  }
  section.opinion .first .box .social-newspaper .social span {
    font-size: var(--12punto-font-gallery);
  }
  section.opinion .first .box .social-newspaper .social .boxes {
    gap: 8px;
  }
  section.opinion .first .box .social-newspaper .social .boxes a {
    width: 30px;
    height: 30px;
  }
  section.opinion .first .box .social-newspaper .social .boxes a i {
    font-size: var(--12punto-font-gallery);
  }
  section.opinion .first .box .social-newspaper .social .store {
    gap: 10px;
  }
  section.opinion .first .box .social-newspaper .social .store img {
    border-radius: 5px;
    padding: 5px;
    max-width: 100px;
  }
}
@media (max-width: 768px) {
  section.opinion .first .box {
    grid-template-areas: "news1" "news2" "news3" "news4" "news5" "news6" "social-newspaper" "form";
  }
  section.opinion .first .box .news2, section.opinion .first .box .news3, section.opinion .first .box .news4, section.opinion .first .box .news5, section.opinion .first .box .news6 {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-content: start;
  }
  section.opinion .first .box .news2 img, section.opinion .first .box .news3 img, section.opinion .first .box .news4 img, section.opinion .first .box .news5 img, section.opinion .first .box .news6 img {
    height: 100% !important;
    max-width: max-content;
    width: 160px;
  }
  section.opinion .first .box .news2 p, section.opinion .first .box .news3 p, section.opinion .first .box .news4 p, section.opinion .first .box .news5 p, section.opinion .first .box .news6 p {
    height: 100%;
    display: grid;
    align-items: center;
  }
  section.opinion .first .box .news2 div, section.opinion .first .box .news3 div, section.opinion .first .box .news4 div, section.opinion .first .box .news5 div, section.opinion .first .box .news6 div {
    height: 100%;
  }
  section.opinion .first .box .news2 div:after, section.opinion .first .box .news3 div:after, section.opinion .first .box .news4 div:after, section.opinion .first .box .news5 div:after, section.opinion .first .box .news6 div:after {
    padding: 3px;
  }
  section.opinion .first .box .social span {
    font-size: var(--12punto-font-medium);
  }
  section.opinion .first .box form {
    height: unset;
  }
}
section.opinion .second {
  grid-template-columns: 1fr 3fr;
  display: grid;
  gap: 24px;
  /*		.whatsapp {
  	display: grid;
  	background: var(--12punto-default-white) url(https://i.12punto.com.tr/content/img/opinion/bg4.svg) no-repeat center;
  	background-size: cover;
  	padding: 35px 20px;
  	box-shadow: 0px 0px 11px 0px var(--12punto-box-shadow);

  	p {
  		display: grid;
  		justify-items: baseline;
  		font-size: var(--12punto-font-title);
  		font-weight: var(--12punto-font-bold);
  		color: var(--12punto-default-cyan);
  		line-height: var(--12punto-font-medium);

  		span {
  			font-size: var(--12punto-font-subtitles);
  			font-weight: var(--12punto-font-thin);
  			color: var(--12punto-photo-gray);
  		}
  	}

  	a {
  		display: grid;
  		grid-auto-flow: column;
  		align-items: center;
  		font-size: var(--12punto-font-medium);
  		font-weight: var(--12punto-font-normal);
  		justify-content: start;
  		gap: 10px;
  		overflow: visible;
  	}
  }*/
  /*@media (max-width: 1000px) {*/
  /*	.whatsapp {
  		grid-row: 2 / span 2;
  		grid-column: 2 / span 3;
  		height: 148px;
  		gap: 14px;

  		p {
  			gap: 14px;
  		}
  	}*/
  /*}*/
}
section.opinion .second .subscribe {
  display: grid;
}
@media (max-width: 768px) {
  section.opinion .second {
    display: flex;
    flex-direction: column-reverse;
    /*.whatsapp {
    	grid-row: 3 / span 1;
    	grid-column: 1 / span 4;
    	height: unset;
    	justify-content: center;
    }*/
  }
  section.opinion .second .subscribe img {
    width: 100%;
  }
}

section.economy {
  display: grid;
  gap: 24px;
  grid-column: 1/span 12;
  grid-template-rows: max-content;
}
section.economy h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.economy h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.economy .box {
  display: grid;
  gap: 24px;
  border-radius: 5px;
  background: var(--12punto-default-white);
  padding: 20px;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
}
section.economy .box .news5,
section.economy .box .news6,
section.economy .box .news7,
section.economy .box .news8,
section.economy .box .news9 {
  display: none;
}
section.economy .box .news1,
section.economy .box .news2,
section.economy .box .news3,
section.economy .box .news4 {
  border-radius: 5px;
  background-color: var(--12punto-background-color);
  box-shadow: 0px 0px 6px 0px var(--12punto-box-shadow);
}
section.economy .box .news1 p,
section.economy .box .news2 p,
section.economy .box .news3 p,
section.economy .box .news4 p {
  padding: 10px 5px;
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-normal);
}
section.economy .box .news1 img,
section.economy .box .news2 img,
section.economy .box .news3 img,
section.economy .box .news4 img {
  width: 100%;
  height: 165px;
  object-fit: cover;
}
section.economy .box .news1,
section.economy .box .news3 {
  grid-column: 1;
}
section.economy .box .news2,
section.economy .box .news4 {
  grid-column: 2;
}
section.economy .box .news1,
section.economy .box .news2 {
  grid-row: 1;
}
section.economy .box .news3,
section.economy .box .news4 {
  grid-row: 2;
}
@media (max-width: 768px) {
  section.economy .box {
    grid-template-rows: unset;
    grid-template-areas: "news1 news1" "news2 news2" "news3 news3" "news4 news4";
  }
  section.economy .box .news1,
  section.economy .box .news2,
  section.economy .box .news3,
  section.economy .box .news4,
  section.economy .box .news5,
  section.economy .box .news6,
  section.economy .box .news7,
  section.economy .box .nesw8,
  section.economy .box .news9 {
    grid-column: unset;
    grid-row: unset;
  }
  section.economy .box .news1 {
    grid-area: news1;
  }
  section.economy .box .news2 {
    grid-area: news2;
  }
  section.economy .box .news3 {
    grid-area: news3;
  }
  section.economy .box .news4 {
    grid-area: news4;
  }
}

section.politics {
  display: grid;
  gap: 24px;
  grid-column: 13/span 12;
  grid-template-rows: max-content;
}
section.politics h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.politics h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.politics .box {
  display: grid;
  gap: 24px;
  border-radius: 5px;
  background: var(--12punto-default-white);
  padding: 20px;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
}
section.politics .box .news5,
section.politics .box .news6,
section.politics .box .news7,
section.politics .box .news8,
section.politics .box .news9 {
  display: none;
}
section.politics .box .news1,
section.politics .box .news2,
section.politics .box .news3,
section.politics .box .news4 {
  border-radius: 5px;
  background-color: var(--12punto-background-color);
  box-shadow: 0px 0px 6px 0px var(--12punto-box-shadow);
}
section.politics .box .news1 p,
section.politics .box .news2 p,
section.politics .box .news3 p,
section.politics .box .news4 p {
  padding: 10px 5px;
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-normal);
}
section.politics .box .news1 img,
section.politics .box .news2 img,
section.politics .box .news3 img,
section.politics .box .news4 img {
  width: 100%;
  height: 165px;
  object-fit: cover;
}
section.politics .box .news1,
section.politics .box .news3 {
  grid-column: 1;
}
section.politics .box .news2,
section.politics .box .news4 {
  grid-column: 2;
}
section.politics .box .news1,
section.politics .box .news2 {
  grid-row: 1;
}
section.politics .box .news3,
section.politics .box .news4 {
  grid-row: 2;
}
@media (max-width: 768px) {
  section.politics .box {
    grid-template-rows: unset;
    grid-template-areas: "news1 news1" "news2 news2" "news3 news3" "news4 news4";
  }
  section.politics .box .news1,
  section.politics .box .news2,
  section.politics .box .news3,
  section.politics .box .news4,
  section.politics .box .news5,
  section.politics .box .news6,
  section.politics .box .news7,
  section.politics .box .nesw8,
  section.politics .box .news9 {
    grid-column: unset;
    grid-row: unset;
  }
  section.politics .box .news1 {
    grid-area: news1;
  }
  section.politics .box .news2 {
    grid-area: news2;
  }
  section.politics .box .news3 {
    grid-area: news3;
  }
  section.politics .box .news4 {
    grid-area: news4;
  }
}

section.public {
  display: grid;
  gap: 24px;
  grid-column: 13/span 12;
  grid-template-rows: max-content;
}
section.public h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.public h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.public .box {
  display: grid;
  gap: 24px;
  border-radius: 5px;
  background: var(--12punto-default-white);
  padding: 20px;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
}
section.public .box .news5,
section.public .box .news6,
section.public .box .news7,
section.public .box .news8,
section.public .box .news9 {
  display: none;
}
section.public .box .news1,
section.public .box .news2,
section.public .box .news3,
section.public .box .news4 {
  border-radius: 5px;
  background-color: var(--12punto-background-color);
  box-shadow: 0px 0px 6px 0px var(--12punto-box-shadow);
}
section.public .box .news1 p,
section.public .box .news2 p,
section.public .box .news3 p,
section.public .box .news4 p {
  padding: 10px 5px;
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-normal);
}
section.public .box .news1 img,
section.public .box .news2 img,
section.public .box .news3 img,
section.public .box .news4 img {
  width: 100%;
  height: 165px;
  object-fit: cover;
}
section.public .box .news1,
section.public .box .news3 {
  grid-column: 1;
}
section.public .box .news2,
section.public .box .news4 {
  grid-column: 2;
}
section.public .box .news1,
section.public .box .news2 {
  grid-row: 1;
}
section.public .box .news3,
section.public .box .news4 {
  grid-row: 2;
}
@media (max-width: 768px) {
  section.public .box {
    grid-template-rows: unset;
    grid-template-areas: "news1 news1" "news2 news2" "news3 news3" "news4 news4";
  }
  section.public .box .news1,
  section.public .box .news2,
  section.public .box .news3,
  section.public .box .news4,
  section.public .box .news5,
  section.public .box .news6,
  section.public .box .news7,
  section.public .box .nesw8,
  section.public .box .news9 {
    grid-column: unset;
    grid-row: unset;
  }
  section.public .box .news1 {
    grid-area: news1;
  }
  section.public .box .news2 {
    grid-area: news2;
  }
  section.public .box .news3 {
    grid-area: news3;
  }
  section.public .box .news4 {
    grid-area: news4;
  }
}

section.world {
  display: grid;
  gap: 24px;
  grid-column: 13/span 12;
  grid-template-rows: max-content;
}
section.world h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.world h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.world .box {
  display: grid;
  gap: 24px;
  border-radius: 5px;
  background: var(--12punto-default-white);
  padding: 20px;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, 1fr);
}
section.world .box .news5,
section.world .box .news6,
section.world .box .news7,
section.world .box .news8,
section.world .box .news9 {
  display: none;
}
section.world .box .news1,
section.world .box .news2,
section.world .box .news3,
section.world .box .news4 {
  border-radius: 5px;
  background-color: var(--12punto-background-color);
  box-shadow: 0px 0px 6px 0px var(--12punto-box-shadow);
}
section.world .box .news1 p,
section.world .box .news2 p,
section.world .box .news3 p,
section.world .box .news4 p {
  padding: 10px 5px;
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-normal);
}
section.world .box .news1 img,
section.world .box .news2 img,
section.world .box .news3 img,
section.world .box .news4 img {
  width: 100%;
  height: 165px;
  object-fit: cover;
}
section.world .box .news1,
section.world .box .news3 {
  grid-column: 1;
}
section.world .box .news2,
section.world .box .news4 {
  grid-column: 2;
}
section.world .box .news1,
section.world .box .news2 {
  grid-row: 1;
}
section.world .box .news3,
section.world .box .news4 {
  grid-row: 2;
}
@media (max-width: 768px) {
  section.world .box {
    grid-template-rows: unset;
    grid-template-areas: "news1 news1" "news2 news2" "news3 news3" "news4 news4";
  }
  section.world .box .news1,
  section.world .box .news2,
  section.world .box .news3,
  section.world .box .news4,
  section.world .box .news5,
  section.world .box .news6,
  section.world .box .news7,
  section.world .box .nesw8,
  section.world .box .news9 {
    grid-column: unset;
    grid-row: unset;
  }
  section.world .box .news1 {
    grid-area: news1;
  }
  section.world .box .news2 {
    grid-area: news2;
  }
  section.world .box .news3 {
    grid-area: news3;
  }
  section.world .box .news4 {
    grid-area: news4;
  }
}

section.editor {
  grid-column: 17/span 8;
  display: grid;
  grid-template-rows: max-content;
  gap: 24px;
}
section.editor h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.editor h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.editor .box {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(10, auto);
  gap: 24px;
}
section.editor .box .news1, section.editor .box .news2, section.editor .box .news3 {
  display: grid;
  grid-auto-flow: row;
  background-color: var(--12punto-default-white);
  border-radius: 5px;
}
section.editor .box .news1 img, section.editor .box .news2 img, section.editor .box .news3 img {
  width: 100%;
  object-fit: cover;
  max-width: unset;
}
section.editor .box .news1 p, section.editor .box .news2 p, section.editor .box .news3 p {
  padding: 15px;
}
section.editor .box .news1 {
  grid-column: 1/span 2;
  grid-row: 5/span 6;
}
section.editor .box .news1 p {
  font-size: var(--12punto-font-medium);
}
section.editor .box .news1 img {
  height: 230px;
}
section.editor .box .news2 {
  grid-column: 1;
  grid-row: 1/span 4;
}
section.editor .box .news3 {
  grid-row: 1/span 4;
  grid-column: 2;
}
section.editor .box .news2 img, section.editor .box .news3 img {
  height: 100px;
}

section.backstage {
  grid-column: 1/span 24;
  gap: 24px;
  display: grid;
}
section.backstage h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.backstage h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.backstage .box {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  background-color: var(--12punto-default-white);
  padding: 25px;
  gap: 24px;
  border-radius: 5px;
}
section.backstage .box a {
  display: grid;
  grid-auto-flow: column;
  align-items: center;
  padding: 10px;
  gap: 15px;
  position: relative;
  overflow: visible;
  border-radius: 5px;
}
section.backstage .box a span:nth-child(1) {
  font-weight: var(--12punto-font-bold);
  font-size: var(--12punto-font-x-large);
  color: var(--12punto-default-cyan);
}
section.backstage .box a span:nth-child(2) {
  font-weight: var(--12punto-font-normal);
  font-size: var(--12punto-font-medium);
  color: var(--12punto-c-gray);
  transition: all 0.2s;
}
section.backstage .box a span:nth-child(2):hover {
  color: var(--12punto-default-cyan);
}
section.backstage .box a:not(:last-child):after {
  content: "";
  position: absolute;
  right: 0;
  transform: translateX(-50%);
  width: 1px;
  height: 80px;
  background-color: var(--12punto-default-gray);
}
@media (max-width: 635px) {
  section.backstage .box a:nth-child(even)::after {
    display: none;
  }
  section.backstage .box a:nth-child(odd)::after {
    right: -15px;
  }
}
@media (max-width: 443px) {
  section.backstage .box a:not(:last-child):after {
    display: block !important;
    content: "";
    position: absolute;
    right: unset;
    transform: unset;
    width: 100%;
    height: 1px;
    bottom: 0;
    background: linear-gradient(to right, var(--12punto-default-white) 20%, var(--12punto-default-gray) 20%, var(--12punto-default-gray) 80%, var(--12punto-default-white) 80%);
  }
  section.backstage .box a span:nth-child(1) {
    width: 60px;
    line-height: 90px;
    display: flex;
    justify-content: center;
  }
}
@media (max-width: 443px) {
  section.backstage .box {
    grid-template-columns: unset;
    gap: 0;
    padding: 20px;
  }
}

section.health,
section.law {
  grid-column: 1/span 6;
  display: grid;
  gap: 24px;
  grid-template-rows: max-content;
}
section.health h3,
section.law h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.health h3:after,
section.law h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.health .box,
section.law .box {
  display: grid;
  gap: 24px;
}
section.health .box a,
section.law .box a {
  padding: 5px 10px;
  background-color: var(--12punto-default-white);
  display: grid;
  grid-auto-flow: column;
  gap: 12px;
  align-items: center;
  border-radius: 5px;
  justify-content: flex-start;
}
section.health .box a p,
section.law .box a p {
  font-size: var(--12punto-font-medium);
}
section.health .box a img,
section.law .box a img {
  width: 80px;
  height: 80px;
  object-fit: cover;
  border-radius: 50%;
  max-width: unset;
}
@media (max-width: 1000px) {
  section.health,
  section.law {
    grid-column: 1/span 12 !important;
  }
}
@media (max-width: 570px) {
  section.health,
  section.law {
    grid-column: 1/span 24 !important;
  }
}

section.law {
  grid-column: 7/span 6;
}
@media (max-width: 1000px) {
  section.law {
    grid-column: 13/span 12 !important;
  }
}
@media (max-width: 570px) {
  section.law {
    grid-column: 1/span 24 !important;
  }
}

section.education {
  grid-column: 13/span 6;
  grid-template-rows: max-content;
  display: grid;
  gap: 24px;
  min-width: 275px;
}
section.education h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.education h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.education .box {
  padding: 10px 15px;
  background-color: var(--12punto-default-white);
  gap: 24px;
  display: grid;
  border-radius: 5px;
}
section.education .box a {
  display: grid;
  gap: 15px;
  grid-auto-flow: column;
  justify-content: flex-start;
  border-radius: 5px;
  align-items: center;
}
section.education .box a p {
  display: grid;
  grid-auto-flow: row;
  font-size: var(--12punto-font-medium);
}
section.education .box a p span {
  color: var(--12punto-default-cyan);
  font-size: var(--12punto-font-x-small);
  font-weight: var(--12punto-font-regular);
}
section.education .box a img {
  width: 65px;
  height: 65px;
  object-fit: cover;
  border-radius: 5px;
  max-width: unset;
}
@media (max-width: 768px) {
  section.education .box a img {
    width: 80px !important;
  }
}
@media (max-width: 1000px) {
  section.education {
    grid-column: 1/span 12 !important;
  }
}

section.gourmet {
  display: grid;
  grid-column: 1/span 24;
  gap: 24px;
}
section.gourmet h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.gourmet h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.gourmet .box {
  grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
  gap: 24px;
  display: grid;
  overflow: hidden;
}
section.gourmet .box a {
  padding: 15px;
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-normal);
}
@media (max-width: 768px) {
  section.gourmet .box {
    scroll-snap-type: x mandatory;
    overflow-x: auto;
    grid-auto-flow: column;
    grid-template-columns: unset;
    margin: 0;
    -webkit-overflow-scrolling: touch;
    grid-template-columns: unset;
    grid-template-rows: repeat(4, 1fr);
    padding-bottom: 10px;
  }
  section.gourmet .box::-webkit-scrollbar {
    width: 5px;
    height: 5px;
  }
  section.gourmet .box::-webkit-scrollbar-thumb {
    background-color: var(--12punto-default-gray);
  }
  section.gourmet .box a {
    width: 275px;
  }
}

section.gallery {
  display: grid;
  gap: 24px;
  grid-column: 1/span 24;
}
section.gallery h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.gallery h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.gallery .box {
  display: grid;
  grid-gap: 24px;
  grid-template-columns: repeat(4, auto);
  grid-template-rows: repeat(2, auto);
  padding: 20px;
  background-color: var(--12punto-default-white);
  border-radius: 5px;
}
section.gallery .box .news1 {
  display: flex;
  flex-direction: column;
  gap: 15px;
  grid-column: 1/span 2;
  grid-row: 1/span 2;
  background-color: var(--12punto-background-color);
  border-radius: 5px;
}
section.gallery .box .news1 p {
  font-size: var(--12punto-font-gallery);
  padding: 10px 5px;
}
section.gallery .box .news1 span {
  font-size: var(--12punto-font-small);
  color: var(--12punto-c-gray);
}
section.gallery .box .news1 img {
  width: 100%;
  height: 350px;
  object-fit: cover;
}
section.gallery .box .news2,
section.gallery .box .news3,
section.gallery .box .news4,
section.gallery .box .news5 {
  background-color: var(--12punto-background-color);
  border-radius: 5px;
  box-shadow: 0px 0px 7px 0px var(--12punto-box-shadow);
  grid-column: 2/span 2;
}
section.gallery .box .news2 img,
section.gallery .box .news3 img,
section.gallery .box .news4 img,
section.gallery .box .news5 img {
  width: 100%;
  height: 165px;
  border-radius: unset;
  object-fit: cover;
}
section.gallery .box .news2 p,
section.gallery .box .news3 p,
section.gallery .box .news4 p,
section.gallery .box .news5 p {
  padding: 10px 5px;
  font-size: var(--12punto-font-medium);
}
section.gallery .box .news2,
section.gallery .box .news3 {
  grid-row: 1;
}
section.gallery .box .news4,
section.gallery .box .news5 {
  grid-row: 2;
}
section.gallery .box .news2,
section.gallery .box .news4 {
  grid-column: 3/span 1;
}
section.gallery .box .news3,
section.gallery .box .news5 {
  grid-column: 4/span 1;
}
@media (max-width: 720px) {
  section.gallery .box {
    grid-template-rows: unset;
    grid-template-areas: "news1 news1 news1 news1" "news2 news2 news3 news3" "news4 news4 news5 news5";
  }
  section.gallery .box .news1, section.gallery .box .news2, section.gallery .box .news3, section.gallery .box .news4, section.gallery .box .news5 {
    grid-column: unset;
    grid-row: unset;
  }
  section.gallery .box .news1 {
    grid-area: news1;
  }
  section.gallery .box .news2 {
    grid-area: news2;
  }
  section.gallery .box .news3 {
    grid-area: news3;
  }
  section.gallery .box .news4 {
    grid-area: news4;
  }
  section.gallery .box .news5 {
    grid-area: news5;
  }
}

section.sport {
  display: grid;
  gap: 24px;
  grid-column: 1/span 16;
  grid-template-rows: max-content;
}
section.sport h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.sport h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.sport .box {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  padding: 20px;
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  z-index: 1;
  gap: 20px;
}
section.sport .box .first {
  display: flex;
  flex-direction: column;
  gap: 20px;
  grid-column: 1 span/2;
  /*span {
  			font-size: var(--12punto-font-small);
  			font-weight: var(--12punto-font-regular);
  			color: var(--12punto-photo-gray);
  		}*/
}
section.sport .box .first img {
  border-radius: 5px;
  width: 100%;
  height: 335px;
  object-fit: cover;
}
section.sport .box .first p {
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-bold);
}
section.sport .box .second {
  display: grid;
  gap: 24px;
}
section.sport .box .second a {
  display: grid;
  grid-auto-flow: column;
  align-items: center;
  gap: 15px;
  justify-content: start;
}
section.sport .box .second a img {
  border-radius: 5px;
  height: 85px;
  width: 120px;
  object-fit: cover;
  max-width: fit-content;
}
section.sport .box .second a p {
  overflow: hidden;
  font-size: var(--12punto-font-medium);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
@media (max-width: 1000px) {
  section.sport .box {
    grid-template-columns: unset;
  }
  section.sport .box .first {
    grid-column: 1 span/2;
  }
  section.sport .box .second {
    grid-column: 1 span/2;
  }
  section.sport .box .second a {
    justify-content: start;
    height: 85px !important;
  }
}
section.sport .box .right {
  display: none;
}
@media (max-width: 1000px) {
  section.sport .box .box {
    grid-column: 1/span 4;
  }
}

section.life {
  display: grid;
  gap: 24px;
  grid-column: 1/span 24;
}
section.life h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.life h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.life .box {
  display: grid;
  grid-gap: 24px;
  grid-template-columns: repeat(4, auto);
  grid-template-rows: repeat(2, auto);
  padding: 20px;
  background-color: var(--12punto-default-white);
  border-radius: 5px;
}
section.life .box .news5 {
  display: flex;
  flex-direction: column;
  gap: 15px;
  grid-column: 3/span 2;
  grid-row: 1/span 2;
  background-color: var(--12punto-background-color);
  border-radius: 5px;
}
section.life .box .news5 p {
  font-size: var(--12punto-font-gallery);
  padding: 10px 5px;
}
section.life .box .news5 span {
  font-size: var(--12punto-font-small);
  color: var(--12punto-c-gray);
}
section.life .box .news5 img {
  width: 100%;
  height: 350px;
  object-fit: cover;
}
section.life .box .news6, section.life .box .news7, section.life .box .news8, section.life .box news9, section.life .box news10, section.life .box news11, section.life .box news12 {
  display: none;
}
section.life .box .news1,
section.life .box .news2,
section.life .box .news3,
section.life .box .news4 {
  background-color: var(--12punto-background-color);
  border-radius: 5px;
  box-shadow: 0px 0px 7px 0px var(--12punto-box-shadow);
}
section.life .box .news1 img,
section.life .box .news2 img,
section.life .box .news3 img,
section.life .box .news4 img {
  width: 100%;
  height: 165px;
  border-radius: unset;
  object-fit: cover;
}
section.life .box .news1 p,
section.life .box .news2 p,
section.life .box .news3 p,
section.life .box .news4 p {
  padding: 10px 5px;
  font-size: var(--12punto-font-medium);
}
section.life .box .news1, section.life .box .news2 {
  grid-row: 1;
}
section.life .box .news3, section.life .box .news4 {
  grid-row: 2;
}
section.life .box .news1, section.life .box .news3 {
  grid-column: 1;
}
section.life .box .news2, section.life .box .news4 {
  grid-column: 2;
}
@media (max-width: 720px) {
  section.life .box {
    grid-template-rows: unset;
    grid-template-areas: "news1 news1 news1 news1" "news2 news2 news3 news3" "news4 news4 news5 news5";
  }
  section.life .box .news1, section.life .box .news2, section.life .box .news3, section.life .box .news4, section.life .box .news5 {
    grid-column: unset;
    grid-row: unset;
  }
  section.life .box .news1 {
    grid-area: news1;
  }
  section.life .box .news2 {
    grid-area: news2;
  }
  section.life .box .news3 {
    grid-area: news3;
  }
  section.life .box .news4 {
    grid-area: news4;
  }
  section.life .box .news5 {
    grid-area: news5;
  }
}

section.science {
  grid-column: 17/span 8;
  display: grid;
  grid-template-rows: max-content;
  gap: 24px;
}
section.science h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.science h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.science .box {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(10, auto);
  gap: 24px;
}
section.science .box .news1, section.science .box .news2, section.science .box .news3 {
  display: grid;
  grid-auto-flow: row;
  background-color: var(--12punto-default-white);
  border-radius: 5px;
}
section.science .box .news1 img, section.science .box .news2 img, section.science .box .news3 img {
  width: 100%;
  object-fit: cover;
  max-width: unset;
}
section.science .box .news1 p, section.science .box .news2 p, section.science .box .news3 p {
  padding: 15px;
}
section.science .box .news1 {
  grid-column: 1/span 2;
  grid-row: 5/span 6;
}
section.science .box .news1 p {
  font-size: var(--12punto-font-medium);
}
section.science .box .news1 img {
  height: 230px;
}
section.science .box .news2 {
  grid-column: 1;
  grid-row: 1/span 4;
}
section.science .box .news3 {
  grid-row: 1/span 4;
  grid-column: 2;
}
section.science .box .news2 img, section.science .box .news3 img {
  height: 100px;
}
section.science .box .news4, section.science .box .news5, section.science .box .news6, section.science .box .news7, section.science .box .news8, section.science .box news9, section.science .box news10, section.science .box news11, section.science .box news12 {
  display: none;
}

section.trend {
  grid-column: 1/span 12;
  display: grid;
  gap: 24px;
}
section.trend h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.trend h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.trend .box {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 24px;
}
section.trend .box a {
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  box-shadow: 0px 0px 10px 0px var(--12punto-box-shadow);
}
section.trend .box a img {
  height: 130px;
  object-fit: cover;
  width: 100%;
}
section.trend .box a p {
  padding: 20px 10px;
  font-size: var(--12punto-font-medium);
}
@media (max-width: 1000px) {
  section.trend .box {
    grid-template-columns: repeat(auto-fill, minmax(225px, 1fr));
  }
}
@media (max-width: 805px) {
  section.trend .box {
    grid-template-columns: repeat(auto-fill, minmax(245px, 1fr));
  }
}
@media (max-width: 768px) {
  section.trend .box {
    grid-template-columns: unset;
  }
  section.trend .box a:not(:first-child) {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    justify-content: start;
  }
  section.trend .box a:not(:first-child) img {
    max-width: max-content;
    width: 160px;
    height: 100% !important;
  }
}

section.inform {
  overflow: hidden;
  background-color: var(--12punto-default-cyan);
  grid-column: 1/span 24;
  position: relative;
  padding: 40px 80px;
  height: 300px;
  display: grid;
  gap: 17px;
  border-radius: 5px;
}
section.inform::after {
  content: "";
  position: absolute;
  right: -10%;
  top: -20%;
  border-radius: 60px;
  background-color: var(--12punto-footer-cyan);
  width: 475px;
  height: 475px;
  transform: rotate(45deg);
}
section.inform img {
  position: absolute;
  bottom: 0;
  right: 20px;
  z-index: 1;
}
section.inform h3,
section.inform p,
section.inform a {
  z-index: 1;
  color: var(--12punto-default-white);
}
section.inform padding, section.inform a {
  font-weight: var(--12punto-font-regular) !important;
}
section.inform h3 {
  font-size: var(--12punto-font-subtitle);
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.inform h3, section.inform p, section.inform img {
  pointer-events: none;
}
section.inform p,
section.inform a {
  font-weight: var(--12punto-font-regular);
  font-size: var(--12punto-font-medium);
}
section.inform p {
  max-width: 430px;
  width: 100%;
}
section.inform a {
  display: grid;
  align-items: center;
  gap: 15px;
  padding: 10px 20px;
  background-color: var(--12punto-footer-cyan);
  width: max-content;
  border-radius: 35px;
  grid-auto-flow: column;
  height: fit-content;
  transition: all 0.2s;
  font-size: 16px !important;
}
section.inform a:hover {
  background-color: var(--12punto-footer-white);
}
section.inform a:hover p, section.inform a:hover i {
  color: var(--12punto-default-cyan);
}
@media (max-width: 1105px) {
  section.inform img {
    opacity: 0.5;
  }
}
@media (max-width: 768px) {
  section.inform {
    height: auto;
    text-align: center;
    justify-items: center;
    padding: 40px;
  }
  section.inform::after {
    display: none;
  }
  section.inform p {
    max-width: unset;
  }
  section.inform img {
    display: none;
  }
}

section.tv {
  grid-column: 1/span 24;
  display: grid;
  grid-auto-flow: row;
  gap: 24px;
}
section.tv h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
section.tv h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.tv .box {
  display: grid;
  grid-template-columns: auto auto auto auto;
  /* grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));*/
  gap: 24px;
}
section.tv .box .box-item {
  border-radius: 5px;
  background-color: var(--12punto-default-white);
  box-shadow: 0px 0px 6px 0px var(--12punto-box-shadow);
}
section.tv .box .box-item span {
  position: relative;
}
section.tv .box .box-item p {
  padding: 10px 5px;
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-normal);
  position: relative;
}
section.tv .box .box-item img {
  width: 100%;
  height: 160px;
  object-fit: cover;
}
@media (max-width: 768px) {
  section.tv .box {
    grid-template-columns: auto auto;
  }
  section.tv .box .box-item {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  section.tv .box .box-item img {
    height: 100% !important;
    max-width: max-content;
    /*                    width: 160px;*/
  }
  section.tv .box .box-item p {
    height: 100%;
    display: grid;
    align-items: center;
  }
}

.tv-button {
  display: flex;
  align-items: center;
  background-color: #272727;
  border-radius: 15px;
  color: #fff;
  height: 30px;
  padding: 10px 15px;
  text-decoration: none;
  font-size: 16px;
  font-weight: normal;
  justify-content: center;
}
.tv-button span:first-child {
  align-items: center;
  display: flex;
}
.tv-button span:first-child .icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 180'%3E%3Cpath fill='red' d='M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134'/%3E%3Cpath fill='%23FFF' d='m102.421 128.06 66.328-38.418-66.328-38.418z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  display: inline-block;
  height: 16px;
  width: 23px;
}
.tv-button span:first-child .icon-text {
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 17px;
  margin-left: 2px;
}
.tv-button span:last-child {
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  line-height: 17px;
  margin-left: 15px;
  letter-spacing: 0.8px;
}

section.last24 .tv-button {
  width: 100%;
  border-radius: 5px;
}

section.popular {
  grid-column: 1/span 24;
  display: grid;
  gap: 24px;
}
section.popular h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.popular h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.popular .box {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(4, 1fr);
}
section.popular .box a {
  padding: 10px;
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  box-shadow: 0px 0px 10px 0px var(--12punto-box-shadow);
}
section.popular .box a p {
  font-size: var(--12punto-font-medium);
}
@media (max-width: 1000px) {
  section.popular .box {
    overflow-x: auto;
    padding-bottom: 10px;
  }
  section.popular .box a {
    width: 250px;
  }
  section.popular .box::-webkit-scrollbar {
    width: 5px;
    height: 5px;
  }
  section.popular .box::-webkit-scrollbar-thumb {
    background-color: var(--12punto-default-gray);
  }
}

/* News */
section.headline {
  grid-column: 1/span 24;
  display: grid;
  gap: 10px;
  font-family: "FormaDJRDisplay", sans-serif;
}
section.headline h1 {
  color: var(--12punto-default-black) !important;
  font-size: 40px;
  font-weight: var(--12punto-font-bold);
  line-height: 100%;
  letter-spacing: 0.2px;
}
section.headline p {
  width: 90%;
  margin-top: 15px;
  color: var(--12punto-font-medium);
  /* font-family: "Poppins", sans-serif;*/
  font-size: 22px;
  text-align: left;
  /*       letter-spacing: 0;*/
  font-family: "PT Serif", serif;
}
@media (max-width: 1000px) {
  section.headline p {
    width: 100%;
  }
}

section.details {
  grid-column: 1/span 17;
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  padding: 20px;
  display: grid;
  font-family: "PTRootUI", sans-serif;
  /*    font-family: "FormaDJRDisplay", sans-serif;
  letter-spacing: 0.8px;*/
  font-size: 20px;
  font-weight: normal;
  word-break: break-word;
}
section.details:has(.gallery-subNews) {
  display: flex;
  flex-direction: column;
}
@media (max-width: 1000px) {
  section.details {
    margin: 0 -15px;
    padding: 15px;
  }
  section.details:has(.gallery-subNews) {
    display: flex;
    flex-direction: column;
  }
}
section.details p {
  margin-bottom: 15px;
}
section.details p iframe {
  width: 100% !important;
  aspect-ratio: 16/9;
  height: unset;
}
section.details h2, section.details h3 {
  font-size: 20px;
  margin-top: 15px;
}
section.details img {
  border-radius: 5px;
  margin-bottom: 24px;
}
section.details a {
  color: var(--12punto-default-cyan);
}
section.details iframe {
  width: 100% !important;
  aspect-ratio: 16/9;
  height: unset;
}
section.details .gallery-subNews {
  width: 100%;
  /* aspect-ratio: 16 / 9;
   height: 250px;*/
  display: block;
  margin-bottom: 14px;
  position: unset;
  /* @media(max-width:1000px) {
      height: auto;

      ins {
          margin-left: unset !important;
          margin-right: unset !important;
      }
  }*/
}

section.readsmore {
  grid-column: 18/span 7;
}
section.readsmore h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.readsmore h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.readsmore .subNews {
  width: unset;
  height: unset;
  position: unset;
  background-color: unset;
}
section.readsmore .subNews img {
  width: 100%;
}
@media (max-width: 1000px) {
  section.readsmore .subNews img {
    margin-top: 60px;
  }
}
@media (max-width: 650px) {
  section.readsmore .subNews {
    display: none;
  }
}
section.readsmore .box {
  /* margin-top: 24px;*/
  display: grid;
  gap: 24px;
}
section.readsmore .box .list {
  display: grid;
  gap: 24px;
  padding: 15px;
  border-radius: 5px;
  background-color: var(--12punto-default-white);
  height: 450px;
  overflow-y: auto;
  justify-items: start;
}
section.readsmore .box .list a {
  display: grid;
  gap: 10px;
  grid-auto-flow: column;
  justify-content: center;
  align-items: center;
  /*height: max-content;*/
  overflow: unset;
  /**/
}
section.readsmore .box .list a p {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
section.readsmore .box .list a img {
  height: 50px;
  border-radius: 5px;
  width: 85px;
  max-width: fit-content;
}
section.readsmore .box .list::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
section.readsmore .box .list::-webkit-scrollbar-thumb {
  background-color: var(--12punto-default-gray);
}
section.readsmore .ideal-media-box {
  padding: 15px;
  border-radius: 5px;
  background-color: var(--12punto-default-white);
  color: var(--12punto-default-black);
}
@media (min-width: 1001px) {
  section.readsmore {
    position: sticky;
    top: 80px;
    height: max-content;
  }
}
@media (max-width: 1000px) {
  section.readsmore {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
  }
  section.readsmore .subNews {
    height: auto;
    grid-column: 4;
    order: 2;
    min-width: 300px;
  }
  section.readsmore .box {
    margin: 0;
    order: 1;
    grid-column: 1/span 3;
  }
  section.readsmore .box .list {
    justify-content: start;
    justify-items: start;
  }
  section.readsmore .ideal-media-box {
    order: 2;
    grid-column: 1/span 4;
  }
}
@media (max-width: 650px) {
  section.readsmore {
    grid-template-columns: unset;
    display: flex;
    flex-direction: column;
  }
  section.readsmore .box, section.readsmore .subNews {
    grid-column: unset;
  }
  section.readsmore .subNews {
    height: 200px;
  }
}

section.tags {
  grid-column: 1/span 17;
  max-width: 100%;
  width: 100%;
  overflow-x: scroll;
  gap: 15px;
  padding-bottom: 15px;
  display: flex;
  /* grid-auto-flow:column;*/
}
section.tags a {
  font-size: var(--12punto-font-small);
  padding: 10px;
  text-align: center;
  border-radius: 400px;
  color: var(--12punto-author-gray);
  background-color: var(--12punto-default-gray);
  /* min-width: 150px; */
  width: max-content;
  min-width: max-content;
}
section.tags::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
section.tags::-webkit-scrollbar-thumb {
  background-color: var(--12punto-default-gray);
}

section.interests {
  /* grid-column: 1/span 17;*/
  display: grid;
  gap: 24px;
  position: relative;
}
section.interests .box {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
  gap: 24px;
}
section.interests .box a {
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  box-shadow: 0px 0px 10px 0px var(--12punto-box-shadow);
}
section.interests .box a img {
  height: 160px;
  width: 100%;
  object-fit: cover;
}
section.interests .box a p {
  padding: 15px 10px;
  font-size: 18px;
}
@media (max-width: 1000px) {
  section.interests .box {
    grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
  }
}
@media (max-width: 768px) {
  section.interests .box {
    display: flex;
    flex-direction: column;
  }
  section.interests .box a {
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  section.interests .box a img {
    width: 160px;
    height: 100% !important;
    margin-bottom: 0;
  }
  section.interests .box a p {
    margin-bottom: 0;
    padding: 0 10px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
  }
}
section.interests h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.interests h3:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.interests .more {
  position: absolute;
  left: 50%;
  bottom: -25px;
  text-align: center;
  transform: translate(-50%, -50%);
  padding: 10px 20px;
  background-color: var(--12punto-default-cyan);
  color: var(--12punto-default-white);
  border-radius: 35px;
  width: 160px;
}

section.category {
  grid-column: 1/span 17;
  text-align: center;
}
section.category .container {
  grid-column: 1/span 17;
  grid-template-columns: repeat(3, 1fr);
  display: grid;
  gap: 24px;
  position: relative;
  padding-bottom: 70px;
  text-align: left;
}
section.category .container a {
  display: grid;
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  position: relative;
}
section.category .container a img {
  height: 155px;
  object-fit: cover;
  width: 100%;
}
section.category .container a p {
  padding: 20px 10px;
  font-size: var(--12punto-font-medium);
}
section.category .container a:nth-child(1):not(.more) {
  position: relative;
  grid-column: 1/span 3;
}
section.category .container a:nth-child(1):not(.more) p {
  text-align: left;
  position: absolute;
  padding: 30px;
  bottom: 0;
  font-size: var(--12punto-font-title);
  font-weight: var(--12punto-font-bold);
  color: var(--12punto-footer-white);
  z-index: 1;
  transition: all 0.2s;
}
section.category .container a:nth-child(1):not(.more) p:hover {
  color: var(--12punto-default-cyan);
}
@media (max-width: 550px) {
  section.category .container a:nth-child(1):not(.more) p {
    font-size: var(--12punto-font-gallery);
    padding: 10px;
  }
}
section.category .container a:nth-child(1):not(.more) img {
  height: 100% !important;
  box-shadow: 0px 0px 10px 0px var(--12punto-box-shadow);
}
section.category .container a:nth-child(1):not(.more):before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, #000000 0%, rgba(0, 0, 0, 0.1) 46.63%);
  z-index: 1;
}
section.category .container p.not-news {
  grid-column: 1/span 17;
  font-weight: 400;
  font-size: 14px;
  pointer-events: none;
}
@media (max-width: 1000px) {
  section.category .container {
    grid-column: 1/span 4;
  }
}
@media (max-width: 768px) {
  section.category .container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
  }
  section.category .container a:not(.more, a:nth-child(1)) {
    grid-column: 1/span 3;
    justify-content: start;
    grid-auto-flow: column;
  }
  section.category .container a:not(.more, a:nth-child(1)) img {
    width: 160px;
    max-width: max-content;
    height: 100% !important;
  }
  section.category .container a:nth-child(1) {
    grid-column: 1/span 3;
  }
}
section.category a.more {
  text-align: center;
  transform: translate(-50%, -50%);
  padding: 10px 20px;
  background-color: var(--12punto-default-cyan);
  color: var(--12punto-default-white);
  border-radius: 35px;
  transition: all 0.2s;
}
section.category a.more:hover {
  background-color: var(--12punto-default-white);
  color: var(--12punto-default-cyan);
  border: 1px solid var(--12punto-default-cyan);
}

section.gallery-page {
  grid-column: 1/span 24;
  display: grid;
  gap: 24px;
  justify-items: center;
  font-family: "FormaDJRDisplay", sans-serif;
  font-size: 20px;
}
section.gallery-page .box {
  border-radius: 5px;
  background-color: var(--12punto-default-white);
  padding: 20px 85px;
  display: grid;
  justify-items: center;
  position: relative;
}
section.gallery-page .box p {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 15px;
  line-height: 25px;
  letter-spacing: 0.5px;
  text-align: center;
}
section.gallery-page .box img {
  margin-bottom: 15px;
}
section.gallery-page .box .pagination {
  display: grid;
  position: absolute;
  top: 40%;
  transform: translate(-50%, -50%);
  right: 10px;
}
section.gallery-page .box .pagination span {
  display: grid;
  width: 32px;
  height: 32px;
  justify-items: center;
  align-items: center;
  font-size: var(--12punto-font-gallery);
  font-weight: var(--12punto-font-bold);
}
section.gallery-page .box .pagination span:nth-child(1) {
  background-color: var(--12punto-default-cyan);
  color: var(--12punto-default-white);
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
section.gallery-page .box .pagination span:nth-child(2) {
  background-color: var(--12punto-background-color);
  color: var(--12punto-c-gray);
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
@media (max-width: 768px) {
  section.gallery-page .box {
    padding: 20px;
  }
  section.gallery-page .box .pagination {
    position: unset;
    transform: unset;
    grid-auto-flow: column;
  }
  section.gallery-page .box .pagination span:nth-child(1) {
    border-top-right-radius: unset;
    border-bottom-left-radius: 5px;
  }
  section.gallery-page .box .pagination span:nth-child(2) {
    border-top-right-radius: 5px;
    border-bottom-left-radius: unset;
  }
}
section.gallery-page .gallery-subNews {
  width: 100%;
  height: 250px;
  display: block;
  position: unset;
  /* @media(max-width:1000px) {
       height: auto;

       ins {
           margin-left: unset !important;
           margin-right: unset !important;
       }
   }*/
}
section.gallery-page .more {
  text-align: center;
  padding: 10px 20px;
  background-color: var(--12punto-default-cyan);
  color: var(--12punto-default-white);
  border-radius: 35px;
  width: 160px;
}
@media (max-width: 1000px) {
  section.gallery-page {
    display: flex;
    flex-direction: column;
  }
}

.gallerynext {
  text-align: center;
  padding: 10px 20px;
  background-color: var(--12punto-default-cyan);
  color: var(--12punto-default-white);
  border-radius: 35px;
  width: 160px;
  grid-column: 11/span 12;
}

.news-source {
  font-size: 18px;
}

/* Pages */
section.details-contact {
  grid-column: 1/span 24;
  background-color: var(--12punto-default-white);
  padding: 20px;
  border-radius: 5px;
}
section.details-contact .contact {
  width: 100%;
  overflow: unset;
  overflow-y: auto;
  grid-template-columns: auto auto;
  gap: 24px;
  display: grid;
}
section.details-contact .contact::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
section.details-contact .contact::-webkit-scrollbar-thumb {
  background-color: var(--12punto-default-gray);
}
section.details-contact .contact table {
  grid-column: 1;
}
section.details-contact .contact table h2 {
  font-size: var(--12punto-font-gallery);
  color: var(--12punto-default-black);
  text-align: left;
  font-weight: var(--12punto-font-normal);
  padding: 0;
  margin-bottom: 15px;
}
section.details-contact .contact table h1 {
  color: var(--12punto-default-black);
  margin-bottom: 50px;
  font-size: var(--12punto-font-title);
  font-weight: var(--12punto-font-bold);
  text-align: left;
}
section.details-contact .contact table h3 {
  font-size: var(--12punto-font-gallery);
  margin-bottom: 15px;
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.details-contact .contact table td {
  font-weight: var(--12punto-font-normal);
}
section.details-contact .contact table td:nth-child(3), section.details-contact .contact table td span {
  color: var(--12punto-author-gray);
}
section.details-contact .contact table .bottom {
  margin-bottom: 30px;
}
section.details-contact .contact table + img {
  grid-column: 2;
}
@media (max-width: 850px) {
  section.details-contact .contact {
    display: flex;
    flex-direction: column;
  }
  section.details-contact .contact table + img {
    order: -1;
    max-height: 275px;
  }
}

.maps {
  grid-column: 1/span 24;
}

section.kunye {
  grid-column: 1/span 24;
  display: grid;
  width: 100%;
}
section.kunye::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
@media (max-width: 1000px) {
  section.kunye::-webkit-scrollbar {
    display: none;
  }
}
section.kunye::-webkit-scrollbar-thumb {
  background-color: var(--12punto-default-gray);
}
section.kunye table tr:nth-child(odd) {
  background-color: var(--12punto-default-gray);
}
section.kunye table tr:nth-child(even) {
  background-color: var(--12punto-default-white);
}
section.kunye table td {
  padding-left: 15px;
  height: 50px;
  width: 50%;
}
@media (max-width: 768px) {
  section.kunye {
    overflow: unset;
    overflow-y: auto;
  }
  section.kunye table {
    width: max-content;
  }
  section.kunye table td {
    width: 50%;
  }
}

section.gazete-mansetleri {
  grid-column: 1/span 24;
  display: flex;
  flex-direction: column;
  gap: 24px;
  display: grid;
  width: 100%;
}
section.gazete-mansetleri h1 {
  font-size: var(--12punto-font-title);
}
section.gazete-mansetleri .mansetler {
  display: grid;
  width: 100%;
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
}
section.gazete-mansetleri .mansetler a {
  /*        border: 2px solid var(--12punto-default-cyan);
  */
  border-width: 2px;
  border-style: solid;
  border-image: linear-gradient(90deg, var(--12punto-default-cyan) 50%, var(--12punto-default-black) 50%) 1;
  border-radius: 5px;
  padding: 3px;
  background-color: #fff;
  transition: all 0.4s;
}
section.gazete-mansetleri .mansetler a:hover {
  transform: scale(1.05);
}
@media (max-width: 1000px) {
  section.gazete-mansetleri .mansetler {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (max-width: 768px) {
  section.gazete-mansetleri .mansetler {
    grid-template-columns: repeat(2, 1fr);
  }
}

section.weather {
  grid-column: 1/span 24;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
section.weather h1 {
  font-size: var(--12punto-font-title);
}

section.cookies h2 {
  text-decoration: underline;
}

section.cookies ul li, section.privacy ul li {
  margin-bottom: 5px;
}

section.cookies, section.privacy, section.aydinlatma, section.camera, section.kvkk section.kullanim, section.musteriaydinlatma, section.yayinilkeleri, section.kvkk, section.reklam-p {
  grid-column: 1/span 24;
  display: grid;
  width: 100%;
  gap: 15px;
}
section.cookies h1, section.privacy h1, section.aydinlatma h1, section.camera h1, section.kvkk section.kullanim h1, section.musteriaydinlatma h1, section.yayinilkeleri h1, section.kvkk h1, section.reklam-p h1 {
  font-size: var(--12punto-font-title);
  font-weight: var(--12punto-font-bold);
}
section.cookies h2, section.privacy h2, section.aydinlatma h2, section.camera h2, section.kvkk section.kullanim h2, section.musteriaydinlatma h2, section.yayinilkeleri h2, section.kvkk h2, section.reklam-p h2 {
  font-size: var(--12punto-font-subtitle);
  font-weight: var(--12punto-font-bold);
}
section.cookies p, section.privacy p, section.aydinlatma p, section.camera p, section.kvkk section.kullanim p, section.musteriaydinlatma p, section.yayinilkeleri p, section.kvkk p, section.reklam-p p {
  font-size: var(--12punto-font-medium);
}
section.cookies a, section.privacy a, section.aydinlatma a, section.camera a, section.kvkk section.kullanim a, section.musteriaydinlatma a, section.yayinilkeleri a, section.kvkk a, section.reklam-p a {
  color: var(--12punto-default-cyan);
}
section.cookies h3, section.privacy h3, section.aydinlatma h3, section.camera h3, section.kvkk section.kullanim h3, section.musteriaydinlatma h3, section.yayinilkeleri h3, section.kvkk h3, section.reklam-p h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}

/* Author */
section.article {
  grid-column: 1/span 17;
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  padding: 20px;
  display: grid;
  font-size: 20px;
  line-height: 1.6;
  word-break: break-word;
  font-weight: normal;
  /*    letter-spacing: 0.8px;*/
  font-family: "PTRootUI", sans-serif;
}
section.article p {
  margin-bottom: 15px;
  line-height: 25px;
}
section.article a {
  color: var(--12punt-default-cyan);
}

a.articlesmore {
  display: grid;
  max-width: max-content;
  width: 100%;
  grid-column: 6/span 11;
  padding: 15px;
  border-radius: 5px;
  background-color: var(--12punto-default-cyan);
  grid-auto-flow: column;
  gap: 15px;
  align-items: center;
}
a.articlesmore img {
  width: 70px;
  height: 70px;
  border: 1px dashed var(--12punto-author-border);
  object-fit: cover;
  border-radius: 50%;
}
a.articlesmore p {
  display: grid;
  color: var(--12punto-default-white);
  font-weight: var(--12punto-font-bold);
  font-size: var(--12punto-font-medium);
}
a.articlesmore p span {
  font-weight: var(--12punto-font-regular);
  font-size: var(--12punto-font-small);
}

section.author {
  grid-column: 1/span 24;
  display: grid;
  justify-content: space-between;
  grid-auto-flow: column;
  border-bottom: 1px solid var(--12punto-default-gray);
  padding-bottom: 15px;
}
section.author .left {
  display: flex;
  grid-auto-flow: column;
  align-items: center;
  gap: 10px;
}
section.author .left img {
  height: 100px;
  width: 100px;
  object-fit: cover;
  border-radius: 50%;
}
@media (max-width: 1000px) {
  section.author .left img {
    height: 100px !important;
  }
}
section.author .left .box {
  display: flex;
  flex-direction: column;
}
section.author .left .box p {
  font-size: 26px;
  text-align: left;
  font-weight: var(--12punto-font-bold);
}
section.author .left .box span {
  font-size: var(--12punto-font-small);
  font-weight: var(--12punto-font-regular);
  color: var(--12punto-author-gray);
}
section.author .right {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 10px;
}
section.author .right p {
  padding: 0;
  background-color: unset;
  text-align: right;
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-normal);
  width: 100%;
}
@media (max-width: 768px) {
  section.author .right p {
    text-align: left;
  }
}
section.author .right .socials {
  display: grid;
  gap: 10px;
  grid-auto-flow: column;
  justify-content: end;
}
section.author .right .socials .box {
  border-radius: 50%;
  width: 30px;
  height: 30px;
  display: grid;
  align-items: center;
  justify-content: center;
  background-color: var(--12punto-default-white);
}
@media (max-width: 600px) {
  section.author {
    grid-auto-flow: unset;
    gap: 24px;
  }
  section.author .right {
    gap: 5px;
  }
  section.author .right .socials {
    justify-content: start;
  }
}

section.author-about {
  grid-column: 1/span 24;
  display: grid;
  border-bottom: 1px solid var(--12punto-default-gray);
  padding-bottom: 15px;
}

section.author-headline {
  grid-column: 1/span 24;
  display: grid;
  grid-auto-flow: column;
}
section.author-headline h1 {
  font-size: 25px;
  font-weight: var(--12punto-font-bold);
}

section.share-article, section.share-author {
  border-bottom: 1px solid var(--12punto-default-gray);
  border-top: unset;
  padding-bottom: 24px;
}
@media (max-width: 600px) {
  section.share-article, section.share-author {
    grid-auto-flow: unset;
    gap: 24px;
  }
  section.share-article p, section.share-author p {
    text-align: left;
  }
}

section.share-author {
  justify-content: end;
  gap: 5px;
  grid-auto-flow: unset !important;
}
section.share-author p {
  padding: 0;
  background-color: unset;
  text-align: left;
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-normal);
  width: 100%;
}
@media (max-width: 600px) {
  section.share-author {
    justify-content: start;
  }
}

section.date {
  display: grid;
  grid-auto-flow: column;
  gap: 15px;
  grid-column: 1/span 24;
  justify-content: start;
}
section.date select {
  cursor: pointer;
  width: 140px;
  height: 35px;
  border: 1px solid var(--12punto-input-gray);
  border-radius: 5px;
  padding: 5px 10px;
  color: var(--12punto-c-gray);
  background-color: var(--12punto-default-gray);
  font-size: var(--12punto-font-x-small);
  font-weight: var(--12punto-font-regular);
  position: relative;
}
section.date select:focus {
  outline: 0;
}
section.date select:nth-child(2) {
  width: 120px;
}
section.date button {
  cursor: pointer;
  border-radius: 5px;
  background-color: var(--12punto-default-cyan);
  width: 75px;
  height: 35px;
  text-align: center;
  display: grid;
  align-items: center;
  border: none;
  color: var(--12punto-default-white);
  font-size: var(--12punto-font-x-small);
  font-weight: var(--12punto-font-regular);
}
@media (max-width: 400px) {
  section.date {
    grid-auto-flow: unset;
  }
  section.date select,
  section.date button {
    width: 140px !important;
  }
}

section.details-author {
  grid-column: 1/span 17;
  display: grid;
  gap: 24px;
  align-content: baseline;
  height: fit-content;
}
section.details-author .article-list {
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  padding: 20px;
  display: grid;
  align-content: baseline;
  gap: 15px;
  height: fit-content;
}
@media (max-width: 768px) {
  section.details-author .article-list {
    padding: 15px;
  }
  section.details-author .article-list div.pagination .box a {
    width: 33px !important;
    height: 35px !important;
  }
  section.details-author .article-list div.pagination .box a:first-child, section.details-author .article-list div.pagination .box a:last-child {
    display: none;
  }
}
section.details-author h1 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.details-author h1:after {
  content: "";
  border-bottom: solid 1.5px #000;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35px;
}
section.details-author a h4 {
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.details-author a span {
  color: var(--12punto-author-gray);
  font-size: var(--12punto-font-small);
  font-weight: var(--12punto-font-regular);
}

section.authorsmore {
  grid-column: 18/span 7;
}
section.authorsmore h3 {
  font-size: var(--12punto-font-subtitle);
  color: var(--12punto-default-black);
  position: relative;
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.authorsmore .subNews {
  width: unset;
  height: 440px;
  position: unset;
}
section.authorsmore .box {
  margin-top: 24px;
  display: grid;
}
section.authorsmore .box .list {
  display: grid;
  gap: 24px;
  padding: 15px;
  border-radius: 5px;
  background-color: var(--12punto-default-white);
  height: 450px;
  overflow-y: scroll;
  margin-top: 24px;
}
section.authorsmore .box .list::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
section.authorsmore .box .list::-webkit-scrollbar-track {
  background-color: var(--12punto-default-white);
}
section.authorsmore .box .list::-webkit-scrollbar-thumb {
  background-color: var(--12punto-default-gray);
}
section.authorsmore .box .list a {
  display: grid;
  gap: 10px;
  grid-auto-flow: column;
  justify-content: center;
  align-items: center;
  height: 50px;
}
section.authorsmore .box .list a img {
  height: 50px;
  width: 50px;
  border-radius: 50%;
}
section.authorsmore .box .list a .inside {
  display: grid;
}
section.authorsmore .box .list a .inside h4,
section.authorsmore .box .list a .inside p {
  font-size: var(--12punto-font-small);
  font-weight: var(--12punto-font-normal);
}
section.authorsmore .box .list a .inside h4 {
  color: var(--12punto-author-gray);
}
section.authorsmore .box .all {
  width: 100%;
  height: 45px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  display: grid;
  align-items: center;
  text-align: center;
  background-color: var(--12punto-default-cyan);
  color: var(--12punto-default-white);
}
@media (max-width: 1000px) {
  section.authorsmore {
    display: grid;
    grid-template-columns: repeat(4, auto);
    gap: 24px;
  }
  section.authorsmore .subNews {
    height: auto;
    grid-column: 5/span 2;
    order: 2;
    min-width: 300px;
  }
  section.authorsmore .box {
    margin: 0;
    order: 1;
    grid-column: 1/span 4;
  }
  section.authorsmore .box .list {
    justify-content: start;
  }
}
@media (max-width: 650px) {
  section.authorsmore {
    grid-template-columns: unset;
  }
  section.authorsmore .box {
    order: 2;
  }
  section.authorsmore .subNews {
    order: 1;
  }
  section.authorsmore .box,
  section.authorsmore .subNews {
    grid-column: unset;
  }
  section.authorsmore .subNews {
    height: 200px;
  }
}

section.authors-page, section.today-authors-page {
  display: grid;
  gap: 24px;
  /*   padding-bottom: 65px;*/
  position: relative;
  grid-column: 1/span 17;
  height: fit-content;
}
section.authors-page .pagination, section.today-authors-page .pagination {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(45px, 1fr));
  gap: 5px;
}
section.authors-page .pagination a, section.today-authors-page .pagination a {
  color: #000;
  float: left;
  padding: 8px 8px;
  text-decoration: none;
  border-radius: 5px;
  transition: background-color 0.3s;
  border: 1px solid #ddd;
  margin: 4px;
  height: 37px;
  text-align: center;
}
@media (max-width: 768px) {
  section.authors-page .pagination, section.today-authors-page .pagination {
    height: 150px;
    overflow-y: auto;
  }
}
section.authors-page .box, section.today-authors-page .box {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 24px;
}
section.authors-page .box a, section.today-authors-page .box a {
  background-color: var(--12punto-author-white);
  border: 1px dashed var(--12punto-author-border);
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-items: center;
  gap: 10px;
  padding: 15px;
  border-radius: 5px;
  transition: all 0.4s;
}
section.authors-page .box a img, section.today-authors-page .box a img {
  width: 80px;
  height: 80px;
  object-fit: cover;
  border: 2px dashed var(--12punto-author-border);
  border-radius: 50%;
}
section.authors-page .box a h4, section.today-authors-page .box a h4 {
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-normal);
  color: var(--12punto-author-gray);
  text-align: center;
}
section.authors-page .box a p, section.today-authors-page .box a p {
  font-size: var(--12punto-font-regular);
  font-weight: var(--12punto-font-small);
  color: var(--12punto-default-black);
  text-align: center;
}
section.authors-page .box a span, section.today-authors-page .box a span {
  font-size: var(--12punto-font-regular);
  font-weight: var(--12punto-font-x-small);
  color: var(--12punto-default-cyan);
  text-align: center;
}
section.authors-page .box a:hover, section.today-authors-page .box a:hover {
  background-color: var(--12punto-default-white);
  border-color: var(--12punto-default-cyan);
}
section.authors-page .box a:hover img, section.today-authors-page .box a:hover img {
  border-color: var(--12punto-default-cyan);
}
section.authors-page .more, section.today-authors-page .more {
  position: absolute;
  left: 50%;
  bottom: -25px;
  text-align: center;
  transform: translate(-50%, -50%);
  padding: 10px 20px;
  background-color: var(--12punto-default-cyan);
  color: var(--12punto-default-white);
  border-radius: 35px;
}

h2.authors-title, h1.today-authors {
  font-size: var(--12punto-font-gallery);
  color: var(--12punto-default-black);
  grid-column: 1/span 17;
  font-weight: var(--12punto-font-bold);
}

section.side {
  width: unset;
  height: 440px;
  position: unset;
  background-color: var(--12punto-default-gray);
  grid-column: 18/span 7;
}

section.author-other-articles {
  width: 100%;
  grid-column: 1/span 17;
  background-color: var(--12punto-default-white);
  border-radius: 5px;
  padding: 20px;
  display: grid;
  gap: 24px;
}
section.author-other-articles h2 {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  flex-wrap: wrap;
}
section.author-other-articles h2 a {
  color: var(--12punto-default-cyan);
  position: relative;
}
section.author-other-articles h2 a:after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0;
  height: 2px;
  background-color: var(--12punto-default-cyan);
}
@media (max-width: 380px) {
  section.author-other-articles h2 a:after {
    right: unset;
    left: 0;
  }
}
section.author-other-articles h2 a:hover:after {
  width: 50%;
  transition: all 0.2s;
}
section.author-other-articles .author-latest-articles {
  display: grid;
  align-content: baseline;
  gap: 15px;
  height: fit-content;
}
section.author-other-articles .author-latest-articles a {
  text-decoration: none;
  color: var(--12punto-default-black);
  overflow: hidden;
  transition: all 0.2s;
}
section.author-other-articles .author-latest-articles a h3 {
  font-size: var(--12punto-font-medium);
  font-weight: var(--12punto-font-bold);
  height: fit-content;
}
section.author-other-articles .author-latest-articles a span {
  color: var(--12punto-author-gray);
  font-size: var(--12punto-font-small);
  font-weight: var(--12punto-font-regular);
}