@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700;1,900&display=swap');

:root {
    /* GENERAL SELCTION COLOR */
    --selection-bg-color : rgba(0, 0, 0, 0.15);
    --selection-color : inherit;
    
    /* GENERAL BODY SETUP */
    --body-bg-color : #FFFFFF;
    --body-color : #2C3E55;
    --body-font-family :'Source Sans Pro', sans-serif;;
    --body-font-weight : inherit;
    --body-font-size : 17px;
 
    /* GENERAL CONTAINER SETUP */
    --wbWidth-max-width : 1200px;
    --wbWidth-margin : auto;
    
    /* GENERAL TITLE SETUP */
    --h1-font-family : inherit;
    --h1-margin : 1.5rem 0;
    --h1-padding : 0;
    --h1-font-weight : bold;
    --h1-font-size : 3.5rem;
    --h1-line-height : 3.8rem;
    --h1-color : #F3342E;
    --h1-bg-color : transparent;
    --h1-border-style : solid;
    --h1-border-size : 0px;
    --h1-border-color : transparent;
    
    --h2-font-family : inherit;
    --h2-margin : 1.5rem 0;
    --h2-padding : 0;
    --h2-font-weight : bold;
    --h2-font-size : 2.1rem;
    --h2-line-height : 2.2rem;
    --h2-color : #212121;
    --h2-bg-color : transparent;
    --h2-border-style : solid;
    --h2-border-size : 0px;
    --h2-border-color : transparent;    
    
    --h3-font-family : inherit;
    --h3-margin : 1.5rem 0;
    --h3-padding : 0;
    --h3-font-weight : bold;
    --h3-font-size : 2.3rem;
    --h3-line-height : 2rem;
    --h3-color :#696969;
    --h3-bg-color : transparent;
    --h3-border-style : solid;
    --h3-border-size : 0px;
    --h3-border-color : transparent;    
    
    --h4-font-family : inherit;
    --h4-margin : 1.5rem 0;
    --h4-padding : 0;
    --h4-font-weight : bold;
    --h4-font-size : 1.5rem;
    --h4-line-height : 1.8rem;
    --h4-color : #2C3E50;
    --h4-bg-color : transparent;
    --h4-border-style : solid;
    --h4-border-size : 0px;
    --h4-border-color : transparent; 
    
    --h5-font-family : inherit;
    --h5-margin : 1.5rem 0;
    --h5-padding : 0;
    --h5-font-weight : bold;
    --h5-font-size : 1.25rem;
    --h5-line-height : 1.50rem;
    --h5-color : #F3342E;
    --h5-bg-color : transparent;
    --h5-border-style : solid;
    --h5-border-size : 0px;
    --h5-border-color : transparent;   
    
    --h6-font-family : inherit;
    --h6-margin : 1.5rem 0;
    --h6-padding : 0;
    --h6-font-weight : bold;
    --h6-font-size : 1.1rem;
    --h6-line-height : 1.2rem;
    --h6-color : #2C3E50;
    --h6-bg-color : transparent;
    --h6-border-style : solid;
    --h6-border-size : 0px;
    --h6-border-color : transparent;
    
    /* GENERAL LINK COLOR*/
    --link-bg-color : #fff ;
    --link-color : #fff ;
    --link-color-hover : rgba(255, 255, 255, 0.8) ;
    
    /* GENERAL LINK STYLE*/
    --link-display : inline-block;
    --link-text-decoration : none;
    --link-border-color : #fff ;
    --link-border-style : solid ;
    --link-border-size : 2px ;
    --link-border-radius : 0.5rem;
    --link-padding : 0.25rem;
    --link-cursor-hover:pointer;
    /* GENERAL LINK:HOVER STYLE */
    --link-border-color-hover : #fff ;
    --link-border-style-hover : solid ;
    --link-border-size-hover : 2px ;
    --link-border-radius-hover : 2rem;
}

::selection {
    background-color:var(--selection-bg-color);
    color:var(--selection-color);
}

.post, .page {
    margin: 0 !important;
}

.site-footer {
    background-color:#212121;
    color:white;
}

.wp-block-file a , .wp-block-file a:focus , .wp-block-file a:visited{
    color:var( --body-color);
}

.wp-block-file__button {
    color:white !important;
    text-decoration: none;
}
.wp-block-file__button:hover {
    color:white !important;
    text-decoration: none;
}

.wp-block-file a:hover{
  color:var( --body-color);
   text-decoration: underline;
}

body , html {
    font-size:var(--body-font-size);
    font-weight:var(--body-font-weight);
    font-family:var(--body-font-family);
    background:var(--body-bg-color);
    color:var(--body-color);
    z-index: -1;
}

main {
    z-index: 1;
    min-height: calc(100vh - 239px);
}

.absoluteLink {
    position: absolute;
    width:100%;
    height:100%;
    left:0;
    top:0;
    z-index: 1;
    font-size: 0;
    border:none !important;
}


* {
    outline: none !important;
}

