/* 
    Document   : layout
    Created on : Apr 14, 2014, 3:37:45 PM
    Author     : jesseryles
    Description:
        Purpose of the stylesheet follows.
*/

.slicknav_menu {
    display:none;
}

@media screen and (max-width: 1150px) {
    .site-width { 
		width: 100% !important; 
	}
	
    .top-header .cart-icon { 
		right: 14px; 
	}
	
    article { 
		width: 100%; padding: 0px 5%;
	}
    .page-wrapper .left { 
		padding: 0px 5%; 
	}
}

/* iPhone X */
@media only screen 
    and (device-width : 375px) 
    and (device-height : 812px) 
    and (-webkit-device-pixel-ratio : 3) {
	.top-header #logo {
	}	

	.header-width{
		width: 100%;
		float: left;
		display: block;
		height: 80px;
	}
	
	.top-header div.line { 
		width: 65%;				
	}
	
	.top-header .line hr {
		height: 15px;
	}	
}

/* iPhone 8 */
@media only screen 
    and (device-width : 375px) 
    and (device-height : 667px) 
    and (-webkit-device-pixel-ratio : 2) { 
	.top-header #logo {
	}
	
	.header-width{
		width: 100%;
		float: left;
		display: block;
		height: 80px;
	}
	
	.top-header div.line { 
		width: 65%;				
	}
	
	.top-header .line hr {
		height: 15px;
	}
}

/* iPhone 8 Plus */
@media only screen 
    and (device-width : 414px) 
    and (device-height : 736px) 
    and (-webkit-device-pixel-ratio : 3) { 
	.top-header #logo {
	}
	
	.header-width{
		width: 100%;
		float: left;
		display: block;
		height: 80px;
	}
	
	.top-header div.line { 
		width: 65%;				
	}
	
	.top-header .line hr {
		height: 15px;
	}
}
	
@media screen and (max-width: 60em) {

    .header{
	    height: 100px;
		background-color: unset;
	}
	
	.header-details {
		width: 90%; 
		float: right;
		font-size: 10px;
		padding-right: 15px;
	}
	
	.header-details > .phone{
		padding-right: 0 !important;
	}
	
	.registrationform-logo{
		top: 20px !important;
	}
	
	.line-registrationform hr {
		top: 30px;
		color: #FFF;
		border-bottom: 3px solid #011F42;
		height: 10px;
		width: 75%;
		float: right;
		padding-right: 15px;
		border-top: 0px;
		border-left: 0px;
		border-right: 0px;
		position: relative;
		margin-right: 15px;
	  }
    
    /* #menu is the original menu */
    .js #menu-main-menu {
        display:none;
    }

    .js .slicknav_menu {
        display:block;
    }
	
	.header-width{
		width: 100%;
		float: left;
		display: block;
		height: 100px;
	}
	
	.top-header div.line { 
		width: 87%;	
		padding-right: 10px;		
	}
	
	.top-header .line hr {
		height: 25px;
	}
	
    .site-width{
		width: 100%;
		float: left;
		display: block;		
	}
	
    .bottom-header {
		/*padding-right: 100px;*/
		padding-right: 10px;
	}
    .top-header .cart-icon {
		top: 8px;
		right: 20px;
	}
	
    .top-header #logo {
        position: absolute;
        top: -12px;
        left: 20px;
        width: 261px;
    }
	
    .partner-wrapper{ 
		padding-left: 38px;
	}
	
    .footer .widget{width:100%;float:left;padding-left:25px;}
    .footer .widget .ten-years {top:10px;right:20px;}
    .below-footer .copyright, .footer-nav{float:left;width:100%;display:block;padding-left:25px;}
    .below-footer .footer-nav { text-align: left; }
    .site-credit{width:200px !important;}

    .product-wrapper-main .right .course-date { height: auto; padding-bottom: 10px; }
    .product-wrapper-main .right .course-date .description { width: 60%; }
    .product-wrapper-main .right .course-date .qty, .product-wrapper-main .right .course-date .book { float: right; }

    .staffing-services-wrap, .container-services-wrap, .training-services-wrap { padding-bottom: 30px; background-position: center right !important; }
    .product-wrapper .product-bucket { width: 32%; }

    .partner-wrapper span { width: 100%; margin-top: 0px; margin-bottom: 10px; }

    .product-wrapper-main .right .course-special { height: auto; padding-bottom: 10px; }

    .discount-text { float: left; width: 100%; }
    .woocommerce form { float: left; width: 100%; margin-top: 10px; }
    .woocommerce .minus, .woocommerce .plus { display: none; }
    .terms-conditions { width: 100%; }
    .buttons-wrapper { width: 100%; padding-top: 20px; }
    
    .content-wrapper .home-cta a{padding:10px 30px;}
}

