﻿body, html { width:100%; height:100%; margin:0; background:#F5F5F5; color:#1A1A1A; font-family:Arial; font-size:9pt; line-height:1.5; }

h1 { font-family:Arial; font-weight:bold; color:#ED6724; font-size:26pt; line-height:1; margin:0; padding:0; }
h2 { font-family:Arial Narrow, Arial; font-weight:bold; font-size:24pt; line-height:1; margin:0; padding:5px 0 0 0; color:#FF6600; }
h3 { font-family:Arial; font-weight:bold; color:#1A1A1a; font-size:24pt; line-height:1; margin:0; padding:0 0 5px 0; }
h4 { font-family:Arial; font-weight:normal; color:#1A1A1a; font-size:18pt; line-height:1; margin:0; padding:0 0 5px 0; }
a { color:#ED6724; text-decoration:none; }
    a:hover { text-decoration:underline; }
p { margin:0; padding:0 0 10px 0; }
hr { clear:both; margin:0; padding:0; height:0; border:0; }
br.clear { clear:both; }

#scroll_top { position:fixed; bottom:10px; right:10px; width:40px; height:40px; background:url(../images/site/buttons/top_btn.png) no-repeat; display:none; }
    #scroll_top:hover { cursor:pointer; }

/* Page containers */
.full_container { width:100%; float:left; }
.container { width:1400px; margin:0 auto; }

/* Colours */
.white_bg { background-color:#FFFFFF; }  
.orange_bg { background-color:#ED6724; } 
.blue_bg { background-color:#3C7DC4; }  
.green_bg { background-color:#91C442; }  
.light_bg { background-color:#E3E3E3; }  
.dark_grey_bg { background-color:#5B5B5B; }

.center { text-align:center; }

.dark_grey { color:#5B5B5B; }
.white { color:#FFFFFF; }  
.blue { color:#3C7DC4; }  
.green { color:#ED6724; }  
.bold { font-weight:bold; }

/* Borders */
.border1blue { border-top:1px solid #3276B5; border-bottom:1px solid #3276B5; }

/* Padding, margins and alignment */
.padding20 { padding-top:20px; padding-bottom:20px; }
.padding2010 { padding-top:20px; padding-bottom:10px; }
.padding10 { padding-top:10px; padding-bottom:10px; }
.paddingtop10 { padding-top:10px; }
.margin20 { margin-top:20px; margin-bottom:20px; }
.margin10 { margin-top:10px; margin-bottom:10px; }
.margintop10 { margin-top:10px }
.text_left { text-align:left; }
.text_center { text-align:center; }
.text_right { text-align:right; }
.fixed { position:fixed; }

.input_loading { background:url(../images/site/input-loader.gif) right 5px top 8px no-repeat #FFFFFF; }
.input_success { background:url(../images/site/input-success.png) right 5px top 8px no-repeat #FFFFFF; }
.input_error { background:url(../images/site/input-error.png) right 5px top 8px no-repeat #FFFFFF; }
    
/* Curvaceous */
.curve_top { background-color:#FF0000; -webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -moz-border-radius-topleft:4px; -moz-border-radius-topright:4px; border-top-left-radius:4px; border-top-right-radius:4px;   -webkit-border-bottom-right-radius:0; -webkit-border-bottom-left-radius:0; -moz-border-radius-bottomright:0; -moz-border-radius-bottomleft:0; border-bottom-right-radius:0; border-bottom-left-radius:0; }
.curve_bottom { -webkit-border-bottom-right-radius:4px; -webkit-border-bottom-left-radius:4px; -moz-border-radius-bottomright:4px; -moz-border-radius-bottomleft:4px; border-bottom-right-radius:4px; border-bottom-left-radius:4px; }
.curve_all { -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }
.curve_left { -webkit-border-top-left-radius:4px; -webkit-border-bottom-left-radius:4px; -moz-border-radius-topleft:4px; -moz-border-radius-bottomleft:4px; border-top-left-radius:4px; border-bottom-left-radius:4px; }
.curve_right { -webkit-border-top-right-radius:4px; -webkit-border-bottom-right-radius:4px; -moz-border-radius-topright:4px; -moz-border-radius-bottomright:4px; border-top-right-radius:4px; border-bottom-right-radius:4px; }

.window_bg { display:none; z-index:9999; width:100%; height:100%; position:fixed; background:rgba(0,0,0,0.8); }
.loading_window_bg { display:none; z-index:9999; width:100%; height:100%; position:fixed; background:rgba(0,0,0,0.8); }
.loading { display:none; z-index:10000; position:fixed; top:50%; left:50%; margin:-31px 0 0 -31px; width:62px; height:62px; background:url(../images/site/loading.gif) no-repeat center center #ED6724; -webkit-border-radius:40px; -moz-border-radius:40px; border-radius:40px; }
.modal { box-sizing:border-box; width:600px; min-height:60px; margin-right:auto; margin-left:auto; top:50%; right:0; left:0; position:fixed; background:#FFFFFF; z-index:10000; box-shadow:0 7px 20px rgba(0, 0, 0, 0.25); -webkit-box-shadow:0 7px 20px rgba(0, 0, 0, 0.25); -moz-box-shadow:0 7px 20px rgba(0, 0, 0, 0.25);  }
    .modal .close_modal { display:block; background:url(../images/site/window_close.png) no-repeat; width:30px; height:30px; position:absolute; right:10px; top:15px; }
        .modal .close_modal:hover { cursor:pointer; opacity:0.8; filter:alpha(opacity=80); }
    .modal .modal_inner { width:100%; float:left; display:block; }
        .modal .modal_inner .modal_container { width:100%; float:left; padding:20px; box-sizing:border-box; }
            .modal .modal_inner .modal_container h1 { text-transform:uppercase; font-size:21px; }
    
    .modal .modal_inner .scrollable { height:600px; box-sizing:border-box; padding:20px; width:100%; float:left; overflow:auto; }
        .modal .modal_inner .scrollable h3 { color:rgb(145,197,71); text-transform:uppercase; font-size:20px; margin:0; padding:0 0 10px 0; }
    .modal_inner .header { width:100%; font-size:22px; color:#FFFFFF; float:left; display:block; background:#000000; box-sizing:border-box; padding:16px 20px; }
        .modal_inner .header.error { background-color:#E31030; }
        .modal_inner .header.success { background-color:#91C442; }
    .modal_inner .contents { width:100%; float:left; display:block; background:#FFFFFF; box-sizing:border-box; padding:19px; }
        .modal_inner .contents span.title { font-size:17px; display:block; float:left; width:100%; font-weight:bold; }
        .modal_inner .contents span.description { font-size:15px; display:block; float:left; width:100%; }
    .modal_inner .modal_main { width:100%; box-sizing:border-box; padding:20px; float:left; }
    .modal_inner .buttons { border-top:1px solid #DDDADA; background:#F6F6F6; width:100%; float:left; display:block; box-sizing:border-box; padding:8px 20px; text-align:right; }
        .modal_inner .buttons button { border:1px solid #DDDADA; font-size:14px; font-weight:bold; text-align:center; width:90px; padding:7px 0; margin:0 7px 0 0; outline:none; webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
            .modal_inner .buttons button.green_btn { background:#91C442; color:#FFFFFF; }
            .modal_inner .buttons button.red_btn { background:#E31030; color:#FFFFFF; }
            .modal_inner .buttons button.white_btn { background:#FFFFFF; font-weight:normal; }
            .modal_inner .buttons button:hover { cursor:pointer; opacity:0.9; filter:alpha(opacity=90); }
 
   
    header { z-index:2; position:fixed; height:60px; background:rgba(237,103,36,0.9); top:0; left:0; width:100%; }
        header .logo { float:left; margin-left:20px; }
            header .logo a { float:left; display:block; width:240px; height:60px; background:url(../images/site/logo.png) no-repeat left center; text-indent:-9999px; } 
            header nav.main_nav { float:left; position:relative; }
                header nav.main_nav a.menu { margin:9px 0 0 15px; display:block; float:left; padding:6px 0 0 38px; font-weight:bold; color:#000000; font-size:20px; text-transform:uppercase; width:107px; box-sizing:border-box; height:40px; background:url(../images/site/menu_icon.png) no-repeat left 6px center rgba(255,255,255,1); -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
                    header nav.main_nav a.menu:hover { background-color:rgba(255,255,255,0.9); text-decoration:none; }
                header nav.main_nav .menu_arrow { margin:58px 0 0 -152px; top:0; left:0; background:url(../images/site/menu_arrow.png) no-repeat; display:none; width:206px; height:105px; z-index:20; position:absolute; }
            
            header .search { width:40%; height: 45px; display:block; float:right; padding:15px 0 0 0; text-align: center; margin-right:15px; }
            header .search input { background:#FFFFFF; outline:none; width:70%; height:80%; font-size:20px; font-weight:bold; padding:0 4px 0 4px; border:1px solid #DDDDDD; webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
            header .search button { background-color:rgb(237,103,36); color:#FFFFFF; outline:none; width:18%; height:50%; font-size:18px; padding:2px 0 1px 0; border:1px solid #DDDDDD; webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
            
            header .trolley { box-sizing:border-box; padding:9px 0 0 0; width:46px; height:60px; display:block; float:right; margin-right:20px; }
            header .trolley a.trolley_link { display:block; float:left; color:#FFFFFF; box-sizing:border-box; padding-right:8px; font-weight:bold; font-size:16px; text-align:center; width:46px; height:41px; background:url(../images/site/trolley_icon.png) no-repeat center center transparent; }
                header .trolley a.trolley_link:hover { text-decoration:none; }
                  
        nav.side_nav { position:relative; color:#FFFFFF; display:none; z-index:10000; width:350px; height:100%; position:fixed; top:0; left:0; background:rgba(0,0,0,0.9); }
            nav.side_nav .side_header { position:absolute; width:100%; top:0; left:0; box-sizing:border-box; height:60px; }
                 nav.side_nav .side_header .logo { float:left; margin-left:20px; }
                 nav.side_nav .side_header .logo a { float:left; display:block; width:240px; height:60px; background:url(../images/site/logo.png) no-repeat left center; text-indent:-9999px; }
                 nav.side_nav .side_header button.close_nav { top:13px; right:0px; height:30px; width:30px; background:url(../images/site/close_x.png) no-repeat center center; text-indent:-9999px; position:absolute; outline:0; border:0; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
                    nav.side_nav .side_header button.close_nav:hover { cursor:pointer; }
            nav.side_nav .side_menu { position:absolute; top:60px; left:0; width:100%; height:100%; padding:10px 20px 20px 20px; box-sizing:border-box; overflow-x:hidden; overflow-y:auto; }
            nav.side_nav .side_menu h3 { color:#ED6724; text-transform:uppercase; font-size:16px; padding:0 0 10px 0; margin:0; }
            nav.side_nav .side_menu::-webkit-scrollbar { width:10px; background-color:#1E1E1E; } 
            nav.side_nav .side_menu::-webkit-scrollbar-thumb{ background-color:#ED6724; border-radius:1px; }
            nav.side_nav .side_menu::-webkit-scrollbar-thumb:hover{ background-color:#D25A1E; }
            nav.side_nav .side_menu::-webkit-scrollbar-thumb:active{ background-color:#D25A1E; } 
                nav.side_nav .side_menu ul.side_menu_options { margin:0 0 15px 0; padding:0; list-style:none; width:100%; float:left; }
                    nav.side_nav .side_menu ul.side_menu_options li { display:block; padding:0 0 3px 0; }
                        nav.side_nav .side_menu ul.side_menu_options li.main a { font-size:16px; font-weight:bold; }
                        nav.side_nav .side_menu ul.side_menu_options li a { color:#FFFFFF; font-size:15px; }
                        
    main { width:100%; border-top:60px solid #F5F5F5; float:left; margin:10px 0 0 0; padding:0; position:relative; }
        
        main .empty { color:#959595; width:100%; float:left; text-align:center; background:url(../images/site/sad.png) center top no-repeat; padding:160px 0 0 0; }
            main .empty span.notice { font-size:22px; display:block; font-weight:bold; }
            main .empty span.description { font-size:18px; display:block; }
                main .empty span.description a { color:#959595; text-decoration:underline; }
                    main .empty span.description a:hover { text-decoration:none; }
                    
        main .top_search { text-align:center; position:fixed; z-index:1000; top:60px; left:0; width:100%; float:left; background:rgba(255,255,255,0.98); padding:20px 10px; box-sizing:border-box; }
            main .top_search input { background:#FFFFFF; outline:none; width:50%; font-size:30px; font-weight:bold; padding:5px 10px; border:1px solid #DDDDDD; webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
            main .top_search button { background-color:rgb(237,103,36); color:#FFFFFF; outline:none; font-size:30px; padding:5px 10px; border:1px solid #DDDDDD; webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
                main .top_search button:hover { cursor:pointer; background-color:rgba(237,103,36,0.9); }
        
        #breadcrumb { margin:0 0 10px 0; background-color:#F5F5F5; border-top:2px dotted #E9E9E9; border-bottom:2px dotted #E9E9E9; z-index:1; width:100%; position:relative; float:left; padding:6px 0; font-size:14px; }  
            #breadcrumb.breadcrumb_btm { border-bottom:none; border-bottom:none; }
            #breadcrumb ul.breadcrumb { margin:0; padding:0; list-style:none; }
            #breadcrumb ul.breadcrumb li { display:inline-block; background:url(../images/site/breadcrumb_arrow.png) no-repeat center left; padding:0 5px 0 22px; font-weight:bold; color:#000000; }    
            #breadcrumb ul.breadcrumb li.here { background:none; padding:0 5px; }
            #breadcrumb ul.breadcrumb li a { color:#000000; font-weight:normal; }

        main .main_container { margin:1% 0; width:100%; float:left; }  
        main .main_header { width:98%; margin:0 1%; float:left; }
        main .main_container { width:100%; float:left; display:block; }
    
    .main_top { margin:10px 0 0 0; }
    
footer { width:100%; float:left; margin:20px 0 0 0; background:#1A1A1A; color:#FFFFFF; border-bottom:1px solid #5B5B5B; }
    footer a { color:#FFFFFF; text-decoration:underline; }
        footer a:hover { text-decoration:none; }
    footer .footer { width:100%; margin:20px 0; float:left; }
    footer .footer .top { width:98%; float:left; margin:0 1%; border-top:1px solid #ED6724; }
    footer .footer .footer_box_wide { width:48.5%; float:left; margin:20px 0 20px 1%; }
        footer .footer .footer_box_wide span.footer_header { font-weight:bold; font-size:14pt; padding:0; margin:0; display:block; }
        footer .footer .footer_box_wide .browse_options { width:48%; margin:0 1% 0 0; float:left; }
        footer .footer .footer_box_wide ul.footer_list { margin:10px 0 0 0; padding:0; list-style:none; }
            footer .footer .footer_box_wide ul.footer_list li { margin:0; padding:0 0 4px 0; }
            footer .footer .footer_box_wide ul.footer_list li a { line-height:1.1; text-decoration:none; }
                footer .footer .footer_box_wide ul.footer_list li a:hover { text-decoration:underline; }
            footer .footer .footer_box_wide ul.footer_list li.main a { font-weight:bold; font-size:15px; }
        
    footer .footer .footer_box { width:24.25%; float:left; margin:20px 0 20px 1%; }
        footer .footer .footer_box span.footer_header { font-weight:bold; font-size:14pt; padding:0; margin:0; display:block; }
        footer .footer .footer_box ul.footer_list { margin:10px 0 0 0; padding:0; list-style:none; }
            footer .footer .footer_box ul.footer_list li { margin:0; padding:0 0 4px 0; }
                footer .footer .footer_box ul.footer_list li a { text-decoration:none; }
                    footer .footer .footer_box ul.footer_list li a:hover { text-decoration:underline; }
        footer .footer .footer_box ul.contact { margin:0; padding:0; list-style:none; }
            footer .footer .footer_box ul.contact a { display:block; float:left; margin:10px 7px 0 0; }
                footer .footer .footer_box ul.contact a:hover { opacity:0.8; filter: alpha(opacity=80); }
            footer .footer .footer_box ul.contact a.facebook { background:url(../images/site/facebook.png) no-repeat; display:block; width:42px; height:42px; text-indent:-9999px; }
            footer .footer .footer_box ul.contact a.twitter { background:url(../images/site/twitter.png) no-repeat; display:block; width:42px; height:42px; text-indent:-9999px; }
            footer .footer .footer_box ul.contact a.email { background:url(../images/site/email.png) no-repeat; display:block; width:42px; height:42px; text-indent:-9999px; }
            footer .footer .footer_box ul.contact a.youtube { background:url(../images/site/youtube.png) no-repeat; display:block; width:42px; height:42px; text-indent:-9999px; }
        
        footer .footer div.footer_cards { background:#000000; text-align:center; width:98%; float:left; padding:10px 0; margin:10px 1% 0 1%; }
        footer .footer div.footer_notice { text-align:center; width:98%; float:left; padding:20px 0 0 0; margin:10px 1% 0 1%; border-top:1px solid #000000; }
 header .search {﻿
    width: 38%;
}

header .search in﻿put {
    wi﻿dth: calc(95% - 7﻿5px﻿)﻿﻿;
}

header .search button {width: 75px;}   
/* Resize general elements to Media */
@media only screen and (max-width:1050px) 
{
    .modal { width:98%; }
    header { height:121px; min-width:350px;}
        header .logo { float:left; border-bottom:1px solid #D25A1E; height:60px; width:100%; margin:0; display:block; text-align:center; }
            header .logo a { width:100%; height:60px; display:block; background-position:center center; } 
            header nav.main_nav { width:32%; float:left; }
				
            header .search { position:relative; width:40%; float:left; margin-left:2px; }
            header .search input { width:55%; font-size:12px; min-width:107px;}
            header .search button { width:40%; font-size:12px; margin-top:5px; min-width:50px;}

            header .trolley { }
    main { border-top:121px solid #F5F5F5; }
    #breadcrumb { display:none; }
    nav.side_nav { width:100%; }
    .container { width:98%; }
    footer .footer .footer_box_wide { display:none; }  
    footer .footer .footer_box { width:96%; margin:0 0 10px 2%; }
    main .top_search { top:121px; }
        main .top_search input { font-size:18px; width:65%; }
        main .top_search button { font-size:18px; }
    footer .footer div.footer_cards img { width:100%; }

} 
                
@media only screen and (min-width:475px) and (max-width:650px) 
{
    .modal { width:98%; }
    header .search { width:46px; }
        header .search a.search_link { width:46px; padding:0 6px 0 0; background-position:center center; text-indent:-9999px; }
            
    #breadcrumb { display:none; }
    nav.side_nav { width:100%; }
    .container { width:98%; }
    footer .footer .footer_box_wide { display:none; }  
    footer .footer .footer_box { width:98%; margin:0 0 10px 1% }
    main .top_search input { font-size:22px; width:80%; }
    main .top_search button { font-size:22px; }
    footer .footer div.footer_cards img { width:100%; }

} 

@media only screen and (min-width:650px) and (max-width:1024px) 
{
    #breadcrumb { display:none; }
    .container { width:98%; }
    footer .footer .footer_box_wide { display:none; }  
    footer .footer .footer_box { width:48%; }
        main .top_search input { font-size:26px; width:80%; }
        main .top_search button { font-size:26px; }
    footer .footer div.footer_cards img { width:90%; }
} 

@media only screen and (min-width:1024px) and (max-width:1200px) 
{
    .container { width:1024px; }
} 

@media only screen and (min-width:1200px) and (max-width:1400px) 
{
    .container { width:1200px; }
}

/* CUSTOM CSS */

.worldpay_button {float:left; font-size:20px; border:0; outline:0; background:url(../images/site/continue_arrow.png) right 8px center no-repeat rgba(237,103,36,1); color:#FFFFFF; text-decoration:none; font-weight:bold; color:#FFFFFF; display:block; padding:10px 34px 10px 15px; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}
.worldpay_button:hover { cursor:pointer; background-color:rgba(237,103,36,0.9); text-decoration:none; }

.payment_type { font-size: 14px;}