

/*========================================*/
 @media (min-width: 1200px) 
/*========================================*/
 {
     #Body form {/*border: 1px solid lime;*/}

	.modulecontainer,
	.boxlink,
	.RelatedInner {
		margin-bottom:10px !important;
	}

	.slide-content h1 {
		font-size: 42px;
	}

	.slide-content h3 {
		font-size: 21px;
	}

	.slide-content a,
	.slide-content p {
		font-size: 16px
	}

	.trend_signup {
		height:316px;
		min-height:316px;
		max-height:316px;
	}

	.trendcutting_signup {
		height:282px;
		min-height:282px;
		max-height:282px;
	}
    .menu_box{ display:none; float:none; position:relative; padding:0; }
    .mobile_nav { display: none;}
    ul.headerMenu {
	    float: left;
	    margin-right: 10px;
    }
    .menuwrapper {
        
    }
    .topnav {text-align: right;display: inline-block;font-family: 'Futura W01 Light';}
    .menuwrapper {width: 60%;display: table-cell;}
    .searchboxcontainer{display: table-cell;float: none !important;/*z-index: 100000;*/}
    .searchboxcontainer {z-index: 10;}
    .mobilemenuwrapper{z-index: 100000!important;}
    .mobilemenuwrapperopen{ display: none!important;}
    .mobiletopmenu{ display: none;}
    .websitewrapper{ min-width: 320px!important;}
}




/*========================================*/
@media (max-width: 1199px) 
/*========================================*/
{
    #Body form {/*border: 1px solid orange;*/}

	.slide-content h1 {
		font-size: 36px;
	}

	.slide-content h3 {
		font-size: 18px;
	}

	.slide-content a,
	.slide-content p {
		font-size: 14px;
	}

	.trend_signup {
		height:252px;
		min-height:252px;
		max-height:252px;
	}
	.trendcutting_signup {
		height:225px;
		min-height:225px;
		max-height:225px;
	}
    .menu_box{ display:none; float:none; position:relative; padding:0; }
    .mobile_nav { display: none;}
    .mobilemenuwrapperopen{ display: none!important;}
    .mobiletopmenu{ display: none;}

    /*font main menu smaller*/
   #menu > ul > li > a, #menu > ul > li > span.disabled
    {
        font-size:11px;
    }
}




/*========================================*/
@media (max-width: 980px) 
/*========================================*/
{

    /*#Body form {border: 1px solid turquoise;}*/

	.modulecontainer,
	.boxlink,
	.RelatedInner {
		margin-bottom:10px !important;
	}
 
	.slide-content h1 {
		font-size: 30px;
	}

	.slide-content h3 {
		font-size: 15px;
	}

	.slide-content a,
	.slide-content p {
		font-size: 12px;
	}

	.trend_signup {
		height:191px;
		min-height:191px;
		max-height:191px;
	}

	/* 173 minus 2 for the border-top and border bottom */
	.trendcutting_signup {
		height:171px;
		min-height:171px;
		max-height:171px;
	}
   .menu_box{ display:none; float:none; position:relative; padding:0; }
    .mobile_nav { display: none;}
    #menu > ul > li > a, #menu > ul > li > span.disabled {
        font-size: 11px;
    }
    .slide-content h1 {
        font-size: 30px !important;
    }
    .slide-content h3 {
        font-size: 20px !important;
    }
    .mobilemenuwrapperopen{ display: none;}


/**/

.menu_box{ display:none; float:none; position:relative; padding:0; }