@media screen and (max-width: 40em) {

    .slider-wrapper .owl-next {
        position: absolute;
        top: -16%;
        left: 37px;
    }
	
    .slider-wrapper .owl-prev {
        position: absolute;
        top: -16%;
        left: 0;
    }
	
	.header-width{
		width: 100%;
		float: left;
		display: block;
		height: 80px;
	}
	
	.top-header div.line { 
		width: 84%;				
	}
	
	.top-header .line hr {
		height: 5px;
	}
	
    .content-wrapper {
		overflow:hidden;
	}
	
    .cart-icon{
		display: block !important;
		width: 20px !important;
		height: 20px !important;
		position: absolute !important;
		font-size: 14px !important;
		background-color: transparent !important;
		top: -13px !important;
		right: 25px !important;
		z-index:9999;
    }
	
    .top-header .cart-icon i {
		font-size: 23px !important;
		position: relative !important;
		top: 0px !important;
		padding-left: 0px !important;
		color: white !important;
		left: -10px !important;
	}

	.top-header .cart-icon .counter {
		background-color: white;
		color: #89bb54;
		width: 23px;
		display: block;
		height: 25px;
		border-radius: 100%;
		padding-top: 2px;
		text-align: center;
		position: absolute;
		top: 24px;
		right: -20px;
	}
	
    .bottom-header .facebook{display:none;}
    .top-header #logo{width:180px;}
    .bottom-header { padding-right:0; }
    .bottom-header .phone{ padding-right: 15px; float: right; }
    .content-page-header { padding-left:20px; }
    .page-wrapper .right, .page-wrapper .left { width:100%;float:left; }
    .page-wrapper .left { padding: 0px 5%; }
    .product-wrapper .product-bucket { min-width:284px; }
    .content-page-header h1 { font-size:32px !important; }
    .product-wrapper-main .left, .product-wrapper-main .right{ width:100%; }
    .product-wrapper-main .left .tab-triggers .tab-trigger { font-size:12px; }
    .product-wrapper-main .left .tab-content #map {    
		width: 107%;
		height: 206px;
		display: block;
		float: left;
		margin-left: -14px;
		margin-bottom: -10px;
    }
    .product-wrapper-main .right .course-date .book {
        padding: 10px 9px;
        font-size: 12px;
    }
	
    .terms-conditions{width:100%;}
    .buttons-wrapper{    
        float: right;
        width: 100%;
        display: block;
        margin-top: 20px;
    }
    .coupon #coupon_code {margin-bottom:20px;}
    .shop_table.cart{    
		margin: 0;
		float: left;
		font-size: 11px;
		margin-bottom: 20px;
	}
	
    .checkout-nav a {font-size:12px;padding-top: 4px !important;}
    .checkout-nav a:after{display:none;}

    .footer .widget:first-child { width: 100%; }
    .footer .widget .ten-years { display: none; }

    .product-wrapper-main .left .product-title { height: auto; }
    .product-wrapper-main .left .product-title .price { width: 80%; text-align: right; padding-bottom: 10px;}
    .product-wrapper-main .left .product-title h2 { width: 80%; }

    .content-wrapper .home-cta h2 { font-size: 36px; }
    .content-wrapper .home-cta a { width: 100%; display: inline-block; padding:10px 0px;}
    .content-wrapper .training-services-wrap { min-height: initial; }
    .slider-wrapper { display: none !important; }
    .top-header { text-align: center; }
    .top-header #logo { /*width: 100%;*/ left: 0px; display: block; }
    .top-header #logo img { height: 110px; }
    .bottom-header .phone { /*position: absolute; */ color: #1ab7ea; top: 11px; left: 0px; }
	.bottom-header .phone:hover { color: #335781; }

    .discount-text { font-size: 16px; margin-bottom: 10px; }
    .add-course { width: 100%; }
    .woocommerce th, .woocommerce tr { padding: 5px;}
    .woocommerce table.shop_table th { padding: 0px; }
    .woocommerce table.shop_table td { padding: 0px; }
    .woocommerce td.product-quantity { min-width: initial; }
    .woocommerce .product-name { padding-left: 10px !important; }
    .woocommerce .product-remove { padding-right: 10px !important; }
    .woocommerce label.coupon-label { display: none !important; }
    .woocommerce #coupon_code { width: 40%; }
    .woocommerce .coupon button { width: 40% !important; }
    .woocommerce .cart-details { font-size: 14px;}
    .woocommerce td.actions { padding-bottom: 10px !important; padding-right: 5px !important; }
    .woocommerce .total { font-size: 14px; }
    .terms-conditions { font-size: 14px; }
    .product-price { text-align: center; }
    .buttons-wrapper { position: relative; min-height: 100px; }
    .checkout-button { position: absolute; width: 50%; right: 10px; top: 50px; }
    .update-button { position: absolute; width: 50%; right: 10px; top: 0px; }
    
    .years{
        font-size: 28PX;
        right: 77px;
    }
    .related-wrapper .product-bucket{
        width:90% !important;margin:0 5% !important;
    }
}