@import url(https://fonts.googleapis.com/css?family=Lato:300,400,700);
@import url(https://fonts.googleapis.com/css?family=Coming+Soon);

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body, html { font-size: 100%; padding: 0; margin: 0;  }

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

div.panelcdk {
padding: 0.3rem;
}

body {
	font-family: 'Lato', Calibri, Arial, sans-serif;
	color: #6E7883;	
    overflow-x: auto !important;   
}


html
{
    font-size: 16px;
}


@media only screen {
	html {
    font-size: 14px;
  } 
}

@media only screen and (max-width: 40em) 
{
	html{
    font-size: 14px;
  } 
} 


@media only screen and (min-width: 40.063em) 
{
	html{
    font-size: 15px;
  } 
} 

@media only screen and (min-width: 40.063em) and (max-width: 64em) 
{
	html{
    font-size: 15px;
  } 
} 


@media only screen and (min-width: 64.063em) 
{
	html{
    font-size: 16px;
  } 
}  

@media only screen and (min-width: 64.063em) and (max-width: 90em) 
{
	html{
    font-size: 16px;
  } 
}  


@media only screen and (min-width: 90.063em) 
{
	html{
    font-size: 19px;
  } 
} 

@media only screen and (min-width: 90.063em) and (max-width: 120em) 
{
	html{
    font-size: 19px;
  } 
}  


@media only screen and (min-width: 120.063em) 
{
	html{
    font-size: 20px;
  } 
}  


  /*.titleOnSale
    {
        background-color: #2F2F2F;
        color: #FFFFFF;
        
        border-bottom: lightgray;
        border-bottom-style: solid;
        border-bottom-width: 2px;
        padding-top : 20px;
        padding-bottom : 20px;
        text-align: center;
    }*/

.titleOnSale {
      /*border-radius: 10px 10px 10px 10px;
      -moz-border-radius:  10px 10px 10px 10px;
      -webkit-border-radius: 10px 10px 10px 10px;*/      
      border-style: solid ;
      border-color: #008CBA;
     box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    -moz-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    -webkit-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    filter: progid:DXImageTransform.Microsoft.Shadow(color = #adacac, direction = 135, strength = 2);
     margin-top: 20px;
    margin-bottom: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
    text-align: center;
    color: #2F2F2F;
    font-weight: bold;
     }
  .thumbBox
{
    border: 1px solid #808080;
    border-radius: 10px 10px 10px 10px;
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    line-height: 1.5;
    box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    -moz-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    -webkit-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    filter: progid:DXImageTransform.Microsoft.Shadow(color = #adacac, direction = 135, strength = 2);
    padding: 5px;
    display: block;
    margin-bottom: 15px;
}

    div.pageframe {
            /*position: relative;*/
            background: white;                  
            margin: auto;
            margin-top : 10px;
            font-size: 1em; 
            width: 100%;  
            height: 100%;
            box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
            -moz-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
            -webkit-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
            filter: progid:DXImageTransform.Microsoft.Shadow(color = #adacac, direction = 135, strength = 2);   
                         
        }

div.toptab {
    /*position: relative;*/
    background: white;
    margin: auto;
    margin-top: 10px;
    font-size: 1em;
    box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    -moz-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    -webkit-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    filter: progid:DXImageTransform.Microsoft.Shadow(color = #adacac, direction = 135, strength = 2);
    border-radius: 10px 10px 0px 0px;
    -moz-border-radius: 10px 10px 0px 0px;
    -webkit-border-radius: 10px 10px 0px 0px;
    margin-bottom: -9px;
    cursor: pointer;
}

    div.toptab.checked {
        background-color: #AB1111;
        color:white;
        z-index: 10;
    }
    div.toptab.unchecked {
        background-color: lightgray;
    }


@media only screen and (min-width: 64.063em)
{
    .leftside
    {
        border-radius: 10px 0px 0px 10px;
        -moz-border-radius: 10px 0px 0px 10px;
        -webkit-border-radius: 10px 0px 0px 10px;
    }

    .rightside
    {
        border-radius: 0px 10px 10px 0px;
        -moz-border-radius: 0px 10px 10px 0px;
        -webkit-border-radius: 0px 10px 10px 0px;
    }
    .titleArea
    {
        background-color: #2F2F2F;
        color: #FFFFFF;
        border-radius: 10px 0 0 0;
        -moz-border-radius:  10px 0 0 0;
        -webkit-border-radius: 10px 0 0 0;        
        border-bottom: lightgray;
        border-bottom-style: solid;
        border-bottom-width: 2px;
    }
}

@media only screen and (max-width: 64.063em)
{
  .titleArea
    {
        background-color: #2F2F2F;
        color: #FFFFFF;
        border-bottom: lightgray;
        border-bottom-style: solid;
        border-bottom-width: 2px;
    }
}




     .fullside
{
   
      border-radius: 10px 10px 10px 10px;
      -moz-border-radius:  10px 10px 10px 10px;
      -webkit-border-radius: 10px 10px 10px 10px; 
}

      

     
.page-content
{
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -212px; /*=-altezza foother*/
}

.tags
{
    font-size :0.8em;
    padding-top: 5px;
    /*color: #FFFFFF;*/
    /*float:left;*/
}

.selectedTags
{
    font-size: 0.8em;
    color: #C0C0C0;
}

.selectClear
{
    font-size: 0.8em;
    color: #666666;
    text-decoration:underline;    
}
.selectClear:hover
{
    color: #333333;
}

.darkorange {
    color: darkorange;
}

.closebutton
{
    
    cursor: pointer;
    float:right;
    background-color :#2F2F2F /*:#f30bcb;*/
}
    .closebutton a
    {
        /*font-size: 2rem;
        line-height: 1;       
        color: #aaaaaa;
        font-weight: bold;*/
       
    }

    closebutton:hover, closebutton:focus, .closebutton:hover, .closebutton:focus
{
    background-color: #121212;  /*#FFCC00;*/
}

/*.tags a:link, a:visited
{
    color: #FFFFFF;
    text-decoration: underline;
}*/



/*Top Bar overwrite*/
 .top-bar
{
    background-color: #AB1111;
    z-index:100;
}

    
.top-bar-section > ul > .divider, .top-bar-section > ul > [role="separator"] {  
       border-right: solid 1px #B1B1B1;
}

.top-bar-section .divider,
  .top-bar-section [role="separator"] {
   border-right:solid ;
   border-left:solid;
   border-width:1px;
   border-color:white;    
 }
 
 .top-bar-section ul li.active1 > a {
      background: #f30bcb;
      color: white; }
.top-bar-section ul li.active1 > a:hover {
    background: #f30bcb;
    color: white; }

 .top-bar-section li.active1:not(.has-form) a:not(.button) {
      padding: 0 15px;
      line-height: 45px;
      color: white;
      background:  #f30bcb; }
.top-bar-section li.active1:not(.has-form) a:not(.button):hover {
    background: #0078a0; }

.top-bar-section .dropdown li:not(.has-form):not(.active1) > a:not(.button) {
    color: white;
    background: #f30bcb;
}

.top-bar-section .dropdown li:not(.has-form):not(.active1) > a:not(.button):hover {
    background: #0078a0;
}


.top-bar-section ul li.active2 > a {
    background-color: #AB1111;
    color: white;
}
    .top-bar-section ul li.active2 > a:hover {
        background-color: #7e0b0b;
        color: white;
    }

.top-bar-section li.active2:not(.has-form) a:not(.button) {
    padding: 0 15px;
    line-height: 45px;
    color: white;
    background-color: #AB1111;
}

    .top-bar-section li.active2:not(.has-form) a:not(.button):hover {
        background: #7e0b0b
    }

.top-bar-section .dropdown li:not(.has-form):not(.active2) > a:not(.button) {
    color: white;
    background-color: #AB1111;
    ;
}

    .top-bar-section .dropdown li:not(.has-form):not(.active2) > a:not(.button):hover {
        background: #7e0b0b
    }



.top-bar-section {
    background-color: #AB1111;
}

    .top-bar-section ul li > a {
        background-color: #AB1111;
    }

    .top-bar-section ul li {
        background: #AB1111;
    }

        .top-bar-section ul li div {
            background-color: #AB1111;
        }


        .top-bar-section ul li img {
            background-color: #AB1111;
        }

.top-bar.expanded .title-area {
    background: #AB1111;
}

.top-bar-section li.active:not(.has-form) a:not(.button) {
    background: #AB1111; 
}

    .top-bar-section li.active:not(.has-form) a:not(.button):hover {
        background: #7e0b0b;
    }

.otherlabel
{
    font-size: 0.8em;
    font-weight:bold;   
}

.DateWrapper
{
    font-size :0.7em;
    /*float: right;*/ 
    padding-top: 5px;
    /*margin-top: 15px;*/
}

 .rating_button
    {
        display: inline-block;
        margin-right: 5px;          
    }

    .rating_button .voting_up
    {
        background: url(../img/voting_s.png) no-repeat;             
        opacity: 0.5; 
        float: left;
        height: 32px; 
        width: 28px;
        cursor:pointer;
       
    }
      .rating_button .voted_up
    {
        background:  url(../img/voting_s.png) no-repeat;      
        opacity: 1;  
        float: left;
        height: 32px; 
        width: 28px;
        cursor:default;     
    }

    .rating_button .voting_up:hover
    {
        opacity: 0.8;     
    }

     .rating_button span{font-size: 15px; float: left; margin-left:5px; margin-top:2px }

    .TitleWrapper {       
        background-color: rgba(247, 247, 247, 1);
        box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
        -moz-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
        -webkit-box-shadow: 0 2px 4px rgba(31, 19, 19, 0.16);
        filter: progid:DXImageTransform.Microsoft.Shadow(color = #adacac, direction = 135, strength = 2);
}
.TagsWrapper
{
    float:left;
}
    .RatingWrapper
    {
       display: inline-block;
       float: right;      
    }


.bottomdiv
{
    width:100%
}

.bottomdiv_margins
{
    width:100%;
    margin-top: 20px;       
}

.ProductOption
{
    padding:5px;
    height: 30px;
}

.tagsfeatured
{
    position: absolute;    
    width: 40px;
    z-index:10;
}

.tagsfeatured.wall
{
    top: -2px;  
    right: 2px;
}

.tagsfeatured.details
{
    top: 8px;  
    right: 15px;  
}


.thumbwrapper
{
    /*position:relative;*/
}

 .deletebtn
    {
        position:absolute;
        top:2px;
        left:2px;
        z-index:100;
    }

.editbutton
{
     position:absolute;
     top:2px;
     left:24px;
     z-index:100;
}

.FunnyFont
{
    font-family: 'Shadows Into Light' , cursive;
    margin-left: 40px;
    font-weight: bold;
    line-height: 35px;
    font-size: 40px;
    margin-top: 20px;
    margin-bottom: 10px;
}

.FunnyFont.topmost
{
    padding-top :40px;
}

.colorBlue
{
   color: #008cba;
}

.bottomBar
{
    height: 35px;
    width: 100%;
    background-color: lightgray;
    text-align:center; 
}

.socialbuttonscontainer
{
    display:inline-block;
    margin-top:5px;
}

.FrameShip
{
    padding: 10px 20px 5px 20px;
    border: 1px solid #00B3B3;
    border-radius: 0 10px 10px 10px;
    -moz-border-radius: 0 10px 10px 10px;
    -webkit-border-radius: 0 10px 10px 10px;
    background: #009999;
    line-height: 1.5;
    background-color: #f6f6f6;
    box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    -moz-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    -webkit-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    filter: progid:DXImageTransform.Microsoft.Shadow(color = #adacac, direction = 135, strength = 2);
    margin-top: 20px;
    margin-bottom: 20px;
}
.FrameLogin
{
    padding: 10px 20px 5px 20px;
    border: 1px solid #00B3B3;
    /*border-radius: 0 10px 10px 10px;
    -moz-border-radius: 0 10px 10px 10px;
    -webkit-border-radius: 0 10px 10px 10px;*/
    background: #009999;
    line-height: 1.5;
    background-color: #f6f6f6;
    box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    -moz-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    -webkit-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    filter: progid:DXImageTransform.Microsoft.Shadow(color = #adacac, direction = 135, strength = 2);
    margin-top: 20px;
    margin-bottom: 20px;
}


.fixedbottom {
  width: 100%;
  height: 10%;
  position: fixed;
  bottom: 0;
  z-index: 99; 
  background-color: #D3D3D3;
   /*margin: auto;*/
}

.fixedbottom {
 -webkit-transition: -webkit-transform 500ms ease;
  -moz-transition: -moz-transform 500ms ease;
  -ms-transition: -ms-transform 500ms ease;
  -o-transition: -o-transform 500ms ease;
  transition: transform 500ms ease;

}

.move-left > .fixedbottom {
 -ms-transform: translate(-15.625rem, 0);
  -webkit-transform: translate3d(-15.625rem, 0, 0);
  -moz-transform: translate3d(-15.625rem, 0, 0);
  -ms-transform: translate3d(-15.625rem, 0, 0);
  -o-transform: translate3d(-15.625rem, 0, 0);
  transform: translate3d(-15.625rem, 0, 0); 
}


.closeMenu {
    position: absolute;
    right: 5px;
    top: 5px;
    font-size: 1.5em;
    font-weight: bold;
    padding: 5px;
    color: #D5CEB7;
    text-shadow: 0 0 1px rgba(255,255,255,0.1);
    -webkit-transition: background 0.3s, box-shadow 0.3s;
    transition: background 0.3s, box-shadow 0.3s;
}

.closeMenu:hover {
	background: rgba(0,0,0,0.2);
	box-shadow: inset 0 -1px rgba(0,0,0,0);
	color: #fff;
}

.TrackListLeftPanel {
 box-shadow: inset 0 -1px rgba(0,0,0,0.2);
 height:4em;
}
.TrackListLeftPanel a {
    font-size:0.9em;
    padding-left: 5px;
    color:#FFF8DC;
}

.LabelLeftPanel {
    padding: 0 0.3rem 0 0.3rem;
    color:#FFF8DC;
    font-size:0.8em;
}

.LabelLeftPanel a {
    padding: 0 0.3rem 0 0.3rem;
    color:#FFF8DC;
}

.LabelLeftPanel a:hover  {
    color: white;  
}

.LabelLeftPanelStripe {
    padding: 0 0.3rem 0 0.3rem;
    font-size: 0.7em;
}

.LabelLeftPanelStripe a {
    padding: 0 0.3rem 0 0.3rem;
}

.size08 {
    font-size:0.8em;
}
    .size08 label {
        font-size: 0.8em;
        margin-right: 0 !important
    }
   

.LeftPanelTitleStripe {
    font-size: 0.7em;
}
.LabelTitleLeftPanel {
    box-shadow: inset 0 -1px rgba(0,0,0,0.2);
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    text-align: center;
    font-weight: bold;
    font-size: 1rem;
    display: block;
}

.SocialButtons {
    font-size:1.5rem;
    color:darkgray;
}

.Copycounter {
    font-size:2rem;
    font-weight : bold;
    color:#222222; 
}
.CopycounterSmall {
    font-size:1rem;
    font-weight : bold;
    color:#222222; 
}
.Copydescription {
    font-size:0.8rem;     
}
.CampaignCompleted{
     font-size:0.8rem;  
     font-weight : bold;
     color:#222222; 
}
.dark {
    color:#222222;
}
.lineheight1 {
    line-height:1.1; 
}

.button.secondary {
    background-color: #D3D3D3;
}

.button[disabled].secondary {
    background-color: #D3D3D3;
    color:#6E7883;
    opacity:1;
}

.button[disabled].secondary:hover  {
    background-color: #D3D3D3;
    color:#6E7883;
} 

.icon-bar > * i{
    color:inherit;
}


.icon-bar > a:hover .disablehover  {
     color:inherit;
}

.button.red {
  
    background-color: #AB1111;
  
}

    .button.red:hover {
        background-color: #7e0b0b;
        
    }

.OptionBox {
    position: relative;
    border-radius: 4px;
    background: #ffffff;
    height: 100%;
    display: flex;
    flex-flow: column nowrap;
}

.item-img {
    width: 100%;
    height: 300px;
    object-fit: cover;
}

    .item-img img {
        height: inherit;
        width: inherit;
        border-radius: 4px 4px 0 0;
    }

.Importantlabel {
    color: #333333;
    padding: 10px;
    font-size: 1rem;
    display: block;
    font-weight: bold;
    margin-bottom: 10px;
    border-bottom-style: solid;
    border-bottom-width: thin;
    border-bottom-color: #808080;
    margin-top: 5px;
    text-align :center;
}

.Labels {
    color: #777777;
    font-size: 0.8rem;
    font-weight: bold;   
    display: block;
}

    .Labels label {
        color: #777777;
        font-size: 0.8rem;
        font-weight: bold;
    }

.button_darkred {
    background-color: #AB1111;
}

    .button_darkred:hover, .button_darkred:focus {
        background-color: #850b0b;
    }
    .button_darkred.disabled, .button_darkred[disabled] {
        background-color: #ab111161;
    }

.item-wrapper {
    position: relative;
    border-radius: 4px;
    background: #ffffff;
    height: 100%;
    display: flex;
    flex-flow: column nowrap;
    margin-bottom: 2em;
}

.item-content {
    padding: 2rem 2rem 0 2rem;
    height: 150px;
}

.item-title {
    text-align: left;
}

.item-footer {
    padding: 0 0rem 1rem 1rem;
}

.btn {
    font-weight: 600;
    border-width: 1px;
    font-style: normal;
    margin: 0.6rem 0.6rem;
    white-space: normal;
    transition: all 0.2s ease-in-out;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    word-break: break-word;
    padding: 0.6rem 1.2rem;
    border-radius: 4px;
}

    .btn-secondary, 
    .btn-secondary:active {
    background-color: #ab1111 !important;
    border-color: #ab1111 !important;
    color: #ffffff !important;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2);
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary.focus
 {
    color: #ffffff !important;
    background-color: #5c0909 !important;
    border-color: #5c0909 !important;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2);
}

        .btn-secondary.disabled,
        .btn-secondary[disabled] {
            color: #ffffff !important;
            background-color: #a115159e !important;
            border-color: #a115159e !important;
            cursor: default;
        }

.dash_body {
    background-image: url(../img/dashboard/background.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.dash_banner {
    background-color: #AB1111;
    height: 12.5em;
    padding-top: 2em;
    margin-top: -2em;
}

.banner-title {
    color:white;
    font-size: 2rem;
    font-weight:bold;
}

.banner-label {
    color: white;
    font-size: 1rem;
    font-weight: bold;
}