/* ==========================================================================
   juristopaslaugos.lt - tema "Dizainas" - mobili versija
   --------------------------------------------------------------------------
   Visos taisykles yra @media bloku viduje, todel platesniems nei 1000px
   ekranams sis failas itakos neturi: kompiuteryje tema atrodo lygiai taip
   pat kaip anksciau. images/style.css ir images/demo.css nepaliesti.

   Breakpointai:
     <= 1000px  tempiamas plotis (panaikinamas body min-width:980px)
     <=  900px  mobilus meniu (hamburger) + vienas stulpelis
     <=  640px  telefonas
     <=  420px  siauras telefonas

   SVARBU 1: sablone yra inline style="" atributu (article width:730px,
   p width:500px, footer height:80px, .foot padding-top:80px). Inline stilius
   nugali isorini CSS, todel tose vietose butinas !important.

   SVARBU 2: isdestymas pastatytas ant float:left/right. Plaukiantis elementas
   su width:auto susitraukia iki turinio, todel ten, kur blokas turi uzimti
   visa ploti, rasoma width:100%, o ne width:auto.
   ========================================================================== */

/* Hamburger ir submeniu rodykles sukuria responsive-menu.js.
   Kompiuteryje jos visada paslėptos. */
.mobile-menu-toggle,
.mobile-submenu-toggle { display: none; }


/* ==========================================================================
   1. IKI 1000px - tempiamas plotis
   ========================================================================== */