header .topnav 
    {
        display:inline-block;
        margin:5px 25px 0 0;
        font-family: 'Futura W01 Light';
}
 

    header .topnav {
        width: 100% !important;
        margin-left: 0px!important;
        margin-top: 10px !important;
    }
    header .topnav ul.headerMenuWrapper {
        text-align: center !important;
    }
    header .topnav ul.headerMenuWrapper li{
        float: none !important;
        display: inline-block;   
    }
     .nav-mega {
		display:none!important;
	}
      .mobile_nav{ float: right;margin-right: 12px;display: block}

       ul.headerMenu,
    ul.headerMenuWrapper {
        float: none!important;
    }
    ul.headerMenuWrapper {
        margin-bottom: 12px!important;
        display: inline-block!important;
        width: 100%!important;
    }
     .mobiletopmenu {
        display: block;
        /*padding-left: 10px;*/
        padding-right: 5px;
        padding-top: 10px;
        float: none;
        min-width: 140px;
        /*toegevoegd*/
        width:auto !important;
    }

  /* .home .imagebox {
        display: none;
    } */ 

    .mobilemenuwrapperopen {
        display: block!important;
        float: none;
        position: relative;
        padding: 0;
        /*top: 44px;*/

    }
  .headerMenu{ display: block !important;}
  .headerMenu li:first-child  {display:none ;}
    ul.headerMenuWrapper{display: none !important;}
    .mobilemenuwrapper{z-index: 100000!important;top: 43px;}

    .mobilemenuwrapperopen #SimpleMenu .rootMenu {
        position: relative !important;
    }

     .mobiletopmenu{
        /*
        min-width: 135px;
        max-width: 490px;
        overflow: hidden!important;
        width: 80%;
        width: -moz-calc(100% - 190px);
        width: -webkit-calc(100% - 190px);
        width: -o-calc(100% - 190px);
        width: calc(100% - 190px);
        text-align: center;
        */
        width: 100%;
    }
    .mobileTopMenuWrapper{width: 100%;display: inline-block!important;text-align:left;padding-left: 0px!important;padding-bottom: 10px!important;}
    .mobileTopMenuWrapper li { float: none!important;display: inline-block!important;}
    ul.mobileTopMenuWrapper{padding-top:10px;}
    header .search
    {
        margin-top:-40px;
    }

}
/*========================================*/
@media (max-width: 768px) 
/*========================================*/
{
    #Body form {/*border: 1px solid red;*/}
 header .topnav 
    {
        display:inline-block;
        margin:5px 25px 0 0;
    }
 	.trendcutting_signup {
		height: auto;;
		min-height: inherit;
		max-height: inherit;
	}

	.slide-content h1 {
		font-size: 24px;
	}

	.slide-content h3 {
		font-size: 12px;
	}

	.slide-content a,
	.slide-content p {
		font-size: 10px;
	}
    .menu_box{ display:none; float:none; position:relative; padding:0; }

    header .topnav {
        width: 100% !important;
        margin-left: 0px!important;
        margin-top: 10px !important;
    }
    header .topnav ul.headerMenuWrapper {
        text-align: center !important;
    }
    header .topnav ul.headerMenuWrapper li{
        float: none !important;
        display: inline-block;   
    }

    .mobile_nav{ float: right;margin-right: 12px;display: block}
    .site_logo { float: left;margin-left: 20px; margin-right:18px}
    .countryselection{ display: block;}
    .userinfomenu{ display: none;}
    .searchboxcontainer { width:100%!important;padding: 10px;border-top: 1px solid #333333;background-color: #333333!important;}
    .searchbox{}
    .searchInputContainer{ display: block !important;}
    .searchInputContainer input { padding: 5px!important;width: 80%!important;font-size: 14px !important;}
    .searchSkinObjectPreview{ width: 100% !important;top: 38px!important;}
    .searchInputContainer a.dnnShow {
        width: 40px!important;
        height: 40px!important;
        background-color: #333333!important;
        top: -12px!important;
        right: -2px!important;
    }
     header .search
    {
        margin-top:0;
    }
    .nav-mega {
		display:none!important;
	}
    .slide-content h1 {
        font-size: 20px !important;
    }
    .slide-content h3 {
        font-size: 15px !important;
    }
    ul.headerMenu,
    ul.headerMenuWrapper {
        float: none!important;
    }
    ul.headerMenuWrapper {
        margin-bottom: 12px!important;
        display: inline-block!important;
        width: 100%!important;
    }
    
    div.footerMenu {
        float: none!important;
        margin-right: 0px!important;
    }
    ul.horcopyright {
        margin-top: 10px!important;
        display: inline-block;
        width: 100%!important;
        text-align: center;
    }
    ul.horcopyright li {
        float: none!important;
    }
    nav#menuFooterRight {
        margin-left: 0px!important;
        text-align: center;
        width: 100%;
    }
    #menuFooterRight .horizontal {
        margin-top: 10px!important;
        text-align: center!important;
    }
    #menuFooterRight .horizontal li{
        float: none !important;
    }
    .bottom #menuFooter a:link, 
    .bottom #menuFooter a:visited {
        color: #ffffff!important;    
    }
    .socialwrapper {
        width: 100%!important;
        text-align: center!important;
        display: inline-block!important;
    }
    ul.social-bottom li {
        float: none !important;
        display: inline-block!important;
    }
    .footerMenu ul.horizontal{
        width: 100%!important;
        display: inline-block!important;
        text-align: center!important;
    }
    .footerMenu ul.horizontal li {
        float: none !important;
        display: inline-block!important;
    }
    .imagebox img
    {
        width: 100%;
    }
    .mobiletopmenu {
        display: block;
         padding-right: 5px;
        padding-top: 10px;
        /*float: left;*/
        min-width: 140px;
    }

    .homewrapper .imagebox
    {
        display:none;
    } 

    .mobilemenuwrapperopen {
        display: block!important;
        float: none;
        position: relative;
        padding: 0;
        /*top: 44px;*/

    }
    .sliderholder{ display: block;}
    .slide-content h1 {
        font-size: 18px !important;
    }
    .slide-content h3 {
        font-size: 14px !important;
    }
    .footerMenu ul.horizontal{
        width: 100%!important;
        display: inline-block!important;
        text-align: center!important;
    }
    .footerMenu ul.horizontal li {
        float: none !important;
        display: inline-block!important;
    }
    .sliderholder{ display: block;}
    .headerMenu{ display: block !important;}
     .headerMenu li:first-child  {display:none ;}
    ul.headerMenuWrapper{display: none !important;}
    .mobilemenuwrapper{z-index: 100000!important;top: 43px;}
    .cycle-slide-active .slide-content p { display: none;}
    .slide-content{top: 15%!important; }
    .cycle-slide-active .slide-content .orange-signup{ font-size: 12px!important;padding: 2px !important;margin-left: 0px !important;}
    .cycle-slide-active .slide-content h1 { font-size: 14px!important; margin-top: 50px!important;}
    .cycle-slide-active .slide-content h3 { font-size: 12px!important;}
    .cycle-slide-active .slide-content {width: 50% !important; }
    .cycle-pager{ bottom: -5%!important;}
    .mobilemenuwrapperopen #SimpleMenu .rootMenu {
        position: relative !important;
    }
    .slidercontenttextlefttrue {
        max-width: 40% !important;
    }
    .slidercontenttextleftfalse {
        left: 45%!important;
        max-width: 45% !important;
    }
    .mobiletopmenu{
        /*
        min-width: 135px;
        max-width: 490px;
        overflow: hidden!important;
        width: 80%;
        width: -moz-calc(100% - 190px);
        width: -webkit-calc(100% - 190px);
        width: -o-calc(100% - 190px);
        width: calc(100% - 190px);
        text-align: center;
        */
        width: 100%;
    }
    .mobileTopMenuWrapper{width: 100%;display: inline-block!important;text-align:left;padding-left: 0px!important;padding-bottom: 10px!important;}
    .mobileTopMenuWrapper li { float: none!important;display: inline-block!important;}
    ul.mobileTopMenuWrapper{/* text-align: center;*/}
    .xcessmapsmarkerlistgrid_item{ border-bottom: 1px solid white;}
    /*removed from max 480*/
    .cycle-slide .slide-content a.orange-signup{display:none;} /*Hides the orange buttons on the homepage slider*/
    .cycle-slideshow .cycle-pager { display: none;}/*Hides the slider bullets*/
    .headerbox img[src*="FindSalon"] {display:none;}/*Hides the header above the salon finder*/
}