a , a:visited , a:focus{
    display:var(--link-display);
    text-decoration:var(--link-text-decoration);
    padding:var( --link-padding);
    color:var(--link-color);
    border-radius: var(--link-border-radius);
    border-color:var(--link-border-color);
    border:var(--link-border-size) var(--link-border-style) var(--link-border-color);
}
a:hover  {
    color:var(--link-color-hover);
    border-radius: var(--link-border-radius);
    border-color:var(--link-border-color-hover);
    border:var(--link-border-size-hover) var(--link-border-style-hover) var(--link-border-color-hover);
    cursor:var(--link-cursor-hover);
}
.wbWidth {
    padding:0 1rem;
    max-width:var(--wbWidth-max-width);
    margin:var(--wbWidth-margin);
}

.navLogo {
    margin-left:0.5rem;
}

h1 {
    padding:var(--h1-padding);
    margin:var(--h1-margin);
    font-family: var(--h1-font-family);
    font-weight: var(--h1-font-weight);
    font-size:var(--h1-font-size);
    line-height:var(--h1-line-height);
    color:var(--h1-color);
    background-color:var(--h1-bg-color);
    border: var(--h1-border-style) var(--h1-border-size)  var(--h1-border-color) ;
    width:100%;
}

h2 {
    padding: var(--h2-padding);
    margin: var(--h2-margin);
    font-family: var(--h2-font-family);
    font-weight: var(--h2-font-weight);
    font-size: var(--h2-font-size);
    line-height: var(--h2-line-height);
    color:var(--h2-color);
    background-color: var(--h2-bg-color);
    border: var(--h2-border-style) var(--h2-border-size) var(--h2-border-color);
    text-transform: uppercase;
    position: relative;
    padding-bottom:1.5rem;
    width:100%;
}

h2:after {
    content:'';
    height:2px;
    border-radius: 100%;
    display: block;
    position: absolute;
    bottom:0;
    left:0;
    right:0;
    margin:auto;
    width:70%;
    max-width: 550px;
    background-color:rgba(0, 0, 0, 0.3);
}

h3 {
    padding:var(--h3-padding);
    margin:var(--h3-margin);
    font-family: var(--h3-font-family);
    font-weight: var(--h3-font-weight);
    font-size:var(--h3-font-size);
    line-height:var(--h3-line-height);
    color:var(--h3-color);
    background-color:var(--h3-bg-color);
    border: var(--h3-border-style) var(--h3-border-size)  var(--h3-border-color) ;
    width:100%;
}
h4 {
    padding:var(--h4-padding);
    margin:var(--h4-margin);
    font-family: var(--h4-font-family);
    font-weight: var(--h4-font-weight);
    font-size:var(--h4-font-size);
    line-height:var(--h4-line-height);
    color:var(--h4-color);
    background-color:var(--h4-bg-color);
    border: var(--h4-border-style) var(--h4-border-size)  var(--h4-border-color) ;
    width:100%;
}
h5 {
    padding:var(--h5-padding);
    margin:var(--h5-margin);
    font-family: var(--h5-font-family);
    font-weight: var(--h5-font-weight);
    font-size:var(--h5-font-size);
    line-height:var(--h5-line-height);
    color:var(--h5-color);
    background-color:var(--h5-bg-color);
    border: var(--h5-border-style) var(--h5-border-size)  var(--h5-border-color) ;
    width:100%;
}

h6 {
    padding:var(--h6-padding);
    margin:var(--h6-margin);
    font-family: var(--h6-font-family);
    font-weight: var(--h6-font-weight);
    font-size:var(--h6-font-size);
    line-height:var(--h6-line-height);
    color:var(--h6-color);
    background-color:var(--h6-bg-color);
    border: var(--h6-border-style) var(--h6-border-size)  var(--h6-border-color) ;
    width:100%;
}




/* UPLOAD BOX */
.uploadDivDesignContainer {
    position: fixed;
    width:100%;
    height:100%;
    background:rgba(0, 0, 0, 0.29);
    display: flex;
    justify-content: center;
    align-items: center;
    top:0;
    left:0;
}

.divUploadLogo {
    width:190px;
    height:190px;
    position: relative;
    background-color:#b2b2b2;
    border-radius: 100%;
    margin:1rem;
}

.divUploadLogo:before {
     content:'';
    display: block;
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:190px;
    height:190px;
    background-position: center;
    background-size: 130px;
    background-repeat: no-repeat;
    background-image:url(../img/feps-logo-white.png);
    z-index: 1;
    margin: auto;
}

.divUploadLogo:after {
    content:'';
    display: block;
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    margin: auto;
    background-color:#F3342E;
    z-index: 0;
    border-radius: 100%;
    animation-name: uploadBackgroundAnim;
    animation-duration: 1.2s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
}

@keyframes uploadBackgroundAnim {
  from {height:120px;width:120px;}
  to {height:190px;width:190px;}
}

.uploadDivDesign {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    width: 100%;
    max-width: 500px;
    background: #fcfcfc;
    border-radius: 0.5rem;
}