@media screen and (max-width: 1000px) {

	*, *::before, *::after { box-sizing: border-box; }

	body {
		min-width: 0;
		-webkit-text-size-adjust: 100%;
	}

	/* Pagrindiniai konteineriai (buvo fiksuoti 960px) */
	.main {
		width: 100% !important;
		max-width: 960px;
		margin: 0 auto !important;
		padding: 0 12px;
	}
	.container_12,
	.wrapper,
	.head-box1,
	.head-box3 { width: 100% !important; }

	/* Slaideris */
	.slider-bg,
	.slider-line,
	.slider { width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
	.slider img { width: 100% !important; height: auto !important; display: block; }

	/* Turinio stulpelis: 730px -> procentais, forma lieka desineje */
	article.grid_8,
	article.grid_8.push_1 {
		width: 68% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
	/* Pilno plocio eilutes: citata ir apdovanojimai. Buvo 940px ir juos
	   nukirpdavo .wrapper { overflow:hidden } - tekstas "dingdavo" desineje. */
	article.grid_12,
	.grid_12 {
		width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	/* 960 grid klase "push_1" turi position:relative; left:10px - del to
	   turinio stulpelis pasislinkdavo 10px i desine ir tiek pat islisdavo
	   uz .wrapper krasto, kuris ji nukirpdavo (overflow:hidden). */
	.container_12 [class*="push_"],
	.container_12 [class*="pull_"] {
		left: 0 !important;
		right: auto !important;
	}

	.page1-box3 { width: 100% !important; }
	.page1-box3 p { width: 100% !important; }   /* nugali inline width:500px */

	/* Citatos blokas ir apatine linija */
	.page1-box6 { width: 100% !important; padding-left: 20px !important; }
	.foot-line { width: 100% !important; margin: 0 auto !important; max-width: 936px; }

	/* Apdovanojimu juosta */
	.wrapper.p13 article.grid_12 > img { max-width: 30%; height: auto; }
	.wrapper.p13 article.grid_12:last-child > img { max-width: 100%; }
}


/* ==========================================================================
   2. IKI 900px - mobilus meniu ir vienas stulpelis
   ========================================================================== */
@media screen and (max-width: 900px) {

	/* --- Hamburger mygtukas (tamsi juosta, kad tekstas matytusi) --- */
	.mobile-menu-toggle {
		display: block;
		width: 100%;
		margin: 0;
		padding: 13px 10px;
		border: 0;
		border-bottom: 1px solid #262626;
		background: #353434;
		color: #fff;
		font: 14px/1 "Ubuntu", Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		text-align: left;
		cursor: pointer;
	}
	.mobile-menu-toggle-bars {
		display: inline-block;
		position: relative;
		width: 20px;
		height: 2px;
		margin-right: 10px;
		vertical-align: middle;
		background: #fff;
	}
	.mobile-menu-toggle-bars::before,
	.mobile-menu-toggle-bars::after {
		content: "";
		position: absolute;
		left: 0;
		width: 20px;
		height: 2px;
		background: #fff;
	}
	.mobile-menu-toggle-bars::before { top: -6px; }
	.mobile-menu-toggle-bars::after  { top: 6px; }
	.mobile-menu-toggle-text { vertical-align: middle; }
	.mobile-menu-toggle.is-open { background: #262626; }
	.mobile-menu-toggle.is-open .mobile-menu-toggle-bars,
	.mobile-menu-toggle.is-open .mobile-menu-toggle-bars::before,
	.mobile-menu-toggle.is-open .mobile-menu-toggle-bars::after { background: #bc7d6c; }

	/* --- Nav konteineris --- */
	.head-box1 { margin-bottom: 20px !important; }
	nav {
		float: none !important;
		width: 100% !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	/* --- Meniu sarasas: paslėptas, kol nepaspaustas hamburgeris --- */
	ul.sf-menu { display: none; width: 100% !important; }
	nav.mobile-menu-open ul.sf-menu { display: block; background: #353434; }

	ul.sf-menu li {
		float: none !important;
		width: 100% !important;
		height: auto !important;
		margin: 0 !important;
		padding: 0 !important;
		position: relative !important;
		border-bottom: 1px solid #4a4847;
	}
	ul.sf-menu li a {
		display: block !important;
		width: auto !important;
		height: auto !important;
		padding: 13px 44px 13px 10px !important;
		line-height: 1.3 !important;
		font-size: 14px !important;
		background: none !important;
		color: #fff !important;
	}
	ul.sf-menu li a:hover { color: #bc7d6c !important; }
	/* Namuko ikona yra tamsi - ant tamsaus fono paverciame ja balta */
	ul.sf-menu > li:first-child img { filter: brightness(0) invert(1); }

	/* --- Submeniu: is absoliutaus i normalu srauta --- */
	ul.sf-menu li ul {
		display: none;
		position: static !important;
		top: auto !important;
		right: auto !important;
		bottom: auto !important;
		left: auto !important;
		width: 100% !important;
		height: auto !important;
		padding: 0 !important;
		margin: 0 !important;
		background: #262626 !important;
		box-shadow: none !important;
	}
	/* Hover telefone neturi atidaryti - atidaro tik rodykle */
	ul.sf-menu li:hover > ul,
	ul.sf-menu li.sfHover > ul { display: none; }
	ul.sf-menu li.submenu-open > ul { display: block !important; }

	ul.sf-menu li li { border-bottom: 0; border-top: 1px solid #3d3b3b; }
	ul.sf-menu li li a { padding-left: 26px !important; font-size: 13px !important; color: #dcdcdc !important; }

	/* --- Submeniu atidarymo rodykle --- */
	.mobile-submenu-toggle {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		width: 44px;
		height: 44px;
		padding: 0;
		border: 0;
		border-left: 1px solid #4a4847;
		background: transparent;
		color: #fff;
		font-size: 16px;
		line-height: 44px;
		text-align: center;
		cursor: pointer;
	}
	.mobile-submenu-toggle .arrow { display: inline-block; }
	.mobile-submenu-toggle.is-open .arrow { transform: rotate(180deg); }

	/* --- Vienas stulpelis --- */
	article.grid_8,
	article.grid_8.push_1 {
		width: 100% !important;
		float: none !important;
	}

	/* Formos blokas nusileidzia po turiniu */
	#content .wrapper.p9 > div[style] {
		padding-top: 24px !important;
		text-align: left !important;
	}
	.jp-contact-form form.wpcf7-form {
		float: none !important;
		width: 100% !important;
		max-width: 320px;
		margin: 0 !important;
	}
	.jp-contact-form form.wpcf7-form input.wpcf7-text,
	.jp-contact-form form.wpcf7-form textarea.wpcf7-textarea {
		width: 100% !important;
		margin: 0 0 10px 0 !important;
		font-size: 16px !important;   /* maziau nei 16px priverstu iOS priartinti puslapi */
	}
	.jp-contact-form form.wpcf7-form input.wpcf7-submit {
		font-size: 14px !important;
		padding: 8px 18px !important;
	}
	.jp-contact-form form.wpcf7-form .wpcf7-response-output {
		width: 100% !important;
		margin: 10px 0 0 0 !important;
	}

	/* --- Footer: nuimame fiksuotus aukscius is inline style --- */
	footer[style] { height: auto !important; padding-bottom: 20px !important; }
	footer .main[style] { height: auto !important; }
	.foot-page { width: 100% !important; }
	.foot-page1 {
		float: none !important;
		width: 100% !important;
		margin: 0 0 16px 0 !important;
	}
	.foot[style] {
		float: none !important;
		width: 100% !important;
		padding-top: 0 !important;
		text-align: left;
	}
}


/* ==========================================================================
   3. IKI 640px - telefonas
   ========================================================================== */
@media screen and (max-width: 640px) {

	#content { padding-top: 20px !important; }
	.main { padding: 0 10px; }

	.page1-box3 h2 {
		font-size: 22px !important;
		line-height: 1.2 !important;
		letter-spacing: -1px !important;
		margin-bottom: 14px !important;
	}

	/* Slaiderio uzrasas is absoliutaus - po paveiksleliu.
	   Fono NUIMTI negalima: tekstas viduje yra baltas, todel ant sviesaus
	   puslapio fono jis tapdavo nematomas. Dedame tamsu foną. */
	.slider .banner {
		position: static !important;
		width: 100% !important;
		height: auto !important;
		padding: 12px 14px !important;
		margin: 0 !important;
		background: #202020 !important;
	}
	/* Dekoratyvi tamsi juostele ant tamsaus fono nebereikalinga */
	.banner-inner { display: none !important; }
	.banner-inner1 {
		width: 100% !important;
		height: auto !important;
		padding: 0 !important;
	}
	.banner-inner1 span { font-size: 15px !important; line-height: 1.3 !important; color: #fff !important; }
	.banner-inner1 p { font-size: 13px !important; color: #c4c4c4 !important; }

	/* Antrastes juosta po slaideriu (inline font-size:19px) */
	.head-box3[style] {
		font-size: 15px !important;
		line-height: 1.35 !important;
		margin-bottom: 20px !important;
	}

	.page1-box6 { padding-left: 0 !important; }
	.page1-box6 p { font-size: 13px !important; }

	/* Apdovanojimai - po du i eile */
	.wrapper.p13 article.grid_12 > img { max-width: 44%; margin: 0 2% 10px 0; }
	/* Platus Okredo baneris uzima visa ploti - jam margin-right nereikalingas,
	   kitaip 100% + 2% islenda uz krasto. */
	.wrapper.p13 article.grid_12:last-child > img { margin-right: 0 !important; }

	.foot-page1 span { font-size: 11px !important; }
}


/* ==========================================================================
   4. IKI 420px - siauras telefonas
   ========================================================================== */
@media screen and (max-width: 420px) {

	.page1-box3 h2 { font-size: 19px !important; }

	.jp-contact-form form.wpcf7-form { max-width: 100%; }

	/* Apdovanojimai - po du, placiau */
	.wrapper.p13 article.grid_12 > img { max-width: 46%; margin: 0 2% 8px 0; }

	.banner-inner1 span { font-size: 14px !important; }
}