/*========================================*/
/* Smartphones (portrait and landscape) ----------- */
@media (max-width : 480px) 
/*========================================*/
{
    #Body{                
        padding-left: 5px;
        padding-right: 5px;
    }
    #Body form {
        /*border: 1px solid yellow;*/
        min-width: 280px!important;
    }

    .modulecontainer,
	.boxlink,
	.RelatedInner {
		margin-bottom:10px !important;
	}

	/* Styles */
	.nav-mobile {
		display:block;
	}
	.nav-mega {
		display:none!important;
	}
	.nomobile {
		display:none;
	}
    header .topnav {
        width: 100% !important;
        margin-left: 0px!important;
        margin-top: 10px !important;
    }
    .countryselection{ display: none;}
    .userinfomenu{ display: none;}
    .searchboxcontainer { width:100%!important;padding: 10px;border-top: 1px solid #1b1b1b;}
    .searchbox{}
    .searchInputContainer{ display: block !important;}
    .searchInputContainer input { padding: 5px!important;width: 80%!important;}
    .searchSkinObjectPreview{ width: 100% !important;top: 38px!important;}
    .searchInputContainer a.dnnShow {
        width: 40px!important;
        height: 40px!important;
        background-color: #333333!important;
        top: -12px!important;
        right: -2px!important;
    }
    .footerMenu .horizontal li,
    .topnav .horizontal li {
        float: none;
        display: inline;
        margin-right: 2px;
    }
    .footerMenu ul.horizontal, 
    .topnav ul.headerMenu {
        text-align: left;
        width: 100%;
    }
    ul.headerMenu,
    ul.headerMenuWrapper {
        float: none!important;
    }
    ul.headerMenuWrapper {
        margin-bottom: 12px!important;
    }
    div.footerMenu {
        float: none!important;
        margin-right: 0px!important;
    }
    ul.horcopyright {
        margin-top: 30px!important;
        display: inline-block;
        width: 100%!important;
        text-align: center;
    }
    ul.horcopyright li {
        float: none!important;
    }
    nav#menuFooterRight {
        margin-left: 0px!important;
        text-align: center;
        width: 100%;
    }
    #menuFooterRight .horizontal {
        margin-top: 10px!important;
        text-align: center!important;
    }
    .bottom #menuFooter a:link, 
    .bottom #menuFooter a:visited {
        color: #ffffff!important;    
    }
    .socialwrapper {
        width: 100%!important;
        text-align: center!important;
        display: inline-block!important;
    }
    ul.social-bottom li {
        float: none !important;
        display: inline-block!important;
    }
    .mobile_nav {
        display: block;
    }
    .slide-content h1 {
        font-size: 18px !important;
    }
    .slide-content h3 {
        font-size: 14px !important;
    }
    .footerMenu ul.horizontal{
        width: 100%!important;
        display: inline-block!important;
        text-align: center!important;
    }
    .footerMenu ul.horizontal li {
        float: none !important;
        display: inline-block!important;
    }
    .sliderholder{ display: block;}
    ul.headerMenuWrapper{display: none !important;}
     .headerMenu li:first-child  {display:none ;}
    .mobilemenuwrapper{z-index: 100000!important;top: 43px;}
    .cycle-slide-active .slide-content p { display: none;}
    .slide-content{ top: 5%!important;}
    .cycle-slide-active .slide-content .orange-signup{ font-size: 12px!important;padding: 2px !important;margin-left: 0px !important;}
    .cycle-slide-active .slide-content h1 { font-size: 14px!important; margin-top: 50px!important;}
    .cycle-slide-active .slide-content h3 { font-size: 12px!important;}
    .cycle-slide-active .slide-content { width: 50% !important; }
    .cycle-pager{ bottom: -5%!important;}
    .mobilemenuwrapperopen #SimpleMenu .rootMenu {
        position: relative !important;
    }
    .slidercontenttextlefttrue {
        max-width: 40% !important;
        padding: 10px 0px 10px 0px!important;
    }
    .slidercontenttextleftfalse {
        left: 50%!important;
        max-width: 42% !important;
        padding: 10px 0px 10px 25px!important;
        margin-right: 0px!important;
    }
    .websitewrapper{ min-width: 280px!important;}
    .mobiletopmenu{
        /*
        min-width: 135px;
        max-width: 300px;
        overflow: hidden!important;
        width: 80%;
        width: -moz-calc(100% - 190px);
        width: -webkit-calc(100% - 190px);
        width: -o-calc(100% - 190px);
        width: calc(100% - 190px);
        */
        width: 100%;
    }
    .mobileTopMenuWrapper{width: 100%;display: inline-block!important;text-align:left;padding-left: 0px!important;padding-bottom: 10px!important;}
    .mobileTopMenuWrapper li { float: none!important;display: inline-block!important;margin-right: 3px!important;}
    ul.mobileTopMenuWrapper{/* text-align: center;*/}

    .mapcanvas{ display: none;}/*Hides Google Map in mobile view*/

    .xcessmapsmarkerlistgrid_item{ border-bottom: 1px solid white;}
    .xcessmapsrefresh{ display: none;}
    .mobiletopmenu {padding-right: 0px!important;}
    .topnav{margin-right:0px!important;}
    .mapcanvas{width:300px!important;}
    .headerbox .header-overlay h1 { font-size: 14px;}
    .headerbox .header-overlay h2 { font-size: 12px;}
}


